├── .eslintrc.json ├── .github ├── FUNDING.yml ├── ISSUE_TEMPLATE │ ├── bug_report.md │ └── feature_request.md └── workflows │ └── deploy-github-pages.yml ├── .gitignore ├── .prettierrc ├── .storybook ├── main.ts ├── manager-head.html ├── preview.ts └── preview.tsx ├── LICENSE ├── README.md ├── components.json ├── jest.config.js ├── jest.setup.js ├── next-sitemap.config.js ├── next.config.mjs ├── package-lock.json ├── package.json ├── postcss.config.js ├── public ├── next.svg ├── robots.txt ├── sitemap-0.xml ├── sitemap.xml └── vercel.svg ├── src ├── app │ ├── data.tsx │ ├── favicon.ico │ ├── layout.tsx │ ├── page.tsx │ ├── robot.ts │ └── sitemap.ts ├── components │ ├── buy-me-a-coffee.tsx │ ├── code-block.tsx │ ├── providers │ │ └── theme-provider.tsx │ ├── sections │ │ ├── example-card.tsx │ │ ├── examples.tsx │ │ ├── hero.tsx │ │ ├── index.ts │ │ ├── installation.tsx │ │ ├── sidebar.tsx │ │ └── usage.tsx │ ├── theme-toggle.tsx │ ├── timeline │ │ ├── __fixtures__ │ │ │ └── timeline-items.tsx │ │ ├── __tests__ │ │ │ └── timeline.test.tsx │ │ ├── index.ts │ │ ├── timeline-layout.tsx │ │ ├── timeline.stories.tsx │ │ └── timeline.tsx │ └── ui │ │ ├── button.tsx │ │ ├── card.tsx │ │ └── tabs.tsx ├── config │ ├── metadata.ts │ └── site.ts ├── lib │ └── utils.ts ├── styles │ └── globals.css └── types │ └── index.ts ├── storybook-static ├── favicon.svg ├── index.html ├── index.json ├── next.svg ├── nunito-sans-bold-italic.woff2 ├── nunito-sans-bold.woff2 ├── nunito-sans-italic.woff2 ├── nunito-sans-regular.woff2 ├── project.json ├── robots.txt ├── sb-addons │ ├── a11y-12 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-actions-3 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-backgrounds-4 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-controls-2 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-measure-7 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-outline-8 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-toolbars-6 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-viewport-5 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── interactions-10 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── links-1 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── onboarding-9 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt │ ├── storybook-core-core-server-presets-0 │ │ ├── common-manager-bundle.js │ │ └── common-manager-bundle.js.LEGAL.txt │ └── themes-11 │ │ ├── manager-bundle.js │ │ └── manager-bundle.js.LEGAL.txt ├── sb-common-assets │ ├── favicon.svg │ ├── nunito-sans-bold-italic.woff2 │ ├── nunito-sans-bold.woff2 │ ├── nunito-sans-italic.woff2 │ └── nunito-sans-regular.woff2 ├── sb-manager │ ├── globals-module-info.js │ ├── globals-runtime.js │ ├── globals.js │ └── runtime.js ├── sb-preview │ ├── globals.js │ └── runtime.js ├── sitemap-0.xml ├── sitemap.xml └── vercel.svg ├── tailwind.config.ts └── tsconfig.json /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "next/core-web-vitals", 4 | "plugin:@typescript-eslint/recommended", 5 | "plugin:storybook/recommended", 6 | "prettier" 7 | ], 8 | "rules": { 9 | "@typescript-eslint/ban-ts-comment": ["error", { "ts-ignore": "allow-with-description" }], 10 | "@typescript-eslint/restrict-template-expressions": "off", 11 | "react/prop-types": "off", 12 | "comma-spacing": "error", 13 | "object-curly-spacing": ["error", "always"], 14 | "array-bracket-spacing": ["error", "never"], 15 | "max-len": [ 16 | "warn", 17 | { 18 | "code": 100, 19 | "ignoreUrls": true, 20 | "ignoreTemplateLiterals": true, 21 | "ignoreStrings": true, 22 | "ignoreTrailingComments": true 23 | } 24 | ] 25 | }, 26 | "parser": "@typescript-eslint/parser", 27 | "plugins": ["@typescript-eslint"] 28 | } 29 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] 4 | patreon: # Replace with a single Patreon username 5 | open_collective: # Replace with a single Open Collective username 6 | ko_fi: # Replace with a single Ko-fi username 7 | tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel 8 | community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry 9 | liberapay: # Replace with a single Liberapay username 10 | issuehunt: # Replace with a single IssueHunt username 11 | lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry 12 | polar: # Replace with a single Polar username 13 | buy_me_a_coffee: timDeHof 14 | thanks_dev: # Replace with a single thanks.dev username 15 | custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] 16 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Create a report to help us improve 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | --- 8 | 9 | **Describe the bug** 10 | A clear and concise description of what the bug is. 11 | 12 | **To Reproduce** 13 | Steps to reproduce the behavior: 14 | 15 | 1. Go to '...' 16 | 2. Click on '....' 17 | 3. Scroll down to '....' 18 | 4. See error 19 | 20 | **Expected behavior** 21 | A clear and concise description of what you expected to happen. 22 | 23 | **Screenshots** 24 | If applicable, add screenshots to help explain your problem. 25 | 26 | **Desktop (please complete the following information):** 27 | 28 | - OS: [e.g. iOS] 29 | - Browser [e.g. chrome, safari] 30 | - Version [e.g. 22] 31 | 32 | **Smartphone (please complete the following information):** 33 | 34 | - Device: [e.g. iPhone6] 35 | - OS: [e.g. iOS8.1] 36 | - Browser [e.g. stock browser, safari] 37 | - Version [e.g. 22] 38 | 39 | **Additional context** 40 | Add any other context about the problem here. 41 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature request 3 | about: Suggest an idea for this project 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | --- 8 | 9 | **Is your feature request related to a problem? Please describe.** 10 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] 11 | 12 | **Describe the solution you'd like** 13 | A clear and concise description of what you want to happen. 14 | 15 | **Describe alternatives you've considered** 16 | A clear and concise description of any alternative solutions or features you've considered. 17 | 18 | **Additional context** 19 | Add any other context or screenshots about the feature request here. 20 | -------------------------------------------------------------------------------- /.github/workflows/deploy-github-pages.yml: -------------------------------------------------------------------------------- 1 | # Workflow name 2 | name: Build and Publish Storybook to GitHub Pages 3 | 4 | on: 5 | # Event for the workflow to run on 6 | push: 7 | branches: 8 | - 'main' # Replace with the branch you want to deploy from 9 | 10 | permissions: 11 | contents: read 12 | pages: write 13 | id-token: write 14 | 15 | # List of jobs 16 | jobs: 17 | deploy: 18 | runs-on: ubuntu-latest 19 | # Job steps 20 | steps: 21 | # Manual Checkout 22 | - uses: actions/checkout@v4 23 | with: 24 | fetch-depth: 0 25 | # Set up Node 26 | - uses: actions/setup-node@v4 27 | with: 28 | node-version: '20' 29 | #👇 Add Storybook build and deploy to GitHub Pages as a step in the workflow 30 | - uses: bitovi/github-actions-storybook-to-github-pages@v1.0.3 31 | with: 32 | install_command: yarn install # default: npm ci 33 | build_command: yarn build-storybook # default: npm run build-storybook 34 | path: storybook-static # default: dist/storybook 35 | checkout: false # default: true 36 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | .yarn/install-state.gz 8 | 9 | # testing 10 | /coverage 11 | 12 | # next.js 13 | /.next/ 14 | /out/ 15 | 16 | # production 17 | /build 18 | 19 | # misc 20 | .DS_Store 21 | *.pem 22 | 23 | # debug 24 | npm-debug.log* 25 | yarn-debug.log* 26 | yarn-error.log* 27 | 28 | # local env files 29 | .env*.local 30 | 31 | # vercel 32 | .vercel 33 | 34 | # typescript 35 | *.tsbuildinfo 36 | next-env.d.ts 37 | 38 | # IDE 39 | .idea 40 | .vscode 41 | 42 | # Environment 43 | .env 44 | .env.local 45 | .env.development.local 46 | .env.test.local 47 | .env.production.local 48 | 49 | *storybook.log 50 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 100, 3 | "tabWidth": 2, 4 | "singleQuote": true, 5 | "trailingComma": "all", 6 | "semi": true, 7 | "bracketSpacing": true, 8 | "plugins": ["prettier-plugin-tailwindcss"] 9 | } 10 | -------------------------------------------------------------------------------- /.storybook/main.ts: -------------------------------------------------------------------------------- 1 | import type { StorybookConfig } from '@storybook/nextjs'; 2 | 3 | const config: StorybookConfig = { 4 | stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'], 5 | addons: [ 6 | '@storybook/addon-links', 7 | '@storybook/addon-essentials', 8 | '@storybook/addon-onboarding', 9 | '@storybook/addon-interactions', 10 | '@storybook/addon-themes', 11 | '@storybook/addon-a11y', 12 | '@storybook/addon-coverage', 13 | { 14 | name: '@storybook/addon-styling-webpack', 15 | options: { 16 | postCss: true, 17 | }, 18 | }, 19 | ], 20 | framework: { 21 | name: '@storybook/nextjs', 22 | options: {}, 23 | }, 24 | docs: { 25 | autodocs: 'tag', 26 | }, 27 | staticDirs: ['../public'], 28 | }; 29 | 30 | export default config; 31 | -------------------------------------------------------------------------------- /.storybook/manager-head.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /.storybook/preview.ts: -------------------------------------------------------------------------------- 1 | import type { Preview } from '@storybook/react'; 2 | import { withThemeByClassName } from '@storybook/addon-themes'; 3 | import '@/styles/globals.css'; 4 | 5 | const preview: Preview = { 6 | parameters: { 7 | actions: { argTypesRegex: '^on[A-Z].*' }, 8 | controls: { 9 | matchers: { 10 | color: /(background|color)$/i, 11 | date: /Date$/i, 12 | }, 13 | }, 14 | }, 15 | decorators: [ 16 | withThemeByClassName({ 17 | themes: { 18 | light: 'light', 19 | dark: 'dark', 20 | }, 21 | defaultTheme: 'light', 22 | }), 23 | ], 24 | }; 25 | 26 | export default preview; 27 | -------------------------------------------------------------------------------- /.storybook/preview.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import type { Preview } from '@storybook/react'; 3 | import '../src/styles/globals.css'; 4 | import { ThemeProvider } from '../src/components/providers/theme-provider'; 5 | 6 | const preview: Preview = { 7 | parameters: { 8 | actions: { argTypesRegex: '^on[A-Z].*' }, 9 | controls: { 10 | matchers: { 11 | color: /(background|color)$/i, 12 | date: /Date$/i, 13 | }, 14 | }, 15 | backgrounds: { 16 | disable: true, 17 | }, 18 | layout: 'fullscreen', 19 | docs: { 20 | story: { 21 | inline: true, 22 | }, 23 | container: ({ children, context }) => ( 24 | 25 |
{children}
26 |
27 | ), 28 | }, 29 | }, 30 | decorators: [ 31 | (Story) => ( 32 | 33 |
34 |
35 | 36 |
37 |
38 |
39 | ), 40 | ], 41 | }; 42 | 43 | export default preview; 44 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 Tim DeHof 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Shadcn Timeline Component 2 | Buy Me A Coffee 3 | 4 | A beautiful, accessible, and customizable timeline component built on top of shadcn/ui with React and Tailwind CSS. 5 | 6 | The same as shadcn/ui, all components are free to use for personal and commercial. 7 | 8 | Just copy and paste to your project and customize to your needs. The code is yours. 9 | 10 | ## Demo & Documentation 11 | 12 | - 🔗 [View Storybook Documentation](https://timdehof.github.io/shadcn-timeline/) 13 | - 🔗 [Live Demo](https://shadcn-timeline.vercel.app/) 14 | 15 | ## Features 16 | 17 | - 🎨 Customizable appearance with different sizes and colors 18 | - ♿️ Fully accessible with ARIA attributes 19 | - 🔄 Loading and error states 20 | - 🎭 Smooth animations with Framer Motion 21 | - 📱 Responsive design 22 | - 🎯 TypeScript support 23 | - 🌐 SSR Compatible 24 | - 📚 Full Storybook documentation and examples 25 | 26 | ## Installation 27 | 28 | ```bash 29 | # Clone the repository 30 | git clone https://github.com/timDeHof/shadcn-timeline.git 31 | 32 | # Install dependencies 33 | npm install 34 | 35 | # Run Storybook locally 36 | npm run storybook 37 | ``` 38 | 39 | ## Usage 40 | 41 | ```tsx 42 | import { Timeline, TimelineItem } from '@/components/timeline'; 43 | import { Check } from 'lucide-react'; 44 | 45 | export default function Example() { 46 | return ( 47 | 48 | } 53 | status="completed" 54 | /> 55 | 61 | 67 | 68 | ); 69 | } 70 | ``` 71 | 72 | ## Props 73 | 74 | ### Timeline 75 | 76 | | Prop | Type | Default | Description | 77 | | -------- | -------------------- | ------- | -------------------- | 78 | | size | 'sm' \| 'md' \| 'lg' | 'md' | Size of the timeline | 79 | | iconsize | 'sm' \| 'md' \| 'lg' | 'md' | Size of icons | 80 | 81 | ### TimelineItem 82 | 83 | | Prop | Type | Default | Description | 84 | | ----------- | ----------------------------------------------- | ----------- | ------------------------ | 85 | | date | Date \| string \| number | - | Date of the event | 86 | | title | string | - | Title of the event | 87 | | description | string | - | Description of the event | 88 | | icon | ReactNode | - | Custom icon | 89 | | iconColor | 'primary' \| 'secondary' \| 'muted' \| 'accent' | 'primary' | Color theme of the icon | 90 | | status | 'completed' \| 'in-progress' \| 'pending' | 'completed' | Current status | 91 | | loading | boolean | false | Show loading state | 92 | | error | string | - | Show error state | 93 | 94 | ### TimelineTime 95 | 96 | | Prop | Type | Default | Description | 97 | | --------- | ------------------------------------ | ------- | ----------------------- | 98 | | date | Date \| string \| number | - | Date to display | 99 | | format | string \| Intl.DateTimeFormatOptions | - | Date formatting options | 100 | | className | string | - | Additional CSS classes | 101 | 102 | ## Server-Side Rendering 103 | 104 | The component is fully SSR compatible and handles hydration properly. Date formatting is handled on the client side to prevent hydration mismatches. 105 | 106 | ## Development 107 | 108 | To run Storybook locally: 109 | 110 | ```bash 111 | npm run storybook 112 | ``` 113 | 114 | This will start Storybook on http://localhost:6006 115 | 116 | ## Testing 117 | 118 | Run the test suite: 119 | 120 | ```bash 121 | # Run tests 122 | npm run test 123 | 124 | # Run Storybook tests 125 | npm run test-storybook 126 | 127 | # Run Storybook tests with coverage 128 | npm run test-storybook:coverage 129 | ``` 130 | ## Contributing 131 | - [Open an issue](https://github.com/timDeHof/shadcn-timeline/issues) if you believe you've encountered a bug. 132 | - Make a [Pull request](https://github.com/timDeHof/shadcn-timeline/pulls) if you want to add a new feature/make quality of life improvements/ fix bugs. 133 | 134 | ## License 135 | 136 | MIT -------------------------------------------------------------------------------- /components.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://ui.shadcn.com/schema.json", 3 | "style": "new-york", 4 | "rsc": true, 5 | "tsx": true, 6 | "tailwind": { 7 | "config": "tailwind.config.ts", 8 | "css": "src/app/globals.css", 9 | "baseColor": "zinc", 10 | "cssVariables": true, 11 | "prefix": "" 12 | }, 13 | "aliases": { 14 | "components": "@/components", 15 | "utils": "@/lib/utils" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | testEnvironment: 'jsdom', 3 | transform: { 4 | '^.+\\.(ts|tsx)$': [ 5 | 'babel-jest', 6 | { 7 | presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript'], 8 | }, 9 | ], 10 | }, 11 | moduleNameMapper: { 12 | '^@/(.*)$': '/src/$1', 13 | }, 14 | setupFilesAfterEnv: ['/jest.setup.js'], 15 | }; 16 | -------------------------------------------------------------------------------- /jest.setup.js: -------------------------------------------------------------------------------- 1 | require('@testing-library/jest-dom'); 2 | -------------------------------------------------------------------------------- /next-sitemap.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('next-sitemap').IConfig} */ 2 | module.exports = { 3 | siteUrl: process.env.SITE_URL || 'http://localhost:3000', 4 | exclude: ['/next.svg', '/vercel.svg', '/favicon.ico'], 5 | generateRobotsTxt: true, 6 | generateIndexSitemap: false, 7 | robotsTxtOptions: { 8 | policies: [ 9 | { 10 | userAgent: '*', 11 | allow: '/', 12 | }, 13 | ], 14 | }, 15 | }; 16 | -------------------------------------------------------------------------------- /next.config.mjs: -------------------------------------------------------------------------------- 1 | /** @type {import('next').NextConfig} */ 2 | const nextConfig = { 3 | images: { 4 | remotePatterns: [ 5 | { 6 | protocol: 'https', 7 | hostname: 'cdn.buymeacoffee.com', 8 | port: '', 9 | pathname: '/buttons/v2/**', 10 | } 11 | ], 12 | }, 13 | eslint: { 14 | ignoreDuringBuilds: true, 15 | } 16 | }; 17 | 18 | export default nextConfig; 19 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "shadcn-timeline", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "dev": "next dev", 7 | "build": "next build", 8 | "start": "next start", 9 | "lint": "next lint", 10 | "test": "jest", 11 | "storybook": "storybook dev -p 6006", 12 | "build-storybook": "storybook build", 13 | "test-storybook": "test-storybook", 14 | "test-storybook:coverage": "test-storybook --coverage" 15 | }, 16 | "dependencies": { 17 | "@emotion/is-prop-valid": "^1.3.1", 18 | "@radix-ui/react-slot": "^1.0.2", 19 | "@radix-ui/react-tabs": "^1.1.2", 20 | "class-variance-authority": "^0.7.1", 21 | "clsx": "^2.1.0", 22 | "framer-motion": "^11.15.0", 23 | "lucide-react": "^0.469.0", 24 | "next": "^15.1.3", 25 | "next-themes": "^0.4.4", 26 | "prism-react-renderer": "^2.4.1", 27 | "react": "^18", 28 | "react-dom": "^18", 29 | "tailwind-merge": "^2.2.2", 30 | "tailwindcss-animate": "^1.0.7" 31 | }, 32 | "devDependencies": { 33 | "@babel/preset-env": "^7.26.0", 34 | "@babel/preset-react": "^7.26.3", 35 | "@babel/preset-typescript": "^7.26.0", 36 | "@chromatic-com/storybook": "^3.2.3", 37 | "@storybook/addon-a11y": "^8.4.7", 38 | "@storybook/addon-coverage": "^1.0.5", 39 | "@storybook/addon-essentials": "^8.4.7", 40 | "@storybook/addon-interactions": "^8.4.7", 41 | "@storybook/addon-links": "^8.4.7", 42 | "@storybook/addon-onboarding": "^8.4.7", 43 | "@storybook/addon-styling-webpack": "^1.0.1", 44 | "@storybook/addon-themes": "^8.4.7", 45 | "@storybook/blocks": "^8.4.7", 46 | "@storybook/nextjs": "^8.4.7", 47 | "@storybook/react": "^8.4.7", 48 | "@storybook/test": "^8.4.7", 49 | "@storybook/test-runner": "^0.21.0", 50 | "@testing-library/jest-dom": "^6.6.3", 51 | "@testing-library/react": "^16.1.0", 52 | "@types/jest": "^29.5.14", 53 | "@types/node": "^20", 54 | "@types/react": "^18", 55 | "@types/react-dom": "^18", 56 | "@typescript-eslint/eslint-plugin": "^6.21.0", 57 | "@typescript-eslint/parser": "^6.21.0", 58 | "autoprefixer": "^10.0.1", 59 | "babel-jest": "^29.7.0", 60 | "chromatic": "^11.20.2", 61 | "eslint": "^8", 62 | "eslint-config-next": "14.1.4", 63 | "eslint-config-prettier": "^9.1.0", 64 | "eslint-plugin-storybook": "^0.11.2", 65 | "jest": "^29.7.0", 66 | "jest-environment-jsdom": "^29.7.0", 67 | "postcss": "^8.4.49", 68 | "prettier": "^3.4.2", 69 | "prettier-plugin-tailwindcss": "^0.6.9", 70 | "storybook": "^8.4.7", 71 | "tailwindcss": "^3.3.0", 72 | "typescript": "^5", 73 | "typescript-eslint": "^8.19.0" 74 | } 75 | } -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | }; 7 | -------------------------------------------------------------------------------- /public/next.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # * 2 | User-agent: * 3 | Allow: / 4 | 5 | # Host 6 | Host: https://shadcn-timeline.vercel.app 7 | 8 | # Sitemaps 9 | Sitemap: https://shadcn-timeline.vercel.app/sitemap.xml 10 | -------------------------------------------------------------------------------- /public/sitemap-0.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | https://shadcn-timeline.vercel.app2025-01-03T16:53:05.059Zdaily0.7 4 | -------------------------------------------------------------------------------- /public/sitemap.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | https://shadcn-timeline.vercel.app/sitemap-0.xml 4 | -------------------------------------------------------------------------------- /public/vercel.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/app/data.tsx: -------------------------------------------------------------------------------- 1 | import type { TimelineElement } from '@/types'; 2 | 3 | export const timelineData: TimelineElement[] = [ 4 | { 5 | id: 1, 6 | title: 'First event', 7 | date: '2022-01-01', 8 | description: 9 | 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Odio euismod lacinia at quis risus sed vulputate odio ut. Quam viverra orci sagittis eu volutpat odio facilisis mauris.', 10 | status: 'completed', 11 | }, 12 | { 13 | id: 2, 14 | title: 'Second event', 15 | date: '2022-02-01', 16 | description: 17 | 'Aut eius excepturi ex recusandae eius est minima molestiae. Nam dolores iusto ad fugit reprehenderit hic dolorem quisquam et quia omnis non suscipit nihil sit.', 18 | status: 'in-progress', 19 | }, 20 | { 21 | id: 3, 22 | title: 'Third event', 23 | date: '2022-03-01', 24 | description: 25 | 'Sit culpa quas ex nulla animi qui deleniti minus rem placeat mollitia. Et enim doloremque et quia sequi ea dolores voluptatem ea rerum vitae.', 26 | status: 'pending', 27 | }, 28 | ]; 29 | 30 | export type TimelineData = TimelineElement; 31 | -------------------------------------------------------------------------------- /src/app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/src/app/favicon.ico -------------------------------------------------------------------------------- /src/app/layout.tsx: -------------------------------------------------------------------------------- 1 | import type { Metadata } from 'next'; 2 | import { Inter } from 'next/font/google'; 3 | import '@/styles/globals.css'; 4 | import { ThemeProvider } from '@/components/providers/theme-provider'; 5 | import { metadata, viewport } from '@/config/metadata'; 6 | 7 | const inter = Inter({ subsets: ['latin'] }); 8 | 9 | export { metadata, viewport }; 10 | 11 | export default function RootLayout({ 12 | children, 13 | }: Readonly<{ 14 | children: React.ReactNode; 15 | }>) { 16 | return ( 17 | 18 | 19 | 20 | 26 | {children} 27 | 28 | 29 | 30 | ); 31 | } 32 | -------------------------------------------------------------------------------- /src/app/page.tsx: -------------------------------------------------------------------------------- 1 | import { Hero, Sidebar, Installation, Usage, Examples } from '@/components/sections'; 2 | 3 | export default function Home() { 4 | return ( 5 |
6 | 7 |
8 | 9 | 10 | 11 | 12 |
13 |
14 | ); 15 | } 16 | -------------------------------------------------------------------------------- /src/app/robot.ts: -------------------------------------------------------------------------------- 1 | import { MetadataRoute } from 'next' 2 | 3 | export default function robots(): MetadataRoute.Robots { 4 | const baseUrl = process.env.SITE_URL || 'https://localhost:3000' 5 | 6 | return { 7 | rules: [ 8 | { 9 | userAgent: '*', 10 | allow: '/', 11 | disallow: ['/private/', '/admin/'], // Add paths you want to block from crawling 12 | }, 13 | ], 14 | sitemap: `${baseUrl}/sitemap.xml`, 15 | } 16 | } -------------------------------------------------------------------------------- /src/app/sitemap.ts: -------------------------------------------------------------------------------- 1 | import type { MetadataRoute } from 'next'; 2 | 3 | export default function sitemap(): MetadataRoute.Sitemap { 4 | const baseUrl = process.env.SITE_URL || 'https://localhost:3000'; 5 | 6 | return [ 7 | { 8 | url: baseUrl, 9 | lastModified: new Date(), 10 | changeFrequency: 'daily', 11 | priority: 1, 12 | }, 13 | // Add more routes as needed, for example: 14 | // { 15 | // url: `${baseUrl}/about`, 16 | // lastModified: new Date(), 17 | // changeFrequency: 'monthly', 18 | // priority: 0.8, 19 | // }, 20 | ]; 21 | } 22 | -------------------------------------------------------------------------------- /src/components/buy-me-a-coffee.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import Link from 'next/link'; 3 | import Image from 'next/image'; 4 | import { cn } from '@/lib/utils'; 5 | import { siteConfig } from '@/config/site'; 6 | const ALLOWED_DOMAINS = ['buymeacoffee.com']; 7 | 8 | interface BuyMeACoffeeProps { 9 | className?: string; 10 | width?: number; 11 | height?: number; 12 | username?: string; 13 | theme?: 'default-yellow' | 'default-black' | 'default-white'; 14 | } 15 | 16 | const BuyMeACoffee = ({ 17 | className, 18 | width = 217, 19 | height = 48, 20 | username = siteConfig.buyMeACoffee.username, 21 | theme = siteConfig.buyMeACoffee.defaultTheme 22 | }: BuyMeACoffeeProps) => { 23 | // Sanitize username to prevent XSS 24 | const sanitizedUsername = username && encodeURIComponent(username.replace(/[^a-zA-Z0-9]/g, '')); 25 | const url = `https://buymeacoffee.com/${sanitizedUsername}`; 26 | 27 | // Verify domain for security 28 | const isValidDomain = ALLOWED_DOMAINS.some(domain => url.startsWith(`https://${domain}`)); 29 | if (!isValidDomain) { 30 | console.error('Invalid domain detected'); 31 | return null; 32 | } 33 | 34 | return ( 35 | 42 | Buy me a coffee 51 | 52 | ); 53 | }; 54 | 55 | export default BuyMeACoffee; 56 | -------------------------------------------------------------------------------- /src/components/code-block.tsx: -------------------------------------------------------------------------------- 1 | import { cn } from '@/lib/utils'; 2 | import { Highlight, themes } from 'prism-react-renderer'; 3 | 4 | interface CodeBlockProps { 5 | code: string; 6 | language?: string; 7 | showLineNumbers?: boolean; 8 | } 9 | 10 | export function CodeBlock({ code, language = 'tsx', showLineNumbers = true }: CodeBlockProps) { 11 | return ( 12 |
13 | 14 | {({ className, style, tokens, getLineProps, getTokenProps }) => ( 15 |
19 |             {tokens.map((line, i) => (
20 |               
21 | {showLineNumbers && {i + 1}} 22 | {line.map((token, key) => ( 23 | 24 | ))} 25 |
26 | ))} 27 |
28 | )} 29 |
30 |
31 | ); 32 | } 33 | -------------------------------------------------------------------------------- /src/components/providers/theme-provider.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import * as React from 'react'; 4 | import { ThemeProvider as NextThemesProvider } from 'next-themes'; 5 | import { type ThemeProviderProps } from 'next-themes'; 6 | 7 | export function ThemeProvider({ children, ...props }: ThemeProviderProps) { 8 | return {children}; 9 | } 10 | -------------------------------------------------------------------------------- /src/components/sections/example-card.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; 3 | import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; 4 | import { CodeBlock } from '@/components/code-block'; 5 | 6 | interface ExampleCardProps { 7 | name: string; 8 | code: string; 9 | component: React.ReactNode; 10 | } 11 | 12 | export function ExampleCard({ name, code, component }: ExampleCardProps) { 13 | return ( 14 | 15 | 16 | 17 | {name} 18 | 19 | 20 | 21 | 22 | 23 | 27 | Preview 28 | 29 | 33 | Code 34 | 35 | 36 | 37 | 41 |
42 | {component} 43 |
44 |
45 | 46 | 50 | 51 | 52 |
53 |
54 |
55 | ); 56 | } -------------------------------------------------------------------------------- /src/components/sections/examples.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { TimelineLayout } from '@/components/timeline'; 3 | import { Calendar } from 'lucide-react'; 4 | import { timelineData } from '@/app/data'; 5 | import { ExampleCard } from './example-card'; 6 | 7 | const examples = { 8 | basic: { 9 | name: 'Basic', 10 | code: ``, 11 | component: , 12 | }, 13 | customIcon: { 14 | name: 'Custom Icon', 15 | code: `} />`, 16 | component: ( 17 | } 22 | /> 23 | ), 24 | }, 25 | animated: { 26 | name: 'Animated', 27 | code: ``, 28 | component: , 29 | }, 30 | }; 31 | 32 | export function Examples() { 33 | return ( 34 |
35 |

Examples

36 |
37 | {Object.entries(examples).map(([key, example]) => ( 38 | 39 | ))} 40 |
41 |
42 | ); 43 | } -------------------------------------------------------------------------------- /src/components/sections/hero.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | export function Hero() { 4 | return ( 5 |
6 |

Timeline

7 |

8 | A customizable timeline component for displaying chronological events. 9 |

10 |
11 | ); 12 | } 13 | -------------------------------------------------------------------------------- /src/components/sections/index.ts: -------------------------------------------------------------------------------- 1 | export { Hero } from './hero'; 2 | export { Sidebar } from './sidebar'; 3 | export { Installation } from './installation'; 4 | export { Usage } from './usage'; 5 | export { Examples } from './examples'; 6 | export { ExampleCard } from './example-card'; -------------------------------------------------------------------------------- /src/components/sections/installation.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { CodeBlock } from '@/components/code-block'; 3 | 4 | const installCode = `# 1. Clone the repository 5 | git clone https://github.com/timDeHof/shadcn-timeline.git 6 | 7 | # 2. Open the folder 8 | cd shadcn-timeline 9 | 10 | # 3. Install dependencies 11 | npm install 12 | 13 | # 4. Copy the timeline components to your project 14 | # Copy from: 15 | # /src/app/components/timeline/timeline-layout.tsx 16 | # /src/app/components/timeline/timeline.tsx`; 17 | 18 | export function Installation() { 19 | return ( 20 |
21 |

Manual Installation

22 |

23 | Copy the timeline components into your project structure: 24 |

25 |
26 | 27 |
28 |
29 | ); 30 | } -------------------------------------------------------------------------------- /src/components/sections/sidebar.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import Link from 'next/link'; 3 | import { Github } from 'lucide-react'; 4 | import { buttonVariants } from '@/components/ui/button'; 5 | import { cn } from '@/lib/utils'; 6 | import { ThemeToggle } from '@/components/theme-toggle'; 7 | import BuyMeACoffee from '@/components/buy-me-a-coffee'; 8 | import { siteConfig } from '@/config/site'; 9 | 10 | export function Sidebar() { 11 | return ( 12 | 44 | ); 45 | } -------------------------------------------------------------------------------- /src/components/sections/usage.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { CodeBlock } from '@/components/code-block'; 3 | 4 | const usageCode = `# Add to your component: 5 | import { TimelineLayout } from "@/components/timeline/timeline-layout"; 6 | 7 | # Copy the timeline components to: 8 | # /src/components/timeline/timeline-layout.tsx 9 | # /src/components/timeline/timeline.tsx`; 10 | 11 | export function Usage() { 12 | return ( 13 |
14 |

Usage

15 |
16 | 17 |
18 |
19 | ); 20 | } -------------------------------------------------------------------------------- /src/components/theme-toggle.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import * as React from 'react'; 4 | import { Moon, Sun } from 'lucide-react'; 5 | import { useTheme } from 'next-themes'; 6 | 7 | import { Button } from '@/components/ui/button'; 8 | 9 | export function ThemeToggle() { 10 | const { setTheme, theme } = useTheme(); 11 | 12 | return ( 13 | 22 | ); 23 | } 24 | -------------------------------------------------------------------------------- /src/components/timeline/__fixtures__/timeline-items.tsx: -------------------------------------------------------------------------------- 1 | import { Check, GitPullRequest, GitBranch, Calendar, Star, AlertTriangle } from 'lucide-react'; 2 | import type { TimelineElement } from '@/types'; 3 | import React from 'react'; 4 | 5 | // Basic timeline items 6 | export const defaultItems: TimelineElement[] = [ 7 | { 8 | id: 1, 9 | date: '2024-01-01', 10 | title: 'First event', 11 | description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.', 12 | icon: , 13 | status: 'completed', 14 | color: 'primary', 15 | }, 16 | { 17 | id: 2, 18 | date: '2024-02-01', 19 | title: 'Second event', 20 | description: 'Aut eius excepturi ex recusandae eius est minima molestiae.', 21 | icon: , 22 | status: 'in-progress', 23 | color: 'secondary', 24 | }, 25 | { 26 | id: 3, 27 | date: '2024-03-01', 28 | title: 'Third event', 29 | description: 'Sit culpa quas ex nulla animi qui deleniti minus.', 30 | icon: , 31 | status: 'pending', 32 | color: 'muted', 33 | }, 34 | ]; 35 | 36 | // Items with different states 37 | export const stateItems: TimelineElement[] = [ 38 | { 39 | id: 4, 40 | date: '2024-01-15', 41 | title: 'Completed Task', 42 | description: 'This task has been completed successfully.', 43 | icon: , 44 | status: 'completed', 45 | color: 'primary', 46 | }, 47 | { 48 | id: 5, 49 | date: '2024-01-16', 50 | title: 'In Progress Task', 51 | description: 'This task is currently in progress.', 52 | icon: , 53 | status: 'in-progress', 54 | color: 'secondary', 55 | }, 56 | { 57 | id: 6, 58 | date: '2024-01-17', 59 | title: 'Pending Task', 60 | description: 'This task is pending start.', 61 | icon: , 62 | status: 'pending', 63 | color: 'muted', 64 | }, 65 | ]; 66 | 67 | // Items with different sizes 68 | export const sizedItems: Record<'sm' | 'md' | 'lg', TimelineElement[]> = { 69 | sm: defaultItems.map(item => ({ ...item, size: 'sm' })), 70 | md: defaultItems.map(item => ({ ...item, size: 'md' })), 71 | lg: defaultItems.map(item => ({ ...item, size: 'lg' })), 72 | }; 73 | 74 | // Items for loading state 75 | export const loadingItems: TimelineElement[] = Array.from({ length: 3 }, (_, index) => ({ 76 | id: 7 + index, 77 | date: new Date(Date.now() + index * 86400000).toISOString().split('T')[0], 78 | title: 'Loading...', 79 | description: 'Content is loading...', 80 | status: 'pending', 81 | loading: true, 82 | })); 83 | 84 | // Items for error state 85 | export const errorItems: TimelineElement[] = [ 86 | { 87 | id: 10, 88 | date: new Date().toISOString().split('T')[0], 89 | title: 'Error State', 90 | description: 'An error occurred while loading this item.', 91 | icon: , 92 | status: 'pending', 93 | error: 'Failed to load item', 94 | color: 'destructive', 95 | }, 96 | ]; 97 | 98 | // Helper function to create custom items 99 | export const createCustomItems = (count: number, options: Partial = {}): TimelineElement[] => { 100 | return Array.from({ length: count }, (_, index) => ({ 101 | id: 100 + index, 102 | date: new Date(Date.now() + index * 86400000).toISOString().split('T')[0], 103 | title: `Custom Event ${index + 1}`, 104 | description: `Custom description for event ${index + 1}`, 105 | icon: , 106 | status: 'completed', 107 | color: 'primary', 108 | ...options, 109 | })); 110 | }; 111 | 112 | // Export all fixtures 113 | export const timelineFixtures = { 114 | default: defaultItems, 115 | states: stateItems, 116 | sized: sizedItems, 117 | loading: loadingItems, 118 | error: errorItems, 119 | createCustom: createCustomItems, 120 | } as const; 121 | 122 | export const edgeCaseItems = [ 123 | { 124 | title: '', 125 | description: '', 126 | date: null, 127 | }, 128 | { 129 | title: 'No Description', 130 | date: new Date(), 131 | }, 132 | { 133 | title: 'Custom Format', 134 | date: '2024-01-01', 135 | dateFormat: 'yyyy-MM-dd', 136 | }, 137 | ] as const; 138 | 139 | // Add these to your existing tests 140 | export const timelineItems = [...defaultItems, ...edgeCaseItems]; -------------------------------------------------------------------------------- /src/components/timeline/__tests__/timeline.test.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import { render, screen } from '@testing-library/react'; 3 | import '@testing-library/jest-dom'; 4 | import { Timeline, TimelineItem, TimelineTime } from '../timeline'; 5 | import { TimelineLayout } from '../timeline-layout'; 6 | import { Check, GitPullRequest, AlertTriangle } from 'lucide-react'; 7 | import type { TimelineElement } from '@/types'; 8 | 9 | const mockItems: TimelineElement[] = [ 10 | { 11 | id: 1, 12 | date: '2024-01-01', 13 | title: 'Test Event', 14 | description: 'Test Description', 15 | icon: , 16 | status: 'completed', 17 | color: 'primary', 18 | }, 19 | { 20 | id: 2, 21 | date: '2024-01-02', 22 | title: 'In Progress Event', 23 | description: 'Test Description 2', 24 | icon: , 25 | status: 'in-progress', 26 | color: 'secondary', 27 | }, 28 | ]; 29 | 30 | describe('TimelineTime', () => { 31 | it('renders date in ISO format by default', () => { 32 | const { container } = render(); 33 | const timeElement = container.querySelector('time'); 34 | expect(timeElement).toHaveAttribute('dateTime', '2024-01-01T00:00:00.000Z'); 35 | }); 36 | 37 | it('renders children if provided', () => { 38 | render(Custom Date); 39 | expect(screen.getByText('Custom Date')).toBeInTheDocument(); 40 | }); 41 | }); 42 | 43 | describe('Timeline', () => { 44 | it('renders empty state when no items provided', () => { 45 | render(); 46 | expect(screen.getByText('No timeline items to display')).toBeInTheDocument(); 47 | }); 48 | 49 | it('renders timeline items correctly', () => { 50 | render( 51 | 52 | } 57 | status="completed" 58 | iconColor="primary" 59 | /> 60 | , 61 | ); 62 | 63 | expect(screen.getByText('Test Event')).toBeInTheDocument(); 64 | expect(screen.getByText('Test Description')).toBeInTheDocument(); 65 | expect(screen.getByText('2024-01-01')).toBeInTheDocument(); 66 | }); 67 | 68 | it('renders loading state correctly', () => { 69 | render( 70 | 71 | 72 | , 73 | ); 74 | 75 | expect(screen.getByRole('status')).toBeInTheDocument(); 76 | expect(screen.getAllByRole('status')).toHaveLength(1); 77 | const loadingElements = document.querySelectorAll('.animate-pulse'); 78 | expect(loadingElements.length).toBeGreaterThan(0); 79 | }); 80 | 81 | it('renders error state correctly', () => { 82 | const errorMessage = 'Test error message'; 83 | render( 84 | 85 | } 90 | /> 91 | , 92 | ); 93 | 94 | expect(screen.getByText(errorMessage)).toBeInTheDocument(); 95 | expect(screen.getByText('Error Event')).toBeInTheDocument(); 96 | expect(screen.getByRole('alert')).toBeInTheDocument(); 97 | }); 98 | 99 | it('applies size variants correctly', () => { 100 | const { container } = render( 101 | 102 | 103 | , 104 | ); 105 | 106 | expect(container.firstChild).toHaveClass('gap-8'); 107 | }); 108 | 109 | it('handles different icon sizes', () => { 110 | const { container } = render( 111 | 112 | } /> 113 | , 114 | ); 115 | 116 | const iconContainer = container.querySelector( 117 | '[class*="relative flex items-center justify-center rounded-full"]', 118 | ); 119 | expect(iconContainer).toBeInTheDocument(); 120 | expect(iconContainer).toHaveClass('h-12', 'w-12'); 121 | }); 122 | }); 123 | 124 | describe('TimelineLayout', () => { 125 | it('renders all timeline items in reverse order', () => { 126 | render(); 127 | 128 | const items = screen.getAllByRole('listitem'); 129 | expect(items).toHaveLength(2); 130 | expect(items[0]).toHaveTextContent('In Progress Event'); 131 | expect(items[1]).toHaveTextContent('Test Event'); 132 | }); 133 | 134 | it('applies custom colors correctly', () => { 135 | const { container } = render( 136 | ({ ...item, color: undefined }))} 138 | iconColor="accent" 139 | connectorColor="accent" 140 | />, 141 | ); 142 | 143 | const iconContainer = container.querySelector('.text-destructive-foreground'); 144 | expect(iconContainer).toBeInTheDocument(); 145 | }); 146 | 147 | it('handles animation prop', () => { 148 | const { container } = render(); 149 | 150 | const motionDivs = container.querySelectorAll('[style*="transform"]'); 151 | expect(motionDivs.length).toBe(0); 152 | }); 153 | 154 | it('renders with different sizes', () => { 155 | const { container } = render(); 156 | 157 | expect(container.firstChild).toHaveClass('gap-4'); 158 | }); 159 | }); 160 | -------------------------------------------------------------------------------- /src/components/timeline/index.ts: -------------------------------------------------------------------------------- 1 | export * from './timeline'; 2 | export * from './timeline-layout'; 3 | -------------------------------------------------------------------------------- /src/components/timeline/timeline-layout.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import React from 'react'; 4 | import { Timeline, TimelineItem } from './timeline'; 5 | import { motion } from 'framer-motion'; 6 | import type { TimelineElement } from '@/types'; 7 | 8 | interface TimelineLayoutProps { 9 | items: TimelineElement[]; 10 | size?: 'sm' | 'md' | 'lg'; 11 | iconColor?: 'primary' | 'secondary' | 'muted' | 'accent'; 12 | customIcon?: React.ReactNode; 13 | animate?: boolean; 14 | connectorColor?: 'primary' | 'secondary' | 'muted' | 'accent'; 15 | className?: string; 16 | } 17 | 18 | export const TimelineLayout = ({ 19 | items, 20 | size = 'md', 21 | iconColor, 22 | customIcon, 23 | animate = true, 24 | connectorColor, 25 | className, 26 | }: TimelineLayoutProps) => { 27 | return ( 28 | 29 | {[...items].reverse().map((item, index) => ( 30 | 40 | 49 | 50 | ))} 51 | 52 | ); 53 | }; 54 | -------------------------------------------------------------------------------- /src/components/timeline/timeline.stories.tsx: -------------------------------------------------------------------------------- 1 | import type { Meta, StoryObj } from '@storybook/react'; 2 | import { expect, within } from '@storybook/test'; 3 | 4 | import { TimelineLayout } from './timeline-layout'; 5 | import { 6 | defaultItems, 7 | stateItems, 8 | sizedItems, 9 | loadingItems, 10 | errorItems, 11 | timelineFixtures, 12 | } from './__fixtures__/timeline-items'; 13 | 14 | const meta = { 15 | title: 'Components/Timeline', 16 | component: TimelineLayout, 17 | parameters: { 18 | layout: 'centered', 19 | docs: { 20 | description: { 21 | component: 22 | 'A beautiful, accessible timeline component that supports various states, sizes, and customizations.', 23 | }, 24 | }, 25 | }, 26 | tags: ['autodocs'], 27 | argTypes: { 28 | size: { 29 | description: 'The size of the timeline component', 30 | control: 'select', 31 | options: ['sm', 'md', 'lg'], 32 | defaultValue: 'md', 33 | table: { 34 | type: { summary: 'string' }, 35 | }, 36 | }, 37 | iconColor: { 38 | description: 'The color of the timeline icons', 39 | control: 'select', 40 | options: ['primary', 'secondary', 'muted', 'accent'], 41 | defaultValue: 'primary', 42 | table: { 43 | type: { summary: 'string' }, 44 | }, 45 | }, 46 | connectorColor: { 47 | description: 'The color of the connector lines', 48 | control: 'select', 49 | options: ['primary', 'secondary', 'muted', 'accent'], 50 | defaultValue: 'primary', 51 | table: { 52 | type: { summary: 'string' }, 53 | }, 54 | }, 55 | animate: { 56 | description: 'Whether to animate the timeline items', 57 | control: 'boolean', 58 | defaultValue: true, 59 | table: { 60 | type: { summary: 'boolean' }, 61 | }, 62 | }, 63 | items: { 64 | description: 'Array of timeline items', 65 | control: 'object', 66 | table: { 67 | type: { summary: 'TimelineElement[]' }, 68 | }, 69 | }, 70 | className: { 71 | description: 'Additional CSS classes', 72 | control: 'text', 73 | table: { 74 | type: { summary: 'string' }, 75 | }, 76 | }, 77 | }, 78 | } satisfies Meta; 79 | 80 | export default meta; 81 | type Story = StoryObj; 82 | 83 | const commonClasses = 'min-h-[600px] w-full max-w-2xl mx-auto p-8 flex items-center justify-center'; 84 | 85 | export const Default: Story = { 86 | args: { 87 | items: defaultItems.map(item => ({ ...item, color: undefined })), 88 | size: 'md', 89 | animate: true, 90 | iconColor: 'primary', 91 | connectorColor: 'primary', 92 | className: commonClasses, 93 | }, 94 | play: async ({ canvasElement }) => { 95 | const canvas = within(canvasElement); 96 | 97 | // Check if all timeline items are rendered 98 | const items = await canvas.findAllByRole('listitem'); 99 | expect(items).toHaveLength(defaultItems.length); 100 | 101 | // Check if titles are rendered correctly 102 | defaultItems.forEach(async (item) => { 103 | expect(await canvas.findByText(item.title)).toBeInTheDocument(); 104 | }); 105 | 106 | // Check if dates are rendered 107 | defaultItems.forEach(async (item) => { 108 | expect(await canvas.findByText(item.date)).toBeInTheDocument(); 109 | }); 110 | 111 | // Check if descriptions are rendered 112 | defaultItems.forEach(async (item) => { 113 | expect(await canvas.findByText(item.description)).toBeInTheDocument(); 114 | }); 115 | }, 116 | }; 117 | 118 | export const CustomColors: Story = { 119 | args: { 120 | items: defaultItems.map((item) => ({ ...item, color: undefined })), 121 | size: 'md', 122 | animate: true, 123 | iconColor: 'accent', 124 | connectorColor: 'accent', 125 | className: commonClasses, 126 | }, 127 | play: async ({ canvasElement, args }) => { 128 | const canvas = within(canvasElement); 129 | 130 | // Increase wait time to ensure elements are rendered 131 | await new Promise((resolve) => setTimeout(resolve, 500)); 132 | 133 | // Check if items are rendered 134 | const items = canvas.getAllByRole('listitem'); 135 | expect(items).toHaveLength(defaultItems.length); 136 | 137 | // Check for any timeline item with accent color 138 | const timelineItems = canvasElement.querySelectorAll('li'); 139 | let hasAccentColor = false; 140 | 141 | timelineItems.forEach((item) => { 142 | if ( 143 | item.querySelector('[class*="text-accent"]') || 144 | item.querySelector('[class*="after:bg-accent"]') 145 | ) { 146 | hasAccentColor = true; 147 | } 148 | }); 149 | 150 | expect(hasAccentColor).toBeTruthy(); 151 | }, 152 | }; 153 | 154 | export const States: Story = { 155 | args: { 156 | items: stateItems, 157 | animate: true, 158 | iconColor: 'primary', 159 | connectorColor: 'primary', 160 | className: commonClasses, 161 | }, 162 | }; 163 | 164 | export const Small: Story = { 165 | args: { 166 | items: sizedItems.sm, 167 | size: 'sm', 168 | animate: true, 169 | className: commonClasses, 170 | }, 171 | }; 172 | 173 | export const Loading: Story = { 174 | args: { 175 | items: loadingItems, 176 | animate: false, 177 | className: commonClasses, 178 | }, 179 | play: async ({ canvasElement }) => { 180 | const canvas = within(canvasElement); 181 | 182 | // Wait for loading elements to render 183 | await new Promise((resolve) => setTimeout(resolve, 500)); 184 | 185 | // Check for loading skeletons 186 | const loadingItems = canvas.getAllByRole('listitem'); 187 | expect(loadingItems.length).toBeGreaterThan(0); 188 | 189 | // Check for loading state indicators 190 | const loadingTexts = canvas.getAllByText('Loading...'); 191 | expect(loadingTexts.length).toBeGreaterThan(0); 192 | 193 | // Check for "Content is loading..." text 194 | const loadingDescriptions = canvas.getAllByText('Content is loading...'); 195 | expect(loadingDescriptions.length).toBeGreaterThan(0); 196 | }, 197 | }; 198 | 199 | export const Error: Story = { 200 | args: { 201 | items: errorItems, 202 | animate: false, 203 | className: commonClasses, 204 | }, 205 | play: async ({ canvasElement }) => { 206 | const canvas = within(canvasElement); 207 | 208 | // Wait for elements to render 209 | await new Promise((resolve) => setTimeout(resolve, 500)); 210 | 211 | // Check if error items are rendered 212 | const items = canvas.getAllByRole('listitem'); 213 | expect(items.length).toBeGreaterThan(0); 214 | 215 | // Check for error styling 216 | const errorIcon = canvasElement.querySelector('[class*="bg-destructive"]'); 217 | expect(errorIcon).toBeTruthy(); 218 | 219 | // Check for error content 220 | const errorTitle = canvas.getByText('Error State'); 221 | expect(errorTitle).toBeInTheDocument(); 222 | 223 | const errorDescription = canvas.getByText('An error occurred while loading this item.'); 224 | expect(errorDescription).toBeInTheDocument(); 225 | 226 | const warningIcon = canvasElement.querySelector('[data-testid="warning-icon"]'); 227 | expect(warningIcon).toBeTruthy(); 228 | }, 229 | }; 230 | 231 | export const CustomGenerated: Story = { 232 | args: { 233 | items: timelineFixtures.createCustom(5, { color: 'accent' }), 234 | animate: true, 235 | className: commonClasses, 236 | }, 237 | }; 238 | 239 | export const EdgeCases: Story = { 240 | args: { 241 | items: [ 242 | // Test empty case 243 | { 244 | id: 1, 245 | date: '', 246 | title: '', 247 | description: '', 248 | }, 249 | // Test minimal case 250 | { 251 | id: 2, 252 | date: '', 253 | title: '', 254 | description: '', 255 | size: 'sm', 256 | }, 257 | // Test all color variants 258 | { 259 | id: 3, 260 | date: '2024-01-01', 261 | title: 'Primary Color', 262 | description: 'Testing primary color', 263 | color: 'primary', 264 | }, 265 | { 266 | id: 4, 267 | date: '2024-01-02', 268 | title: 'Secondary Color', 269 | description: 'Testing secondary color', 270 | color: 'secondary', 271 | }, 272 | { 273 | id: 5, 274 | date: '2024-01-03', 275 | title: 'Accent Color', 276 | description: 'Testing accent color', 277 | color: 'accent', 278 | }, 279 | // Test all status variants 280 | { 281 | id: 6, 282 | date: '2024-01-04', 283 | title: 'Completed Status', 284 | description: 'Testing completed status', 285 | status: 'completed', 286 | }, 287 | { 288 | id: 7, 289 | date: '2024-01-05', 290 | title: 'In Progress Status', 291 | description: 'Testing in-progress status', 292 | status: 'in-progress', 293 | }, 294 | { 295 | id: 8, 296 | date: '2024-01-06', 297 | title: 'Pending Status', 298 | description: 'Testing pending status', 299 | status: 'pending', 300 | }, 301 | ], 302 | animate: false, 303 | className: commonClasses, 304 | }, 305 | }; 306 | 307 | // Add test for custom connector colors 308 | export const CustomConnectors: Story = { 309 | args: { 310 | items: [ 311 | { 312 | id: 1, 313 | date: '2024-01-01', 314 | title: 'Custom Connector', 315 | description: 'Item with custom connector', 316 | color: 'accent', 317 | }, 318 | { 319 | id: 2, 320 | date: '2024-01-02', 321 | title: 'No Connector', 322 | description: 'Item without connector', 323 | }, 324 | { 325 | id: 3, 326 | date: '2024-01-03', 327 | title: 'Last Item', 328 | description: 'Final item in timeline', 329 | }, 330 | ], 331 | connectorColor: 'accent', 332 | className: commonClasses, 333 | }, 334 | }; 335 | 336 | // Add test for custom icons 337 | export const CustomIcons: Story = { 338 | args: { 339 | items: [ 340 | { 341 | id: 1, 342 | date: '2024-01-01', 343 | title: 'Custom Icon', 344 | description: 'Item with custom icon', 345 | icon: , 346 | }, 347 | ], 348 | className: commonClasses, 349 | }, 350 | }; 351 | -------------------------------------------------------------------------------- /src/components/timeline/timeline.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import * as React from 'react'; 4 | import { cn } from '@/lib/utils'; 5 | import { cva, type VariantProps } from 'class-variance-authority'; 6 | import { motion, HTMLMotionProps } from 'framer-motion'; 7 | import { AlertCircle, Loader2 } from 'lucide-react'; 8 | import type { TimelineColor } from '@/types'; 9 | 10 | const timelineVariants = cva('flex flex-col relative', { 11 | variants: { 12 | size: { 13 | sm: 'gap-4', 14 | md: 'gap-6', 15 | lg: 'gap-8', 16 | }, 17 | }, 18 | defaultVariants: { 19 | size: 'md', 20 | }, 21 | }); 22 | 23 | /** 24 | * Timeline component props interface 25 | * @interface TimelineProps 26 | * @extends {React.HTMLAttributes} 27 | * @extends {VariantProps} 28 | */ 29 | interface TimelineProps 30 | extends React.HTMLAttributes, 31 | VariantProps { 32 | /** Size of the timeline icons */ 33 | iconsize?: 'sm' | 'md' | 'lg'; 34 | } 35 | 36 | /** 37 | * Timeline component for displaying a vertical list of events or items 38 | * @component 39 | */ 40 | const Timeline = React.forwardRef( 41 | ({ className, iconsize, size, children, ...props }, ref) => { 42 | const items = React.Children.toArray(children); 43 | 44 | if (items.length === 0) { 45 | return ; 46 | } 47 | 48 | return ( 49 |
    59 | {React.Children.map(children, (child, index) => { 60 | if ( 61 | React.isValidElement(child) && 62 | typeof child.type !== 'string' && 63 | 'displayName' in child.type && 64 | child.type.displayName === 'TimelineItem' 65 | ) { 66 | return React.cloneElement(child, { 67 | iconsize, 68 | showConnector: index !== items.length - 1, 69 | } as React.ComponentProps); 70 | } 71 | return child; 72 | })} 73 |
74 | ); 75 | }, 76 | ); 77 | Timeline.displayName = 'Timeline'; 78 | 79 | /** 80 | * TimelineItem component props interface 81 | * @interface TimelineItemProps 82 | * @extends {Omit, "ref">} 83 | */ 84 | interface TimelineItemProps extends Omit, 'ref'> { 85 | /** Date string for the timeline item */ 86 | date?: string; 87 | /** Title of the timeline item */ 88 | title?: string; 89 | /** Description text */ 90 | description?: string; 91 | /** Custom icon element */ 92 | icon?: React.ReactNode; 93 | /** Color theme for the icon */ 94 | iconColor?: TimelineColor; 95 | /** Current status of the item */ 96 | status?: 'completed' | 'in-progress' | 'pending'; 97 | /** Color theme for the connector line */ 98 | connectorColor?: TimelineColor; 99 | /** Whether to show the connector line */ 100 | showConnector?: boolean; 101 | /** Size of the icon */ 102 | iconsize?: 'sm' | 'md' | 'lg'; 103 | /** Loading state */ 104 | loading?: boolean; 105 | /** Error message */ 106 | error?: string; 107 | } 108 | 109 | const TimelineItem = React.forwardRef( 110 | ( 111 | { 112 | className, 113 | date, 114 | title, 115 | description, 116 | icon, 117 | iconColor, 118 | status = 'completed', 119 | connectorColor, 120 | showConnector = true, 121 | iconsize, 122 | loading, 123 | error, 124 | // Omit unused Framer Motion props 125 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 126 | initial, 127 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 128 | animate, 129 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 130 | transition, 131 | ...props 132 | }, 133 | ref, 134 | ) => { 135 | const commonClassName = cn( 136 | 'relative w-full mb-8 last:mb-0', 137 | className, 138 | ); 139 | 140 | // Loading State 141 | if (loading) { 142 | return ( 143 | 151 |
152 |
153 |
154 |
155 | 156 |
157 |
158 | 159 |
160 | {showConnector &&
} 161 |
162 | 163 |
164 |
165 |
166 |
167 |
168 |
169 |
170 | 171 | ); 172 | } 173 | 174 | // Error State 175 | if (error) { 176 | return ( 177 | 185 |
186 |
187 | {date} 188 |
189 | 190 |
191 |
192 | 193 |
194 | {showConnector && } 195 |
196 | 197 |
198 | 199 | {title || 'Error'} 200 | 201 | {error} 202 |
203 |
204 |
205 | ); 206 | } 207 | 208 | const content = ( 209 |
213 | {/* Date */} 214 |
215 | {date} 216 |
217 | 218 | {/* Timeline dot and connector */} 219 |
220 |
221 | 222 |
223 | {showConnector && ( 224 |
225 | )} 226 |
227 | 228 | {/* Content */} 229 | 230 | 231 | {title} 232 | 233 | {description} 234 | 235 |
236 | ); 237 | 238 | // Filter out Framer Motion specific props 239 | const { 240 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 241 | style, 242 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 243 | onDrag, 244 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 245 | onDragStart, 246 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 247 | onDragEnd, 248 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 249 | onAnimationStart, 250 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 251 | onAnimationComplete, 252 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 253 | transformTemplate, 254 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 255 | whileHover, 256 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 257 | whileTap, 258 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 259 | whileDrag, 260 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 261 | whileFocus, 262 | // eslint-disable-next-line @typescript-eslint/no-unused-vars 263 | whileInView, 264 | ...filteredProps 265 | } = props; 266 | 267 | return ( 268 |
  • 269 | {content} 270 |
  • 271 | ); 272 | }, 273 | ); 274 | TimelineItem.displayName = 'TimelineItem'; 275 | 276 | interface TimelineTimeProps extends React.HTMLAttributes { 277 | /** Date string, Date object, or timestamp */ 278 | date?: string | Date | number; 279 | /** Optional format for displaying the date */ 280 | format?: Intl.DateTimeFormatOptions; 281 | } 282 | 283 | const defaultDateFormat: Intl.DateTimeFormatOptions = { 284 | year: 'numeric', 285 | month: 'short', 286 | day: '2-digit', 287 | }; 288 | 289 | const TimelineTime = React.forwardRef( 290 | ({ className, date, format, children, ...props }, ref) => { 291 | const formattedDate = React.useMemo(() => { 292 | if (!date) return ''; 293 | 294 | try { 295 | const dateObj = new Date(date); 296 | if (isNaN(dateObj.getTime())) return ''; 297 | 298 | return new Intl.DateTimeFormat('en-US', { 299 | ...defaultDateFormat, 300 | ...format, 301 | }).format(dateObj); 302 | } catch (error) { 303 | console.error('Error formatting date:', error); 304 | return ''; 305 | } 306 | }, [date, format]); 307 | 308 | return ( 309 | 317 | ); 318 | }, 319 | ); 320 | TimelineTime.displayName = 'TimelineTime'; 321 | 322 | const TimelineConnector = React.forwardRef< 323 | HTMLDivElement, 324 | React.HTMLAttributes & { 325 | status?: 'completed' | 'in-progress' | 'pending'; 326 | color?: 'primary' | 'secondary' | 'muted' | 'accent'; 327 | } 328 | >(({ className, status = 'completed', color, ...props }, ref) => ( 329 |
    344 | )); 345 | TimelineConnector.displayName = 'TimelineConnector'; 346 | 347 | const TimelineHeader = React.forwardRef>( 348 | ({ className, ...props }, ref) => ( 349 |
    350 | ), 351 | ); 352 | TimelineHeader.displayName = 'TimelineHeader'; 353 | 354 | const TimelineTitle = React.forwardRef< 355 | HTMLHeadingElement, 356 | React.HTMLAttributes 357 | >(({ className, children, ...props }, ref) => ( 358 |

    363 | {children} 364 |

    365 | )); 366 | TimelineTitle.displayName = 'TimelineTitle'; 367 | 368 | const TimelineIcon = ({ 369 | icon, 370 | color = 'primary', 371 | status = 'completed', 372 | iconSize = 'md', 373 | }: { 374 | icon?: React.ReactNode; 375 | color?: 'primary' | 'secondary' | 'muted' | 'accent' | 'destructive'; 376 | status?: 'completed' | 'in-progress' | 'pending' | 'error'; 377 | iconSize?: 'sm' | 'md' | 'lg'; 378 | }) => { 379 | const sizeClasses = { 380 | sm: 'h-8 w-8', 381 | md: 'h-10 w-10', 382 | lg: 'h-12 w-12', 383 | }; 384 | 385 | const iconSizeClasses = { 386 | sm: 'h-4 w-4', 387 | md: 'h-5 w-5', 388 | lg: 'h-6 w-6', 389 | }; 390 | 391 | const colorClasses = { 392 | primary: 'bg-primary text-primary-foreground', 393 | secondary: 'bg-secondary text-secondary-foreground', 394 | muted: 'bg-muted text-muted-foreground', 395 | accent: 'bg-accent text-accent-foreground', 396 | destructive: 'bg-destructive text-destructive-foreground', 397 | }; 398 | 399 | return ( 400 |
    407 | {icon ? ( 408 |
    409 | {icon} 410 |
    411 | ) : ( 412 |
    413 | )} 414 |
    415 | ); 416 | }; 417 | 418 | const TimelineDescription = React.forwardRef< 419 | HTMLParagraphElement, 420 | React.HTMLAttributes 421 | >(({ className, ...props }, ref) => ( 422 |

    423 | )); 424 | TimelineDescription.displayName = 'TimelineDescription'; 425 | 426 | const TimelineContent = React.forwardRef>( 427 | ({ className, ...props }, ref) => ( 428 |

    429 | ), 430 | ); 431 | TimelineContent.displayName = 'TimelineContent'; 432 | 433 | const TimelineEmpty = React.forwardRef>( 434 | ({ className, children, ...props }, ref) => ( 435 |
    440 |

    {children || 'No timeline items to display'}

    441 |
    442 | ), 443 | ); 444 | TimelineEmpty.displayName = 'TimelineEmpty'; 445 | 446 | export { 447 | Timeline, 448 | TimelineItem, 449 | TimelineConnector, 450 | TimelineHeader, 451 | TimelineTitle, 452 | TimelineIcon, 453 | TimelineDescription, 454 | TimelineContent, 455 | TimelineTime, 456 | TimelineEmpty, 457 | }; 458 | -------------------------------------------------------------------------------- /src/components/ui/button.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import { Slot } from '@radix-ui/react-slot'; 3 | import { cva, type VariantProps } from 'class-variance-authority'; 4 | 5 | import { cn } from '@/lib/utils'; 6 | 7 | const buttonVariants = cva( 8 | 'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50', 9 | { 10 | variants: { 11 | variant: { 12 | default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90', 13 | destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90', 14 | outline: 15 | 'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground', 16 | secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80', 17 | ghost: 'hover:bg-accent hover:text-accent-foreground', 18 | link: 'text-primary underline-offset-4 hover:underline', 19 | }, 20 | size: { 21 | default: 'h-9 px-4 py-2', 22 | sm: 'h-8 rounded-md px-3 text-xs', 23 | lg: 'h-10 rounded-md px-8', 24 | icon: 'h-9 w-9', 25 | }, 26 | }, 27 | defaultVariants: { 28 | variant: 'default', 29 | size: 'default', 30 | }, 31 | }, 32 | ); 33 | 34 | export interface ButtonProps 35 | extends React.ButtonHTMLAttributes, 36 | VariantProps { 37 | asChild?: boolean; 38 | } 39 | 40 | const Button = React.forwardRef( 41 | ({ className, variant, size, asChild = false, ...props }, ref) => { 42 | const Comp = asChild ? Slot : 'button'; 43 | return ( 44 | 45 | ); 46 | }, 47 | ); 48 | Button.displayName = 'Button'; 49 | 50 | export { Button, buttonVariants }; 51 | -------------------------------------------------------------------------------- /src/components/ui/card.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | 3 | import { cn } from '@/lib/utils'; 4 | 5 | const Card = React.forwardRef>( 6 | ({ className, ...props }, ref) => ( 7 |
    12 | ), 13 | ); 14 | Card.displayName = 'Card'; 15 | 16 | const CardHeader = React.forwardRef>( 17 | ({ className, ...props }, ref) => ( 18 |
    19 | ), 20 | ); 21 | CardHeader.displayName = 'CardHeader'; 22 | 23 | const CardTitle = React.forwardRef>( 24 | ({ className, ...props }, ref) => ( 25 |
    30 | ), 31 | ); 32 | CardTitle.displayName = 'CardTitle'; 33 | 34 | const CardDescription = React.forwardRef>( 35 | ({ className, ...props }, ref) => ( 36 |
    37 | ), 38 | ); 39 | CardDescription.displayName = 'CardDescription'; 40 | 41 | const CardContent = React.forwardRef>( 42 | ({ className, ...props }, ref) => ( 43 |
    44 | ), 45 | ); 46 | CardContent.displayName = 'CardContent'; 47 | 48 | const CardFooter = React.forwardRef>( 49 | ({ className, ...props }, ref) => ( 50 |
    51 | ), 52 | ); 53 | CardFooter.displayName = 'CardFooter'; 54 | 55 | export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }; 56 | -------------------------------------------------------------------------------- /src/components/ui/tabs.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import * as React from 'react'; 4 | import * as TabsPrimitive from '@radix-ui/react-tabs'; 5 | 6 | import { cn } from '@/lib/utils'; 7 | 8 | const Tabs = TabsPrimitive.Root; 9 | 10 | const TabsList = React.forwardRef< 11 | React.ElementRef, 12 | React.ComponentPropsWithoutRef 13 | >(({ className, ...props }, ref) => ( 14 | 22 | )); 23 | TabsList.displayName = TabsPrimitive.List.displayName; 24 | 25 | const TabsTrigger = React.forwardRef< 26 | React.ElementRef, 27 | React.ComponentPropsWithoutRef 28 | >(({ className, ...props }, ref) => ( 29 | 37 | )); 38 | TabsTrigger.displayName = TabsPrimitive.Trigger.displayName; 39 | 40 | const TabsContent = React.forwardRef< 41 | React.ElementRef, 42 | React.ComponentPropsWithoutRef 43 | >(({ className, ...props }, ref) => ( 44 | 52 | )); 53 | TabsContent.displayName = TabsPrimitive.Content.displayName; 54 | 55 | export { Tabs, TabsList, TabsTrigger, TabsContent }; 56 | -------------------------------------------------------------------------------- /src/config/metadata.ts: -------------------------------------------------------------------------------- 1 | import type { Metadata, Viewport } from 'next'; 2 | import { siteConfig } from './site'; 3 | 4 | export const metadata: Metadata = { 5 | title: siteConfig.name, 6 | description: siteConfig.description, 7 | } as const; 8 | 9 | export const viewport: Viewport = { 10 | width: 'device-width', 11 | initialScale: 1.0, 12 | maximumScale: 1.0, 13 | userScalable: false, 14 | } as const; -------------------------------------------------------------------------------- /src/config/site.ts: -------------------------------------------------------------------------------- 1 | const THEMES = ['default-yellow', 'default-black', 'default-white'] as const; 2 | type Theme = typeof THEMES[number]; 3 | 4 | interface BuyMeACoffeeConfig { 5 | username: string; 6 | defaultTheme: Theme; 7 | } 8 | 9 | interface SiteLinks { 10 | github: string; 11 | } 12 | 13 | interface SiteConfig { 14 | name: string; 15 | description: string; 16 | url: string; 17 | buyMeACoffee: BuyMeACoffeeConfig; 18 | links: SiteLinks; 19 | } 20 | 21 | export const siteConfig: SiteConfig = { 22 | name: "Shadcn Timeline", 23 | description: "A timeline component built with shadcn/ui", 24 | url: process.env.SITE_URL || "https://localhost:3000", 25 | buyMeACoffee: { 26 | username: "timdehof", 27 | defaultTheme: "default-yellow", 28 | }, 29 | links: { 30 | github: "https://github.com/TimDehof/shadcn-timeline", 31 | }, 32 | } as const; 33 | 34 | export type { SiteConfig, Theme }; 35 | -------------------------------------------------------------------------------- /src/lib/utils.ts: -------------------------------------------------------------------------------- 1 | import { type ClassValue, clsx } from 'clsx'; 2 | import { twMerge } from 'tailwind-merge'; 3 | 4 | export function cn(...inputs: ClassValue[]) { 5 | return twMerge(clsx(inputs)); 6 | } 7 | -------------------------------------------------------------------------------- /src/styles/globals.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | 5 | @layer base { 6 | :root { 7 | --background: 0 0% 100%; 8 | --foreground: 240 10% 3.9%; 9 | --card: 0 0% 100%; 10 | --card-foreground: 240 10% 3.9%; 11 | --popover: 0 0% 100%; 12 | --popover-foreground: 240 10% 3.9%; 13 | --primary: 142.1 76.2% 36.3%; 14 | --primary-foreground: 355.7 100% 97.3%; 15 | --secondary: 240 4.8% 95.9%; 16 | --secondary-foreground: 240 5.9% 10%; 17 | --muted: 240 4.8% 95.9%; 18 | --muted-foreground: 240 3.8% 46.1%; 19 | --accent: 240 4.8% 95.9%; 20 | --accent-foreground: 240 5.9% 10%; 21 | --destructive: 0 84.2% 60.2%; 22 | --destructive-foreground: 0 0% 98%; 23 | --border: 240 5.9% 90%; 24 | --input: 240 5.9% 90%; 25 | --ring: 142.1 76.2% 36.3%; 26 | --radius: 0.5rem; 27 | } 28 | 29 | .dark { 30 | --background: 20 14.3% 4.1%; 31 | --foreground: 0 0% 95%; 32 | --card: 24 9.8% 10%; 33 | --card-foreground: 0 0% 95%; 34 | --popover: 0 0% 9%; 35 | --popover-foreground: 0 0% 95%; 36 | --primary: 142.1 70.6% 45.3%; 37 | --primary-foreground: 144.9 80.4% 10%; 38 | --secondary: 240 3.7% 15.9%; 39 | --secondary-foreground: 0 0% 98%; 40 | --muted: 0 0% 15%; 41 | --muted-foreground: 240 5% 64.9%; 42 | --accent: 12 6.5% 15.1%; 43 | --accent-foreground: 0 0% 98%; 44 | --destructive: 0 62.8% 30.6%; 45 | --destructive-foreground: 0 85.7% 97.3%; 46 | --border: 240 3.7% 15.9%; 47 | --input: 240 3.7% 15.9%; 48 | --ring: 142.4 71.8% 29.2%; 49 | } 50 | } 51 | 52 | @layer base { 53 | * { 54 | @apply border-border; 55 | } 56 | body { 57 | @apply bg-background text-foreground; 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /src/types/index.ts: -------------------------------------------------------------------------------- 1 | import { ReactNode } from 'react'; 2 | 3 | export type TimelineSize = 'sm' | 'md' | 'lg'; 4 | export type TimelineStatus = 'completed' | 'in-progress' | 'pending'; 5 | export type TimelineColor = 'primary' | 'secondary' | 'muted' | 'accent' | 'destructive'; 6 | 7 | export interface TimelineElement { 8 | id: number; 9 | date: string; 10 | title: string; 11 | description: string; 12 | icon?: ReactNode | (() => ReactNode); 13 | status?: TimelineStatus; 14 | color?: TimelineColor; 15 | size?: TimelineSize; 16 | loading?: boolean; 17 | error?: string; 18 | } 19 | 20 | export interface TimelineProps { 21 | items: TimelineElement[]; 22 | size?: TimelineSize; 23 | animate?: boolean; 24 | iconColor?: TimelineColor; 25 | connectorColor?: TimelineColor; 26 | className?: string; 27 | } 28 | -------------------------------------------------------------------------------- /storybook-static/favicon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | @storybook/core - Storybook 7 | 8 | 9 | 10 | 11 | 12 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 83 | 84 | 85 | 86 | 87 |
    88 | 89 | 90 | 151 | 152 | 153 | 186 | 187 | 188 | 189 | 190 | 191 | 192 | -------------------------------------------------------------------------------- /storybook-static/index.json: -------------------------------------------------------------------------------- 1 | {"v":5,"entries":{"components-timeline--docs":{"id":"components-timeline--docs","title":"Components/Timeline","name":"Docs","importPath":"./src/components/timeline/timeline.stories.tsx","type":"docs","tags":["dev","test","autodocs"],"storiesImports":[]},"components-timeline--default":{"type":"story","id":"components-timeline--default","name":"Default","title":"Components/Timeline","importPath":"./src/components/timeline/timeline.stories.tsx","componentPath":"./src/components/timeline/timeline-layout.tsx","tags":["dev","test","autodocs"]},"components-timeline--states":{"type":"story","id":"components-timeline--states","name":"States","title":"Components/Timeline","importPath":"./src/components/timeline/timeline.stories.tsx","componentPath":"./src/components/timeline/timeline-layout.tsx","tags":["dev","test","autodocs"]},"components-timeline--small":{"type":"story","id":"components-timeline--small","name":"Small","title":"Components/Timeline","importPath":"./src/components/timeline/timeline.stories.tsx","componentPath":"./src/components/timeline/timeline-layout.tsx","tags":["dev","test","autodocs"]},"components-timeline--loading":{"type":"story","id":"components-timeline--loading","name":"Loading","title":"Components/Timeline","importPath":"./src/components/timeline/timeline.stories.tsx","componentPath":"./src/components/timeline/timeline-layout.tsx","tags":["dev","test","autodocs"]},"components-timeline--error":{"type":"story","id":"components-timeline--error","name":"Error","title":"Components/Timeline","importPath":"./src/components/timeline/timeline.stories.tsx","componentPath":"./src/components/timeline/timeline-layout.tsx","tags":["dev","test","autodocs"]},"components-timeline--custom-generated":{"type":"story","id":"components-timeline--custom-generated","name":"Custom Generated","title":"Components/Timeline","importPath":"./src/components/timeline/timeline.stories.tsx","componentPath":"./src/components/timeline/timeline-layout.tsx","tags":["dev","test","autodocs"]}}} -------------------------------------------------------------------------------- /storybook-static/next.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/nunito-sans-bold-italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/nunito-sans-bold-italic.woff2 -------------------------------------------------------------------------------- /storybook-static/nunito-sans-bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/nunito-sans-bold.woff2 -------------------------------------------------------------------------------- /storybook-static/nunito-sans-italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/nunito-sans-italic.woff2 -------------------------------------------------------------------------------- /storybook-static/nunito-sans-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/nunito-sans-regular.woff2 -------------------------------------------------------------------------------- /storybook-static/project.json: -------------------------------------------------------------------------------- 1 | {"generatedAt":1735936376429,"hasCustomBabel":false,"hasCustomWebpack":false,"hasStaticDirs":true,"hasStorybookEslint":true,"refCount":0,"metaFramework":{"name":"Next","packageName":"next","version":"15.1.3"},"testPackages":{"@testing-library/jest-dom":"6.6.3","@testing-library/react":"16.1.0","@types/jest":"29.5.14","babel-jest":"29.7.0","jest":"29.7.0","jest-environment-jsdom":"29.7.0"},"packageManager":{"type":"npm","version":"10.8.2"},"preview":{"usesGlobals":false},"framework":{"name":"@storybook/nextjs","options":{}},"builder":"@storybook/builder-webpack5","renderer":"@storybook/react","portableStoriesFileCount":0,"storybookVersion":"8.4.7","storybookVersionSpecifier":"^8.4.7","language":"typescript","storybookPackages":{"@chromatic-com/storybook":{"version":"3.2.3"},"@storybook/blocks":{"version":"8.4.7"},"@storybook/nextjs":{"version":"8.4.7"},"@storybook/react":{"version":"8.4.7"},"@storybook/test":{"version":"8.4.7"},"@storybook/test-runner":{"version":"0.21.0"},"eslint-plugin-storybook":{"version":"0.11.2"},"storybook":{"version":"8.4.7"}},"addons":{"@storybook/addon-links":{"version":"8.4.7"},"@storybook/addon-essentials":{"version":"8.4.7"},"@storybook/addon-onboarding":{"version":"8.4.7"},"@storybook/addon-interactions":{"version":"8.4.7"},"@storybook/addon-themes":{"version":"8.4.7"},"@storybook/addon-a11y":{"version":"8.4.7"},"@storybook/addon-coverage":{"version":"1.0.5"},"@storybook/addon-styling-webpack":{"version":"1.0.1"},"chromatic":{"version":"11.20.2","versionSpecifier":"^11.20.2"}}} -------------------------------------------------------------------------------- /storybook-static/robots.txt: -------------------------------------------------------------------------------- 1 | # * 2 | User-agent: * 3 | Allow: / 4 | 5 | # Host 6 | Host: https://shadcn-timeline.vercel.app 7 | 8 | # Sitemaps 9 | Sitemap: https://shadcn-timeline.vercel.app/sitemap.xml 10 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/a11y-12/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var r=__REACT__,{Children:_o,Component:To,Fragment:U,Profiler:yo,PureComponent:se,StrictMode:bo,Suspense:Oo,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:Co,cloneElement:G,createContext:ue,createElement:E,createFactory:vo,createRef:de,forwardRef:Ao,isValidElement:me,lazy:xo,memo:No,startTransition:ko,unstable_act:Lo,useCallback:x,useContext:pe,useDebugValue:Do,useDeferredValue:wo,useEffect:H,useId:Po,useImperativeHandle:Ho,useInsertionEffect:Bo,useLayoutEffect:ge,useMemo:F,useReducer:Mo,useRef:W,useState:k,useSyncExternalStore:Uo,useTransition:Go,version:Fo}=__REACT__;var jo=__STORYBOOK_COMPONENTS__,{A:zo,ActionBar:K,AddonPanel:Vo,Badge:Q,Bar:Ko,Blockquote:Qo,Button:qo,ClipboardCode:Xo,Code:Zo,DL:Jo,Div:er,DocumentWrapper:tr,EmptyTabContent:Ee,ErrorFormatter:nr,FlexBar:or,Form:rr,H1:ar,H2:ir,H3:cr,H4:lr,H5:sr,H6:ur,HR:dr,IconButton:he,IconButtonSkeleton:mr,Icons:pr,Img:gr,LI:Er,Link:hr,ListItem:Ir,Loader:fr,Modal:Rr,OL:Sr,P:_r,Placeholder:Tr,Pre:yr,ResetWrapper:br,ScrollArea:Ie,Separator:Or,Spaced:fe,Span:Cr,StorybookIcon:vr,StorybookLogo:Ar,Symbols:xr,SyntaxHighlighter:Nr,TT:kr,TabBar:Lr,TabButton:Dr,TabWrapper:wr,Table:Pr,Tabs:Hr,TabsState:Br,TooltipLinkList:Re,TooltipMessage:Mr,TooltipNote:Ur,UL:Gr,WithTooltip:Se,WithTooltipPure:Fr,Zoom:Wr,codeCommon:$r,components:Yr,createCopyToClipboardFunction:jr,getStoryHref:zr,icons:Vr,interleaveSeparators:Kr,nameSpaceClassNames:Qr,resetComponents:qr,withReset:Xr}=__STORYBOOK_COMPONENTS__;var na=__STORYBOOK_API__,{ActiveTabs:oa,Consumer:ra,ManagerContext:aa,Provider:ia,RequestResponseError:ca,addons:$,combineParameters:la,controlOrMetaKey:sa,controlOrMetaSymbol:ua,eventMatchesShortcut:da,eventToShortcut:ma,experimental_requestResponse:pa,isMacLike:ga,isShortcutTaken:Ea,keyToSymbol:ha,merge:Ia,mockChannel:fa,optionOrAltSymbol:Ra,shortcutMatchesShortcut:Sa,shortcutToHumanString:_a,types:q,useAddonState:X,useArgTypes:Ta,useArgs:ya,useChannel:Z,useGlobalTypes:ba,useGlobals:Oa,useParameter:_e,useSharedState:Ca,useStoryPrepared:va,useStorybookApi:J,useStorybookState:Te}=__STORYBOOK_API__;var La=__STORYBOOK_THEMING__,{CacheProvider:Da,ClassNames:wa,Global:ye,ThemeProvider:Pa,background:Ha,color:Ba,convert:Y,create:Ma,createCache:Ua,createGlobal:Ga,createReset:Fa,css:Wa,darken:$a,ensure:Ya,ignoreSsrWarning:ja,isPropValid:za,jsx:Va,keyframes:Ka,lighten:Qa,styled:l,themes:j,typography:qa,useTheme:Xa,withTheme:Za}=__STORYBOOK_THEMING__;var oi=__STORYBOOK_ICONS__,{AccessibilityAltIcon:ri,AccessibilityIcon:be,AddIcon:ai,AdminIcon:ii,AlertAltIcon:ci,AlertIcon:li,AlignLeftIcon:si,AlignRightIcon:ui,AppleIcon:di,ArrowBottomLeftIcon:mi,ArrowBottomRightIcon:pi,ArrowDownIcon:gi,ArrowLeftIcon:Ei,ArrowRightIcon:hi,ArrowSolidDownIcon:Ii,ArrowSolidLeftIcon:fi,ArrowSolidRightIcon:Ri,ArrowSolidUpIcon:Si,ArrowTopLeftIcon:_i,ArrowTopRightIcon:Ti,ArrowUpIcon:yi,AzureDevOpsIcon:bi,BackIcon:Oi,BasketIcon:Ci,BatchAcceptIcon:vi,BatchDenyIcon:Ai,BeakerIcon:xi,BellIcon:Ni,BitbucketIcon:ki,BoldIcon:Li,BookIcon:Di,BookmarkHollowIcon:wi,BookmarkIcon:Pi,BottomBarIcon:Hi,BottomBarToggleIcon:Bi,BoxIcon:Mi,BranchIcon:Ui,BrowserIcon:Gi,ButtonIcon:Fi,CPUIcon:Wi,CalendarIcon:$i,CameraIcon:Yi,CategoryIcon:ji,CertificateIcon:zi,ChangedIcon:Vi,ChatIcon:Ki,CheckIcon:Oe,ChevronDownIcon:Qi,ChevronLeftIcon:qi,ChevronRightIcon:Xi,ChevronSmallDownIcon:Ce,ChevronSmallLeftIcon:Zi,ChevronSmallRightIcon:Ji,ChevronSmallUpIcon:ec,ChevronUpIcon:tc,ChromaticIcon:nc,ChromeIcon:oc,CircleHollowIcon:rc,CircleIcon:ac,ClearIcon:ic,CloseAltIcon:cc,CloseIcon:lc,CloudHollowIcon:sc,CloudIcon:uc,CogIcon:dc,CollapseIcon:mc,CommandIcon:pc,CommentAddIcon:gc,CommentIcon:Ec,CommentsIcon:hc,CommitIcon:Ic,CompassIcon:fc,ComponentDrivenIcon:Rc,ComponentIcon:Sc,ContrastIcon:_c,ControlsIcon:Tc,CopyIcon:yc,CreditIcon:bc,CrossIcon:Oc,DashboardIcon:Cc,DatabaseIcon:vc,DeleteIcon:Ac,DiamondIcon:xc,DirectionIcon:Nc,DiscordIcon:kc,DocChartIcon:Lc,DocListIcon:Dc,DocumentIcon:wc,DownloadIcon:Pc,DragIcon:Hc,EditIcon:Bc,EllipsisIcon:Mc,EmailIcon:Uc,ExpandAltIcon:Gc,ExpandIcon:Fc,EyeCloseIcon:Wc,EyeIcon:$c,FaceHappyIcon:Yc,FaceNeutralIcon:jc,FaceSadIcon:zc,FacebookIcon:Vc,FailedIcon:Kc,FastForwardIcon:Qc,FigmaIcon:qc,FilterIcon:Xc,FlagIcon:Zc,FolderIcon:Jc,FormIcon:el,GDriveIcon:tl,GithubIcon:nl,GitlabIcon:ol,GlobeIcon:rl,GoogleIcon:al,GraphBarIcon:il,GraphLineIcon:cl,GraphqlIcon:ll,GridAltIcon:sl,GridIcon:ul,GrowIcon:dl,HeartHollowIcon:ml,HeartIcon:pl,HomeIcon:gl,HourglassIcon:El,InfoIcon:hl,ItalicIcon:Il,JumpToIcon:fl,KeyIcon:Rl,LightningIcon:Sl,LightningOffIcon:_l,LinkBrokenIcon:Tl,LinkIcon:yl,LinkedinIcon:bl,LinuxIcon:Ol,ListOrderedIcon:Cl,ListUnorderedIcon:vl,LocationIcon:Al,LockIcon:xl,MarkdownIcon:Nl,MarkupIcon:kl,MediumIcon:Ll,MemoryIcon:Dl,MenuIcon:wl,MergeIcon:Pl,MirrorIcon:Hl,MobileIcon:Bl,MoonIcon:Ml,NutIcon:Ul,OutboxIcon:Gl,OutlineIcon:Fl,PaintBrushIcon:Wl,PaperClipIcon:$l,ParagraphIcon:Yl,PassedIcon:jl,PhoneIcon:zl,PhotoDragIcon:Vl,PhotoIcon:Kl,PinAltIcon:Ql,PinIcon:ql,PlayAllHollowIcon:Xl,PlayBackIcon:Zl,PlayHollowIcon:Jl,PlayIcon:es,PlayNextIcon:ts,PlusIcon:ns,PointerDefaultIcon:os,PointerHandIcon:rs,PowerIcon:as,PrintIcon:is,ProceedIcon:cs,ProfileIcon:ls,PullRequestIcon:ss,QuestionIcon:us,RSSIcon:ds,RedirectIcon:ms,ReduxIcon:ps,RefreshIcon:gs,ReplyIcon:Es,RepoIcon:hs,RequestChangeIcon:Is,RewindIcon:fs,RulerIcon:Rs,SaveIcon:Ss,SearchIcon:_s,ShareAltIcon:Ts,ShareIcon:ys,ShieldIcon:bs,SideBySideIcon:Os,SidebarAltIcon:Cs,SidebarAltToggleIcon:vs,SidebarIcon:As,SidebarToggleIcon:xs,SpeakerIcon:Ns,StackedIcon:ks,StarHollowIcon:Ls,StarIcon:Ds,StatusFailIcon:ws,StatusPassIcon:Ps,StatusWarnIcon:Hs,StickerIcon:Bs,StopAltHollowIcon:Ms,StopAltIcon:Us,StopIcon:Gs,StorybookIcon:Fs,StructureIcon:Ws,SubtractIcon:$s,SunIcon:Ys,SupportIcon:js,SwitchAltIcon:zs,SyncIcon:ve,TabletIcon:Vs,ThumbsUpIcon:Ks,TimeIcon:Qs,TimerIcon:qs,TransferIcon:Xs,TrashIcon:Zs,TwitterIcon:Js,TypeIcon:eu,UbuntuIcon:tu,UndoIcon:nu,UnfoldIcon:ou,UnlockIcon:ru,UnpinIcon:au,UploadIcon:iu,UserAddIcon:cu,UserAltIcon:lu,UserIcon:su,UsersIcon:uu,VSCodeIcon:du,VerifiedIcon:mu,VideoIcon:pu,WandIcon:gu,WatchIcon:Eu,WindowsIcon:hu,WrenchIcon:Iu,XIcon:fu,YoutubeIcon:Ru,ZoomIcon:Su,ZoomOutIcon:_u,ZoomResetIcon:Tu,iconList:yu}=__STORYBOOK_ICONS__;var Au=__STORYBOOK_CORE_EVENTS__,{ARGTYPES_INFO_REQUEST:xu,ARGTYPES_INFO_RESPONSE:Nu,CHANNEL_CREATED:ku,CHANNEL_WS_DISCONNECT:Lu,CONFIG_ERROR:Du,CREATE_NEW_STORYFILE_REQUEST:wu,CREATE_NEW_STORYFILE_RESPONSE:Pu,CURRENT_STORY_WAS_SET:Hu,DOCS_PREPARED:Bu,DOCS_RENDERED:Mu,FILE_COMPONENT_SEARCH_REQUEST:Uu,FILE_COMPONENT_SEARCH_RESPONSE:Gu,FORCE_REMOUNT:Fu,FORCE_RE_RENDER:Wu,GLOBALS_UPDATED:$u,NAVIGATE_URL:Yu,PLAY_FUNCTION_THREW_EXCEPTION:ju,PRELOAD_ENTRIES:zu,PREVIEW_BUILDER_PROGRESS:Vu,PREVIEW_KEYDOWN:Ku,REGISTER_SUBSCRIPTION:Qu,REQUEST_WHATS_NEW_DATA:qu,RESET_STORY_ARGS:Xu,RESULT_WHATS_NEW_DATA:Zu,SAVE_STORY_REQUEST:Ju,SAVE_STORY_RESPONSE:ed,SELECT_STORY:td,SET_CONFIG:nd,SET_CURRENT_STORY:od,SET_FILTER:rd,SET_GLOBALS:ad,SET_INDEX:id,SET_STORIES:cd,SET_WHATS_NEW_CACHE:ld,SHARED_STATE_CHANGED:sd,SHARED_STATE_SET:ud,STORIES_COLLAPSE_ALL:dd,STORIES_EXPAND_ALL:md,STORY_ARGS_UPDATED:pd,STORY_CHANGED:Ae,STORY_ERRORED:gd,STORY_INDEX_INVALIDATED:Ed,STORY_MISSING:hd,STORY_PREPARED:Id,STORY_RENDERED:xe,STORY_RENDER_PHASE_CHANGED:fd,STORY_SPECIFIED:Rd,STORY_THREW_EXCEPTION:Sd,STORY_UNCHANGED:_d,TELEMETRY_ERROR:Td,TESTING_MODULE_CANCEL_TEST_RUN_REQUEST:yd,TESTING_MODULE_CANCEL_TEST_RUN_RESPONSE:bd,TESTING_MODULE_CRASH_REPORT:Od,TESTING_MODULE_PROGRESS_REPORT:Cd,TESTING_MODULE_RUN_ALL_REQUEST:vd,TESTING_MODULE_RUN_REQUEST:Ad,TESTING_MODULE_WATCH_MODE_REQUEST:xd,TOGGLE_WHATS_NEW_NOTIFICATIONS:Nd,UNHANDLED_ERRORS_WHILE_PLAYING:kd,UPDATE_GLOBALS:Ld,UPDATE_QUERY_PARAMS:Dd,UPDATE_STORY_ARGS:wd}=__STORYBOOK_CORE_EVENTS__;var Ne="storybook/highlight",ke=`${Ne}/add`,Yd=`${Ne}/reset`;var Qd=__REACT_DOM__,{__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:qd,createPortal:Xd,createRoot:Zd,findDOMNode:Le,flushSync:Jd,hydrate:em,hydrateRoot:tm,render:nm,unmountComponentAtNode:om,unstable_batchedUpdates:rm,unstable_renderSubtreeIntoContainer:am,version:im}=__REACT_DOM__;var N="storybook/a11y",De=`${N}/panel`,nt="a11y",ot=`${N}/result`,rt=`${N}/request`,at=`${N}/running`,it=`${N}/error`,ct=`${N}/manual`,M={RESULT:ot,REQUEST:rt,RUNNING:at,ERROR:it,MANUAL:ct},lt=[Y(j.light).color.negative,Y(j.light).color.positive,Y(j.light).color.warning],$e=ue({results:{passes:[],incomplete:[],violations:[]},setResults:()=>{},highlighted:[],toggleHighlight:()=>{},clearHighlights:()=>{},tab:0,setTab:()=>{}}),we={passes:[],incomplete:[],violations:[]},st=({active:e,...n})=>{let[o,t]=X(N,we),[a,u]=k(0),[s,i]=k([]),m=J(),p=m.getCurrentStoryData(),d=x((R,h)=>{i(S=>h?[...S,...R]:S.filter(y=>!R.includes(y)))},[]),g=R=>{T(M.REQUEST,R,m.getParameters(R,"a11y"))},c=x(()=>i([]),[]),f=x(R=>{c(),u(R)},[]),_=x(()=>{u(0),t(we)},[]),T=Z({[xe]:g,[Ae]:_});return H(()=>{T(ke,{elements:s,color:lt[a]})},[s,a]),H(()=>{e&&p?.type==="story"?g(p.id):c()},[e,c,T,p]),e?E($e.Provider,{value:{results:o,setResults:t,highlighted:s,toggleHighlight:d,clearHighlights:c,tab:a,setTab:f},...n}):null},ae=()=>pe($e),ut=l.input(({disabled:e})=>({cursor:e?"not-allowed":"pointer"}));function Pe(e,n){let o=e.filter(t=>n.includes(t.target[0])).length;return o===0?1:o===e.length?0:2}var dt=({toggleId:e,elementsToHighlight:n=[]})=>{let{toggleHighlight:o,highlighted:t}=ae(),a=r.useRef(null),[u,s]=r.useState(Pe(n,t));r.useEffect(()=>{let m=Pe(n,t);a.current&&(a.current.indeterminate=m===2),s(m)},[n,t]);let i=r.useCallback(()=>{o(n.map(m=>m.target[0]),u!==0)},[n,u,o]);return r.createElement(ut,{ref:a,id:e,type:"checkbox","aria-label":"Highlight result",disabled:!n.length,onChange:i,checked:u===0})},ie=dt,ne=function(e,n){return ne=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(o,t){o.__proto__=t}||function(o,t){for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(o[a]=t[a])},ne(e,n)};function mt(e,n){if(typeof n!="function"&&n!==null)throw new TypeError("Class extends value "+String(n)+" is not a constructor or null");ne(e,n);function o(){this.constructor=e}e.prototype=n===null?Object.create(n):(o.prototype=n.prototype,new o)}var oe=function(){return oe=Object.assign||function(e){for(var n,o=1,t=arguments.length;o=n||b<0||g&&O>=u}function h(){var I=ee();if(R(I))return S(I);i=setTimeout(h,T(I))}function S(I){return i=void 0,c&&t?f(I):(t=a=void 0,s)}function y(){i!==void 0&&clearTimeout(i),p=0,t=m=a=i=void 0}function w(){return i===void 0?s:S(ee())}function D(){var I=ee(),b=R(I);if(t=arguments,a=this,m=I,b){if(i===void 0)return _(m);if(g)return clearTimeout(i),i=setTimeout(h,n),f(m)}return i===void 0&&(i=setTimeout(h,n)),s}return D.cancel=y,D.flush=w,D}var Ve=mn,pn=Ve,gn=ce,En="Expected a function";function hn(e,n,o){var t=!0,a=!0;if(typeof e!="function")throw new TypeError(En);return gn(o)&&(t="leading"in o?!!o.leading:t,a="trailing"in o?!!o.trailing:a),pn(e,n,{leading:t,maxWait:n,trailing:a})}var In=hn,Ke=function(e,n,o,t){switch(n){case"debounce":return Ve(e,o,t);case"throttle":return In(e,o,t);default:return e}},re=function(e){return typeof e=="function"},L=function(){return typeof window>"u"},We=function(e){return e instanceof Element||e instanceof HTMLDocument},Qe=function(e,n,o,t){return function(a){var u=a.width,s=a.height;n(function(i){return i.width===u&&i.height===s||i.width===u&&!t||i.height===s&&!o?i:(e&&re(e)&&e(u,s),{width:u,height:s})})}};(function(e){mt(n,e);function n(o){var t=e.call(this,o)||this;t.cancelHandler=function(){t.resizeHandler&&t.resizeHandler.cancel&&(t.resizeHandler.cancel(),t.resizeHandler=null)},t.attachObserver=function(){var p=t.props,d=p.targetRef,g=p.observerOptions;if(!L()){d&&d.current&&(t.targetRef.current=d.current);var c=t.getElement();c&&(t.observableElement&&t.observableElement===c||(t.observableElement=c,t.resizeObserver.observe(c,g)))}},t.getElement=function(){var p=t.props,d=p.querySelector,g=p.targetDomEl;if(L())return null;if(d)return document.querySelector(d);if(g&&We(g))return g;if(t.targetRef&&We(t.targetRef.current))return t.targetRef.current;var c=Le(t);if(!c)return null;var f=t.getRenderType();switch(f){case"renderProp":return c;case"childFunction":return c;case"child":return c;case"childArray":return c;default:return c.parentElement}},t.createResizeHandler=function(p){var d=t.props,g=d.handleWidth,c=g===void 0?!0:g,f=d.handleHeight,_=f===void 0?!0:f,T=d.onResize;if(!(!c&&!_)){var R=Qe(T,t.setState.bind(t),c,_);p.forEach(function(h){var S=h&&h.contentRect||{},y=S.width,w=S.height,D=!t.skipOnMount&&!L();D&&R({width:y,height:w}),t.skipOnMount=!1})}},t.getRenderType=function(){var p=t.props,d=p.render,g=p.children;return re(d)?"renderProp":re(g)?"childFunction":me(g)?"child":Array.isArray(g)?"childArray":"parent"};var a=o.skipOnMount,u=o.refreshMode,s=o.refreshRate,i=s===void 0?1e3:s,m=o.refreshOptions;return t.state={width:void 0,height:void 0},t.skipOnMount=a,t.targetRef=de(),t.observableElement=null,L()||(t.resizeHandler=Ke(t.createResizeHandler,u,i,m),t.resizeObserver=new window.ResizeObserver(t.resizeHandler)),t}return n.prototype.componentDidMount=function(){this.attachObserver()},n.prototype.componentDidUpdate=function(){this.attachObserver()},n.prototype.componentWillUnmount=function(){L()||(this.observableElement=null,this.resizeObserver.disconnect(),this.cancelHandler())},n.prototype.render=function(){var o=this.props,t=o.render,a=o.children,u=o.nodeType,s=u===void 0?"div":u,i=this.state,m=i.width,p=i.height,d={width:m,height:p,targetRef:this.targetRef},g=this.getRenderType(),c;switch(g){case"renderProp":return t&&t(d);case"childFunction":return c=a,c(d);case"child":if(c=a,c.type&&typeof c.type=="string"){d.targetRef;var f=pt(d,["targetRef"]);return G(c,f)}return G(c,d);case"childArray":return c=a,c.map(function(_){return!!_&&G(_,d)});default:return E(s,null)}},n})(se);var fn=L()?H:ge;function qe(e){e===void 0&&(e={});var n=e.skipOnMount,o=n===void 0?!1:n,t=e.refreshMode,a=e.refreshRate,u=a===void 0?1e3:a,s=e.refreshOptions,i=e.handleWidth,m=i===void 0?!0:i,p=e.handleHeight,d=p===void 0?!0:p,g=e.targetRef,c=e.observerOptions,f=e.onResize,_=W(o),T=W(null),R=g??T,h=W(),S=k({width:void 0,height:void 0}),y=S[0],w=S[1];return fn(function(){if(!L()){var D=Qe(f,w,m,d),I=function(O){!m&&!d||O.forEach(function(P){var le=P&&P.contentRect||{},Ze=le.width,Je=le.height,et=!_.current&&!L();et&&D({width:Ze,height:Je}),_.current=!1})};h.current=Ke(I,t,u,s);var b=new window.ResizeObserver(h.current);return R.current&&b.observe(R.current,c),function(){b.disconnect();var O=h.current;O&&O.cancel&&O.cancel()}}},[t,u,s,m,d,f,c,R.current]),oe({ref:R},y)}var Rn=l.div({display:"flex",flexDirection:"column",paddingBottom:4,paddingRight:4,paddingTop:4,fontWeight:400}),Sn=l.div(({elementWidth:e})=>({flexDirection:e>407?"row":"inherit",marginBottom:e>407?6:12,display:e>407?"flex":"block"})),_n=l(Q)({padding:"2px 8px",marginBottom:3,minWidth:65,maxWidth:"fit-content",width:"100%",textAlign:"center"}),Tn=l.div({paddingLeft:6,paddingRight:23}),yn=e=>e.charAt(0).toUpperCase().concat(e.slice(1)),bn=({rule:e})=>{let{ref:n,width:o}=qe({refreshMode:"debounce",handleHeight:!1,handleWidth:!0}),t=null;switch(e.impact){case"critical":t="critical";break;case"serious":t="negative";break;case"moderate":t="warning";break;case"minor":t="neutral";break}return r.createElement(Sn,{ref:n,elementWidth:o||0},r.createElement(_n,{status:t},yn(e.impact)),r.createElement(Tn,null,e.message))},On=({rules:e})=>r.createElement(Rn,null,e.map((n,o)=>r.createElement(bn,{rule:n,key:o}))),Cn=l.li({fontWeight:600}),vn=l.span(({theme:e})=>({borderBottom:`1px solid ${e.appBorderColor}`,width:"100%",display:"flex",paddingBottom:6,marginBottom:6,justifyContent:"space-between"})),An=l.span({fontWeight:"normal",alignSelf:"center",paddingRight:15,input:{margin:0,display:"block"}}),xn=({element:e,type:n})=>{let{any:o,all:t,none:a}=e,u=[...o,...t,...a],s=`${n}-${e.target[0]}`;return r.createElement(Cn,null,r.createElement(vn,null,e.target[0],r.createElement(An,null,r.createElement(ie,{toggleId:s,elementsToHighlight:[e]}))),r.createElement(On,{rules:u}))},Nn=({elements:e,type:n})=>r.createElement("ol",null,e.map((o,t)=>r.createElement(xn,{element:o,key:t,type:n}))),kn=l.div({padding:12,marginBottom:10}),Ln=l.p({margin:"0 0 12px"}),Dn=l.a({marginTop:12,textDecoration:"underline",color:"inherit",display:"block"}),wn=({item:e})=>r.createElement(kn,null,r.createElement(Ln,null,e.description),r.createElement(Dn,{href:e.helpUrl,target:"_blank"},"More info...")),Pn=l.div({display:"flex",flexWrap:"wrap",margin:"12px 0"}),Hn=l.div(({theme:e})=>({margin:"0 6px",padding:5,border:`1px solid ${e.appBorderColor}`,borderRadius:e.appBorderRadius})),Bn=({tags:e})=>r.createElement(Pn,null,e.map(n=>r.createElement(Hn,{key:n},n))),Mn=l.div(({theme:e})=>({display:"flex",width:"100%",borderBottom:`1px solid ${e.appBorderColor}`,"&:hover":{background:e.background.hoverable}})),Un=l(Ce)({marginRight:10,transition:"transform 0.1s ease-in-out",verticalAlign:"inherit"}),Gn=l.div(({theme:e})=>({padding:e.layoutMargin,paddingLeft:e.layoutMargin-3,lineHeight:"20px",background:"none",color:"inherit",textAlign:"left",cursor:"pointer",borderLeft:"3px solid transparent",width:"100%","&:focus":{outline:"0 none",borderLeft:`3px solid ${e.color.secondary}`}})),Fn=l.span({fontWeight:"normal",float:"right",marginRight:15,alignSelf:"center",input:{margin:0,display:"block"}}),Wn=e=>{let[n,o]=k(!1),{item:t,type:a}=e,u=`${a}-${t.id}`;return r.createElement(U,null,r.createElement(Mn,null,r.createElement(Gn,{onClick:()=>o(!n),role:"button"},r.createElement(Un,{style:{transform:`rotate(${n?0:-90}deg)`}}),t.help),r.createElement(Fn,null,r.createElement(ie,{toggleId:u,elementsToHighlight:t.nodes}))),n?r.createElement(U,null,r.createElement(wn,{item:t,key:"info"}),r.createElement(Nn,{elements:t.nodes,type:a,key:"elements"}),r.createElement(Bn,{tags:t.tags,key:"tags"})):null)},te=({items:e,empty:n,type:o})=>r.createElement(U,null,e&&e.length?e.map(t=>r.createElement(Wn,{item:t,key:`${o}:${t.id}`,type:o})):r.createElement(Ee,{title:n})),$n=l.div({width:"100%",position:"relative",minHeight:"100%"}),Yn=l.label(({theme:e})=>({cursor:"pointer",userSelect:"none",color:e.color.dark})),jn=l.div(({elementWidth:e,theme:n})=>({cursor:"pointer",fontSize:13,lineHeight:"20px",padding:e>450?"10px 15px 10px 0":"10px 0px 10px 15px",height:"40px",border:"none",marginTop:e>450?-40:0,float:e>450?"right":"left",display:"flex",alignItems:"center",width:e>450?"auto":"100%",borderBottom:e>450?"none":`1px solid ${n.appBorderColor}`,input:{marginLeft:10,marginRight:0,marginTop:-1,marginBottom:0}})),zn=l.button(({theme:e})=>({textDecoration:"none",padding:"10px 15px",cursor:"pointer",fontWeight:e.typography.weight.bold,fontSize:e.typography.size.s2-1,lineHeight:1,height:40,border:"none",borderTop:"3px solid transparent",borderBottom:"3px solid transparent",background:"transparent","&:focus":{outline:"0 none",borderBottom:`3px solid ${e.color.secondary}`}}),({active:e,theme:n})=>e?{opacity:1,borderBottom:`3px solid ${n.color.secondary}`}:{}),Vn=l.div({}),Kn=l.div(({theme:e})=>({boxShadow:`${e.appBorderColor} 0 -1px 0 0 inset`,background:e.background.app,display:"flex",justifyContent:"space-between",whiteSpace:"nowrap"}));function Qn(e){return e.reduce((n,o)=>n.concat(o.nodes),[])}var qn=({tabs:e})=>{let{ref:n,width:o}=qe({refreshMode:"debounce",handleHeight:!1,handleWidth:!0}),{tab:t,setTab:a}=ae(),u=x(i=>{a(parseInt(i.currentTarget.getAttribute("data-index")||"",10))},[a]),s=`${e[t].type}-global-checkbox`;return E($n,{ref:n},E(Kn,null,E(Vn,null,e.map((i,m)=>E(zn,{key:m,"data-index":m,active:t===m,onClick:u},i.label)))),e[t].items.length>0?E(jn,{elementWidth:o||0},E(Yn,{htmlFor:s},"Highlight results"),E(ie,{toggleId:s,elementsToHighlight:Qn(e[t].items)})):null,e[t].panel)},Xn=l(ve)({marginRight:4}),Zn=l(Xn)(({theme:e})=>({animation:`${e.animation.rotate360} 1s linear infinite;`})),Jn=l.span(({theme:e})=>({color:e.color.positiveText})),eo=l.span(({theme:e})=>({color:e.color.negativeText})),to=l.span(({theme:e})=>({color:e.color.warningText})),V=l.span({display:"flex",alignItems:"center",justifyContent:"center",height:"100%"}),no=()=>{let{manual:e}=_e("a11y",{manual:!1}),[n,o]=k(e?"manual":"initial"),[t,a]=r.useState(void 0),{setResults:u,results:s}=ae(),{storyId:i}=Te(),m=J();r.useEffect(()=>{o(e?"manual":"initial")},[e]);let p=h=>{o("ran"),u(h),setTimeout(()=>{n==="ran"&&o("ready")},900)},d=x(()=>{o("running")},[]),g=x(h=>{o("error"),a(h)},[]),c=Z({[M.RUNNING]:d,[M.RESULT]:p,[M.ERROR]:g}),f=x(()=>{o("running"),c(M.MANUAL,i,m.getParameters(i,"a11y"))},[i]),_=F(()=>[{title:"Run test",onClick:f}],[f]),T=F(()=>[{title:n==="ready"?"Rerun tests":r.createElement(r.Fragment,null,r.createElement(Oe,null)," Tests completed"),onClick:f}],[n,f]),R=F(()=>{let{passes:h,incomplete:S,violations:y}=s;return[{label:r.createElement(eo,null,y.length," Violations"),panel:r.createElement(te,{items:y,type:0,empty:"No accessibility violations found."}),items:y,type:0},{label:r.createElement(Jn,null,h.length," Passes"),panel:r.createElement(te,{items:h,type:1,empty:"No accessibility checks passed."}),items:h,type:1},{label:r.createElement(to,null,S.length," Incomplete"),panel:r.createElement(te,{items:S,type:2,empty:"No accessibility checks incomplete."}),items:S,type:2}]},[s]);return r.createElement(r.Fragment,null,n==="initial"&&r.createElement(V,null,"Initializing..."),n==="manual"&&r.createElement(r.Fragment,null,r.createElement(V,null,"Manually run the accessibility scan."),r.createElement(K,{key:"actionbar",actionItems:_})),n==="running"&&r.createElement(V,null,r.createElement(Zn,{size:12})," Please wait while the accessibility scan is running ..."),(n==="ready"||n==="ran")&&r.createElement(r.Fragment,null,r.createElement(Ie,{vertical:!0,horizontal:!0},r.createElement(qn,{key:"tabs",tabs:R})),r.createElement(K,{key:"actionbar",actionItems:T})),n==="error"&&r.createElement(V,null,"The accessibility scan encountered an error.",r.createElement("br",null),typeof t=="string"?t:JSON.stringify(t)))},oo=e=>E("svg",{...e},E("defs",null,E("filter",{id:"protanopia"},E("feColorMatrix",{in:"SourceGraphic",type:"matrix",values:"0.567, 0.433, 0, 0, 0 0.558, 0.442, 0, 0, 0 0, 0.242, 0.758, 0, 0 0, 0, 0, 1, 0"})),E("filter",{id:"protanomaly"},E("feColorMatrix",{in:"SourceGraphic",type:"matrix",values:"0.817, 0.183, 0, 0, 0 0.333, 0.667, 0, 0, 0 0, 0.125, 0.875, 0, 0 0, 0, 0, 1, 0"})),E("filter",{id:"deuteranopia"},E("feColorMatrix",{in:"SourceGraphic",type:"matrix",values:"0.625, 0.375, 0, 0, 0 0.7, 0.3, 0, 0, 0 0, 0.3, 0.7, 0, 0 0, 0, 0, 1, 0"})),E("filter",{id:"deuteranomaly"},E("feColorMatrix",{in:"SourceGraphic",type:"matrix",values:"0.8, 0.2, 0, 0, 0 0.258, 0.742, 0, 0, 0 0, 0.142, 0.858, 0, 0 0, 0, 0, 1, 0"})),E("filter",{id:"tritanopia"},E("feColorMatrix",{in:"SourceGraphic",type:"matrix",values:"0.95, 0.05, 0, 0, 0 0, 0.433, 0.567, 0, 0 0, 0.475, 0.525, 0, 0 0, 0, 0, 1, 0"})),E("filter",{id:"tritanomaly"},E("feColorMatrix",{in:"SourceGraphic",type:"matrix",values:"0.967, 0.033, 0, 0, 0 0, 0.733, 0.267, 0, 0 0, 0.183, 0.817, 0, 0 0, 0, 0, 1, 0"})),E("filter",{id:"achromatopsia"},E("feColorMatrix",{in:"SourceGraphic",type:"matrix",values:"0.299, 0.587, 0.114, 0, 0 0.299, 0.587, 0.114, 0, 0 0.299, 0.587, 0.114, 0, 0 0, 0, 0, 1, 0"})))),ro="storybook-preview-iframe",ao=[{name:"blurred vision",percentage:22.9},{name:"deuteranomaly",percentage:2.7},{name:"deuteranopia",percentage:.56},{name:"protanomaly",percentage:.66},{name:"protanopia",percentage:.59},{name:"tritanomaly",percentage:.01},{name:"tritanopia",percentage:.016},{name:"achromatopsia",percentage:1e-4},{name:"grayscale"}],Xe=e=>e?e==="blurred vision"?"blur(2px)":e==="grayscale"?"grayscale(100%)":`url('#${e}')`:"none",io=l.div(()=>({"&, & svg":{position:"absolute",width:0,height:0}})),co=l.span({background:"linear-gradient(to right, #F44336, #FF9800, #FFEB3B, #8BC34A, #2196F3, #9C27B0)",borderRadius:"1rem",display:"block",height:"1rem",width:"1rem"},({filter:e})=>({filter:Xe(e)}),({theme:e})=>({boxShadow:`${e.appBorderColor} 0 0 0 1px inset`})),lo=l.span({display:"flex",flexDirection:"column"}),so=l.span({textTransform:"capitalize"}),uo=l.span(({theme:e})=>({fontSize:11,color:e.textMutedColor})),mo=(e,n)=>[...e!==null?[{id:"reset",title:"Reset color filter",onClick:()=>{n(null)},right:void 0,active:!1}]:[],...ao.map(o=>{let t=o.percentage!==void 0?`${o.percentage}% of users`:void 0;return{id:o.name,title:r.createElement(lo,null,r.createElement(so,null,o.name),t&&r.createElement(uo,null,t)),onClick:()=>{n(o)},right:r.createElement(co,{filter:o.name}),active:e===o}})],po=()=>{let[e,n]=k(null);return r.createElement(r.Fragment,null,e&&r.createElement(ye,{styles:{[`#${ro}`]:{filter:Xe(e.name)}}}),r.createElement(Se,{placement:"top",tooltip:({onHide:o})=>{let t=mo(e,a=>{n(a),o()});return r.createElement(Re,{links:t})},closeOnOutsideClick:!0,onDoubleClick:()=>n(null)},r.createElement(he,{key:"filter",active:!!e,title:"Vision simulator"},r.createElement(be,null))),r.createElement(io,null,r.createElement(oo,null)))},go=()=>{let[e]=X(N),n=e?.violations?.length||0,o=e?.incomplete?.length||0,t=n+o;return r.createElement("div",null,r.createElement(fe,{col:1},r.createElement("span",{style:{display:"inline-block",verticalAlign:"middle"}},"Accessibility"),t===0?"":r.createElement(Q,{status:"neutral"},t)))};$.register(N,e=>{$.add(De,{title:"",type:q.TOOL,match:({viewMode:n,tabId:o})=>n==="story"&&!o,render:()=>r.createElement(po,null)}),$.add(De,{title:go,type:q.PANEL,render:({active:n=!0})=>r.createElement(st,{active:n},r.createElement(no,null)),paramKey:nt})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/a11y-12/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/a11y-12/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-actions-3/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/essentials-actions-3/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-backgrounds-4/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var re=Object.create;var Y=Object.defineProperty;var ce=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var ae=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var E=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(o,a)=>(typeof require<"u"?require:o)[a]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var M=(e,o)=>()=>(e&&(o=e(e=0)),o);var se=(e,o)=>()=>(o||e((o={exports:{}}).exports,o),o.exports);var ue=(e,o,a,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let c of ie(o))!le.call(e,c)&&c!==a&&Y(e,c,{get:()=>o[c],enumerable:!(r=ce(o,c))||r.enumerable});return e};var Ie=(e,o,a)=>(a=e!=null?re(ae(e)):{},ue(o||!e||!e.__esModule?Y(a,"default",{value:e,enumerable:!0}):a,e));var p=M(()=>{});var h=M(()=>{});var f=M(()=>{});var X=se((Q,V)=>{p();h();f();(function(e){if(typeof Q=="object"&&typeof V<"u")V.exports=e();else if(typeof define=="function"&&define.amd)define([],e);else{var o;typeof window<"u"||typeof window<"u"?o=window:typeof self<"u"?o=self:o=this,o.memoizerific=e()}})(function(){var e,o,a;return function r(c,d,l){function t(i,I){if(!d[i]){if(!c[i]){var s=typeof E=="function"&&E;if(!I&&s)return s(i,!0);if(n)return n(i,!0);var C=new Error("Cannot find module '"+i+"'");throw C.code="MODULE_NOT_FOUND",C}var m=d[i]={exports:{}};c[i][0].call(m.exports,function(b){var y=c[i][1][b];return t(y||b)},m,m.exports,r,c,d,l)}return d[i].exports}for(var n=typeof E=="function"&&E,u=0;u=0)return this.lastItem=this.list[n],this.list[n].val},l.prototype.set=function(t,n){var u;return this.lastItem&&this.isEqual(this.lastItem.key,t)?(this.lastItem.val=n,this):(u=this.indexOf(t),u>=0?(this.lastItem=this.list[u],this.list[u].val=n,this):(this.lastItem={key:t,val:n},this.list.push(this.lastItem),this.size++,this))},l.prototype.delete=function(t){var n;if(this.lastItem&&this.isEqual(this.lastItem.key,t)&&(this.lastItem=void 0),n=this.indexOf(t),n>=0)return this.size--,this.list.splice(n,1)[0]},l.prototype.has=function(t){var n;return this.lastItem&&this.isEqual(this.lastItem.key,t)?!0:(n=this.indexOf(t),n>=0?(this.lastItem=this.list[n],!0):!1)},l.prototype.forEach=function(t,n){var u;for(u=0;u0&&(x[_]={cacheItem:b,arg:arguments[_]},O?t(s,x):s.push(x),s.length>i&&n(s.shift())),m.wasMemoized=O,m.numArgs=_+1,R};return m.limit=i,m.wasMemoized=!1,m.cache=I,m.lru=s,m}};function t(i,I){var s=i.length,C=I.length,m,b,y;for(b=0;b=0&&(s=i[m],C=s.cacheItem.get(s.arg),!C||!C.size);m--)s.cacheItem.delete(s.arg)}function u(i,I){return i===I||i!==i&&I!==I}},{"map-or-similar":1}]},{},[3])(3)})});p();h();f();p();h();f();p();h();f();p();h();f();var g=__REACT__,{Children:Ee,Component:we,Fragment:D,Profiler:Be,PureComponent:Re,StrictMode:xe,Suspense:Le,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:Pe,cloneElement:Me,createContext:De,createElement:Ge,createFactory:Fe,createRef:Ne,forwardRef:Ue,isValidElement:He,lazy:qe,memo:w,startTransition:ze,unstable_act:Ke,useCallback:G,useContext:Ve,useDebugValue:We,useDeferredValue:Ye,useEffect:je,useId:$e,useImperativeHandle:Ze,useInsertionEffect:Je,useLayoutEffect:Qe,useMemo:j,useReducer:Xe,useRef:eo,useState:F,useSyncExternalStore:oo,useTransition:no,version:to}=__REACT__;p();h();f();var lo=__STORYBOOK_API__,{ActiveTabs:so,Consumer:uo,ManagerContext:Io,Provider:mo,RequestResponseError:po,addons:N,combineParameters:ho,controlOrMetaKey:fo,controlOrMetaSymbol:go,eventMatchesShortcut:bo,eventToShortcut:Co,experimental_requestResponse:yo,isMacLike:So,isShortcutTaken:ko,keyToSymbol:vo,merge:To,mockChannel:_o,optionOrAltSymbol:Ao,shortcutMatchesShortcut:Oo,shortcutToHumanString:Eo,types:$,useAddonState:wo,useArgTypes:Bo,useArgs:Ro,useChannel:xo,useGlobalTypes:Lo,useGlobals:L,useParameter:P,useSharedState:Po,useStoryPrepared:Mo,useStorybookApi:Do,useStorybookState:Go}=__STORYBOOK_API__;p();h();f();var qo=__STORYBOOK_COMPONENTS__,{A:zo,ActionBar:Ko,AddonPanel:Vo,Badge:Wo,Bar:Yo,Blockquote:jo,Button:$o,ClipboardCode:Zo,Code:Jo,DL:Qo,Div:Xo,DocumentWrapper:en,EmptyTabContent:on,ErrorFormatter:nn,FlexBar:tn,Form:rn,H1:cn,H2:an,H3:ln,H4:sn,H5:un,H6:In,HR:dn,IconButton:B,IconButtonSkeleton:mn,Icons:pn,Img:hn,LI:fn,Link:gn,ListItem:bn,Loader:Cn,Modal:yn,OL:Sn,P:kn,Placeholder:vn,Pre:Tn,ResetWrapper:_n,ScrollArea:An,Separator:On,Spaced:En,Span:wn,StorybookIcon:Bn,StorybookLogo:Rn,Symbols:xn,SyntaxHighlighter:Ln,TT:Pn,TabBar:Mn,TabButton:Dn,TabWrapper:Gn,Table:Fn,Tabs:Nn,TabsState:Un,TooltipLinkList:U,TooltipMessage:Hn,TooltipNote:qn,UL:zn,WithTooltip:H,WithTooltipPure:Kn,Zoom:Vn,codeCommon:Wn,components:Yn,createCopyToClipboardFunction:jn,getStoryHref:$n,icons:Zn,interleaveSeparators:Jn,nameSpaceClassNames:Qn,resetComponents:Xn,withReset:et}=__STORYBOOK_COMPONENTS__;p();h();f();var ct=__STORYBOOK_ICONS__,{AccessibilityAltIcon:it,AccessibilityIcon:at,AddIcon:lt,AdminIcon:st,AlertAltIcon:ut,AlertIcon:It,AlignLeftIcon:dt,AlignRightIcon:mt,AppleIcon:pt,ArrowBottomLeftIcon:ht,ArrowBottomRightIcon:ft,ArrowDownIcon:gt,ArrowLeftIcon:bt,ArrowRightIcon:Ct,ArrowSolidDownIcon:yt,ArrowSolidLeftIcon:St,ArrowSolidRightIcon:kt,ArrowSolidUpIcon:vt,ArrowTopLeftIcon:Tt,ArrowTopRightIcon:_t,ArrowUpIcon:At,AzureDevOpsIcon:Ot,BackIcon:Et,BasketIcon:wt,BatchAcceptIcon:Bt,BatchDenyIcon:Rt,BeakerIcon:xt,BellIcon:Lt,BitbucketIcon:Pt,BoldIcon:Mt,BookIcon:Dt,BookmarkHollowIcon:Gt,BookmarkIcon:Ft,BottomBarIcon:Nt,BottomBarToggleIcon:Ut,BoxIcon:Ht,BranchIcon:qt,BrowserIcon:zt,ButtonIcon:Kt,CPUIcon:Vt,CalendarIcon:Wt,CameraIcon:Yt,CategoryIcon:jt,CertificateIcon:$t,ChangedIcon:Zt,ChatIcon:Jt,CheckIcon:Qt,ChevronDownIcon:Xt,ChevronLeftIcon:er,ChevronRightIcon:or,ChevronSmallDownIcon:nr,ChevronSmallLeftIcon:tr,ChevronSmallRightIcon:rr,ChevronSmallUpIcon:cr,ChevronUpIcon:ir,ChromaticIcon:ar,ChromeIcon:lr,CircleHollowIcon:sr,CircleIcon:Z,ClearIcon:ur,CloseAltIcon:Ir,CloseIcon:dr,CloudHollowIcon:mr,CloudIcon:pr,CogIcon:hr,CollapseIcon:fr,CommandIcon:gr,CommentAddIcon:br,CommentIcon:Cr,CommentsIcon:yr,CommitIcon:Sr,CompassIcon:kr,ComponentDrivenIcon:vr,ComponentIcon:Tr,ContrastIcon:_r,ControlsIcon:Ar,CopyIcon:Or,CreditIcon:Er,CrossIcon:wr,DashboardIcon:Br,DatabaseIcon:Rr,DeleteIcon:xr,DiamondIcon:Lr,DirectionIcon:Pr,DiscordIcon:Mr,DocChartIcon:Dr,DocListIcon:Gr,DocumentIcon:Fr,DownloadIcon:Nr,DragIcon:Ur,EditIcon:Hr,EllipsisIcon:qr,EmailIcon:zr,ExpandAltIcon:Kr,ExpandIcon:Vr,EyeCloseIcon:Wr,EyeIcon:Yr,FaceHappyIcon:jr,FaceNeutralIcon:$r,FaceSadIcon:Zr,FacebookIcon:Jr,FailedIcon:Qr,FastForwardIcon:Xr,FigmaIcon:ec,FilterIcon:oc,FlagIcon:nc,FolderIcon:tc,FormIcon:rc,GDriveIcon:cc,GithubIcon:ic,GitlabIcon:ac,GlobeIcon:lc,GoogleIcon:sc,GraphBarIcon:uc,GraphLineIcon:Ic,GraphqlIcon:dc,GridAltIcon:mc,GridIcon:q,GrowIcon:pc,HeartHollowIcon:hc,HeartIcon:fc,HomeIcon:gc,HourglassIcon:bc,InfoIcon:Cc,ItalicIcon:yc,JumpToIcon:Sc,KeyIcon:kc,LightningIcon:vc,LightningOffIcon:Tc,LinkBrokenIcon:_c,LinkIcon:Ac,LinkedinIcon:Oc,LinuxIcon:Ec,ListOrderedIcon:wc,ListUnorderedIcon:Bc,LocationIcon:Rc,LockIcon:xc,MarkdownIcon:Lc,MarkupIcon:Pc,MediumIcon:Mc,MemoryIcon:Dc,MenuIcon:Gc,MergeIcon:Fc,MirrorIcon:Nc,MobileIcon:Uc,MoonIcon:Hc,NutIcon:qc,OutboxIcon:zc,OutlineIcon:Kc,PaintBrushIcon:Vc,PaperClipIcon:Wc,ParagraphIcon:Yc,PassedIcon:jc,PhoneIcon:$c,PhotoDragIcon:Zc,PhotoIcon:z,PinAltIcon:Jc,PinIcon:Qc,PlayAllHollowIcon:Xc,PlayBackIcon:ei,PlayHollowIcon:oi,PlayIcon:ni,PlayNextIcon:ti,PlusIcon:ri,PointerDefaultIcon:ci,PointerHandIcon:ii,PowerIcon:ai,PrintIcon:li,ProceedIcon:si,ProfileIcon:ui,PullRequestIcon:Ii,QuestionIcon:di,RSSIcon:mi,RedirectIcon:pi,ReduxIcon:hi,RefreshIcon:J,ReplyIcon:fi,RepoIcon:gi,RequestChangeIcon:bi,RewindIcon:Ci,RulerIcon:yi,SaveIcon:Si,SearchIcon:ki,ShareAltIcon:vi,ShareIcon:Ti,ShieldIcon:_i,SideBySideIcon:Ai,SidebarAltIcon:Oi,SidebarAltToggleIcon:Ei,SidebarIcon:wi,SidebarToggleIcon:Bi,SpeakerIcon:Ri,StackedIcon:xi,StarHollowIcon:Li,StarIcon:Pi,StatusFailIcon:Mi,StatusPassIcon:Di,StatusWarnIcon:Gi,StickerIcon:Fi,StopAltHollowIcon:Ni,StopAltIcon:Ui,StopIcon:Hi,StorybookIcon:qi,StructureIcon:zi,SubtractIcon:Ki,SunIcon:Vi,SupportIcon:Wi,SwitchAltIcon:Yi,SyncIcon:ji,TabletIcon:$i,ThumbsUpIcon:Zi,TimeIcon:Ji,TimerIcon:Qi,TransferIcon:Xi,TrashIcon:ea,TwitterIcon:oa,TypeIcon:na,UbuntuIcon:ta,UndoIcon:ra,UnfoldIcon:ca,UnlockIcon:ia,UnpinIcon:aa,UploadIcon:la,UserAddIcon:sa,UserAltIcon:ua,UserIcon:Ia,UsersIcon:da,VSCodeIcon:ma,VerifiedIcon:pa,VideoIcon:ha,WandIcon:fa,WatchIcon:ga,WindowsIcon:ba,WrenchIcon:Ca,XIcon:ya,YoutubeIcon:Sa,ZoomIcon:ka,ZoomOutIcon:va,ZoomResetIcon:Ta,iconList:_a}=__STORYBOOK_ICONS__;p();h();f();var Ba=__STORYBOOK_CLIENT_LOGGER__,{deprecate:Ra,logger:K,once:xa,pretty:La}=__STORYBOOK_CLIENT_LOGGER__;var W=Ie(X());p();h();f();var qa=__STORYBOOK_THEMING__,{CacheProvider:za,ClassNames:Ka,Global:Va,ThemeProvider:Wa,background:Ya,color:ja,convert:$a,create:Za,createCache:Ja,createGlobal:Qa,createReset:Xa,css:el,darken:ol,ensure:nl,ignoreSsrWarning:tl,isPropValid:rl,jsx:cl,keyframes:il,lighten:al,styled:ee,themes:ll,typography:sl,useTheme:ul,withTheme:Il}=__STORYBOOK_THEMING__;p();h();f();function oe(e){for(var o=[],a=1;a{r({[S]:I})},[r]);return g.createElement(D,null,g.createElement(B,{key:"grid",active:n,disabled:t,title:"Apply a grid to the preview",onClick:()=>i({value:l,grid:!n})},g.createElement(q,null)),a>0?g.createElement(H,{key:"background",placement:"top",closeOnOutsideClick:!0,tooltip:({onHide:I})=>g.createElement(U,{links:[...o?[{id:"reset",title:"Reset background",icon:g.createElement(J,null),onClick:()=>{i({value:void 0,grid:n}),I()}}]:[],...Object.entries(d).map(([s,C])=>({id:s,title:C.name,icon:g.createElement(Z,{color:C?.value||"grey"}),active:s===l,onClick:()=>{i({value:s,grid:n}),I()}}))]}),onVisibleChange:c},g.createElement(B,{disabled:t,key:"background",title:"Change the background of the preview",active:!!o||u},g.createElement(z,null))):null)}),he=ee.span(({background:e})=>({borderRadius:"1rem",display:"block",height:"1rem",width:"1rem",background:e}),({theme:e})=>({boxShadow:`${e.appBorderColor} 0 0 0 1px inset`})),fe=(e,o=[],a)=>{if(e==="transparent")return"transparent";if(o.find(c=>c.value===e)||e)return e;let r=o.find(c=>c.name===a);if(r)return r.value;if(a){let c=o.map(d=>d.name).join(", ");K.warn(oe` 8 | Backgrounds Addon: could not find the default color "${a}". 9 | These are the available colors for your story based on your configuration: 10 | ${c}. 11 | `)}return"transparent"},te=(0,W.default)(1e3)((e,o,a,r,c,d)=>({id:e||o,title:o,onClick:()=>{c({selected:a,name:o})},value:a,right:r?g.createElement(he,{background:a}):void 0,active:d})),ge=(0,W.default)(10)((e,o,a)=>{let r=e.map(({name:c,value:d})=>te(null,c,d,!0,a,d===o));return o!=="transparent"?[te("reset","Clear background","transparent",null,a,!1),...r]:r}),be={default:null,disable:!0,values:[]},Ce=w(function(){let e=P(S,be),[o,a]=F(!1),[r,c]=L(),d=r[S]?.value,l=j(()=>fe(d,e.values,e.default),[e,d]);Array.isArray(e)&&K.warn("Addon Backgrounds api has changed in Storybook 6.0. Please refer to the migration guide: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md");let t=G(n=>{c({[S]:{...r[S],value:n}})},[e,r,c]);return e.disable?null:g.createElement(H,{placement:"top",closeOnOutsideClick:!0,tooltip:({onHide:n})=>g.createElement(U,{links:ge(e.values,l,({selected:u})=>{l!==u&&t(u),n()})}),onVisibleChange:a},g.createElement(B,{key:"background",title:"Change the background of the preview",active:l!=="transparent"||o},g.createElement(z,null)))}),ye=w(function(){let[e,o]=L(),{grid:a}=P(S,{grid:{disable:!1}});if(a?.disable)return null;let r=e[S]?.grid||!1;return g.createElement(B,{key:"background",active:r,title:"Apply a grid to the preview",onClick:()=>o({[S]:{...e[S],grid:!r}})},g.createElement(q,null))});N.register(ne,()=>{N.add(ne,{title:"Backgrounds",type:$.TOOL,match:({viewMode:e,tabId:o})=>!!(e&&e.match(/^(story|docs)$/))&&!o,render:()=>FEATURES?.backgroundsStoryGlobals?g.createElement(me,null):g.createElement(D,null,g.createElement(Ce,null),g.createElement(ye,null))})});})(); 12 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 13 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-backgrounds-4/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/essentials-backgrounds-4/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-controls-2/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/essentials-controls-2/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-measure-7/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var t=__REACT__,{Children:f,Component:k,Fragment:R,Profiler:P,PureComponent:w,StrictMode:L,Suspense:E,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:D,cloneElement:M,createContext:H,createElement:v,createFactory:x,createRef:F,forwardRef:U,isValidElement:N,lazy:G,memo:W,startTransition:K,unstable_act:Y,useCallback:u,useContext:q,useDebugValue:V,useDeferredValue:Z,useEffect:d,useId:z,useImperativeHandle:J,useInsertionEffect:Q,useLayoutEffect:X,useMemo:$,useReducer:j,useRef:oo,useState:no,useSyncExternalStore:eo,useTransition:co,version:to}=__REACT__;var so=__STORYBOOK_API__,{ActiveTabs:io,Consumer:uo,ManagerContext:mo,Provider:po,RequestResponseError:So,addons:l,combineParameters:Co,controlOrMetaKey:ho,controlOrMetaSymbol:Ao,eventMatchesShortcut:bo,eventToShortcut:To,experimental_requestResponse:_o,isMacLike:go,isShortcutTaken:yo,keyToSymbol:Bo,merge:Oo,mockChannel:fo,optionOrAltSymbol:ko,shortcutMatchesShortcut:Ro,shortcutToHumanString:Po,types:m,useAddonState:wo,useArgTypes:Lo,useArgs:Eo,useChannel:Do,useGlobalTypes:Mo,useGlobals:p,useParameter:Ho,useSharedState:vo,useStoryPrepared:xo,useStorybookApi:S,useStorybookState:Fo}=__STORYBOOK_API__;var Ko=__STORYBOOK_COMPONENTS__,{A:Yo,ActionBar:qo,AddonPanel:Vo,Badge:Zo,Bar:zo,Blockquote:Jo,Button:Qo,ClipboardCode:Xo,Code:$o,DL:jo,Div:on,DocumentWrapper:nn,EmptyTabContent:en,ErrorFormatter:cn,FlexBar:tn,Form:rn,H1:In,H2:an,H3:ln,H4:sn,H5:un,H6:dn,HR:mn,IconButton:C,IconButtonSkeleton:pn,Icons:Sn,Img:Cn,LI:hn,Link:An,ListItem:bn,Loader:Tn,Modal:_n,OL:gn,P:yn,Placeholder:Bn,Pre:On,ResetWrapper:fn,ScrollArea:kn,Separator:Rn,Spaced:Pn,Span:wn,StorybookIcon:Ln,StorybookLogo:En,Symbols:Dn,SyntaxHighlighter:Mn,TT:Hn,TabBar:vn,TabButton:xn,TabWrapper:Fn,Table:Un,Tabs:Nn,TabsState:Gn,TooltipLinkList:Wn,TooltipMessage:Kn,TooltipNote:Yn,UL:qn,WithTooltip:Vn,WithTooltipPure:Zn,Zoom:zn,codeCommon:Jn,components:Qn,createCopyToClipboardFunction:Xn,getStoryHref:$n,icons:jn,interleaveSeparators:oe,nameSpaceClassNames:ne,resetComponents:ee,withReset:ce}=__STORYBOOK_COMPONENTS__;var le=__STORYBOOK_ICONS__,{AccessibilityAltIcon:se,AccessibilityIcon:ie,AddIcon:ue,AdminIcon:de,AlertAltIcon:me,AlertIcon:pe,AlignLeftIcon:Se,AlignRightIcon:Ce,AppleIcon:he,ArrowBottomLeftIcon:Ae,ArrowBottomRightIcon:be,ArrowDownIcon:Te,ArrowLeftIcon:_e,ArrowRightIcon:ge,ArrowSolidDownIcon:ye,ArrowSolidLeftIcon:Be,ArrowSolidRightIcon:Oe,ArrowSolidUpIcon:fe,ArrowTopLeftIcon:ke,ArrowTopRightIcon:Re,ArrowUpIcon:Pe,AzureDevOpsIcon:we,BackIcon:Le,BasketIcon:Ee,BatchAcceptIcon:De,BatchDenyIcon:Me,BeakerIcon:He,BellIcon:ve,BitbucketIcon:xe,BoldIcon:Fe,BookIcon:Ue,BookmarkHollowIcon:Ne,BookmarkIcon:Ge,BottomBarIcon:We,BottomBarToggleIcon:Ke,BoxIcon:Ye,BranchIcon:qe,BrowserIcon:Ve,ButtonIcon:Ze,CPUIcon:ze,CalendarIcon:Je,CameraIcon:Qe,CategoryIcon:Xe,CertificateIcon:$e,ChangedIcon:je,ChatIcon:oc,CheckIcon:nc,ChevronDownIcon:ec,ChevronLeftIcon:cc,ChevronRightIcon:tc,ChevronSmallDownIcon:rc,ChevronSmallLeftIcon:Ic,ChevronSmallRightIcon:ac,ChevronSmallUpIcon:lc,ChevronUpIcon:sc,ChromaticIcon:ic,ChromeIcon:uc,CircleHollowIcon:dc,CircleIcon:mc,ClearIcon:pc,CloseAltIcon:Sc,CloseIcon:Cc,CloudHollowIcon:hc,CloudIcon:Ac,CogIcon:bc,CollapseIcon:Tc,CommandIcon:_c,CommentAddIcon:gc,CommentIcon:yc,CommentsIcon:Bc,CommitIcon:Oc,CompassIcon:fc,ComponentDrivenIcon:kc,ComponentIcon:Rc,ContrastIcon:Pc,ControlsIcon:wc,CopyIcon:Lc,CreditIcon:Ec,CrossIcon:Dc,DashboardIcon:Mc,DatabaseIcon:Hc,DeleteIcon:vc,DiamondIcon:xc,DirectionIcon:Fc,DiscordIcon:Uc,DocChartIcon:Nc,DocListIcon:Gc,DocumentIcon:Wc,DownloadIcon:Kc,DragIcon:Yc,EditIcon:qc,EllipsisIcon:Vc,EmailIcon:Zc,ExpandAltIcon:zc,ExpandIcon:Jc,EyeCloseIcon:Qc,EyeIcon:Xc,FaceHappyIcon:$c,FaceNeutralIcon:jc,FaceSadIcon:ot,FacebookIcon:nt,FailedIcon:et,FastForwardIcon:ct,FigmaIcon:tt,FilterIcon:rt,FlagIcon:It,FolderIcon:at,FormIcon:lt,GDriveIcon:st,GithubIcon:it,GitlabIcon:ut,GlobeIcon:dt,GoogleIcon:mt,GraphBarIcon:pt,GraphLineIcon:St,GraphqlIcon:Ct,GridAltIcon:ht,GridIcon:At,GrowIcon:bt,HeartHollowIcon:Tt,HeartIcon:_t,HomeIcon:gt,HourglassIcon:yt,InfoIcon:Bt,ItalicIcon:Ot,JumpToIcon:ft,KeyIcon:kt,LightningIcon:Rt,LightningOffIcon:Pt,LinkBrokenIcon:wt,LinkIcon:Lt,LinkedinIcon:Et,LinuxIcon:Dt,ListOrderedIcon:Mt,ListUnorderedIcon:Ht,LocationIcon:vt,LockIcon:xt,MarkdownIcon:Ft,MarkupIcon:Ut,MediumIcon:Nt,MemoryIcon:Gt,MenuIcon:Wt,MergeIcon:Kt,MirrorIcon:Yt,MobileIcon:qt,MoonIcon:Vt,NutIcon:Zt,OutboxIcon:zt,OutlineIcon:Jt,PaintBrushIcon:Qt,PaperClipIcon:Xt,ParagraphIcon:$t,PassedIcon:jt,PhoneIcon:or,PhotoDragIcon:nr,PhotoIcon:er,PinAltIcon:cr,PinIcon:tr,PlayAllHollowIcon:rr,PlayBackIcon:Ir,PlayHollowIcon:ar,PlayIcon:lr,PlayNextIcon:sr,PlusIcon:ir,PointerDefaultIcon:ur,PointerHandIcon:dr,PowerIcon:mr,PrintIcon:pr,ProceedIcon:Sr,ProfileIcon:Cr,PullRequestIcon:hr,QuestionIcon:Ar,RSSIcon:br,RedirectIcon:Tr,ReduxIcon:_r,RefreshIcon:gr,ReplyIcon:yr,RepoIcon:Br,RequestChangeIcon:Or,RewindIcon:fr,RulerIcon:h,SaveIcon:kr,SearchIcon:Rr,ShareAltIcon:Pr,ShareIcon:wr,ShieldIcon:Lr,SideBySideIcon:Er,SidebarAltIcon:Dr,SidebarAltToggleIcon:Mr,SidebarIcon:Hr,SidebarToggleIcon:vr,SpeakerIcon:xr,StackedIcon:Fr,StarHollowIcon:Ur,StarIcon:Nr,StatusFailIcon:Gr,StatusPassIcon:Wr,StatusWarnIcon:Kr,StickerIcon:Yr,StopAltHollowIcon:qr,StopAltIcon:Vr,StopIcon:Zr,StorybookIcon:zr,StructureIcon:Jr,SubtractIcon:Qr,SunIcon:Xr,SupportIcon:$r,SwitchAltIcon:jr,SyncIcon:oI,TabletIcon:nI,ThumbsUpIcon:eI,TimeIcon:cI,TimerIcon:tI,TransferIcon:rI,TrashIcon:II,TwitterIcon:aI,TypeIcon:lI,UbuntuIcon:sI,UndoIcon:iI,UnfoldIcon:uI,UnlockIcon:dI,UnpinIcon:mI,UploadIcon:pI,UserAddIcon:SI,UserAltIcon:CI,UserIcon:hI,UsersIcon:AI,VSCodeIcon:bI,VerifiedIcon:TI,VideoIcon:_I,WandIcon:gI,WatchIcon:yI,WindowsIcon:BI,WrenchIcon:OI,XIcon:fI,YoutubeIcon:kI,ZoomIcon:RI,ZoomOutIcon:PI,ZoomResetIcon:wI,iconList:LI}=__STORYBOOK_ICONS__;var s="storybook/measure-addon",A=`${s}/tool`,b=()=>{let[r,c]=p(),{measureEnabled:I}=r,i=S(),a=u(()=>c({measureEnabled:!I}),[c,I]);return d(()=>{i.setAddonShortcut(s,{label:"Toggle Measure [M]",defaultShortcut:["M"],actionName:"measure",showInMenu:!1,action:a})},[a,i]),t.createElement(C,{key:A,active:I,title:"Enable measure",onClick:a},t.createElement(h,null))};l.register(s,()=>{l.add(A,{type:m.TOOL,title:"Measure",match:({viewMode:r,tabId:c})=>r==="story"&&!c,render:()=>t.createElement(b,null)})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-measure-7/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/essentials-measure-7/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-outline-8/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var t=__REACT__,{Children:k,Component:R,Fragment:P,Profiler:w,PureComponent:L,StrictMode:E,Suspense:D,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:H,cloneElement:v,createContext:x,createElement:M,createFactory:F,createRef:U,forwardRef:N,isValidElement:G,lazy:W,memo:u,startTransition:K,unstable_act:Y,useCallback:d,useContext:q,useDebugValue:V,useDeferredValue:Z,useEffect:p,useId:z,useImperativeHandle:J,useInsertionEffect:Q,useLayoutEffect:X,useMemo:$,useReducer:j,useRef:oo,useState:no,useSyncExternalStore:eo,useTransition:co,version:to}=__REACT__;var io=__STORYBOOK_API__,{ActiveTabs:so,Consumer:uo,ManagerContext:po,Provider:mo,RequestResponseError:So,addons:l,combineParameters:Co,controlOrMetaKey:ho,controlOrMetaSymbol:Ao,eventMatchesShortcut:To,eventToShortcut:_o,experimental_requestResponse:bo,isMacLike:go,isShortcutTaken:yo,keyToSymbol:Oo,merge:Bo,mockChannel:fo,optionOrAltSymbol:ko,shortcutMatchesShortcut:Ro,shortcutToHumanString:Po,types:m,useAddonState:wo,useArgTypes:Lo,useArgs:Eo,useChannel:Do,useGlobalTypes:Ho,useGlobals:S,useParameter:vo,useSharedState:xo,useStoryPrepared:Mo,useStorybookApi:C,useStorybookState:Fo}=__STORYBOOK_API__;var Ko=__STORYBOOK_COMPONENTS__,{A:Yo,ActionBar:qo,AddonPanel:Vo,Badge:Zo,Bar:zo,Blockquote:Jo,Button:Qo,ClipboardCode:Xo,Code:$o,DL:jo,Div:on,DocumentWrapper:nn,EmptyTabContent:en,ErrorFormatter:cn,FlexBar:tn,Form:rn,H1:In,H2:an,H3:ln,H4:sn,H5:un,H6:dn,HR:pn,IconButton:h,IconButtonSkeleton:mn,Icons:Sn,Img:Cn,LI:hn,Link:An,ListItem:Tn,Loader:_n,Modal:bn,OL:gn,P:yn,Placeholder:On,Pre:Bn,ResetWrapper:fn,ScrollArea:kn,Separator:Rn,Spaced:Pn,Span:wn,StorybookIcon:Ln,StorybookLogo:En,Symbols:Dn,SyntaxHighlighter:Hn,TT:vn,TabBar:xn,TabButton:Mn,TabWrapper:Fn,Table:Un,Tabs:Nn,TabsState:Gn,TooltipLinkList:Wn,TooltipMessage:Kn,TooltipNote:Yn,UL:qn,WithTooltip:Vn,WithTooltipPure:Zn,Zoom:zn,codeCommon:Jn,components:Qn,createCopyToClipboardFunction:Xn,getStoryHref:$n,icons:jn,interleaveSeparators:oe,nameSpaceClassNames:ne,resetComponents:ee,withReset:ce}=__STORYBOOK_COMPONENTS__;var le=__STORYBOOK_ICONS__,{AccessibilityAltIcon:ie,AccessibilityIcon:se,AddIcon:ue,AdminIcon:de,AlertAltIcon:pe,AlertIcon:me,AlignLeftIcon:Se,AlignRightIcon:Ce,AppleIcon:he,ArrowBottomLeftIcon:Ae,ArrowBottomRightIcon:Te,ArrowDownIcon:_e,ArrowLeftIcon:be,ArrowRightIcon:ge,ArrowSolidDownIcon:ye,ArrowSolidLeftIcon:Oe,ArrowSolidRightIcon:Be,ArrowSolidUpIcon:fe,ArrowTopLeftIcon:ke,ArrowTopRightIcon:Re,ArrowUpIcon:Pe,AzureDevOpsIcon:we,BackIcon:Le,BasketIcon:Ee,BatchAcceptIcon:De,BatchDenyIcon:He,BeakerIcon:ve,BellIcon:xe,BitbucketIcon:Me,BoldIcon:Fe,BookIcon:Ue,BookmarkHollowIcon:Ne,BookmarkIcon:Ge,BottomBarIcon:We,BottomBarToggleIcon:Ke,BoxIcon:Ye,BranchIcon:qe,BrowserIcon:Ve,ButtonIcon:Ze,CPUIcon:ze,CalendarIcon:Je,CameraIcon:Qe,CategoryIcon:Xe,CertificateIcon:$e,ChangedIcon:je,ChatIcon:oc,CheckIcon:nc,ChevronDownIcon:ec,ChevronLeftIcon:cc,ChevronRightIcon:tc,ChevronSmallDownIcon:rc,ChevronSmallLeftIcon:Ic,ChevronSmallRightIcon:ac,ChevronSmallUpIcon:lc,ChevronUpIcon:ic,ChromaticIcon:sc,ChromeIcon:uc,CircleHollowIcon:dc,CircleIcon:pc,ClearIcon:mc,CloseAltIcon:Sc,CloseIcon:Cc,CloudHollowIcon:hc,CloudIcon:Ac,CogIcon:Tc,CollapseIcon:_c,CommandIcon:bc,CommentAddIcon:gc,CommentIcon:yc,CommentsIcon:Oc,CommitIcon:Bc,CompassIcon:fc,ComponentDrivenIcon:kc,ComponentIcon:Rc,ContrastIcon:Pc,ControlsIcon:wc,CopyIcon:Lc,CreditIcon:Ec,CrossIcon:Dc,DashboardIcon:Hc,DatabaseIcon:vc,DeleteIcon:xc,DiamondIcon:Mc,DirectionIcon:Fc,DiscordIcon:Uc,DocChartIcon:Nc,DocListIcon:Gc,DocumentIcon:Wc,DownloadIcon:Kc,DragIcon:Yc,EditIcon:qc,EllipsisIcon:Vc,EmailIcon:Zc,ExpandAltIcon:zc,ExpandIcon:Jc,EyeCloseIcon:Qc,EyeIcon:Xc,FaceHappyIcon:$c,FaceNeutralIcon:jc,FaceSadIcon:ot,FacebookIcon:nt,FailedIcon:et,FastForwardIcon:ct,FigmaIcon:tt,FilterIcon:rt,FlagIcon:It,FolderIcon:at,FormIcon:lt,GDriveIcon:it,GithubIcon:st,GitlabIcon:ut,GlobeIcon:dt,GoogleIcon:pt,GraphBarIcon:mt,GraphLineIcon:St,GraphqlIcon:Ct,GridAltIcon:ht,GridIcon:At,GrowIcon:Tt,HeartHollowIcon:_t,HeartIcon:bt,HomeIcon:gt,HourglassIcon:yt,InfoIcon:Ot,ItalicIcon:Bt,JumpToIcon:ft,KeyIcon:kt,LightningIcon:Rt,LightningOffIcon:Pt,LinkBrokenIcon:wt,LinkIcon:Lt,LinkedinIcon:Et,LinuxIcon:Dt,ListOrderedIcon:Ht,ListUnorderedIcon:vt,LocationIcon:xt,LockIcon:Mt,MarkdownIcon:Ft,MarkupIcon:Ut,MediumIcon:Nt,MemoryIcon:Gt,MenuIcon:Wt,MergeIcon:Kt,MirrorIcon:Yt,MobileIcon:qt,MoonIcon:Vt,NutIcon:Zt,OutboxIcon:zt,OutlineIcon:A,PaintBrushIcon:Jt,PaperClipIcon:Qt,ParagraphIcon:Xt,PassedIcon:$t,PhoneIcon:jt,PhotoDragIcon:or,PhotoIcon:nr,PinAltIcon:er,PinIcon:cr,PlayAllHollowIcon:tr,PlayBackIcon:rr,PlayHollowIcon:Ir,PlayIcon:ar,PlayNextIcon:lr,PlusIcon:ir,PointerDefaultIcon:sr,PointerHandIcon:ur,PowerIcon:dr,PrintIcon:pr,ProceedIcon:mr,ProfileIcon:Sr,PullRequestIcon:Cr,QuestionIcon:hr,RSSIcon:Ar,RedirectIcon:Tr,ReduxIcon:_r,RefreshIcon:br,ReplyIcon:gr,RepoIcon:yr,RequestChangeIcon:Or,RewindIcon:Br,RulerIcon:fr,SaveIcon:kr,SearchIcon:Rr,ShareAltIcon:Pr,ShareIcon:wr,ShieldIcon:Lr,SideBySideIcon:Er,SidebarAltIcon:Dr,SidebarAltToggleIcon:Hr,SidebarIcon:vr,SidebarToggleIcon:xr,SpeakerIcon:Mr,StackedIcon:Fr,StarHollowIcon:Ur,StarIcon:Nr,StatusFailIcon:Gr,StatusPassIcon:Wr,StatusWarnIcon:Kr,StickerIcon:Yr,StopAltHollowIcon:qr,StopAltIcon:Vr,StopIcon:Zr,StorybookIcon:zr,StructureIcon:Jr,SubtractIcon:Qr,SunIcon:Xr,SupportIcon:$r,SwitchAltIcon:jr,SyncIcon:oI,TabletIcon:nI,ThumbsUpIcon:eI,TimeIcon:cI,TimerIcon:tI,TransferIcon:rI,TrashIcon:II,TwitterIcon:aI,TypeIcon:lI,UbuntuIcon:iI,UndoIcon:sI,UnfoldIcon:uI,UnlockIcon:dI,UnpinIcon:pI,UploadIcon:mI,UserAddIcon:SI,UserAltIcon:CI,UserIcon:hI,UsersIcon:AI,VSCodeIcon:TI,VerifiedIcon:_I,VideoIcon:bI,WandIcon:gI,WatchIcon:yI,WindowsIcon:OI,WrenchIcon:BI,XIcon:fI,YoutubeIcon:kI,ZoomIcon:RI,ZoomOutIcon:PI,ZoomResetIcon:wI,iconList:LI}=__STORYBOOK_ICONS__;var i="storybook/outline",T="outline",_=u(function(){let[c,r]=S(),s=C(),I=[!0,"true"].includes(c[T]),a=d(()=>r({[T]:!I}),[I]);return p(()=>{s.setAddonShortcut(i,{label:"Toggle Outline",defaultShortcut:["alt","O"],actionName:"outline",showInMenu:!1,action:a})},[a,s]),t.createElement(h,{key:"outline",active:I,title:"Apply outlines to the preview",onClick:a},t.createElement(A,null))});l.register(i,()=>{l.add(i,{title:"Outline",type:m.TOOL,match:({viewMode:c,tabId:r})=>!!(c&&c.match(/^(story|docs)$/))&&!r,render:()=>t.createElement(_,null)})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-outline-8/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/essentials-outline-8/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-toolbars-6/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var l=__REACT__,{Children:se,Component:ie,Fragment:ue,Profiler:ce,PureComponent:pe,StrictMode:me,Suspense:de,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:be,cloneElement:Se,createContext:Te,createElement:ye,createFactory:_e,createRef:fe,forwardRef:Ce,isValidElement:ve,lazy:Ie,memo:Oe,startTransition:Ee,unstable_act:xe,useCallback:C,useContext:ge,useDebugValue:ke,useDeferredValue:he,useEffect:g,useId:Ae,useImperativeHandle:Re,useInsertionEffect:Le,useLayoutEffect:Be,useMemo:Me,useReducer:Pe,useRef:L,useState:B,useSyncExternalStore:Ne,useTransition:we,version:Ve}=__REACT__;var We=__STORYBOOK_API__,{ActiveTabs:Ke,Consumer:Ye,ManagerContext:$e,Provider:qe,RequestResponseError:ze,addons:k,combineParameters:Ue,controlOrMetaKey:je,controlOrMetaSymbol:Ze,eventMatchesShortcut:Je,eventToShortcut:Qe,experimental_requestResponse:Xe,isMacLike:et,isShortcutTaken:tt,keyToSymbol:ot,merge:rt,mockChannel:at,optionOrAltSymbol:lt,shortcutMatchesShortcut:nt,shortcutToHumanString:st,types:M,useAddonState:it,useArgTypes:ut,useArgs:ct,useChannel:pt,useGlobalTypes:P,useGlobals:h,useParameter:mt,useSharedState:dt,useStoryPrepared:bt,useStorybookApi:N,useStorybookState:St}=__STORYBOOK_API__;var Ct=__STORYBOOK_COMPONENTS__,{A:vt,ActionBar:It,AddonPanel:Ot,Badge:Et,Bar:xt,Blockquote:gt,Button:kt,ClipboardCode:ht,Code:At,DL:Rt,Div:Lt,DocumentWrapper:Bt,EmptyTabContent:Mt,ErrorFormatter:Pt,FlexBar:Nt,Form:wt,H1:Vt,H2:Dt,H3:Ht,H4:Ft,H5:Gt,H6:Wt,HR:Kt,IconButton:w,IconButtonSkeleton:Yt,Icons:A,Img:$t,LI:qt,Link:zt,ListItem:Ut,Loader:jt,Modal:Zt,OL:Jt,P:Qt,Placeholder:Xt,Pre:eo,ResetWrapper:to,ScrollArea:oo,Separator:V,Spaced:ro,Span:ao,StorybookIcon:lo,StorybookLogo:no,Symbols:so,SyntaxHighlighter:io,TT:uo,TabBar:co,TabButton:po,TabWrapper:mo,Table:bo,Tabs:So,TabsState:To,TooltipLinkList:D,TooltipMessage:yo,TooltipNote:_o,UL:fo,WithTooltip:H,WithTooltipPure:Co,Zoom:vo,codeCommon:Io,components:Oo,createCopyToClipboardFunction:Eo,getStoryHref:xo,icons:go,interleaveSeparators:ko,nameSpaceClassNames:ho,resetComponents:Ao,withReset:Ro}=__STORYBOOK_COMPONENTS__;var K={type:"item",value:""},Y=(o,t)=>({...t,name:t.name||o,description:t.description||o,toolbar:{...t.toolbar,items:t.toolbar.items.map(e=>{let r=typeof e=="string"?{value:e,title:e}:e;return r.type==="reset"&&t.toolbar.icon&&(r.icon=t.toolbar.icon,r.hideIcon=!0),{...K,...r}})}}),$=["reset"],q=o=>o.filter(t=>!$.includes(t.type)).map(t=>t.value),S="addon-toolbars",z=async(o,t,e)=>{e&&e.next&&await o.setAddonShortcut(S,{label:e.next.label,defaultShortcut:e.next.keys,actionName:`${t}:next`,action:e.next.action}),e&&e.previous&&await o.setAddonShortcut(S,{label:e.previous.label,defaultShortcut:e.previous.keys,actionName:`${t}:previous`,action:e.previous.action}),e&&e.reset&&await o.setAddonShortcut(S,{label:e.reset.label,defaultShortcut:e.reset.keys,actionName:`${t}:reset`,action:e.reset.action})},U=o=>t=>{let{id:e,toolbar:{items:r,shortcuts:a}}=t,c=N(),[T,i]=h(),n=L([]),u=T[e],v=C(()=>{i({[e]:""})},[i]),I=C(()=>{let s=n.current,m=s.indexOf(u),d=m===s.length-1?0:m+1,p=n.current[d];i({[e]:p})},[n,u,i]),O=C(()=>{let s=n.current,m=s.indexOf(u),d=m>-1?m:0,p=d===0?s.length-1:d-1,b=n.current[p];i({[e]:b})},[n,u,i]);return g(()=>{a&&z(c,e,{next:{...a.next,action:I},previous:{...a.previous,action:O},reset:{...a.reset,action:v}})},[c,e,a,I,O,v]),g(()=>{n.current=q(r)},[]),l.createElement(o,{cycleValues:n.current,...t})},F=({currentValue:o,items:t})=>o!=null&&t.find(e=>e.value===o&&e.type!=="reset"),j=({currentValue:o,items:t})=>{let e=F({currentValue:o,items:t});if(e)return e.icon},Z=({currentValue:o,items:t})=>{let e=F({currentValue:o,items:t});if(e)return e.title},J=({active:o,disabled:t,title:e,icon:r,description:a,onClick:c})=>l.createElement(w,{active:o,title:a,disabled:t,onClick:t?()=>{}:c},r&&l.createElement(A,{icon:r,__suppressDeprecationWarning:!0}),e?`\xA0${e}`:null),Q=({right:o,title:t,value:e,icon:r,hideIcon:a,onClick:c,disabled:T,currentValue:i})=>{let n=r&&l.createElement(A,{style:{opacity:1},icon:r}),u={id:e??"_reset",active:i===e,right:o,title:t,disabled:T,onClick:c};return r&&!a&&(u.icon=n),u},X=U(({id:o,name:t,description:e,toolbar:{icon:r,items:a,title:c,preventDynamicIcon:T,dynamicTitle:i}})=>{let[n,u,v]=h(),[I,O]=B(!1),s=n[o],m=!!s,d=o in v,p=r,b=c;T||(p=j({currentValue:s,items:a})||p),i&&(b=Z({currentValue:s,items:a})||b),!b&&!p&&console.warn(`Toolbar '${t}' has no title or icon`);let G=C(x=>{u({[o]:x})},[o,u]);return l.createElement(H,{placement:"top",tooltip:({onHide:x})=>{let W=a.filter(({type:E})=>{let R=!0;return E==="reset"&&!s&&(R=!1),R}).map(E=>Q({...E,currentValue:s,disabled:d,onClick:()=>{G(E.value),x()}}));return l.createElement(D,{links:W})},closeOnOutsideClick:!0,onVisibleChange:O},l.createElement(J,{active:I||m,disabled:d,description:e||"",icon:p,title:b||""}))}),ee=()=>{let o=P(),t=Object.keys(o).filter(e=>!!o[e].toolbar);return t.length?l.createElement(l.Fragment,null,l.createElement(V,null),t.map(e=>{let r=Y(e,o[e]);return l.createElement(X,{key:e,id:e,...r})})):null};k.register(S,()=>k.add(S,{title:S,type:M.TOOL,match:({tabId:o})=>!o,render:()=>l.createElement(ee,null)}));})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-toolbars-6/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/essentials-toolbars-6/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-viewport-5/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var he=Object.create;var J=Object.defineProperty;var me=Object.getOwnPropertyDescriptor;var fe=Object.getOwnPropertyNames;var ge=Object.getPrototypeOf,we=Object.prototype.hasOwnProperty;var O=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(t,a)=>(typeof require<"u"?require:t)[a]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var H=(e,t)=>()=>(e&&(t=e(e=0)),t);var be=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports);var ye=(e,t,a,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let c of fe(t))!we.call(e,c)&&c!==a&&J(e,c,{get:()=>t[c],enumerable:!(s=me(t,c))||s.enumerable});return e};var Se=(e,t,a)=>(a=e!=null?he(ge(e)):{},ye(t||!e||!e.__esModule?J(a,"default",{value:e,enumerable:!0}):a,e));var f=H(()=>{});var g=H(()=>{});var w=H(()=>{});var le=be((ce,Z)=>{f();g();w();(function(e){if(typeof ce=="object"&&typeof Z<"u")Z.exports=e();else if(typeof define=="function"&&define.amd)define([],e);else{var t;typeof window<"u"||typeof window<"u"?t=window:typeof self<"u"?t=self:t=this,t.memoizerific=e()}})(function(){var e,t,a;return function s(c,b,p){function o(n,d){if(!b[n]){if(!c[n]){var r=typeof O=="function"&&O;if(!d&&r)return r(n,!0);if(i)return i(n,!0);var u=new Error("Cannot find module '"+n+"'");throw u.code="MODULE_NOT_FOUND",u}var I=b[n]={exports:{}};c[n][0].call(I.exports,function(m){var y=c[n][1][m];return o(y||m)},I,I.exports,s,c,b,p)}return b[n].exports}for(var i=typeof O=="function"&&O,h=0;h=0)return this.lastItem=this.list[i],this.list[i].val},p.prototype.set=function(o,i){var h;return this.lastItem&&this.isEqual(this.lastItem.key,o)?(this.lastItem.val=i,this):(h=this.indexOf(o),h>=0?(this.lastItem=this.list[h],this.list[h].val=i,this):(this.lastItem={key:o,val:i},this.list.push(this.lastItem),this.size++,this))},p.prototype.delete=function(o){var i;if(this.lastItem&&this.isEqual(this.lastItem.key,o)&&(this.lastItem=void 0),i=this.indexOf(o),i>=0)return this.size--,this.list.splice(i,1)[0]},p.prototype.has=function(o){var i;return this.lastItem&&this.isEqual(this.lastItem.key,o)?!0:(i=this.indexOf(o),i>=0?(this.lastItem=this.list[i],!0):!1)},p.prototype.forEach=function(o,i){var h;for(h=0;h0&&(M[S]={cacheItem:m,arg:arguments[S]},A?o(r,M):r.push(M),r.length>n&&i(r.shift())),I.wasMemoized=A,I.numArgs=S+1,k};return I.limit=n,I.wasMemoized=!1,I.cache=d,I.lru=r,I}};function o(n,d){var r=n.length,u=d.length,I,m,y;for(m=0;m=0&&(r=n[I],u=r.cacheItem.get(r.arg),!u||!u.size);I--)r.cacheItem.delete(r.arg)}function h(n,d){return n===d||n!==n&&d!==d}},{"map-or-similar":1}]},{},[3])(3)})});f();g();w();f();g();w();f();g();w();f();g();w();var l=__REACT__,{Children:$e,Component:Je,Fragment:V,Profiler:Qe,PureComponent:Xe,StrictMode:et,Suspense:tt,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:ot,cloneElement:nt,createContext:rt,createElement:N,createFactory:it,createRef:at,forwardRef:ct,isValidElement:lt,lazy:st,memo:Q,startTransition:ut,unstable_act:It,useCallback:X,useContext:pt,useDebugValue:dt,useDeferredValue:ht,useEffect:_,useId:mt,useImperativeHandle:ft,useInsertionEffect:gt,useLayoutEffect:wt,useMemo:bt,useReducer:yt,useRef:ee,useState:z,useSyncExternalStore:St,useTransition:vt,version:Ct}=__REACT__;f();g();w();var kt=__STORYBOOK_API__,{ActiveTabs:At,Consumer:xt,ManagerContext:Ot,Provider:_t,RequestResponseError:Lt,addons:G,combineParameters:Bt,controlOrMetaKey:Pt,controlOrMetaSymbol:Mt,eventMatchesShortcut:Vt,eventToShortcut:Dt,experimental_requestResponse:Ht,isMacLike:Nt,isShortcutTaken:zt,keyToSymbol:Gt,merge:Ft,mockChannel:Ut,optionOrAltSymbol:qt,shortcutMatchesShortcut:Wt,shortcutToHumanString:Yt,types:te,useAddonState:jt,useArgTypes:Kt,useArgs:Zt,useChannel:$t,useGlobalTypes:Jt,useGlobals:F,useParameter:U,useSharedState:Qt,useStoryPrepared:Xt,useStorybookApi:oe,useStorybookState:eo}=__STORYBOOK_API__;f();g();w();var io=__STORYBOOK_COMPONENTS__,{A:ao,ActionBar:co,AddonPanel:lo,Badge:so,Bar:uo,Blockquote:Io,Button:po,ClipboardCode:ho,Code:mo,DL:fo,Div:go,DocumentWrapper:wo,EmptyTabContent:bo,ErrorFormatter:yo,FlexBar:So,Form:vo,H1:Co,H2:Eo,H3:Ro,H4:To,H5:ko,H6:Ao,HR:xo,IconButton:L,IconButtonSkeleton:Oo,Icons:_o,Img:Lo,LI:Bo,Link:Po,ListItem:Mo,Loader:Vo,Modal:Do,OL:Ho,P:No,Placeholder:zo,Pre:Go,ResetWrapper:Fo,ScrollArea:Uo,Separator:qo,Spaced:Wo,Span:Yo,StorybookIcon:jo,StorybookLogo:Ko,Symbols:Zo,SyntaxHighlighter:$o,TT:Jo,TabBar:Qo,TabButton:Xo,TabWrapper:en,Table:tn,Tabs:on,TabsState:nn,TooltipLinkList:q,TooltipMessage:rn,TooltipNote:an,UL:cn,WithTooltip:W,WithTooltipPure:ln,Zoom:sn,codeCommon:un,components:In,createCopyToClipboardFunction:pn,getStoryHref:dn,icons:hn,interleaveSeparators:mn,nameSpaceClassNames:fn,resetComponents:gn,withReset:wn}=__STORYBOOK_COMPONENTS__;f();g();w();var Cn=__STORYBOOK_THEMING__,{CacheProvider:En,ClassNames:Rn,Global:Y,ThemeProvider:Tn,background:kn,color:An,convert:xn,create:On,createCache:_n,createGlobal:Ln,createReset:Bn,css:Pn,darken:Mn,ensure:Vn,ignoreSsrWarning:Dn,isPropValid:Hn,jsx:Nn,keyframes:zn,lighten:Gn,styled:v,themes:Fn,typography:Un,useTheme:qn,withTheme:Wn}=__STORYBOOK_THEMING__;f();g();w();var $n=__STORYBOOK_ICONS__,{AccessibilityAltIcon:Jn,AccessibilityIcon:Qn,AddIcon:Xn,AdminIcon:er,AlertAltIcon:tr,AlertIcon:or,AlignLeftIcon:nr,AlignRightIcon:rr,AppleIcon:ir,ArrowBottomLeftIcon:ar,ArrowBottomRightIcon:cr,ArrowDownIcon:lr,ArrowLeftIcon:sr,ArrowRightIcon:ur,ArrowSolidDownIcon:Ir,ArrowSolidLeftIcon:pr,ArrowSolidRightIcon:dr,ArrowSolidUpIcon:hr,ArrowTopLeftIcon:mr,ArrowTopRightIcon:fr,ArrowUpIcon:gr,AzureDevOpsIcon:wr,BackIcon:br,BasketIcon:yr,BatchAcceptIcon:Sr,BatchDenyIcon:vr,BeakerIcon:Cr,BellIcon:Er,BitbucketIcon:Rr,BoldIcon:Tr,BookIcon:kr,BookmarkHollowIcon:Ar,BookmarkIcon:xr,BottomBarIcon:Or,BottomBarToggleIcon:_r,BoxIcon:Lr,BranchIcon:Br,BrowserIcon:ne,ButtonIcon:Pr,CPUIcon:Mr,CalendarIcon:Vr,CameraIcon:Dr,CategoryIcon:Hr,CertificateIcon:Nr,ChangedIcon:zr,ChatIcon:Gr,CheckIcon:Fr,ChevronDownIcon:Ur,ChevronLeftIcon:qr,ChevronRightIcon:Wr,ChevronSmallDownIcon:Yr,ChevronSmallLeftIcon:jr,ChevronSmallRightIcon:Kr,ChevronSmallUpIcon:Zr,ChevronUpIcon:$r,ChromaticIcon:Jr,ChromeIcon:Qr,CircleHollowIcon:Xr,CircleIcon:ei,ClearIcon:ti,CloseAltIcon:oi,CloseIcon:ni,CloudHollowIcon:ri,CloudIcon:ii,CogIcon:ai,CollapseIcon:ci,CommandIcon:li,CommentAddIcon:si,CommentIcon:ui,CommentsIcon:Ii,CommitIcon:pi,CompassIcon:di,ComponentDrivenIcon:hi,ComponentIcon:mi,ContrastIcon:fi,ControlsIcon:gi,CopyIcon:wi,CreditIcon:bi,CrossIcon:yi,DashboardIcon:Si,DatabaseIcon:vi,DeleteIcon:Ci,DiamondIcon:Ei,DirectionIcon:Ri,DiscordIcon:Ti,DocChartIcon:ki,DocListIcon:Ai,DocumentIcon:xi,DownloadIcon:Oi,DragIcon:_i,EditIcon:Li,EllipsisIcon:Bi,EmailIcon:Pi,ExpandAltIcon:Mi,ExpandIcon:Vi,EyeCloseIcon:Di,EyeIcon:Hi,FaceHappyIcon:Ni,FaceNeutralIcon:zi,FaceSadIcon:Gi,FacebookIcon:Fi,FailedIcon:Ui,FastForwardIcon:qi,FigmaIcon:Wi,FilterIcon:Yi,FlagIcon:ji,FolderIcon:Ki,FormIcon:Zi,GDriveIcon:$i,GithubIcon:Ji,GitlabIcon:Qi,GlobeIcon:Xi,GoogleIcon:ea,GraphBarIcon:ta,GraphLineIcon:oa,GraphqlIcon:na,GridAltIcon:ra,GridIcon:ia,GrowIcon:j,HeartHollowIcon:aa,HeartIcon:ca,HomeIcon:la,HourglassIcon:sa,InfoIcon:ua,ItalicIcon:Ia,JumpToIcon:pa,KeyIcon:da,LightningIcon:ha,LightningOffIcon:ma,LinkBrokenIcon:fa,LinkIcon:ga,LinkedinIcon:wa,LinuxIcon:ba,ListOrderedIcon:ya,ListUnorderedIcon:Sa,LocationIcon:va,LockIcon:Ca,MarkdownIcon:Ea,MarkupIcon:Ra,MediumIcon:Ta,MemoryIcon:ka,MenuIcon:Aa,MergeIcon:xa,MirrorIcon:Oa,MobileIcon:re,MoonIcon:_a,NutIcon:La,OutboxIcon:Ba,OutlineIcon:Pa,PaintBrushIcon:Ma,PaperClipIcon:Va,ParagraphIcon:Da,PassedIcon:Ha,PhoneIcon:Na,PhotoDragIcon:za,PhotoIcon:Ga,PinAltIcon:Fa,PinIcon:Ua,PlayAllHollowIcon:qa,PlayBackIcon:Wa,PlayHollowIcon:Ya,PlayIcon:ja,PlayNextIcon:Ka,PlusIcon:Za,PointerDefaultIcon:$a,PointerHandIcon:Ja,PowerIcon:Qa,PrintIcon:Xa,ProceedIcon:ec,ProfileIcon:tc,PullRequestIcon:oc,QuestionIcon:nc,RSSIcon:rc,RedirectIcon:ic,ReduxIcon:ac,RefreshIcon:ie,ReplyIcon:cc,RepoIcon:lc,RequestChangeIcon:sc,RewindIcon:uc,RulerIcon:Ic,SaveIcon:pc,SearchIcon:dc,ShareAltIcon:hc,ShareIcon:mc,ShieldIcon:fc,SideBySideIcon:gc,SidebarAltIcon:wc,SidebarAltToggleIcon:bc,SidebarIcon:yc,SidebarToggleIcon:Sc,SpeakerIcon:vc,StackedIcon:Cc,StarHollowIcon:Ec,StarIcon:Rc,StatusFailIcon:Tc,StatusPassIcon:kc,StatusWarnIcon:Ac,StickerIcon:xc,StopAltHollowIcon:Oc,StopAltIcon:_c,StopIcon:Lc,StorybookIcon:Bc,StructureIcon:Pc,SubtractIcon:Mc,SunIcon:Vc,SupportIcon:Dc,SwitchAltIcon:Hc,SyncIcon:Nc,TabletIcon:ae,ThumbsUpIcon:zc,TimeIcon:Gc,TimerIcon:Fc,TransferIcon:K,TrashIcon:Uc,TwitterIcon:qc,TypeIcon:Wc,UbuntuIcon:Yc,UndoIcon:jc,UnfoldIcon:Kc,UnlockIcon:Zc,UnpinIcon:$c,UploadIcon:Jc,UserAddIcon:Qc,UserAltIcon:Xc,UserIcon:el,UsersIcon:tl,VSCodeIcon:ol,VerifiedIcon:nl,VideoIcon:rl,WandIcon:il,WatchIcon:al,WindowsIcon:cl,WrenchIcon:ll,XIcon:sl,YoutubeIcon:ul,ZoomIcon:Il,ZoomOutIcon:pl,ZoomResetIcon:dl,iconList:hl}=__STORYBOOK_ICONS__;var $=Se(le()),B="storybook/viewport",x="viewport",Ie={mobile1:{name:"Small mobile",styles:{height:"568px",width:"320px"},type:"mobile"},mobile2:{name:"Large mobile",styles:{height:"896px",width:"414px"},type:"mobile"},tablet:{name:"Tablet",styles:{height:"1112px",width:"834px"},type:"tablet"}},P={name:"Reset viewport",styles:{height:"100%",width:"100%"},type:"desktop"},Ce={[x]:{value:void 0,isRotated:!1}},Ee={viewport:"reset",viewportRotated:!1},Re=FEATURES?.viewportStoryGlobals?Ce:Ee,pe=(e,t)=>e.indexOf(t),Te=(e,t)=>{let a=pe(e,t);return a===e.length-1?e[0]:e[a+1]},ke=(e,t)=>{let a=pe(e,t);return a<1?e[e.length-1]:e[a-1]},de=async(e,t,a,s)=>{await e.setAddonShortcut(B,{label:"Previous viewport",defaultShortcut:["alt","shift","V"],actionName:"previous",action:()=>{a({viewport:ke(s,t)})}}),await e.setAddonShortcut(B,{label:"Next viewport",defaultShortcut:["alt","V"],actionName:"next",action:()=>{a({viewport:Te(s,t)})}}),await e.setAddonShortcut(B,{label:"Reset viewport",defaultShortcut:["alt","control","V"],actionName:"reset",action:()=>{a(Re)}})},Ae=v.div(()=>({display:"inline-flex",alignItems:"center"})),se=v.div(({theme:e})=>({display:"inline-block",textDecoration:"none",padding:10,fontWeight:e.typography.weight.bold,fontSize:e.typography.size.s2-1,lineHeight:"1",height:40,border:"none",borderTop:"3px solid transparent",borderBottom:"3px solid transparent",background:"transparent"})),xe=v(L)(()=>({display:"inline-flex",alignItems:"center"})),Oe=v.div(({theme:e})=>({fontSize:e.typography.size.s2-1,marginLeft:10})),_e={desktop:l.createElement(ne,null),mobile:l.createElement(re,null),tablet:l.createElement(ae,null),other:l.createElement(V,null)},Le=({api:e})=>{let t=U(x),[a,s,c]=F(),[b,p]=z(!1),{options:o=Ie,disable:i}=t||{},h=a?.[x]||{},n=h.value,d=h.isRotated,r=o[n]||P,u=b||r!==P,I=x in c,m=Object.keys(o).length;if(_(()=>{de(e,n,s,Object.keys(o))},[o,n,s,e]),r.styles===null||!o||m<1)return null;if(typeof r.styles=="function")return console.warn("Addon Viewport no longer supports dynamic styles using a function, use css calc() instead"),null;let y=d?r.styles.height:r.styles.width,k=d?r.styles.width:r.styles.height;return i?null:l.createElement(Be,{item:r,updateGlobals:s,viewportMap:o,viewportName:n,isRotated:d,setIsTooltipVisible:p,isLocked:I,isActive:u,width:y,height:k})},Be=l.memo(function(e){let{item:t,viewportMap:a,viewportName:s,isRotated:c,updateGlobals:b,setIsTooltipVisible:p,isLocked:o,isActive:i,width:h,height:n}=e,d=X(r=>b({[x]:r}),[b]);return l.createElement(V,null,l.createElement(W,{placement:"bottom",tooltip:({onHide:r})=>l.createElement(q,{links:[...length>0&&t!==P?[{id:"reset",title:"Reset viewport",icon:l.createElement(ie,null),onClick:()=>{d({value:void 0,isRotated:!1}),r()}}]:[],...Object.entries(a).map(([u,I])=>({id:u,title:I.name,icon:_e[I.type],active:u===s,onClick:()=>{d({value:u,isRotated:!1}),r()}}))]}),closeOnOutsideClick:!0,onVisibleChange:p},l.createElement(xe,{disabled:o,key:"viewport",title:"Change the size of the preview",active:i,onDoubleClick:()=>{d({value:void 0,isRotated:!1})}},l.createElement(j,null),t!==P?l.createElement(Oe,null,t.name," ",c?"(L)":"(P)"):null)),l.createElement(Y,{styles:{'iframe[data-is-storybook="true"]':{width:h,height:n}}}),t!==P?l.createElement(Ae,null,l.createElement(se,{title:"Viewport width"},h.replace("px","")),o?"/":l.createElement(L,{key:"viewport-rotate",title:"Rotate viewport",onClick:()=>{d({value:s,isRotated:!c})}},l.createElement(K,null)),l.createElement(se,{title:"Viewport height"},n.replace("px",""))):null)}),Pe=(0,$.default)(50)(e=>[...Me,...Object.entries(e).map(([t,{name:a,...s}])=>({...s,id:t,title:a}))]),D={id:"reset",title:"Reset viewport",styles:null,type:"other"},Me=[D],Ve=(0,$.default)(50)((e,t,a,s)=>e.filter(c=>c.id!==D.id||t.id!==c.id).map(c=>({...c,onClick:()=>{a({viewport:c.id}),s()}}))),De=({width:e,height:t,...a})=>({...a,height:e,width:t}),He=v.div(()=>({display:"inline-flex",alignItems:"center"})),ue=v.div(({theme:e})=>({display:"inline-block",textDecoration:"none",padding:10,fontWeight:e.typography.weight.bold,fontSize:e.typography.size.s2-1,lineHeight:"1",height:40,border:"none",borderTop:"3px solid transparent",borderBottom:"3px solid transparent",background:"transparent"})),Ne=v(L)(()=>({display:"inline-flex",alignItems:"center"})),ze=v.div(({theme:e})=>({fontSize:e.typography.size.s2-1,marginLeft:10})),Ge=(e,t,a)=>{if(t===null)return;let s=typeof t=="function"?t(e):t;return a?De(s):s},Fe=Q(function(){let[e,t]=F(),{viewports:a=Ie,defaultOrientation:s,defaultViewport:c,disable:b}=U(x,{}),p=Pe(a),o=oe(),[i,h]=z(!1);c&&!p.find(u=>u.id===c)&&console.warn(`Cannot find "defaultViewport" of "${c}" in addon-viewport configs, please check the "viewports" setting in the configuration.`),_(()=>{de(o,e,t,Object.keys(a))},[a,e,e.viewport,t,o]),_(()=>{let u=s==="landscape";(c&&e.viewport!==c||s&&e.viewportRotated!==u)&&t({viewport:c,viewportRotated:u})},[s,c,t]);let n=p.find(u=>u.id===e.viewport)||p.find(u=>u.id===c)||p.find(u=>u.default)||D,d=ee(),r=Ge(d.current,n.styles,e.viewportRotated);return _(()=>{d.current=r},[n]),b||Object.entries(a).length===0?null:l.createElement(V,null,l.createElement(W,{placement:"top",tooltip:({onHide:u})=>l.createElement(q,{links:Ve(p,n,t,u)}),closeOnOutsideClick:!0,onVisibleChange:h},l.createElement(Ne,{key:"viewport",title:"Change the size of the preview",active:i||!!r,onDoubleClick:()=>{t({viewport:D.id})}},l.createElement(j,null),r?l.createElement(ze,null,e.viewportRotated?`${n.title} (L)`:`${n.title} (P)`):null)),r?l.createElement(He,null,l.createElement(Y,{styles:{'iframe[data-is-storybook="true"]':{...r||{width:"100%",height:"100%"}}}}),l.createElement(ue,{title:"Viewport width"},r.width.replace("px","")),l.createElement(L,{key:"viewport-rotate",title:"Rotate viewport",onClick:()=>{t({viewportRotated:!e.viewportRotated})}},l.createElement(K,null)),l.createElement(ue,{title:"Viewport height"},r.height.replace("px",""))):null)});G.register(B,e=>{G.add(B,{title:"viewport / media-queries",type:te.TOOL,match:({viewMode:t,tabId:a})=>t==="story"&&!a,render:()=>FEATURES?.viewportStoryGlobals?N(Le,{api:e}):N(Fe,null)})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-viewport-5/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/essentials-viewport-5/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/interactions-10/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/interactions-10/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/links-1/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var E=__STORYBOOK_API__,{ActiveTabs:T,Consumer:h,ManagerContext:p,Provider:A,RequestResponseError:b,addons:a,combineParameters:O,controlOrMetaKey:R,controlOrMetaSymbol:k,eventMatchesShortcut:v,eventToShortcut:g,experimental_requestResponse:I,isMacLike:C,isShortcutTaken:M,keyToSymbol:P,merge:x,mockChannel:f,optionOrAltSymbol:q,shortcutMatchesShortcut:D,shortcutToHumanString:G,types:K,useAddonState:V,useArgTypes:$,useArgs:B,useChannel:N,useGlobalTypes:Q,useGlobals:U,useParameter:Y,useSharedState:H,useStoryPrepared:L,useStorybookApi:j,useStorybookState:w}=__STORYBOOK_API__;var e="storybook/links",n={NAVIGATE:`${e}/navigate`,REQUEST:`${e}/request`,RECEIVE:`${e}/receive`};a.register(e,t=>{t.on(n.REQUEST,({kind:u,name:S})=>{let c=t.storyId(u,S);t.emit(n.RECEIVE,c)})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/links-1/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/links-1/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/onboarding-9/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | Bundled license information: 2 | 3 | react/cjs/react-jsx-runtime.production.min.js: 4 | /** 5 | * @license React 6 | * react-jsx-runtime.production.min.js 7 | * 8 | * Copyright (c) Facebook, Inc. and its affiliates. 9 | * 10 | * This source code is licensed under the MIT license found in the 11 | * LICENSE file in the root directory of this source tree. 12 | */ 13 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var T=__STORYBOOK_API__,{ActiveTabs:_,Consumer:O,ManagerContext:f,Provider:A,RequestResponseError:v,addons:n,combineParameters:P,controlOrMetaKey:k,controlOrMetaSymbol:x,eventMatchesShortcut:M,eventToShortcut:R,experimental_requestResponse:w,isMacLike:C,isShortcutTaken:G,keyToSymbol:I,merge:K,mockChannel:q,optionOrAltSymbol:B,shortcutMatchesShortcut:F,shortcutToHumanString:Y,types:j,useAddonState:E,useArgTypes:H,useArgs:L,useChannel:N,useGlobalTypes:z,useGlobals:D,useParameter:J,useSharedState:Q,useStoryPrepared:U,useStorybookApi:V,useStorybookState:W}=__STORYBOOK_API__;var c=(()=>{let e;return typeof window<"u"?e=window:typeof globalThis<"u"?e=globalThis:typeof window<"u"?e=window:typeof self<"u"?e=self:e={},e})(),S="tag-filters",d="static-filter";n.register(S,e=>{let u=Object.entries(c.TAGS_OPTIONS??{}).reduce((t,r)=>{let[o,i]=r;return i.excludeFromSidebar&&(t[o]=!0),t},{});e.experimental_setFilter(d,t=>{let r=t.tags??[];return(r.includes("dev")||t.type==="docs")&&r.filter(o=>u[o]).length===0})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-addons/themes-11/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var $=__STORYBOOK_API__,{ActiveTabs:Z,Consumer:j,ManagerContext:J,Provider:Q,RequestResponseError:X,addons:i,combineParameters:oo,controlOrMetaKey:eo,controlOrMetaSymbol:no,eventMatchesShortcut:to,eventToShortcut:co,experimental_requestResponse:ro,isMacLike:Io,isShortcutTaken:ao,keyToSymbol:lo,merge:io,mockChannel:so,optionOrAltSymbol:mo,shortcutMatchesShortcut:uo,shortcutToHumanString:ho,types:g,useAddonState:y,useArgTypes:po,useArgs:So,useChannel:R,useGlobalTypes:To,useGlobals:O,useParameter:f,useSharedState:Co,useStoryPrepared:_o,useStorybookApi:Eo,useStorybookState:Ao}=__STORYBOOK_API__;var e=__REACT__,{Children:Oo,Component:fo,Fragment:ko,Profiler:Bo,PureComponent:Lo,StrictMode:Po,Suspense:Do,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:wo,cloneElement:Ho,createContext:Mo,createElement:vo,createFactory:Go,createRef:xo,forwardRef:Fo,isValidElement:No,lazy:Uo,memo:Wo,startTransition:Ko,unstable_act:Yo,useCallback:Vo,useContext:qo,useDebugValue:zo,useDeferredValue:$o,useEffect:Zo,useId:jo,useImperativeHandle:Jo,useInsertionEffect:Qo,useLayoutEffect:Xo,useMemo:oe,useReducer:ee,useRef:ne,useState:te,useSyncExternalStore:ce,useTransition:re,version:Ie}=__REACT__;var me=__STORYBOOK_COMPONENTS__,{A:ue,ActionBar:de,AddonPanel:he,Badge:pe,Bar:Se,Blockquote:Te,Button:Ce,ClipboardCode:_e,Code:Ee,DL:Ae,Div:be,DocumentWrapper:ge,EmptyTabContent:ye,ErrorFormatter:Re,FlexBar:Oe,Form:fe,H1:ke,H2:Be,H3:Le,H4:Pe,H5:De,H6:we,HR:He,IconButton:p,IconButtonSkeleton:Me,Icons:ve,Img:Ge,LI:xe,Link:Fe,ListItem:Ne,Loader:Ue,Modal:We,OL:Ke,P:Ye,Placeholder:Ve,Pre:qe,ResetWrapper:ze,ScrollArea:$e,Separator:Ze,Spaced:je,Span:Je,StorybookIcon:Qe,StorybookLogo:Xe,Symbols:on,SyntaxHighlighter:en,TT:nn,TabBar:tn,TabButton:cn,TabWrapper:rn,Table:In,Tabs:an,TabsState:ln,TooltipLinkList:k,TooltipMessage:sn,TooltipNote:mn,UL:un,WithTooltip:B,WithTooltipPure:dn,Zoom:hn,codeCommon:pn,components:Sn,createCopyToClipboardFunction:Tn,getStoryHref:Cn,icons:_n,interleaveSeparators:En,nameSpaceClassNames:An,resetComponents:bn,withReset:gn}=__STORYBOOK_COMPONENTS__;var kn=__STORYBOOK_THEMING__,{CacheProvider:Bn,ClassNames:Ln,Global:Pn,ThemeProvider:Dn,background:wn,color:Hn,convert:Mn,create:vn,createCache:Gn,createGlobal:xn,createReset:Fn,css:Nn,darken:Un,ensure:Wn,ignoreSsrWarning:Kn,isPropValid:Yn,jsx:Vn,keyframes:qn,lighten:zn,styled:L,themes:$n,typography:Zn,useTheme:jn,withTheme:Jn}=__STORYBOOK_THEMING__;var nt=__STORYBOOK_ICONS__,{AccessibilityAltIcon:tt,AccessibilityIcon:ct,AddIcon:rt,AdminIcon:It,AlertAltIcon:at,AlertIcon:lt,AlignLeftIcon:it,AlignRightIcon:st,AppleIcon:mt,ArrowBottomLeftIcon:ut,ArrowBottomRightIcon:dt,ArrowDownIcon:ht,ArrowLeftIcon:pt,ArrowRightIcon:St,ArrowSolidDownIcon:Tt,ArrowSolidLeftIcon:Ct,ArrowSolidRightIcon:_t,ArrowSolidUpIcon:Et,ArrowTopLeftIcon:At,ArrowTopRightIcon:bt,ArrowUpIcon:gt,AzureDevOpsIcon:yt,BackIcon:Rt,BasketIcon:Ot,BatchAcceptIcon:ft,BatchDenyIcon:kt,BeakerIcon:Bt,BellIcon:Lt,BitbucketIcon:Pt,BoldIcon:Dt,BookIcon:wt,BookmarkHollowIcon:Ht,BookmarkIcon:Mt,BottomBarIcon:vt,BottomBarToggleIcon:Gt,BoxIcon:xt,BranchIcon:Ft,BrowserIcon:Nt,ButtonIcon:Ut,CPUIcon:Wt,CalendarIcon:Kt,CameraIcon:Yt,CategoryIcon:Vt,CertificateIcon:qt,ChangedIcon:zt,ChatIcon:$t,CheckIcon:Zt,ChevronDownIcon:jt,ChevronLeftIcon:Jt,ChevronRightIcon:Qt,ChevronSmallDownIcon:Xt,ChevronSmallLeftIcon:oc,ChevronSmallRightIcon:ec,ChevronSmallUpIcon:nc,ChevronUpIcon:tc,ChromaticIcon:cc,ChromeIcon:rc,CircleHollowIcon:Ic,CircleIcon:ac,ClearIcon:lc,CloseAltIcon:ic,CloseIcon:sc,CloudHollowIcon:mc,CloudIcon:uc,CogIcon:dc,CollapseIcon:hc,CommandIcon:pc,CommentAddIcon:Sc,CommentIcon:Tc,CommentsIcon:Cc,CommitIcon:_c,CompassIcon:Ec,ComponentDrivenIcon:Ac,ComponentIcon:bc,ContrastIcon:gc,ControlsIcon:yc,CopyIcon:Rc,CreditIcon:Oc,CrossIcon:fc,DashboardIcon:kc,DatabaseIcon:Bc,DeleteIcon:Lc,DiamondIcon:Pc,DirectionIcon:Dc,DiscordIcon:wc,DocChartIcon:Hc,DocListIcon:Mc,DocumentIcon:vc,DownloadIcon:Gc,DragIcon:xc,EditIcon:Fc,EllipsisIcon:Nc,EmailIcon:Uc,ExpandAltIcon:Wc,ExpandIcon:Kc,EyeCloseIcon:Yc,EyeIcon:Vc,FaceHappyIcon:qc,FaceNeutralIcon:zc,FaceSadIcon:$c,FacebookIcon:Zc,FailedIcon:jc,FastForwardIcon:Jc,FigmaIcon:Qc,FilterIcon:Xc,FlagIcon:or,FolderIcon:er,FormIcon:nr,GDriveIcon:tr,GithubIcon:cr,GitlabIcon:rr,GlobeIcon:Ir,GoogleIcon:ar,GraphBarIcon:lr,GraphLineIcon:ir,GraphqlIcon:sr,GridAltIcon:mr,GridIcon:ur,GrowIcon:dr,HeartHollowIcon:hr,HeartIcon:pr,HomeIcon:Sr,HourglassIcon:Tr,InfoIcon:Cr,ItalicIcon:_r,JumpToIcon:Er,KeyIcon:Ar,LightningIcon:br,LightningOffIcon:gr,LinkBrokenIcon:yr,LinkIcon:Rr,LinkedinIcon:Or,LinuxIcon:fr,ListOrderedIcon:kr,ListUnorderedIcon:Br,LocationIcon:Lr,LockIcon:Pr,MarkdownIcon:Dr,MarkupIcon:wr,MediumIcon:Hr,MemoryIcon:Mr,MenuIcon:vr,MergeIcon:Gr,MirrorIcon:xr,MobileIcon:Fr,MoonIcon:Nr,NutIcon:Ur,OutboxIcon:Wr,OutlineIcon:Kr,PaintBrushIcon:S,PaperClipIcon:Yr,ParagraphIcon:Vr,PassedIcon:qr,PhoneIcon:zr,PhotoDragIcon:$r,PhotoIcon:Zr,PinAltIcon:jr,PinIcon:Jr,PlayAllHollowIcon:Qr,PlayBackIcon:Xr,PlayHollowIcon:oI,PlayIcon:eI,PlayNextIcon:nI,PlusIcon:tI,PointerDefaultIcon:cI,PointerHandIcon:rI,PowerIcon:II,PrintIcon:aI,ProceedIcon:lI,ProfileIcon:iI,PullRequestIcon:sI,QuestionIcon:mI,RSSIcon:uI,RedirectIcon:dI,ReduxIcon:hI,RefreshIcon:pI,ReplyIcon:SI,RepoIcon:TI,RequestChangeIcon:CI,RewindIcon:_I,RulerIcon:EI,SaveIcon:AI,SearchIcon:bI,ShareAltIcon:gI,ShareIcon:yI,ShieldIcon:RI,SideBySideIcon:OI,SidebarAltIcon:fI,SidebarAltToggleIcon:kI,SidebarIcon:BI,SidebarToggleIcon:LI,SpeakerIcon:PI,StackedIcon:DI,StarHollowIcon:wI,StarIcon:HI,StatusFailIcon:MI,StatusPassIcon:vI,StatusWarnIcon:GI,StickerIcon:xI,StopAltHollowIcon:FI,StopAltIcon:NI,StopIcon:UI,StorybookIcon:WI,StructureIcon:KI,SubtractIcon:YI,SunIcon:VI,SupportIcon:qI,SwitchAltIcon:zI,SyncIcon:$I,TabletIcon:ZI,ThumbsUpIcon:jI,TimeIcon:JI,TimerIcon:QI,TransferIcon:XI,TrashIcon:oa,TwitterIcon:ea,TypeIcon:na,UbuntuIcon:ta,UndoIcon:ca,UnfoldIcon:ra,UnlockIcon:Ia,UnpinIcon:aa,UploadIcon:la,UserAddIcon:ia,UserAltIcon:sa,UserIcon:ma,UsersIcon:ua,VSCodeIcon:da,VerifiedIcon:ha,VideoIcon:pa,WandIcon:Sa,WatchIcon:Ta,WindowsIcon:Ca,WrenchIcon:_a,XIcon:Ea,YoutubeIcon:Aa,ZoomIcon:ba,ZoomOutIcon:ga,ZoomResetIcon:ya,iconList:Ra}=__STORYBOOK_ICONS__;var T="themes",C=`storybook/${T}`,v="theme",s=`${C}/theme-switcher`,G={themesList:[],themeDefault:void 0},x={},P={REGISTER_THEMES:`${C}/REGISTER_THEMES`},D=L.div(({theme:o})=>({fontSize:o.typography.size.s2-1})),F=o=>o.length>1,N=o=>o.length===2,U=e.memo(function(){let{themeOverride:o,disable:m}=f(T,x),[{theme:u},_,w]=O(),E=i.getChannel().last(P.REGISTER_THEMES),H=Object.assign({},G,{themesList:E?.[0]?.themes||[],themeDefault:E?.[0]?.defaultTheme||""}),[{themesList:l,themeDefault:A},M]=y(s,H),d=v in w||!!o;R({[P.REGISTER_THEMES]:({themes:a,defaultTheme:n})=>{M(h=>({...h,themesList:a,themeDefault:n}))}});let b=u||A,t="";if(d?t="Story override":b&&(t=`${b} theme`),m)return null;if(N(l)){let a=u||A,n=l.find(h=>h!==a);return e.createElement(p,{disabled:d,key:s,active:!o,title:"Theme",onClick:()=>{_({theme:n})}},e.createElement(S,null),t?e.createElement(D,null,t):null)}return F(l)?e.createElement(B,{placement:"top",trigger:"click",closeOnOutsideClick:!0,tooltip:({onHide:a})=>e.createElement(k,{links:l.map(n=>({id:n,title:n,active:u===n,onClick:()=>{_({theme:n}),a()}}))})},e.createElement(p,{key:s,active:!o,title:"Theme",disabled:d},e.createElement(S,null),t&&e.createElement(D,null,t))):null});i.register(C,()=>{i.add(s,{title:"Themes",type:g.TOOL,match:({viewMode:o,tabId:m})=>!!(o&&o.match(/^(story|docs)$/))&&!m,render:U,paramKey:T})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/themes-11/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-addons/themes-11/manager-bundle.js.LEGAL.txt -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/favicon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-bold-italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-common-assets/nunito-sans-bold-italic.woff2 -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-common-assets/nunito-sans-bold.woff2 -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-common-assets/nunito-sans-italic.woff2 -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/timDeHof/shadcn-timeline/9d8aa5ae371fc5405547610f0cc75c42f5e25fef/storybook-static/sb-common-assets/nunito-sans-regular.woff2 -------------------------------------------------------------------------------- /storybook-static/sb-manager/globals.js: -------------------------------------------------------------------------------- 1 | import ESM_COMPAT_Module from "node:module"; 2 | import { fileURLToPath as ESM_COMPAT_fileURLToPath } from 'node:url'; 3 | import { dirname as ESM_COMPAT_dirname } from 'node:path'; 4 | const __filename = ESM_COMPAT_fileURLToPath(import.meta.url); 5 | const __dirname = ESM_COMPAT_dirname(__filename); 6 | const require = ESM_COMPAT_Module.createRequire(import.meta.url); 7 | 8 | // src/manager/globals/globals.ts 9 | var _ = { 10 | react: "__REACT__", 11 | "react-dom": "__REACT_DOM__", 12 | "react-dom/client": "__REACT_DOM_CLIENT__", 13 | "@storybook/icons": "__STORYBOOK_ICONS__", 14 | "storybook/internal/manager-api": "__STORYBOOK_API__", 15 | "@storybook/manager-api": "__STORYBOOK_API__", 16 | "@storybook/core/manager-api": "__STORYBOOK_API__", 17 | "storybook/internal/components": "__STORYBOOK_COMPONENTS__", 18 | "@storybook/components": "__STORYBOOK_COMPONENTS__", 19 | "@storybook/core/components": "__STORYBOOK_COMPONENTS__", 20 | "storybook/internal/channels": "__STORYBOOK_CHANNELS__", 21 | "@storybook/channels": "__STORYBOOK_CHANNELS__", 22 | "@storybook/core/channels": "__STORYBOOK_CHANNELS__", 23 | "storybook/internal/core-errors": "__STORYBOOK_CORE_EVENTS__", 24 | "@storybook/core-events": "__STORYBOOK_CORE_EVENTS__", 25 | "@storybook/core/core-events": "__STORYBOOK_CORE_EVENTS__", 26 | "storybook/internal/manager-errors": "__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__", 27 | "@storybook/core-events/manager-errors": "__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__", 28 | "@storybook/core/manager-errors": "__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__", 29 | "storybook/internal/router": "__STORYBOOK_ROUTER__", 30 | "@storybook/router": "__STORYBOOK_ROUTER__", 31 | "@storybook/core/router": "__STORYBOOK_ROUTER__", 32 | "storybook/internal/theming": "__STORYBOOK_THEMING__", 33 | "@storybook/theming": "__STORYBOOK_THEMING__", 34 | "@storybook/core/theming": "__STORYBOOK_THEMING__", 35 | "storybook/internal/theming/create": "__STORYBOOK_THEMING_CREATE__", 36 | "@storybook/theming/create": "__STORYBOOK_THEMING_CREATE__", 37 | "@storybook/core/theming/create": "__STORYBOOK_THEMING_CREATE__", 38 | "storybook/internal/client-logger": "__STORYBOOK_CLIENT_LOGGER__", 39 | "@storybook/client-logger": "__STORYBOOK_CLIENT_LOGGER__", 40 | "@storybook/core/client-logger": "__STORYBOOK_CLIENT_LOGGER__", 41 | "storybook/internal/types": "__STORYBOOK_TYPES__", 42 | "@storybook/types": "__STORYBOOK_TYPES__", 43 | "@storybook/core/types": "__STORYBOOK_TYPES__" 44 | }, o = Object.keys(_); 45 | export { 46 | o as globalPackages, 47 | _ as globalsNameReferenceMap 48 | }; 49 | -------------------------------------------------------------------------------- /storybook-static/sb-preview/globals.js: -------------------------------------------------------------------------------- 1 | import ESM_COMPAT_Module from "node:module"; 2 | import { fileURLToPath as ESM_COMPAT_fileURLToPath } from 'node:url'; 3 | import { dirname as ESM_COMPAT_dirname } from 'node:path'; 4 | const __filename = ESM_COMPAT_fileURLToPath(import.meta.url); 5 | const __dirname = ESM_COMPAT_dirname(__filename); 6 | const require = ESM_COMPAT_Module.createRequire(import.meta.url); 7 | 8 | // src/preview/globals/globals.ts 9 | var _ = { 10 | "@storybook/global": "__STORYBOOK_MODULE_GLOBAL__", 11 | "storybook/internal/channels": "__STORYBOOK_MODULE_CHANNELS__", 12 | "@storybook/channels": "__STORYBOOK_MODULE_CHANNELS__", 13 | "@storybook/core/channels": "__STORYBOOK_MODULE_CHANNELS__", 14 | "storybook/internal/client-logger": "__STORYBOOK_MODULE_CLIENT_LOGGER__", 15 | "@storybook/client-logger": "__STORYBOOK_MODULE_CLIENT_LOGGER__", 16 | "@storybook/core/client-logger": "__STORYBOOK_MODULE_CLIENT_LOGGER__", 17 | "storybook/internal/core-events": "__STORYBOOK_MODULE_CORE_EVENTS__", 18 | "@storybook/core-events": "__STORYBOOK_MODULE_CORE_EVENTS__", 19 | "@storybook/core/core-events": "__STORYBOOK_MODULE_CORE_EVENTS__", 20 | "storybook/internal/preview-errors": "__STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS__", 21 | "@storybook/core-events/preview-errors": "__STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS__", 22 | "@storybook/core/preview-errors": "__STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS__", 23 | "storybook/internal/preview-api": "__STORYBOOK_MODULE_PREVIEW_API__", 24 | "@storybook/preview-api": "__STORYBOOK_MODULE_PREVIEW_API__", 25 | "@storybook/core/preview-api": "__STORYBOOK_MODULE_PREVIEW_API__", 26 | "storybook/internal/types": "__STORYBOOK_MODULE_TYPES__", 27 | "@storybook/types": "__STORYBOOK_MODULE_TYPES__", 28 | "@storybook/core/types": "__STORYBOOK_MODULE_TYPES__" 29 | }, O = Object.keys(_); 30 | export { 31 | O as globalPackages, 32 | _ as globalsNameReferenceMap 33 | }; 34 | -------------------------------------------------------------------------------- /storybook-static/sitemap-0.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | https://shadcn-timeline.vercel.app2025-01-03T16:53:05.059Zdaily0.7 4 | -------------------------------------------------------------------------------- /storybook-static/sitemap.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | https://shadcn-timeline.vercel.app/sitemap-0.xml 4 | -------------------------------------------------------------------------------- /storybook-static/vercel.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /tailwind.config.ts: -------------------------------------------------------------------------------- 1 | import type { Config } from 'tailwindcss'; 2 | 3 | const config = { 4 | darkMode: ['class', "[data-mode='dark']"], 5 | content: [ 6 | './pages/**/*.{ts,tsx}', 7 | './components/**/*.{ts,tsx}', 8 | './app/**/*.{ts,tsx}', 9 | './src/**/*.{ts,tsx}', 10 | ], 11 | prefix: '', 12 | theme: { 13 | container: { 14 | center: true, 15 | padding: '2rem', 16 | screens: { 17 | '2xl': '1400px', 18 | }, 19 | }, 20 | extend: { 21 | colors: { 22 | border: 'hsl(var(--border))', 23 | input: 'hsl(var(--input))', 24 | ring: 'hsl(var(--ring))', 25 | background: 'hsl(var(--background))', 26 | foreground: 'hsl(var(--foreground))', 27 | primary: { 28 | DEFAULT: 'hsl(var(--primary))', 29 | foreground: 'hsl(var(--primary-foreground))', 30 | }, 31 | secondary: { 32 | DEFAULT: 'hsl(var(--secondary))', 33 | foreground: 'hsl(var(--secondary-foreground))', 34 | }, 35 | destructive: { 36 | DEFAULT: 'hsl(var(--destructive))', 37 | foreground: 'hsl(var(--destructive-foreground))', 38 | }, 39 | muted: { 40 | DEFAULT: 'hsl(var(--muted))', 41 | foreground: 'hsl(var(--muted-foreground))', 42 | }, 43 | accent: { 44 | DEFAULT: 'hsl(var(--accent))', 45 | foreground: 'hsl(var(--accent-foreground))', 46 | }, 47 | popover: { 48 | DEFAULT: 'hsl(var(--popover))', 49 | foreground: 'hsl(var(--popover-foreground))', 50 | }, 51 | card: { 52 | DEFAULT: 'hsl(var(--card))', 53 | foreground: 'hsl(var(--card-foreground))', 54 | }, 55 | }, 56 | borderRadius: { 57 | lg: 'var(--radius)', 58 | md: 'calc(var(--radius) - 2px)', 59 | sm: 'calc(var(--radius) - 4px)', 60 | }, 61 | keyframes: { 62 | 'accordion-down': { 63 | from: { height: '0' }, 64 | to: { height: 'var(--radix-accordion-content-height)' }, 65 | }, 66 | 'accordion-up': { 67 | from: { height: 'var(--radix-accordion-content-height)' }, 68 | to: { height: '0' }, 69 | }, 70 | }, 71 | animation: { 72 | 'accordion-down': 'accordion-down 0.2s ease-out', 73 | 'accordion-up': 'accordion-up 0.2s ease-out', 74 | }, 75 | }, 76 | }, 77 | plugins: [require('tailwindcss-animate')], 78 | } satisfies Config; 79 | 80 | export default config; 81 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "lib": ["dom", "dom.iterable", "esnext"], 4 | "allowJs": true, 5 | "skipLibCheck": true, 6 | "strict": true, 7 | "noEmit": true, 8 | "esModuleInterop": true, 9 | "module": "esnext", 10 | "moduleResolution": "bundler", 11 | "resolveJsonModule": true, 12 | "isolatedModules": true, 13 | "jsx": "preserve", 14 | "incremental": true, 15 | "baseUrl": ".", 16 | "plugins": [ 17 | { 18 | "name": "next" 19 | } 20 | ], 21 | "paths": { 22 | "@/*": ["./src/*"] 23 | }, 24 | "target": "ES2017" 25 | }, 26 | "include": [ 27 | "next-env.d.ts", 28 | "**/*.ts", 29 | "**/*.tsx", 30 | ".next/types/**/*.ts", 31 | "next-sitemap.config.js" 32 | ], 33 | "exclude": ["node_modules"] 34 | } 35 | --------------------------------------------------------------------------------