@zentauri-ui/zentauri-components 1.7.5 → 1.7.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -5
- package/cli/registry.json +2 -0
- package/dist/chunk-DEZRB6DS.mjs +83 -0
- package/dist/chunk-DEZRB6DS.mjs.map +1 -0
- package/dist/chunk-V5JTDRV5.mjs +278 -0
- package/dist/chunk-V5JTDRV5.mjs.map +1 -0
- package/dist/chunk-Z4KHAD6Y.js +295 -0
- package/dist/chunk-Z4KHAD6Y.js.map +1 -0
- package/dist/chunk-ZX2IBIZT.js +92 -0
- package/dist/chunk-ZX2IBIZT.js.map +1 -0
- package/dist/design-system/context-menu.d.ts +41 -0
- package/dist/design-system/context-menu.d.ts.map +1 -0
- package/dist/design-system/index.d.ts +2 -0
- package/dist/design-system/index.d.ts.map +1 -1
- package/dist/design-system/timeline.d.ts +56 -0
- package/dist/design-system/timeline.d.ts.map +1 -0
- package/dist/ui/context-menu/context-menu.d.ts +11 -0
- package/dist/ui/context-menu/context-menu.d.ts.map +1 -0
- package/dist/ui/context-menu/index.d.ts +4 -0
- package/dist/ui/context-menu/index.d.ts.map +1 -0
- package/dist/ui/context-menu/types.d.ts +81 -0
- package/dist/ui/context-menu/types.d.ts.map +1 -0
- package/dist/ui/context-menu/variants.d.ts +7 -0
- package/dist/ui/context-menu/variants.d.ts.map +1 -0
- package/dist/ui/context-menu.js +500 -0
- package/dist/ui/context-menu.js.map +1 -0
- package/dist/ui/context-menu.mjs +488 -0
- package/dist/ui/context-menu.mjs.map +1 -0
- package/dist/ui/dropdown.js +9 -89
- package/dist/ui/dropdown.js.map +1 -1
- package/dist/ui/dropdown.mjs +1 -81
- package/dist/ui/dropdown.mjs.map +1 -1
- package/dist/ui/scroll-area/scroll-area.d.ts.map +1 -1
- package/dist/ui/scroll-area.js.map +1 -1
- package/dist/ui/scroll-area.mjs.map +1 -1
- package/dist/ui/timeline/animated/animations.d.ts +8 -0
- package/dist/ui/timeline/animated/animations.d.ts.map +1 -0
- package/dist/ui/timeline/animated/index.d.ts +6 -0
- package/dist/ui/timeline/animated/index.d.ts.map +1 -0
- package/dist/ui/timeline/animated/timeline-item-animated.d.ts +8 -0
- package/dist/ui/timeline/animated/timeline-item-animated.d.ts.map +1 -0
- package/dist/ui/timeline/animated/types.d.ts +12 -0
- package/dist/ui/timeline/animated/types.d.ts.map +1 -0
- package/dist/ui/timeline/animated.js +94 -0
- package/dist/ui/timeline/animated.js.map +1 -0
- package/dist/ui/timeline/animated.mjs +71 -0
- package/dist/ui/timeline/animated.mjs.map +1 -0
- package/dist/ui/timeline/index.d.ts +4 -0
- package/dist/ui/timeline/index.d.ts.map +1 -0
- package/dist/ui/timeline/timeline-base.d.ts +37 -0
- package/dist/ui/timeline/timeline-base.d.ts.map +1 -0
- package/dist/ui/timeline/timeline.d.ts +8 -0
- package/dist/ui/timeline/timeline.d.ts.map +1 -0
- package/dist/ui/timeline/types.d.ts +38 -0
- package/dist/ui/timeline/types.d.ts.map +1 -0
- package/dist/ui/timeline/variants.d.ts +19 -0
- package/dist/ui/timeline/variants.d.ts.map +1 -0
- package/dist/ui/timeline.js +63 -0
- package/dist/ui/timeline.js.map +1 -0
- package/dist/ui/timeline.mjs +14 -0
- package/dist/ui/timeline.mjs.map +1 -0
- package/package.json +1 -1
- package/src/design-system/context-menu.ts +44 -0
- package/src/design-system/index.ts +2 -0
- package/src/design-system/timeline.ts +87 -0
- package/src/ui/context-menu/context-menu.test.tsx +176 -0
- package/src/ui/context-menu/context-menu.tsx +536 -0
- package/src/ui/context-menu/index.ts +29 -0
- package/src/ui/context-menu/types.ts +110 -0
- package/src/ui/context-menu/variants.ts +26 -0
- package/src/ui/scroll-area/scroll-area.tsx +0 -2
- package/src/ui/timeline/animated/animations.ts +16 -0
- package/src/ui/timeline/animated/index.ts +22 -0
- package/src/ui/timeline/animated/timeline-item-animated.tsx +76 -0
- package/src/ui/timeline/animated/types.ts +21 -0
- package/src/ui/timeline/index.ts +30 -0
- package/src/ui/timeline/timeline-base.tsx +232 -0
- package/src/ui/timeline/timeline.test.tsx +262 -0
- package/src/ui/timeline/timeline.tsx +24 -0
- package/src/ui/timeline/types.ts +61 -0
- package/src/ui/timeline/variants.ts +60 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/design-system/scroll-area.ts","../../src/ui/scroll-area/variants.ts","../../src/ui/scroll-area/scroll-area.tsx"],"names":["cva","jsx","cn"],"mappings":"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","file":"scroll-area.js","sourcesContent":["export const zuiScrollAreaBase =\n \"relative min-w-0 rounded-xl outline-none transition-[background-color,border-color,box-shadow,scrollbar-color] duration-200 [scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [scrollbar-width:thin] focus-visible:ring-2 focus-visible:ring-[var(--zui-scroll-area-ring-focus,oklch(54.6%_0.245_262.881_/_0.28))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus,#ffffff)] dark:focus-visible:ring-[var(--zui-scroll-area-ring-focus-dark,oklch(70.7%_0.165_254.624_/_0.28))] dark:focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] [&::-webkit-scrollbar]:h-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar]:w-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar-corner]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:border-2 [&::-webkit-scrollbar-thumb]:border-solid [&::-webkit-scrollbar-thumb]:border-[var(--zui-scroll-area-thumb-border,transparent)] [&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:rounded-full [&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\";\n\nexport const zuiScrollAreaAppearances = {\n default:\n \"[--zui-scroll-area-thumb:#94a3b8] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#e2e8f0] dark:[--zui-scroll-area-thumb:#64748b] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n muted:\n \"[--zui-scroll-area-thumb:#cbd5e1] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#f1f5f9] dark:[--zui-scroll-area-thumb:#475569] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#0f172a]\",\n outline:\n \"border border-[color:var(--zui-scroll-area-outline-border,#cbd5e1)] [--zui-scroll-area-thumb:#64748b] [--zui-scroll-area-thumb-border:#ffffff] [--zui-scroll-area-track:#e2e8f0] dark:border-[color:var(--zui-scroll-area-outline-border-dark,#334155)] dark:[--zui-scroll-area-thumb:#94a3b8] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n glass:\n \"border border-[color:var(--zui-scroll-area-glass-border,#ffffff80)] bg-[var(--zui-scroll-area-glass-bg,#ffffff99)] backdrop-blur-md [--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624_/_0.9)] [--zui-scroll-area-thumb-border:#ffffff66] [--zui-scroll-area-track:#ffffff33] dark:border-[color:var(--zui-scroll-area-glass-border-dark,#ffffff1f)] dark:bg-[var(--zui-scroll-area-glass-bg-dark,#0f172acc)] dark:[--zui-scroll-area-thumb:oklch(78.9%_0.154_211.53_/_0.8)] dark:[--zui-scroll-area-thumb-border:#02061766] dark:[--zui-scroll-area-track:#ffffff12]\",\n sky: \"border border-[color:var(--zui-scroll-area-sky-border,oklch(62.3%_0.214_259.815_/_0.35))] [--zui-scroll-area-thumb:oklch(54.6%_0.245_262.881)] [--zui-scroll-area-thumb-border:#eff6ff] [--zui-scroll-area-track:#dbeafe] dark:border-[color:var(--zui-scroll-area-sky-border-dark,oklch(70.7%_0.165_254.624_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#172554]\",\n emerald:\n \"border border-[color:var(--zui-scroll-area-emerald-border,oklch(59.6%_0.145_163.225_/_0.35))] [--zui-scroll-area-thumb:oklch(59.6%_0.145_163.225)] [--zui-scroll-area-thumb-border:#ecfdf5] [--zui-scroll-area-track:#d1fae5] dark:border-[color:var(--zui-scroll-area-emerald-border-dark,oklch(69.6%_0.17_162.48_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(69.6%_0.17_162.48)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#064e3b]\",\n rose: \"border border-[color:var(--zui-scroll-area-rose-border,oklch(58.6%_0.253_17.585_/_0.3))] [--zui-scroll-area-thumb:oklch(58.6%_0.253_17.585)] [--zui-scroll-area-thumb-border:#fff1f2] [--zui-scroll-area-track:#ffe4e6] dark:border-[color:var(--zui-scroll-area-rose-border-dark,oklch(71.2%_0.194_13.428_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(71.2%_0.194_13.428)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#4c0519]\",\n amber:\n \"border border-[color:var(--zui-scroll-area-amber-border,oklch(76.9%_0.188_70.08_/_0.35))] [--zui-scroll-area-thumb:oklch(66.6%_0.179_58.318)] [--zui-scroll-area-thumb-border:#fffbeb] [--zui-scroll-area-track:#fef3c7] dark:border-[color:var(--zui-scroll-area-amber-border-dark,oklch(82.8%_0.189_84.429_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(82.8%_0.189_84.429)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#451a03]\",\n violet:\n \"border border-[color:var(--zui-scroll-area-violet-border,oklch(60.6%_0.25_292.717_/_0.35))] [--zui-scroll-area-thumb:oklch(54.1%_0.281_293.009)] [--zui-scroll-area-thumb-border:#f5f3ff] [--zui-scroll-area-track:#ede9fe] dark:border-[color:var(--zui-scroll-area-violet-border-dark,oklch(70.2%_0.183_293.541_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.2%_0.183_293.541)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#2e1065]\",\n} as const;\n\nexport const zuiScrollAreaSizes = {\n sm: \"[--zui-scroll-area-size:0.375rem]\",\n md: \"[--zui-scroll-area-size:0.625rem]\",\n lg: \"[--zui-scroll-area-size:0.875rem]\",\n} as const;\n\nexport const zuiScrollAreaOrientations = {\n vertical: \"overflow-x-hidden overflow-y-auto\",\n horizontal: \"overflow-x-auto overflow-y-hidden\",\n both: \"overflow-auto\",\n} as const;\n\nexport const zuiScrollAreaVisibility = {\n auto: \"\",\n hover:\n \"[scrollbar-color:transparent_transparent] hover:[scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [&::-webkit-scrollbar-thumb]:bg-transparent hover:[&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:bg-transparent hover:[&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\",\n always: \"\",\n hidden:\n \"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&::-webkit-scrollbar]:h-0 [&::-webkit-scrollbar]:w-0\",\n} as const;\n\nexport const zuiScrollAreaShadows = {\n false: \"\",\n true: \"[box-shadow:inset_0_2px_12px_rgb(15_23_42_/_0.08)] dark:[box-shadow:inset_0_2px_12px_rgb(0_0_0_/_0.3)]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n zuiScrollAreaAppearances,\n zuiScrollAreaBase,\n zuiScrollAreaOrientations,\n zuiScrollAreaShadows,\n zuiScrollAreaSizes,\n zuiScrollAreaVisibility,\n} from \"../../design-system/scroll-area\";\n\nexport const scrollAreaVariants = cva(zuiScrollAreaBase, {\n variants: {\n appearance: zuiScrollAreaAppearances,\n orientation: zuiScrollAreaOrientations,\n scrollbar: zuiScrollAreaVisibility,\n shadow: zuiScrollAreaShadows,\n size: zuiScrollAreaSizes,\n },\n compoundVariants: [\n {\n scrollbar: \"always\",\n orientation: \"vertical\",\n class: \"overflow-x-hidden overflow-y-scroll\",\n },\n {\n scrollbar: \"always\",\n orientation: \"horizontal\",\n class: \"overflow-x-scroll overflow-y-hidden\",\n },\n {\n scrollbar: \"always\",\n orientation: \"both\",\n class: \"overflow-scroll\",\n },\n ],\n defaultVariants: {\n appearance: \"default\",\n orientation: \"vertical\",\n scrollbar: \"auto\",\n shadow: false,\n size: \"md\",\n },\n});\n","\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { ScrollAreaProps } from \"./types\";\nimport { scrollAreaVariants } from \"./variants\";\n\nexport function ScrollArea(props: ScrollAreaProps) {\n const {\n appearance,\n children,\n className,\n orientation,\n ref,\n role,\n scrollbar,\n shadow,\n size,\n tabIndex,\n viewportClassName,\n ...rest\n } = props;\n const ariaLabel = rest[\"aria-label\"];\n const ariaLabelledBy = rest[\"aria-labelledby\"];\n const isNamedRegion =\n role === \"region\" ||\n ariaLabel !== undefined ||\n ariaLabelledBy !== undefined;\n\n return (\n <div\n ref={ref}\n data-orientation={orientation ?? \"vertical\"}\n data-scrollbar={scrollbar ?? \"auto\"}\n data-slot=\"scroll-area\"\n role={\n role ??\n (ariaLabel !== undefined || ariaLabelledBy !== undefined\n ? \"region\"\n : undefined)\n }\n tabIndex={tabIndex ?? (isNamedRegion ? 0 : undefined)}\n className={cn(\n scrollAreaVariants({\n appearance,\n orientation,\n scrollbar,\n shadow,\n size,\n }),\n className,\n )}\n {...rest}\n >\n <div data-slot=\"scroll-area-viewport\" className={viewportClassName}>\n {children}\n </div>\n </div>\n );\n}\n\nScrollArea.displayName = \"ScrollArea\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/design-system/scroll-area.ts","../../src/ui/scroll-area/variants.ts","../../src/ui/scroll-area/scroll-area.tsx"],"names":["cva","jsx","cn"],"mappings":"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","file":"scroll-area.js","sourcesContent":["export const zuiScrollAreaBase =\n \"relative min-w-0 rounded-xl outline-none transition-[background-color,border-color,box-shadow,scrollbar-color] duration-200 [scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [scrollbar-width:thin] focus-visible:ring-2 focus-visible:ring-[var(--zui-scroll-area-ring-focus,oklch(54.6%_0.245_262.881_/_0.28))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus,#ffffff)] dark:focus-visible:ring-[var(--zui-scroll-area-ring-focus-dark,oklch(70.7%_0.165_254.624_/_0.28))] dark:focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] [&::-webkit-scrollbar]:h-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar]:w-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar-corner]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:border-2 [&::-webkit-scrollbar-thumb]:border-solid [&::-webkit-scrollbar-thumb]:border-[var(--zui-scroll-area-thumb-border,transparent)] [&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:rounded-full [&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\";\n\nexport const zuiScrollAreaAppearances = {\n default:\n \"[--zui-scroll-area-thumb:#94a3b8] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#e2e8f0] dark:[--zui-scroll-area-thumb:#64748b] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n muted:\n \"[--zui-scroll-area-thumb:#cbd5e1] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#f1f5f9] dark:[--zui-scroll-area-thumb:#475569] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#0f172a]\",\n outline:\n \"border border-[color:var(--zui-scroll-area-outline-border,#cbd5e1)] [--zui-scroll-area-thumb:#64748b] [--zui-scroll-area-thumb-border:#ffffff] [--zui-scroll-area-track:#e2e8f0] dark:border-[color:var(--zui-scroll-area-outline-border-dark,#334155)] dark:[--zui-scroll-area-thumb:#94a3b8] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n glass:\n \"border border-[color:var(--zui-scroll-area-glass-border,#ffffff80)] bg-[var(--zui-scroll-area-glass-bg,#ffffff99)] backdrop-blur-md [--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624_/_0.9)] [--zui-scroll-area-thumb-border:#ffffff66] [--zui-scroll-area-track:#ffffff33] dark:border-[color:var(--zui-scroll-area-glass-border-dark,#ffffff1f)] dark:bg-[var(--zui-scroll-area-glass-bg-dark,#0f172acc)] dark:[--zui-scroll-area-thumb:oklch(78.9%_0.154_211.53_/_0.8)] dark:[--zui-scroll-area-thumb-border:#02061766] dark:[--zui-scroll-area-track:#ffffff12]\",\n sky: \"border border-[color:var(--zui-scroll-area-sky-border,oklch(62.3%_0.214_259.815_/_0.35))] [--zui-scroll-area-thumb:oklch(54.6%_0.245_262.881)] [--zui-scroll-area-thumb-border:#eff6ff] [--zui-scroll-area-track:#dbeafe] dark:border-[color:var(--zui-scroll-area-sky-border-dark,oklch(70.7%_0.165_254.624_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#172554]\",\n emerald:\n \"border border-[color:var(--zui-scroll-area-emerald-border,oklch(59.6%_0.145_163.225_/_0.35))] [--zui-scroll-area-thumb:oklch(59.6%_0.145_163.225)] [--zui-scroll-area-thumb-border:#ecfdf5] [--zui-scroll-area-track:#d1fae5] dark:border-[color:var(--zui-scroll-area-emerald-border-dark,oklch(69.6%_0.17_162.48_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(69.6%_0.17_162.48)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#064e3b]\",\n rose: \"border border-[color:var(--zui-scroll-area-rose-border,oklch(58.6%_0.253_17.585_/_0.3))] [--zui-scroll-area-thumb:oklch(58.6%_0.253_17.585)] [--zui-scroll-area-thumb-border:#fff1f2] [--zui-scroll-area-track:#ffe4e6] dark:border-[color:var(--zui-scroll-area-rose-border-dark,oklch(71.2%_0.194_13.428_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(71.2%_0.194_13.428)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#4c0519]\",\n amber:\n \"border border-[color:var(--zui-scroll-area-amber-border,oklch(76.9%_0.188_70.08_/_0.35))] [--zui-scroll-area-thumb:oklch(66.6%_0.179_58.318)] [--zui-scroll-area-thumb-border:#fffbeb] [--zui-scroll-area-track:#fef3c7] dark:border-[color:var(--zui-scroll-area-amber-border-dark,oklch(82.8%_0.189_84.429_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(82.8%_0.189_84.429)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#451a03]\",\n violet:\n \"border border-[color:var(--zui-scroll-area-violet-border,oklch(60.6%_0.25_292.717_/_0.35))] [--zui-scroll-area-thumb:oklch(54.1%_0.281_293.009)] [--zui-scroll-area-thumb-border:#f5f3ff] [--zui-scroll-area-track:#ede9fe] dark:border-[color:var(--zui-scroll-area-violet-border-dark,oklch(70.2%_0.183_293.541_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.2%_0.183_293.541)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#2e1065]\",\n} as const;\n\nexport const zuiScrollAreaSizes = {\n sm: \"[--zui-scroll-area-size:0.375rem]\",\n md: \"[--zui-scroll-area-size:0.625rem]\",\n lg: \"[--zui-scroll-area-size:0.875rem]\",\n} as const;\n\nexport const zuiScrollAreaOrientations = {\n vertical: \"overflow-x-hidden overflow-y-auto\",\n horizontal: \"overflow-x-auto overflow-y-hidden\",\n both: \"overflow-auto\",\n} as const;\n\nexport const zuiScrollAreaVisibility = {\n auto: \"\",\n hover:\n \"[scrollbar-color:transparent_transparent] hover:[scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [&::-webkit-scrollbar-thumb]:bg-transparent hover:[&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:bg-transparent hover:[&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\",\n always: \"\",\n hidden:\n \"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&::-webkit-scrollbar]:h-0 [&::-webkit-scrollbar]:w-0\",\n} as const;\n\nexport const zuiScrollAreaShadows = {\n false: \"\",\n true: \"[box-shadow:inset_0_2px_12px_rgb(15_23_42_/_0.08)] dark:[box-shadow:inset_0_2px_12px_rgb(0_0_0_/_0.3)]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n zuiScrollAreaAppearances,\n zuiScrollAreaBase,\n zuiScrollAreaOrientations,\n zuiScrollAreaShadows,\n zuiScrollAreaSizes,\n zuiScrollAreaVisibility,\n} from \"../../design-system/scroll-area\";\n\nexport const scrollAreaVariants = cva(zuiScrollAreaBase, {\n variants: {\n appearance: zuiScrollAreaAppearances,\n orientation: zuiScrollAreaOrientations,\n scrollbar: zuiScrollAreaVisibility,\n shadow: zuiScrollAreaShadows,\n size: zuiScrollAreaSizes,\n },\n compoundVariants: [\n {\n scrollbar: \"always\",\n orientation: \"vertical\",\n class: \"overflow-x-hidden overflow-y-scroll\",\n },\n {\n scrollbar: \"always\",\n orientation: \"horizontal\",\n class: \"overflow-x-scroll overflow-y-hidden\",\n },\n {\n scrollbar: \"always\",\n orientation: \"both\",\n class: \"overflow-scroll\",\n },\n ],\n defaultVariants: {\n appearance: \"default\",\n orientation: \"vertical\",\n scrollbar: \"auto\",\n shadow: false,\n size: \"md\",\n },\n});\n","\"use client\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { ScrollAreaProps } from \"./types\";\nimport { scrollAreaVariants } from \"./variants\";\n\nexport function ScrollArea(props: ScrollAreaProps) {\n const {\n appearance,\n children,\n className,\n orientation,\n ref,\n role,\n scrollbar,\n shadow,\n size,\n tabIndex,\n viewportClassName,\n ...rest\n } = props;\n const ariaLabel = rest[\"aria-label\"];\n const ariaLabelledBy = rest[\"aria-labelledby\"];\n const isNamedRegion =\n role === \"region\" ||\n ariaLabel !== undefined ||\n ariaLabelledBy !== undefined;\n\n return (\n <div\n ref={ref}\n data-orientation={orientation ?? \"vertical\"}\n data-scrollbar={scrollbar ?? \"auto\"}\n data-slot=\"scroll-area\"\n role={\n role ??\n (ariaLabel !== undefined || ariaLabelledBy !== undefined\n ? \"region\"\n : undefined)\n }\n tabIndex={tabIndex ?? (isNamedRegion ? 0 : undefined)}\n className={cn(\n scrollAreaVariants({\n appearance,\n orientation,\n scrollbar,\n shadow,\n size,\n }),\n className,\n )}\n {...rest}\n >\n <div data-slot=\"scroll-area-viewport\" className={viewportClassName}>\n {children}\n </div>\n </div>\n );\n}\n\nScrollArea.displayName = \"ScrollArea\";\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/design-system/scroll-area.ts","../../src/ui/scroll-area/variants.ts","../../src/ui/scroll-area/scroll-area.tsx"],"names":[],"mappings":";;;;;AAAO,IAAM,iBAAA,GACX,itCAAA;AAEK,IAAM,wBAAA,GAA2B;AAAA,EACtC,OAAA,EACE,0OAAA;AAAA,EACF,KAAA,EACE,0OAAA;AAAA,EACF,OAAA,EACE,qXAAA;AAAA,EACF,KAAA,EACE,uiBAAA;AAAA,EACF,GAAA,EAAK,ucAAA;AAAA,EACL,OAAA,EACE,2cAAA;AAAA,EACF,IAAA,EAAM,ocAAA;AAAA,EACN,KAAA,EACE,scAAA;AAAA,EACF,MAAA,EACE;AACJ,CAAA;AAEO,IAAM,kBAAA,GAAqB;AAAA,EAChC,EAAA,EAAI,mCAAA;AAAA,EACJ,EAAA,EAAI,mCAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEO,IAAM,yBAAA,GAA4B;AAAA,EACvC,QAAA,EAAU,mCAAA;AAAA,EACV,UAAA,EAAY,mCAAA;AAAA,EACZ,IAAA,EAAM;AACR,CAAA;AAEO,IAAM,uBAAA,GAA0B;AAAA,EACrC,IAAA,EAAM,EAAA;AAAA,EACN,KAAA,EACE,uYAAA;AAAA,EACF,MAAA,EAAQ,EAAA;AAAA,EACR,MAAA,EACE;AACJ,CAAA;AAEO,IAAM,oBAAA,GAAuB;AAAA,EAClC,KAAA,EAAO,EAAA;AAAA,EACP,IAAA,EAAM;AACR,CAAA;;;ACnCO,IAAM,kBAAA,GAAqB,IAAI,iBAAA,EAAmB;AAAA,EACvD,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,wBAAA;AAAA,IACZ,WAAA,EAAa,yBAAA;AAAA,IACb,SAAA,EAAW,uBAAA;AAAA,IACX,MAAA,EAAQ,oBAAA;AAAA,IACR,IAAA,EAAM;AAAA,GACR;AAAA,EACA,gBAAA,EAAkB;AAAA,IAChB;AAAA,MACE,SAAA,EAAW,QAAA;AAAA,MACX,WAAA,EAAa,UAAA;AAAA,MACb,KAAA,EAAO;AAAA,KACT;AAAA,IACA;AAAA,MACE,SAAA,EAAW,QAAA;AAAA,MACX,WAAA,EAAa,YAAA;AAAA,MACb,KAAA,EAAO;AAAA,KACT;AAAA,IACA;AAAA,MACE,SAAA,EAAW,QAAA;AAAA,MACX,WAAA,EAAa,MAAA;AAAA,MACb,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,WAAA,EAAa,UAAA;AAAA,IACb,SAAA,EAAW,MAAA;AAAA,IACX,MAAA,EAAQ,KAAA;AAAA,IACR,IAAA,EAAM;AAAA;AAEV,CAAC;AClCM,SAAS,WAAW,KAAA,EAAwB;AACjD,EAAA,MAAM;AAAA,IACJ,UAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,WAAA;AAAA,IACA,GAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,iBAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,SAAA,GAAY,KAAK,YAAY,CAAA;AACnC,EAAA,MAAM,cAAA,GAAiB,KAAK,iBAAiB,CAAA;AAC7C,EAAA,MAAM,aAAA,GACJ,IAAA,KAAS,QAAA,IACT,SAAA,KAAc,UACd,cAAA,KAAmB,MAAA;AAErB,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,oBAAkB,WAAA,IAAe,UAAA;AAAA,MACjC,kBAAgB,SAAA,IAAa,MAAA;AAAA,MAC7B,WAAA,EAAU,aAAA;AAAA,MACV,MACE,IAAA,KACC,SAAA,KAAc,MAAA,IAAa,cAAA,KAAmB,SAC3C,QAAA,GACA,MAAA,CAAA;AAAA,MAEN,QAAA,EAAU,QAAA,KAAa,aAAA,GAAgB,CAAA,GAAI,MAAA,CAAA;AAAA,MAC3C,SAAA,EAAW,EAAA;AAAA,QACT,kBAAA,CAAmB;AAAA,UACjB,UAAA;AAAA,UACA,WAAA;AAAA,UACA,SAAA;AAAA,UACA,MAAA;AAAA,UACA;AAAA,SACD,CAAA;AAAA,QACD;AAAA,OACF;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,8BAAC,KAAA,EAAA,EAAI,WAAA,EAAU,sBAAA,EAAuB,SAAA,EAAW,mBAC9C,QAAA,EACH;AAAA;AAAA,GACF;AAEJ;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"scroll-area.mjs","sourcesContent":["export const zuiScrollAreaBase =\n \"relative min-w-0 rounded-xl outline-none transition-[background-color,border-color,box-shadow,scrollbar-color] duration-200 [scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [scrollbar-width:thin] focus-visible:ring-2 focus-visible:ring-[var(--zui-scroll-area-ring-focus,oklch(54.6%_0.245_262.881_/_0.28))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus,#ffffff)] dark:focus-visible:ring-[var(--zui-scroll-area-ring-focus-dark,oklch(70.7%_0.165_254.624_/_0.28))] dark:focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] [&::-webkit-scrollbar]:h-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar]:w-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar-corner]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:border-2 [&::-webkit-scrollbar-thumb]:border-solid [&::-webkit-scrollbar-thumb]:border-[var(--zui-scroll-area-thumb-border,transparent)] [&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:rounded-full [&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\";\n\nexport const zuiScrollAreaAppearances = {\n default:\n \"[--zui-scroll-area-thumb:#94a3b8] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#e2e8f0] dark:[--zui-scroll-area-thumb:#64748b] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n muted:\n \"[--zui-scroll-area-thumb:#cbd5e1] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#f1f5f9] dark:[--zui-scroll-area-thumb:#475569] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#0f172a]\",\n outline:\n \"border border-[color:var(--zui-scroll-area-outline-border,#cbd5e1)] [--zui-scroll-area-thumb:#64748b] [--zui-scroll-area-thumb-border:#ffffff] [--zui-scroll-area-track:#e2e8f0] dark:border-[color:var(--zui-scroll-area-outline-border-dark,#334155)] dark:[--zui-scroll-area-thumb:#94a3b8] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n glass:\n \"border border-[color:var(--zui-scroll-area-glass-border,#ffffff80)] bg-[var(--zui-scroll-area-glass-bg,#ffffff99)] backdrop-blur-md [--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624_/_0.9)] [--zui-scroll-area-thumb-border:#ffffff66] [--zui-scroll-area-track:#ffffff33] dark:border-[color:var(--zui-scroll-area-glass-border-dark,#ffffff1f)] dark:bg-[var(--zui-scroll-area-glass-bg-dark,#0f172acc)] dark:[--zui-scroll-area-thumb:oklch(78.9%_0.154_211.53_/_0.8)] dark:[--zui-scroll-area-thumb-border:#02061766] dark:[--zui-scroll-area-track:#ffffff12]\",\n sky: \"border border-[color:var(--zui-scroll-area-sky-border,oklch(62.3%_0.214_259.815_/_0.35))] [--zui-scroll-area-thumb:oklch(54.6%_0.245_262.881)] [--zui-scroll-area-thumb-border:#eff6ff] [--zui-scroll-area-track:#dbeafe] dark:border-[color:var(--zui-scroll-area-sky-border-dark,oklch(70.7%_0.165_254.624_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#172554]\",\n emerald:\n \"border border-[color:var(--zui-scroll-area-emerald-border,oklch(59.6%_0.145_163.225_/_0.35))] [--zui-scroll-area-thumb:oklch(59.6%_0.145_163.225)] [--zui-scroll-area-thumb-border:#ecfdf5] [--zui-scroll-area-track:#d1fae5] dark:border-[color:var(--zui-scroll-area-emerald-border-dark,oklch(69.6%_0.17_162.48_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(69.6%_0.17_162.48)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#064e3b]\",\n rose: \"border border-[color:var(--zui-scroll-area-rose-border,oklch(58.6%_0.253_17.585_/_0.3))] [--zui-scroll-area-thumb:oklch(58.6%_0.253_17.585)] [--zui-scroll-area-thumb-border:#fff1f2] [--zui-scroll-area-track:#ffe4e6] dark:border-[color:var(--zui-scroll-area-rose-border-dark,oklch(71.2%_0.194_13.428_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(71.2%_0.194_13.428)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#4c0519]\",\n amber:\n \"border border-[color:var(--zui-scroll-area-amber-border,oklch(76.9%_0.188_70.08_/_0.35))] [--zui-scroll-area-thumb:oklch(66.6%_0.179_58.318)] [--zui-scroll-area-thumb-border:#fffbeb] [--zui-scroll-area-track:#fef3c7] dark:border-[color:var(--zui-scroll-area-amber-border-dark,oklch(82.8%_0.189_84.429_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(82.8%_0.189_84.429)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#451a03]\",\n violet:\n \"border border-[color:var(--zui-scroll-area-violet-border,oklch(60.6%_0.25_292.717_/_0.35))] [--zui-scroll-area-thumb:oklch(54.1%_0.281_293.009)] [--zui-scroll-area-thumb-border:#f5f3ff] [--zui-scroll-area-track:#ede9fe] dark:border-[color:var(--zui-scroll-area-violet-border-dark,oklch(70.2%_0.183_293.541_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.2%_0.183_293.541)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#2e1065]\",\n} as const;\n\nexport const zuiScrollAreaSizes = {\n sm: \"[--zui-scroll-area-size:0.375rem]\",\n md: \"[--zui-scroll-area-size:0.625rem]\",\n lg: \"[--zui-scroll-area-size:0.875rem]\",\n} as const;\n\nexport const zuiScrollAreaOrientations = {\n vertical: \"overflow-x-hidden overflow-y-auto\",\n horizontal: \"overflow-x-auto overflow-y-hidden\",\n both: \"overflow-auto\",\n} as const;\n\nexport const zuiScrollAreaVisibility = {\n auto: \"\",\n hover:\n \"[scrollbar-color:transparent_transparent] hover:[scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [&::-webkit-scrollbar-thumb]:bg-transparent hover:[&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:bg-transparent hover:[&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\",\n always: \"\",\n hidden:\n \"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&::-webkit-scrollbar]:h-0 [&::-webkit-scrollbar]:w-0\",\n} as const;\n\nexport const zuiScrollAreaShadows = {\n false: \"\",\n true: \"[box-shadow:inset_0_2px_12px_rgb(15_23_42_/_0.08)] dark:[box-shadow:inset_0_2px_12px_rgb(0_0_0_/_0.3)]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n zuiScrollAreaAppearances,\n zuiScrollAreaBase,\n zuiScrollAreaOrientations,\n zuiScrollAreaShadows,\n zuiScrollAreaSizes,\n zuiScrollAreaVisibility,\n} from \"../../design-system/scroll-area\";\n\nexport const scrollAreaVariants = cva(zuiScrollAreaBase, {\n variants: {\n appearance: zuiScrollAreaAppearances,\n orientation: zuiScrollAreaOrientations,\n scrollbar: zuiScrollAreaVisibility,\n shadow: zuiScrollAreaShadows,\n size: zuiScrollAreaSizes,\n },\n compoundVariants: [\n {\n scrollbar: \"always\",\n orientation: \"vertical\",\n class: \"overflow-x-hidden overflow-y-scroll\",\n },\n {\n scrollbar: \"always\",\n orientation: \"horizontal\",\n class: \"overflow-x-scroll overflow-y-hidden\",\n },\n {\n scrollbar: \"always\",\n orientation: \"both\",\n class: \"overflow-scroll\",\n },\n ],\n defaultVariants: {\n appearance: \"default\",\n orientation: \"vertical\",\n scrollbar: \"auto\",\n shadow: false,\n size: \"md\",\n },\n});\n","\"use client\";\n\nimport { forwardRef } from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { ScrollAreaProps } from \"./types\";\nimport { scrollAreaVariants } from \"./variants\";\n\nexport function ScrollArea(props: ScrollAreaProps) {\n const {\n appearance,\n children,\n className,\n orientation,\n ref,\n role,\n scrollbar,\n shadow,\n size,\n tabIndex,\n viewportClassName,\n ...rest\n } = props;\n const ariaLabel = rest[\"aria-label\"];\n const ariaLabelledBy = rest[\"aria-labelledby\"];\n const isNamedRegion =\n role === \"region\" ||\n ariaLabel !== undefined ||\n ariaLabelledBy !== undefined;\n\n return (\n <div\n ref={ref}\n data-orientation={orientation ?? \"vertical\"}\n data-scrollbar={scrollbar ?? \"auto\"}\n data-slot=\"scroll-area\"\n role={\n role ??\n (ariaLabel !== undefined || ariaLabelledBy !== undefined\n ? \"region\"\n : undefined)\n }\n tabIndex={tabIndex ?? (isNamedRegion ? 0 : undefined)}\n className={cn(\n scrollAreaVariants({\n appearance,\n orientation,\n scrollbar,\n shadow,\n size,\n }),\n className,\n )}\n {...rest}\n >\n <div data-slot=\"scroll-area-viewport\" className={viewportClassName}>\n {children}\n </div>\n </div>\n );\n}\n\nScrollArea.displayName = \"ScrollArea\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/design-system/scroll-area.ts","../../src/ui/scroll-area/variants.ts","../../src/ui/scroll-area/scroll-area.tsx"],"names":[],"mappings":"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","file":"scroll-area.mjs","sourcesContent":["export const zuiScrollAreaBase =\n \"relative min-w-0 rounded-xl outline-none transition-[background-color,border-color,box-shadow,scrollbar-color] duration-200 [scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [scrollbar-width:thin] focus-visible:ring-2 focus-visible:ring-[var(--zui-scroll-area-ring-focus,oklch(54.6%_0.245_262.881_/_0.28))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus,#ffffff)] dark:focus-visible:ring-[var(--zui-scroll-area-ring-focus-dark,oklch(70.7%_0.165_254.624_/_0.28))] dark:focus-visible:ring-offset-[var(--zui-scroll-area-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] [&::-webkit-scrollbar]:h-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar]:w-[var(--zui-scroll-area-size,0.625rem)] [&::-webkit-scrollbar-corner]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:border-2 [&::-webkit-scrollbar-thumb]:border-solid [&::-webkit-scrollbar-thumb]:border-[var(--zui-scroll-area-thumb-border,transparent)] [&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:rounded-full [&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\";\n\nexport const zuiScrollAreaAppearances = {\n default:\n \"[--zui-scroll-area-thumb:#94a3b8] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#e2e8f0] dark:[--zui-scroll-area-thumb:#64748b] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n muted:\n \"[--zui-scroll-area-thumb:#cbd5e1] [--zui-scroll-area-thumb-border:#f8fafc] [--zui-scroll-area-track:#f1f5f9] dark:[--zui-scroll-area-thumb:#475569] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#0f172a]\",\n outline:\n \"border border-[color:var(--zui-scroll-area-outline-border,#cbd5e1)] [--zui-scroll-area-thumb:#64748b] [--zui-scroll-area-thumb-border:#ffffff] [--zui-scroll-area-track:#e2e8f0] dark:border-[color:var(--zui-scroll-area-outline-border-dark,#334155)] dark:[--zui-scroll-area-thumb:#94a3b8] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#1e293b]\",\n glass:\n \"border border-[color:var(--zui-scroll-area-glass-border,#ffffff80)] bg-[var(--zui-scroll-area-glass-bg,#ffffff99)] backdrop-blur-md [--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624_/_0.9)] [--zui-scroll-area-thumb-border:#ffffff66] [--zui-scroll-area-track:#ffffff33] dark:border-[color:var(--zui-scroll-area-glass-border-dark,#ffffff1f)] dark:bg-[var(--zui-scroll-area-glass-bg-dark,#0f172acc)] dark:[--zui-scroll-area-thumb:oklch(78.9%_0.154_211.53_/_0.8)] dark:[--zui-scroll-area-thumb-border:#02061766] dark:[--zui-scroll-area-track:#ffffff12]\",\n sky: \"border border-[color:var(--zui-scroll-area-sky-border,oklch(62.3%_0.214_259.815_/_0.35))] [--zui-scroll-area-thumb:oklch(54.6%_0.245_262.881)] [--zui-scroll-area-thumb-border:#eff6ff] [--zui-scroll-area-track:#dbeafe] dark:border-[color:var(--zui-scroll-area-sky-border-dark,oklch(70.7%_0.165_254.624_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.7%_0.165_254.624)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#172554]\",\n emerald:\n \"border border-[color:var(--zui-scroll-area-emerald-border,oklch(59.6%_0.145_163.225_/_0.35))] [--zui-scroll-area-thumb:oklch(59.6%_0.145_163.225)] [--zui-scroll-area-thumb-border:#ecfdf5] [--zui-scroll-area-track:#d1fae5] dark:border-[color:var(--zui-scroll-area-emerald-border-dark,oklch(69.6%_0.17_162.48_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(69.6%_0.17_162.48)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#064e3b]\",\n rose: \"border border-[color:var(--zui-scroll-area-rose-border,oklch(58.6%_0.253_17.585_/_0.3))] [--zui-scroll-area-thumb:oklch(58.6%_0.253_17.585)] [--zui-scroll-area-thumb-border:#fff1f2] [--zui-scroll-area-track:#ffe4e6] dark:border-[color:var(--zui-scroll-area-rose-border-dark,oklch(71.2%_0.194_13.428_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(71.2%_0.194_13.428)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#4c0519]\",\n amber:\n \"border border-[color:var(--zui-scroll-area-amber-border,oklch(76.9%_0.188_70.08_/_0.35))] [--zui-scroll-area-thumb:oklch(66.6%_0.179_58.318)] [--zui-scroll-area-thumb-border:#fffbeb] [--zui-scroll-area-track:#fef3c7] dark:border-[color:var(--zui-scroll-area-amber-border-dark,oklch(82.8%_0.189_84.429_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(82.8%_0.189_84.429)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#451a03]\",\n violet:\n \"border border-[color:var(--zui-scroll-area-violet-border,oklch(60.6%_0.25_292.717_/_0.35))] [--zui-scroll-area-thumb:oklch(54.1%_0.281_293.009)] [--zui-scroll-area-thumb-border:#f5f3ff] [--zui-scroll-area-track:#ede9fe] dark:border-[color:var(--zui-scroll-area-violet-border-dark,oklch(70.2%_0.183_293.541_/_0.35))] dark:[--zui-scroll-area-thumb:oklch(70.2%_0.183_293.541)] dark:[--zui-scroll-area-thumb-border:#020617] dark:[--zui-scroll-area-track:#2e1065]\",\n} as const;\n\nexport const zuiScrollAreaSizes = {\n sm: \"[--zui-scroll-area-size:0.375rem]\",\n md: \"[--zui-scroll-area-size:0.625rem]\",\n lg: \"[--zui-scroll-area-size:0.875rem]\",\n} as const;\n\nexport const zuiScrollAreaOrientations = {\n vertical: \"overflow-x-hidden overflow-y-auto\",\n horizontal: \"overflow-x-auto overflow-y-hidden\",\n both: \"overflow-auto\",\n} as const;\n\nexport const zuiScrollAreaVisibility = {\n auto: \"\",\n hover:\n \"[scrollbar-color:transparent_transparent] hover:[scrollbar-color:var(--zui-scroll-area-thumb,#94a3b8)_var(--zui-scroll-area-track,transparent)] [&::-webkit-scrollbar-thumb]:bg-transparent hover:[&::-webkit-scrollbar-thumb]:bg-[var(--zui-scroll-area-thumb,#94a3b8)] [&::-webkit-scrollbar-track]:bg-transparent hover:[&::-webkit-scrollbar-track]:bg-[var(--zui-scroll-area-track,transparent)]\",\n always: \"\",\n hidden:\n \"[scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&::-webkit-scrollbar]:h-0 [&::-webkit-scrollbar]:w-0\",\n} as const;\n\nexport const zuiScrollAreaShadows = {\n false: \"\",\n true: \"[box-shadow:inset_0_2px_12px_rgb(15_23_42_/_0.08)] dark:[box-shadow:inset_0_2px_12px_rgb(0_0_0_/_0.3)]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n zuiScrollAreaAppearances,\n zuiScrollAreaBase,\n zuiScrollAreaOrientations,\n zuiScrollAreaShadows,\n zuiScrollAreaSizes,\n zuiScrollAreaVisibility,\n} from \"../../design-system/scroll-area\";\n\nexport const scrollAreaVariants = cva(zuiScrollAreaBase, {\n variants: {\n appearance: zuiScrollAreaAppearances,\n orientation: zuiScrollAreaOrientations,\n scrollbar: zuiScrollAreaVisibility,\n shadow: zuiScrollAreaShadows,\n size: zuiScrollAreaSizes,\n },\n compoundVariants: [\n {\n scrollbar: \"always\",\n orientation: \"vertical\",\n class: \"overflow-x-hidden overflow-y-scroll\",\n },\n {\n scrollbar: \"always\",\n orientation: \"horizontal\",\n class: \"overflow-x-scroll overflow-y-hidden\",\n },\n {\n scrollbar: \"always\",\n orientation: \"both\",\n class: \"overflow-scroll\",\n },\n ],\n defaultVariants: {\n appearance: \"default\",\n orientation: \"vertical\",\n scrollbar: \"auto\",\n shadow: false,\n size: \"md\",\n },\n});\n","\"use client\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type { ScrollAreaProps } from \"./types\";\nimport { scrollAreaVariants } from \"./variants\";\n\nexport function ScrollArea(props: ScrollAreaProps) {\n const {\n appearance,\n children,\n className,\n orientation,\n ref,\n role,\n scrollbar,\n shadow,\n size,\n tabIndex,\n viewportClassName,\n ...rest\n } = props;\n const ariaLabel = rest[\"aria-label\"];\n const ariaLabelledBy = rest[\"aria-labelledby\"];\n const isNamedRegion =\n role === \"region\" ||\n ariaLabel !== undefined ||\n ariaLabelledBy !== undefined;\n\n return (\n <div\n ref={ref}\n data-orientation={orientation ?? \"vertical\"}\n data-scrollbar={scrollbar ?? \"auto\"}\n data-slot=\"scroll-area\"\n role={\n role ??\n (ariaLabel !== undefined || ariaLabelledBy !== undefined\n ? \"region\"\n : undefined)\n }\n tabIndex={tabIndex ?? (isNamedRegion ? 0 : undefined)}\n className={cn(\n scrollAreaVariants({\n appearance,\n orientation,\n scrollbar,\n shadow,\n size,\n }),\n className,\n )}\n {...rest}\n >\n <div data-slot=\"scroll-area-viewport\" className={viewportClassName}>\n {children}\n </div>\n </div>\n );\n}\n\nScrollArea.displayName = \"ScrollArea\";\n"]}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { Transition } from "framer-motion";
|
|
2
|
+
/** Entrance presets for animated timeline items (fade + slide, connector draw). */
|
|
3
|
+
export type TimelineTransition = "none" | "default" | "smooth" | "slow";
|
|
4
|
+
export type TimelineTransitionPresets = Record<TimelineTransition, Transition>;
|
|
5
|
+
export declare const timelineItemTransitionPresets: TimelineTransitionPresets;
|
|
6
|
+
/** Default per-item entrance delay multiplier (seconds) for staggered reveals. */
|
|
7
|
+
export declare const TIMELINE_DEFAULT_STAGGER = 0.08;
|
|
8
|
+
//# sourceMappingURL=animations.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.d.ts","sourceRoot":"","sources":["../../../../src/ui/timeline/animated/animations.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,mFAAmF;AACnF,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;AAExE,MAAM,MAAM,yBAAyB,GAAG,MAAM,CAAC,kBAAkB,EAAE,UAAU,CAAC,CAAC;AAE/E,eAAO,MAAM,6BAA6B,EAAE,yBAK3C,CAAC;AAEF,kFAAkF;AAClF,eAAO,MAAM,wBAAwB,OAAO,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { Timeline, TimelineContent, TimelineDescription, TimelineIndicator, TimelineTitle, } from "../timeline-base";
|
|
2
|
+
export { TimelineItem } from "./timeline-item-animated";
|
|
3
|
+
export type { TimelineAnimatedProps, TimelineItemAnimatedProps, } from "./types";
|
|
4
|
+
export { TIMELINE_DEFAULT_STAGGER, timelineItemTransitionPresets, } from "./animations";
|
|
5
|
+
export type { TimelineTransition, TimelineTransitionPresets, } from "./animations";
|
|
6
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ui/timeline/animated/index.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,QAAQ,EACR,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,aAAa,GACd,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,YAAY,EACV,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,wBAAwB,EACxB,6BAA6B,GAC9B,MAAM,cAAc,CAAC;AACtB,YAAY,EACV,kBAAkB,EAClB,yBAAyB,GAC1B,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { TimelineItemAnimatedProps } from "./types";
|
|
2
|
+
export declare function TimelineItem({ className, children, transitionVariant, stagger, ref, ...rest }: TimelineItemAnimatedProps & {
|
|
3
|
+
ref?: React.Ref<HTMLLIElement>;
|
|
4
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare namespace TimelineItem {
|
|
6
|
+
var displayName: string;
|
|
7
|
+
}
|
|
8
|
+
//# sourceMappingURL=timeline-item-animated.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline-item-animated.d.ts","sourceRoot":"","sources":["../../../../src/ui/timeline/animated/timeline-item-animated.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAEzD,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,QAAQ,EACR,iBAA6B,EAC7B,OAAkC,EAClC,GAAG,EACH,GAAG,IAAI,EACR,EAAE,yBAAyB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAA;CAAE,2CA2ChE;yBAlDe,YAAY"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { TimelineItemProps, TimelineProps } from "../types";
|
|
2
|
+
import type { TimelineTransition } from "./animations";
|
|
3
|
+
export type TimelineAnimatedProps = TimelineProps;
|
|
4
|
+
/** Motion `li` uses different handler types than some React DOM events. */
|
|
5
|
+
export type TimelineItemMotionConflictProps = "onAnimationStart" | "onDrag" | "onDragEnd" | "onDragStart";
|
|
6
|
+
export type TimelineItemAnimatedProps = Omit<TimelineItemProps, TimelineItemMotionConflictProps> & {
|
|
7
|
+
/** Entrance easing/duration preset. `none` renders without motion. */
|
|
8
|
+
transitionVariant?: TimelineTransition;
|
|
9
|
+
/** Per-item entrance delay multiplier in seconds (index × stagger). */
|
|
10
|
+
stagger?: number;
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/ui/timeline/animated/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACjE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAEvD,MAAM,MAAM,qBAAqB,GAAG,aAAa,CAAC;AAElD,2EAA2E;AAC3E,MAAM,MAAM,+BAA+B,GACvC,kBAAkB,GAClB,QAAQ,GACR,WAAW,GACX,aAAa,CAAC;AAElB,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC1C,iBAAiB,EACjB,+BAA+B,CAChC,GAAG;IACF,sEAAsE;IACtE,iBAAiB,CAAC,EAAE,kBAAkB,CAAC;IACvC,uEAAuE;IACvE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC"}
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var chunkZ4KHAD6Y_js = require('../../chunk-Z4KHAD6Y.js');
|
|
5
|
+
var chunkZS5756ZC_js = require('../../chunk-ZS5756ZC.js');
|
|
6
|
+
var react = require('react');
|
|
7
|
+
var framerMotion = require('framer-motion');
|
|
8
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
9
|
+
|
|
10
|
+
// src/ui/timeline/animated/animations.ts
|
|
11
|
+
var timelineItemTransitionPresets = {
|
|
12
|
+
none: { duration: 0 },
|
|
13
|
+
default: { duration: 0.4, ease: [0.22, 1, 0.36, 1] },
|
|
14
|
+
smooth: { duration: 0.55, ease: [0.22, 1, 0.36, 1] },
|
|
15
|
+
slow: { duration: 0.8, ease: [0.4, 0, 0.2, 1] }
|
|
16
|
+
};
|
|
17
|
+
var TIMELINE_DEFAULT_STAGGER = 0.08;
|
|
18
|
+
function TimelineItem({
|
|
19
|
+
className,
|
|
20
|
+
children,
|
|
21
|
+
transitionVariant = "default",
|
|
22
|
+
stagger = TIMELINE_DEFAULT_STAGGER,
|
|
23
|
+
ref,
|
|
24
|
+
...rest
|
|
25
|
+
}) {
|
|
26
|
+
const { size, total } = chunkZ4KHAD6Y_js.useTimelineContext("TimelineItem");
|
|
27
|
+
const index = chunkZ4KHAD6Y_js.useTimelineIndex("TimelineItem");
|
|
28
|
+
const isLast = index === total - 1;
|
|
29
|
+
const itemCtx = react.useMemo(
|
|
30
|
+
() => ({ index, isLast }),
|
|
31
|
+
[index, isLast]
|
|
32
|
+
);
|
|
33
|
+
const reducedMotion = framerMotion.useReducedMotion();
|
|
34
|
+
const motionless = transitionVariant === "none" || Boolean(reducedMotion);
|
|
35
|
+
const transition = timelineItemTransitionPresets[transitionVariant];
|
|
36
|
+
const delay = index * stagger;
|
|
37
|
+
return /* @__PURE__ */ jsxRuntime.jsx(chunkZ4KHAD6Y_js.TimelineItemContext.Provider, { value: itemCtx, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
38
|
+
framerMotion.motion.li,
|
|
39
|
+
{
|
|
40
|
+
ref,
|
|
41
|
+
"data-slot": "timeline-item",
|
|
42
|
+
"data-last": isLast ? "" : void 0,
|
|
43
|
+
className: chunkZS5756ZC_js.cn(chunkZ4KHAD6Y_js.timelineItemVariants(), className),
|
|
44
|
+
initial: motionless ? false : { opacity: 0, y: 12 },
|
|
45
|
+
whileInView: motionless ? void 0 : { opacity: 1, y: 0 },
|
|
46
|
+
viewport: { once: true, amount: 0.35 },
|
|
47
|
+
transition: { ...transition, delay },
|
|
48
|
+
...rest,
|
|
49
|
+
children: [
|
|
50
|
+
!isLast ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
51
|
+
framerMotion.motion.span,
|
|
52
|
+
{
|
|
53
|
+
"aria-hidden": "true",
|
|
54
|
+
"data-slot": "timeline-connector",
|
|
55
|
+
className: chunkZ4KHAD6Y_js.timelineConnectorVariants({ size }),
|
|
56
|
+
style: { originY: 0 },
|
|
57
|
+
initial: motionless ? false : { scaleY: 0, x: "-50%" },
|
|
58
|
+
whileInView: motionless ? void 0 : { scaleY: 1, x: "-50%" },
|
|
59
|
+
viewport: { once: true, amount: 0.35 },
|
|
60
|
+
transition: { ...transition, delay: delay + 0.12 }
|
|
61
|
+
}
|
|
62
|
+
) : null,
|
|
63
|
+
children
|
|
64
|
+
]
|
|
65
|
+
}
|
|
66
|
+
) });
|
|
67
|
+
}
|
|
68
|
+
TimelineItem.displayName = "TimelineItem";
|
|
69
|
+
|
|
70
|
+
Object.defineProperty(exports, "Timeline", {
|
|
71
|
+
enumerable: true,
|
|
72
|
+
get: function () { return chunkZ4KHAD6Y_js.Timeline; }
|
|
73
|
+
});
|
|
74
|
+
Object.defineProperty(exports, "TimelineContent", {
|
|
75
|
+
enumerable: true,
|
|
76
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineContent; }
|
|
77
|
+
});
|
|
78
|
+
Object.defineProperty(exports, "TimelineDescription", {
|
|
79
|
+
enumerable: true,
|
|
80
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineDescription; }
|
|
81
|
+
});
|
|
82
|
+
Object.defineProperty(exports, "TimelineIndicator", {
|
|
83
|
+
enumerable: true,
|
|
84
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineIndicator; }
|
|
85
|
+
});
|
|
86
|
+
Object.defineProperty(exports, "TimelineTitle", {
|
|
87
|
+
enumerable: true,
|
|
88
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineTitle; }
|
|
89
|
+
});
|
|
90
|
+
exports.TIMELINE_DEFAULT_STAGGER = TIMELINE_DEFAULT_STAGGER;
|
|
91
|
+
exports.TimelineItem = TimelineItem;
|
|
92
|
+
exports.timelineItemTransitionPresets = timelineItemTransitionPresets;
|
|
93
|
+
//# sourceMappingURL=animated.js.map
|
|
94
|
+
//# sourceMappingURL=animated.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/ui/timeline/animated/animations.ts","../../../src/ui/timeline/animated/timeline-item-animated.tsx"],"names":["useTimelineContext","useTimelineIndex","useMemo","useReducedMotion","jsx","TimelineItemContext","jsxs","motion","cn","timelineItemVariants","timelineConnectorVariants"],"mappings":"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","file":"animated.js","sourcesContent":["import type { Transition } from \"framer-motion\";\n\n/** Entrance presets for animated timeline items (fade + slide, connector draw). */\nexport type TimelineTransition = \"none\" | \"default\" | \"smooth\" | \"slow\";\n\nexport type TimelineTransitionPresets = Record<TimelineTransition, Transition>;\n\nexport const timelineItemTransitionPresets: TimelineTransitionPresets = {\n none: { duration: 0 },\n default: { duration: 0.4, ease: [0.22, 1, 0.36, 1] },\n smooth: { duration: 0.55, ease: [0.22, 1, 0.36, 1] },\n slow: { duration: 0.8, ease: [0.4, 0, 0.2, 1] },\n};\n\n/** Default per-item entrance delay multiplier (seconds) for staggered reveals. */\nexport const TIMELINE_DEFAULT_STAGGER = 0.08;\n","\"use client\";\n\nimport { useMemo } from \"react\";\nimport { motion, useReducedMotion } from \"framer-motion\";\n\nimport { cn } from \"../../../lib/utils\";\n\nimport {\n TimelineItemContext,\n useTimelineContext,\n useTimelineIndex,\n} from \"../timeline-base\";\nimport type { TimelineItemCtx } from \"../types\";\nimport {\n timelineConnectorVariants,\n timelineItemVariants,\n} from \"../variants\";\nimport {\n TIMELINE_DEFAULT_STAGGER,\n timelineItemTransitionPresets,\n} from \"./animations\";\nimport type { TimelineItemAnimatedProps } from \"./types\";\n\nexport function TimelineItem({\n className,\n children,\n transitionVariant = \"default\",\n stagger = TIMELINE_DEFAULT_STAGGER,\n ref,\n ...rest\n}: TimelineItemAnimatedProps & { ref?: React.Ref<HTMLLIElement> }) {\n const { size, total } = useTimelineContext(\"TimelineItem\");\n const index = useTimelineIndex(\"TimelineItem\");\n const isLast = index === total - 1;\n const itemCtx = useMemo<TimelineItemCtx>(\n () => ({ index, isLast }),\n [index, isLast],\n );\n\n const reducedMotion = useReducedMotion();\n const motionless = transitionVariant === \"none\" || Boolean(reducedMotion);\n const transition = timelineItemTransitionPresets[transitionVariant];\n const delay = index * stagger;\n\n return (\n <TimelineItemContext.Provider value={itemCtx}>\n <motion.li\n ref={ref}\n data-slot=\"timeline-item\"\n data-last={isLast ? \"\" : undefined}\n className={cn(timelineItemVariants(), className)}\n initial={motionless ? false : { opacity: 0, y: 12 }}\n whileInView={motionless ? undefined : { opacity: 1, y: 0 }}\n viewport={{ once: true, amount: 0.35 }}\n transition={{ ...transition, delay }}\n {...rest}\n >\n {!isLast ? (\n <motion.span\n aria-hidden=\"true\"\n data-slot=\"timeline-connector\"\n className={timelineConnectorVariants({ size })}\n style={{ originY: 0 }}\n initial={motionless ? false : { scaleY: 0, x: \"-50%\" }}\n whileInView={motionless ? undefined : { scaleY: 1, x: \"-50%\" }}\n viewport={{ once: true, amount: 0.35 }}\n transition={{ ...transition, delay: delay + 0.12 }}\n />\n ) : null}\n {children}\n </motion.li>\n </TimelineItemContext.Provider>\n );\n}\n\nTimelineItem.displayName = \"TimelineItem\";\n"]}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { useTimelineContext, useTimelineIndex, TimelineItemContext, timelineConnectorVariants, timelineItemVariants } from '../../chunk-V5JTDRV5.mjs';
|
|
3
|
+
export { Timeline, TimelineContent, TimelineDescription, TimelineIndicator, TimelineTitle } from '../../chunk-V5JTDRV5.mjs';
|
|
4
|
+
import { cn } from '../../chunk-4D54YOL6.mjs';
|
|
5
|
+
import { useMemo } from 'react';
|
|
6
|
+
import { useReducedMotion, motion } from 'framer-motion';
|
|
7
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
8
|
+
|
|
9
|
+
// src/ui/timeline/animated/animations.ts
|
|
10
|
+
var timelineItemTransitionPresets = {
|
|
11
|
+
none: { duration: 0 },
|
|
12
|
+
default: { duration: 0.4, ease: [0.22, 1, 0.36, 1] },
|
|
13
|
+
smooth: { duration: 0.55, ease: [0.22, 1, 0.36, 1] },
|
|
14
|
+
slow: { duration: 0.8, ease: [0.4, 0, 0.2, 1] }
|
|
15
|
+
};
|
|
16
|
+
var TIMELINE_DEFAULT_STAGGER = 0.08;
|
|
17
|
+
function TimelineItem({
|
|
18
|
+
className,
|
|
19
|
+
children,
|
|
20
|
+
transitionVariant = "default",
|
|
21
|
+
stagger = TIMELINE_DEFAULT_STAGGER,
|
|
22
|
+
ref,
|
|
23
|
+
...rest
|
|
24
|
+
}) {
|
|
25
|
+
const { size, total } = useTimelineContext("TimelineItem");
|
|
26
|
+
const index = useTimelineIndex("TimelineItem");
|
|
27
|
+
const isLast = index === total - 1;
|
|
28
|
+
const itemCtx = useMemo(
|
|
29
|
+
() => ({ index, isLast }),
|
|
30
|
+
[index, isLast]
|
|
31
|
+
);
|
|
32
|
+
const reducedMotion = useReducedMotion();
|
|
33
|
+
const motionless = transitionVariant === "none" || Boolean(reducedMotion);
|
|
34
|
+
const transition = timelineItemTransitionPresets[transitionVariant];
|
|
35
|
+
const delay = index * stagger;
|
|
36
|
+
return /* @__PURE__ */ jsx(TimelineItemContext.Provider, { value: itemCtx, children: /* @__PURE__ */ jsxs(
|
|
37
|
+
motion.li,
|
|
38
|
+
{
|
|
39
|
+
ref,
|
|
40
|
+
"data-slot": "timeline-item",
|
|
41
|
+
"data-last": isLast ? "" : void 0,
|
|
42
|
+
className: cn(timelineItemVariants(), className),
|
|
43
|
+
initial: motionless ? false : { opacity: 0, y: 12 },
|
|
44
|
+
whileInView: motionless ? void 0 : { opacity: 1, y: 0 },
|
|
45
|
+
viewport: { once: true, amount: 0.35 },
|
|
46
|
+
transition: { ...transition, delay },
|
|
47
|
+
...rest,
|
|
48
|
+
children: [
|
|
49
|
+
!isLast ? /* @__PURE__ */ jsx(
|
|
50
|
+
motion.span,
|
|
51
|
+
{
|
|
52
|
+
"aria-hidden": "true",
|
|
53
|
+
"data-slot": "timeline-connector",
|
|
54
|
+
className: timelineConnectorVariants({ size }),
|
|
55
|
+
style: { originY: 0 },
|
|
56
|
+
initial: motionless ? false : { scaleY: 0, x: "-50%" },
|
|
57
|
+
whileInView: motionless ? void 0 : { scaleY: 1, x: "-50%" },
|
|
58
|
+
viewport: { once: true, amount: 0.35 },
|
|
59
|
+
transition: { ...transition, delay: delay + 0.12 }
|
|
60
|
+
}
|
|
61
|
+
) : null,
|
|
62
|
+
children
|
|
63
|
+
]
|
|
64
|
+
}
|
|
65
|
+
) });
|
|
66
|
+
}
|
|
67
|
+
TimelineItem.displayName = "TimelineItem";
|
|
68
|
+
|
|
69
|
+
export { TIMELINE_DEFAULT_STAGGER, TimelineItem, timelineItemTransitionPresets };
|
|
70
|
+
//# sourceMappingURL=animated.mjs.map
|
|
71
|
+
//# sourceMappingURL=animated.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/ui/timeline/animated/animations.ts","../../../src/ui/timeline/animated/timeline-item-animated.tsx"],"names":[],"mappings":"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","file":"animated.mjs","sourcesContent":["import type { Transition } from \"framer-motion\";\n\n/** Entrance presets for animated timeline items (fade + slide, connector draw). */\nexport type TimelineTransition = \"none\" | \"default\" | \"smooth\" | \"slow\";\n\nexport type TimelineTransitionPresets = Record<TimelineTransition, Transition>;\n\nexport const timelineItemTransitionPresets: TimelineTransitionPresets = {\n none: { duration: 0 },\n default: { duration: 0.4, ease: [0.22, 1, 0.36, 1] },\n smooth: { duration: 0.55, ease: [0.22, 1, 0.36, 1] },\n slow: { duration: 0.8, ease: [0.4, 0, 0.2, 1] },\n};\n\n/** Default per-item entrance delay multiplier (seconds) for staggered reveals. */\nexport const TIMELINE_DEFAULT_STAGGER = 0.08;\n","\"use client\";\n\nimport { useMemo } from \"react\";\nimport { motion, useReducedMotion } from \"framer-motion\";\n\nimport { cn } from \"../../../lib/utils\";\n\nimport {\n TimelineItemContext,\n useTimelineContext,\n useTimelineIndex,\n} from \"../timeline-base\";\nimport type { TimelineItemCtx } from \"../types\";\nimport {\n timelineConnectorVariants,\n timelineItemVariants,\n} from \"../variants\";\nimport {\n TIMELINE_DEFAULT_STAGGER,\n timelineItemTransitionPresets,\n} from \"./animations\";\nimport type { TimelineItemAnimatedProps } from \"./types\";\n\nexport function TimelineItem({\n className,\n children,\n transitionVariant = \"default\",\n stagger = TIMELINE_DEFAULT_STAGGER,\n ref,\n ...rest\n}: TimelineItemAnimatedProps & { ref?: React.Ref<HTMLLIElement> }) {\n const { size, total } = useTimelineContext(\"TimelineItem\");\n const index = useTimelineIndex(\"TimelineItem\");\n const isLast = index === total - 1;\n const itemCtx = useMemo<TimelineItemCtx>(\n () => ({ index, isLast }),\n [index, isLast],\n );\n\n const reducedMotion = useReducedMotion();\n const motionless = transitionVariant === \"none\" || Boolean(reducedMotion);\n const transition = timelineItemTransitionPresets[transitionVariant];\n const delay = index * stagger;\n\n return (\n <TimelineItemContext.Provider value={itemCtx}>\n <motion.li\n ref={ref}\n data-slot=\"timeline-item\"\n data-last={isLast ? \"\" : undefined}\n className={cn(timelineItemVariants(), className)}\n initial={motionless ? false : { opacity: 0, y: 12 }}\n whileInView={motionless ? undefined : { opacity: 1, y: 0 }}\n viewport={{ once: true, amount: 0.35 }}\n transition={{ ...transition, delay }}\n {...rest}\n >\n {!isLast ? (\n <motion.span\n aria-hidden=\"true\"\n data-slot=\"timeline-connector\"\n className={timelineConnectorVariants({ size })}\n style={{ originY: 0 }}\n initial={motionless ? false : { scaleY: 0, x: \"-50%\" }}\n whileInView={motionless ? undefined : { scaleY: 1, x: \"-50%\" }}\n viewport={{ once: true, amount: 0.35 }}\n transition={{ ...transition, delay: delay + 0.12 }}\n />\n ) : null}\n {children}\n </motion.li>\n </TimelineItemContext.Provider>\n );\n}\n\nTimelineItem.displayName = \"TimelineItem\";\n"]}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { Timeline, TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, TimelineTitle, } from "./timeline";
|
|
2
|
+
export type { TimelineAppearance, TimelineContentProps, TimelineDescriptionProps, TimelineIndicatorProps, TimelineItemProps, TimelineProps, TimelineSize, TimelineTitleProps, TimelineTransition, } from "./types";
|
|
3
|
+
export { timelineConnectorVariants, timelineContentVariants, timelineDescriptionVariants, timelineIndicatorVariants, timelineItemVariants, timelineTitleVariants, timelineVariants, } from "./variants";
|
|
4
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/timeline/index.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,QAAQ,EACR,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,YAAY,EACZ,aAAa,GACd,MAAM,YAAY,CAAC;AACpB,YAAY,EACV,kBAAkB,EAClB,oBAAoB,EACpB,wBAAwB,EACxB,sBAAsB,EACtB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,yBAAyB,EACzB,uBAAuB,EACvB,2BAA2B,EAC3B,yBAAyB,EACzB,oBAAoB,EACpB,qBAAqB,EACrB,gBAAgB,GACjB,MAAM,YAAY,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import type { TimelineContentProps, TimelineCtx, TimelineDescriptionProps, TimelineIndicatorProps, TimelineItemCtx, TimelineItemProps, TimelineProps, TimelineTitleProps } from "./types";
|
|
2
|
+
export declare const TimelineItemContext: import("react").Context<TimelineItemCtx | null>;
|
|
3
|
+
export declare function useTimelineContext(component: string): TimelineCtx;
|
|
4
|
+
export declare function useTimelineIndex(component: string): number;
|
|
5
|
+
export declare function Timeline({ appearance, size, className, children, ref, ...rest }: TimelineProps): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare namespace Timeline {
|
|
7
|
+
var displayName: string;
|
|
8
|
+
}
|
|
9
|
+
export declare function TimelineItem({ className, children, ref, ...rest }: TimelineItemProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare namespace TimelineItem {
|
|
11
|
+
var displayName: string;
|
|
12
|
+
}
|
|
13
|
+
export declare function TimelineIndicator({ className, appearance, children, ref, ...rest }: TimelineIndicatorProps & {
|
|
14
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
15
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare namespace TimelineIndicator {
|
|
17
|
+
var displayName: string;
|
|
18
|
+
}
|
|
19
|
+
export declare function TimelineContent({ className, children, ref, ...rest }: TimelineContentProps & {
|
|
20
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
21
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
22
|
+
export declare namespace TimelineContent {
|
|
23
|
+
var displayName: string;
|
|
24
|
+
}
|
|
25
|
+
export declare function TimelineTitle({ className, ref, ...rest }: TimelineTitleProps & {
|
|
26
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
27
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
28
|
+
export declare namespace TimelineTitle {
|
|
29
|
+
var displayName: string;
|
|
30
|
+
}
|
|
31
|
+
export declare function TimelineDescription({ className, ref, ...rest }: TimelineDescriptionProps & {
|
|
32
|
+
ref?: React.Ref<HTMLParagraphElement>;
|
|
33
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
34
|
+
export declare namespace TimelineDescription {
|
|
35
|
+
var displayName: string;
|
|
36
|
+
}
|
|
37
|
+
//# sourceMappingURL=timeline-base.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline-base.d.ts","sourceRoot":"","sources":["../../../src/ui/timeline/timeline-base.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EACV,oBAAoB,EACpB,WAAW,EACX,wBAAwB,EACxB,sBAAsB,EACtB,eAAe,EACf,iBAAiB,EACjB,aAAa,EAEb,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAejB,eAAO,MAAM,mBAAmB,iDAA8C,CAAC;AAE/E,wBAAgB,kBAAkB,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,CAMjE;AAED,wBAAgB,gBAAgB,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAM1D;AAUD,wBAAgB,QAAQ,CAAC,EACvB,UAAsB,EACtB,IAAW,EACX,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,2CA8Bf;yBArCe,QAAQ;;;AAyCxB,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,iBAAiB,2CA6BnB;yBAlCe,YAAY;;;AAsC5B,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,sBAAsB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;CAAE,2CAmB9D;yBAzBe,iBAAiB;;;AA6BjC,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,QAAQ,EACR,GAAG,EACH,GAAG,IAAI,EACR,EAAE,oBAAoB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;CAAE,2CAiB5D;yBAtBe,eAAe;;;AA0B/B,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,kBAAkB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;CAAE,2CAU1D;yBAde,aAAa;;;AAkB7B,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,GAAG,EACH,GAAG,IAAI,EACR,EAAE,wBAAwB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,oBAAoB,CAAC,CAAA;CAAE,2CAUtE;yBAde,mBAAmB"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, TimelineTitle } from "./timeline-base";
|
|
2
|
+
import type { TimelineProps } from "./types";
|
|
3
|
+
export declare function Timeline(props: TimelineProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export declare namespace Timeline {
|
|
5
|
+
var displayName: string;
|
|
6
|
+
}
|
|
7
|
+
export { TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, TimelineTitle, };
|
|
8
|
+
//# sourceMappingURL=timeline.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline.d.ts","sourceRoot":"","sources":["../../../src/ui/timeline/timeline.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACd,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,2CAE5C;yBAFe,QAAQ;;;AAMxB,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,iBAAiB,EACjB,YAAY,EACZ,aAAa,GACd,CAAC"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import type { VariantProps } from "class-variance-authority";
|
|
2
|
+
import type { ComponentPropsWithRef, ComponentPropsWithoutRef, ReactNode } from "react";
|
|
3
|
+
import type { TimelineTransition } from "./animated/animations";
|
|
4
|
+
import type { timelineIndicatorVariants, timelineVariants } from "./variants";
|
|
5
|
+
export type { TimelineTransition };
|
|
6
|
+
type TimelineVariantProps = VariantProps<typeof timelineVariants>;
|
|
7
|
+
export type TimelineAppearance = NonNullable<VariantProps<typeof timelineIndicatorVariants>["appearance"]>;
|
|
8
|
+
export type TimelineSize = NonNullable<VariantProps<typeof timelineIndicatorVariants>["size"]>;
|
|
9
|
+
export type TimelineProps = TimelineVariantProps & {
|
|
10
|
+
/** Default indicator appearance applied to every item (overridable per indicator). */
|
|
11
|
+
appearance?: TimelineAppearance;
|
|
12
|
+
/** Controls indicator size, content spacing, and text scale. */
|
|
13
|
+
size?: TimelineSize;
|
|
14
|
+
children?: ReactNode;
|
|
15
|
+
} & Omit<ComponentPropsWithRef<"ol">, "children">;
|
|
16
|
+
export type TimelineItemProps = ComponentPropsWithRef<"li"> & {
|
|
17
|
+
children?: ReactNode;
|
|
18
|
+
};
|
|
19
|
+
export type TimelineIndicatorProps = ComponentPropsWithoutRef<"div"> & {
|
|
20
|
+
/** Override the appearance inherited from the Timeline root. */
|
|
21
|
+
appearance?: TimelineAppearance;
|
|
22
|
+
children?: ReactNode;
|
|
23
|
+
};
|
|
24
|
+
export type TimelineContentProps = ComponentPropsWithoutRef<"div"> & {
|
|
25
|
+
children?: ReactNode;
|
|
26
|
+
};
|
|
27
|
+
export type TimelineTitleProps = ComponentPropsWithoutRef<"div">;
|
|
28
|
+
export type TimelineDescriptionProps = ComponentPropsWithoutRef<"p">;
|
|
29
|
+
export type TimelineCtx = {
|
|
30
|
+
appearance: TimelineAppearance;
|
|
31
|
+
size: TimelineSize;
|
|
32
|
+
total: number;
|
|
33
|
+
};
|
|
34
|
+
export type TimelineItemCtx = {
|
|
35
|
+
index: number;
|
|
36
|
+
isLast: boolean;
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/ui/timeline/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,EACV,qBAAqB,EACrB,wBAAwB,EACxB,SAAS,EACV,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,KAAK,EACV,yBAAyB,EACzB,gBAAgB,EACjB,MAAM,YAAY,CAAC;AAEpB,YAAY,EAAE,kBAAkB,EAAE,CAAC;AAEnC,KAAK,oBAAoB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAElE,MAAM,MAAM,kBAAkB,GAAG,WAAW,CAC1C,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC,YAAY,CAAC,CAC7D,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,WAAW,CACpC,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC,MAAM,CAAC,CACvD,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,oBAAoB,GAAG;IACjD,sFAAsF;IACtF,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,gEAAgE;IAChE,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC;AAElD,MAAM,MAAM,iBAAiB,GAAG,qBAAqB,CAAC,IAAI,CAAC,GAAG;IAC5D,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IACrE,gEAAgE;IAChE,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAEjE,MAAM,MAAM,wBAAwB,GAAG,wBAAwB,CAAC,GAAG,CAAC,CAAC;AAErE,MAAM,MAAM,WAAW,GAAG;IACxB,UAAU,EAAE,kBAAkB,CAAC;IAC/B,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;CACjB,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export declare const timelineVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const timelineItemVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
3
|
+
export declare const timelineConnectorVariants: (props?: ({
|
|
4
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
export declare const timelineIndicatorVariants: (props?: ({
|
|
7
|
+
appearance?: "default" | "sky" | "emerald" | "violet" | "rose" | "gray" | "indigo" | "orange" | "pink" | "purple" | "teal" | "yellow" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | null | undefined;
|
|
8
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
9
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
|
+
export declare const timelineContentVariants: (props?: ({
|
|
11
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
12
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
13
|
+
export declare const timelineTitleVariants: (props?: ({
|
|
14
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
15
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
16
|
+
export declare const timelineDescriptionVariants: (props?: ({
|
|
17
|
+
size?: "md" | "sm" | "lg" | null | undefined;
|
|
18
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
19
|
+
//# sourceMappingURL=variants.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../src/ui/timeline/variants.ts"],"names":[],"mappings":"AAkBA,eAAO,MAAM,gBAAgB,oFAAuB,CAAC;AAErD,eAAO,MAAM,oBAAoB,oFAA2B,CAAC;AAE7D,eAAO,MAAM,yBAAyB;;8EAKpC,CAAC;AAEH,eAAO,MAAM,yBAAyB;;;8EASpC,CAAC;AAEH,eAAO,MAAM,uBAAuB;;8EAKlC,CAAC;AAEH,eAAO,MAAM,qBAAqB;;8EAKhC,CAAC;AAEH,eAAO,MAAM,2BAA2B;;8EAKtC,CAAC"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var chunkZ4KHAD6Y_js = require('../chunk-Z4KHAD6Y.js');
|
|
5
|
+
require('../chunk-ZS5756ZC.js');
|
|
6
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
|
|
8
|
+
function Timeline2(props) {
|
|
9
|
+
return /* @__PURE__ */ jsxRuntime.jsx(chunkZ4KHAD6Y_js.Timeline, { ...props });
|
|
10
|
+
}
|
|
11
|
+
Timeline2.displayName = "Timeline";
|
|
12
|
+
|
|
13
|
+
Object.defineProperty(exports, "TimelineContent", {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineContent; }
|
|
16
|
+
});
|
|
17
|
+
Object.defineProperty(exports, "TimelineDescription", {
|
|
18
|
+
enumerable: true,
|
|
19
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineDescription; }
|
|
20
|
+
});
|
|
21
|
+
Object.defineProperty(exports, "TimelineIndicator", {
|
|
22
|
+
enumerable: true,
|
|
23
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineIndicator; }
|
|
24
|
+
});
|
|
25
|
+
Object.defineProperty(exports, "TimelineItem", {
|
|
26
|
+
enumerable: true,
|
|
27
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineItem; }
|
|
28
|
+
});
|
|
29
|
+
Object.defineProperty(exports, "TimelineTitle", {
|
|
30
|
+
enumerable: true,
|
|
31
|
+
get: function () { return chunkZ4KHAD6Y_js.TimelineTitle; }
|
|
32
|
+
});
|
|
33
|
+
Object.defineProperty(exports, "timelineConnectorVariants", {
|
|
34
|
+
enumerable: true,
|
|
35
|
+
get: function () { return chunkZ4KHAD6Y_js.timelineConnectorVariants; }
|
|
36
|
+
});
|
|
37
|
+
Object.defineProperty(exports, "timelineContentVariants", {
|
|
38
|
+
enumerable: true,
|
|
39
|
+
get: function () { return chunkZ4KHAD6Y_js.timelineContentVariants; }
|
|
40
|
+
});
|
|
41
|
+
Object.defineProperty(exports, "timelineDescriptionVariants", {
|
|
42
|
+
enumerable: true,
|
|
43
|
+
get: function () { return chunkZ4KHAD6Y_js.timelineDescriptionVariants; }
|
|
44
|
+
});
|
|
45
|
+
Object.defineProperty(exports, "timelineIndicatorVariants", {
|
|
46
|
+
enumerable: true,
|
|
47
|
+
get: function () { return chunkZ4KHAD6Y_js.timelineIndicatorVariants; }
|
|
48
|
+
});
|
|
49
|
+
Object.defineProperty(exports, "timelineItemVariants", {
|
|
50
|
+
enumerable: true,
|
|
51
|
+
get: function () { return chunkZ4KHAD6Y_js.timelineItemVariants; }
|
|
52
|
+
});
|
|
53
|
+
Object.defineProperty(exports, "timelineTitleVariants", {
|
|
54
|
+
enumerable: true,
|
|
55
|
+
get: function () { return chunkZ4KHAD6Y_js.timelineTitleVariants; }
|
|
56
|
+
});
|
|
57
|
+
Object.defineProperty(exports, "timelineVariants", {
|
|
58
|
+
enumerable: true,
|
|
59
|
+
get: function () { return chunkZ4KHAD6Y_js.timelineVariants; }
|
|
60
|
+
});
|
|
61
|
+
exports.Timeline = Timeline2;
|
|
62
|
+
//# sourceMappingURL=timeline.js.map
|
|
63
|
+
//# sourceMappingURL=timeline.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/ui/timeline/timeline.tsx"],"names":["Timeline","jsx"],"mappings":";;;;;;AAWO,SAASA,UAAS,KAAA,EAAsB;AAC7C,EAAA,uBAAOC,cAAA,CAACD,yBAAA,EAAA,EAAc,GAAG,KAAA,EAAO,CAAA;AAClC;AAEAA,SAAAA,CAAS,WAAA,GAAc,UAAA","file":"timeline.js","sourcesContent":["// timeline.tsx — default static entry (no framer-motion)\nimport {\n Timeline as TimelineBase,\n TimelineContent,\n TimelineDescription,\n TimelineIndicator,\n TimelineItem,\n TimelineTitle,\n} from \"./timeline-base\";\nimport type { TimelineProps } from \"./types\";\n\nexport function Timeline(props: TimelineProps) {\n return <TimelineBase {...props} />;\n}\n\nTimeline.displayName = \"Timeline\";\n\nexport {\n TimelineContent,\n TimelineDescription,\n TimelineIndicator,\n TimelineItem,\n TimelineTitle,\n};\n"]}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { Timeline } from '../chunk-V5JTDRV5.mjs';
|
|
3
|
+
export { TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, TimelineTitle, timelineConnectorVariants, timelineContentVariants, timelineDescriptionVariants, timelineIndicatorVariants, timelineItemVariants, timelineTitleVariants, timelineVariants } from '../chunk-V5JTDRV5.mjs';
|
|
4
|
+
import '../chunk-4D54YOL6.mjs';
|
|
5
|
+
import { jsx } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
function Timeline2(props) {
|
|
8
|
+
return /* @__PURE__ */ jsx(Timeline, { ...props });
|
|
9
|
+
}
|
|
10
|
+
Timeline2.displayName = "Timeline";
|
|
11
|
+
|
|
12
|
+
export { Timeline2 as Timeline };
|
|
13
|
+
//# sourceMappingURL=timeline.mjs.map
|
|
14
|
+
//# sourceMappingURL=timeline.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/ui/timeline/timeline.tsx"],"names":["Timeline"],"mappings":";;;;;AAWO,SAASA,UAAS,KAAA,EAAsB;AAC7C,EAAA,uBAAO,GAAA,CAAC,QAAA,EAAA,EAAc,GAAG,KAAA,EAAO,CAAA;AAClC;AAEAA,SAAAA,CAAS,WAAA,GAAc,UAAA","file":"timeline.mjs","sourcesContent":["// timeline.tsx — default static entry (no framer-motion)\nimport {\n Timeline as TimelineBase,\n TimelineContent,\n TimelineDescription,\n TimelineIndicator,\n TimelineItem,\n TimelineTitle,\n} from \"./timeline-base\";\nimport type { TimelineProps } from \"./types\";\n\nexport function Timeline(props: TimelineProps) {\n return <TimelineBase {...props} />;\n}\n\nTimeline.displayName = \"Timeline\";\n\nexport {\n TimelineContent,\n TimelineDescription,\n TimelineIndicator,\n TimelineItem,\n TimelineTitle,\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zentauri-ui/zentauri-components",
|
|
3
|
-
"version": "1.7.
|
|
3
|
+
"version": "1.7.6",
|
|
4
4
|
"description": "React + Tailwind UI kit with charts, ESM/CJS builds, per-entry exports, and a zentauri-components / zentauri-ui CLI to vendor UI or hook source into your app",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"files": [
|