@zentauri-ui/zentauri-components 2.3.1 → 2.3.2
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 +7 -5
- package/cli/props.json +664 -0
- package/cli/registry.json +12 -0
- package/dist/chunk-2RBBXVFA.js +19 -0
- package/dist/{chunk-MY3DQVNF.js.map → chunk-2RBBXVFA.js.map} +1 -1
- package/dist/{chunk-VMVG2RVZ.mjs → chunk-425DAZTS.mjs} +4 -4
- package/dist/{chunk-VMVG2RVZ.mjs.map → chunk-425DAZTS.mjs.map} +1 -1
- package/dist/{chunk-RBNZNWYQ.js → chunk-6GP74P4F.js} +6 -6
- package/dist/{chunk-RBNZNWYQ.js.map → chunk-6GP74P4F.js.map} +1 -1
- package/dist/chunk-DUKHIN2W.js +44 -0
- package/dist/chunk-DUKHIN2W.js.map +1 -0
- package/dist/chunk-HJ7EFBED.js +86 -0
- package/dist/chunk-HJ7EFBED.js.map +1 -0
- package/dist/chunk-K2VCZK4I.mjs +75 -0
- package/dist/chunk-K2VCZK4I.mjs.map +1 -0
- package/dist/{chunk-UN5RRNPV.js → chunk-KVBFWRPF.js} +12 -12
- package/dist/{chunk-UN5RRNPV.js.map → chunk-KVBFWRPF.js.map} +1 -1
- package/dist/chunk-N4MLFU2Q.mjs +69 -0
- package/dist/chunk-N4MLFU2Q.mjs.map +1 -0
- package/dist/{chunk-K7UU3K54.js → chunk-NZQA4M35.js} +24 -4
- package/dist/chunk-NZQA4M35.js.map +1 -0
- package/dist/chunk-OME7XOPN.js +78 -0
- package/dist/chunk-OME7XOPN.js.map +1 -0
- package/dist/chunk-PVDWJUMF.mjs +34 -0
- package/dist/chunk-PVDWJUMF.mjs.map +1 -0
- package/dist/{chunk-TTKTPERV.mjs → chunk-R2JXARKB.mjs} +3 -3
- package/dist/{chunk-TTKTPERV.mjs.map → chunk-R2JXARKB.mjs.map} +1 -1
- package/dist/chunk-SD7YXMNV.js +40 -0
- package/dist/chunk-SD7YXMNV.js.map +1 -0
- package/dist/{chunk-PJATBFEK.mjs → chunk-TZTUL6C4.mjs} +24 -4
- package/dist/chunk-TZTUL6C4.mjs.map +1 -0
- package/dist/chunk-V5EE5ATH.mjs +36 -0
- package/dist/chunk-V5EE5ATH.mjs.map +1 -0
- package/dist/{chunk-STWXN5EM.mjs → chunk-YDD5HQGX.mjs} +3 -3
- package/dist/{chunk-STWXN5EM.mjs.map → chunk-YDD5HQGX.mjs.map} +1 -1
- package/dist/design-system/facade.js +6 -4
- package/dist/design-system/facade.js.map +1 -1
- package/dist/design-system/facade.mjs +5 -3
- package/dist/design-system/facade.mjs.map +1 -1
- package/dist/design-system/index.d.ts +2 -0
- package/dist/design-system/index.d.ts.map +1 -1
- package/dist/design-system/speech-recognition.d.ts +39 -0
- package/dist/design-system/speech-recognition.d.ts.map +1 -0
- package/dist/design-system/speech-synthesizer.d.ts +41 -0
- package/dist/design-system/speech-synthesizer.d.ts.map +1 -0
- package/dist/ui/buttons/animated.js +8 -6
- package/dist/ui/buttons/animated.js.map +1 -1
- package/dist/ui/buttons/animated.mjs +6 -4
- package/dist/ui/buttons/animated.mjs.map +1 -1
- package/dist/ui/buttons.js +9 -7
- package/dist/ui/buttons.mjs +7 -5
- package/dist/ui/data-table.js +19 -17
- package/dist/ui/data-table.js.map +1 -1
- package/dist/ui/data-table.mjs +9 -7
- package/dist/ui/data-table.mjs.map +1 -1
- package/dist/ui/dynamic-stepper.js +18 -16
- package/dist/ui/dynamic-stepper.js.map +1 -1
- package/dist/ui/dynamic-stepper.mjs +7 -5
- package/dist/ui/dynamic-stepper.mjs.map +1 -1
- package/dist/ui/pagination.js +10 -8
- package/dist/ui/pagination.mjs +7 -5
- package/dist/ui/speech-recognition/animated/animations.d.ts +8 -0
- package/dist/ui/speech-recognition/animated/animations.d.ts.map +1 -0
- package/dist/ui/speech-recognition/animated/index.d.ts +4 -0
- package/dist/ui/speech-recognition/animated/index.d.ts.map +1 -0
- package/dist/ui/speech-recognition/animated/speech-recognition-animated.d.ts +6 -0
- package/dist/ui/speech-recognition/animated/speech-recognition-animated.d.ts.map +1 -0
- package/dist/ui/speech-recognition/animated/types.d.ts +9 -0
- package/dist/ui/speech-recognition/animated/types.d.ts.map +1 -0
- package/dist/ui/speech-recognition/animated.js +288 -0
- package/dist/ui/speech-recognition/animated.js.map +1 -0
- package/dist/ui/speech-recognition/animated.mjs +285 -0
- package/dist/ui/speech-recognition/animated.mjs.map +1 -0
- package/dist/ui/speech-recognition/index.d.ts +4 -0
- package/dist/ui/speech-recognition/index.d.ts.map +1 -0
- package/dist/ui/speech-recognition/speech-recognition-base.d.ts +6 -0
- package/dist/ui/speech-recognition/speech-recognition-base.d.ts.map +1 -0
- package/dist/ui/speech-recognition/speech-recognition.d.ts +2 -0
- package/dist/ui/speech-recognition/speech-recognition.d.ts.map +1 -0
- package/dist/ui/speech-recognition/types.d.ts +31 -0
- package/dist/ui/speech-recognition/types.d.ts.map +1 -0
- package/dist/ui/speech-recognition/variants.d.ts +11 -0
- package/dist/ui/speech-recognition/variants.d.ts.map +1 -0
- package/dist/ui/speech-recognition.js +242 -0
- package/dist/ui/speech-recognition.js.map +1 -0
- package/dist/ui/speech-recognition.mjs +233 -0
- package/dist/ui/speech-recognition.mjs.map +1 -0
- package/dist/ui/speech-synthesizer/animated/animations.d.ts +8 -0
- package/dist/ui/speech-synthesizer/animated/animations.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/animated/index.d.ts +4 -0
- package/dist/ui/speech-synthesizer/animated/index.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/animated/speech-synthesizer-animated.d.ts +6 -0
- package/dist/ui/speech-synthesizer/animated/speech-synthesizer-animated.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/animated/types.d.ts +9 -0
- package/dist/ui/speech-synthesizer/animated/types.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/animated.js +269 -0
- package/dist/ui/speech-synthesizer/animated.js.map +1 -0
- package/dist/ui/speech-synthesizer/animated.mjs +266 -0
- package/dist/ui/speech-synthesizer/animated.mjs.map +1 -0
- package/dist/ui/speech-synthesizer/index.d.ts +4 -0
- package/dist/ui/speech-synthesizer/index.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/speech-synthesizer-base.d.ts +6 -0
- package/dist/ui/speech-synthesizer/speech-synthesizer-base.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/speech-synthesizer.d.ts +2 -0
- package/dist/ui/speech-synthesizer/speech-synthesizer.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/types.d.ts +43 -0
- package/dist/ui/speech-synthesizer/types.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer/variants.d.ts +13 -0
- package/dist/ui/speech-synthesizer/variants.d.ts.map +1 -0
- package/dist/ui/speech-synthesizer.js +220 -0
- package/dist/ui/speech-synthesizer.js.map +1 -0
- package/dist/ui/speech-synthesizer.mjs +211 -0
- package/dist/ui/speech-synthesizer.mjs.map +1 -0
- package/dist/ui/split-button.js +20 -18
- package/dist/ui/split-button.js.map +1 -1
- package/dist/ui/split-button.mjs +7 -5
- package/dist/ui/split-button.mjs.map +1 -1
- package/package.json +1 -1
- package/src/design-system/index.ts +2 -0
- package/src/design-system/speech-recognition.ts +82 -0
- package/src/design-system/speech-synthesizer.ts +90 -0
- package/src/ui/speech-recognition/animated/animations.ts +62 -0
- package/src/ui/speech-recognition/animated/index.ts +8 -0
- package/src/ui/speech-recognition/animated/speech-recognition-animated.tsx +276 -0
- package/src/ui/speech-recognition/animated/types.ts +11 -0
- package/src/ui/speech-recognition/index.ts +15 -0
- package/src/ui/speech-recognition/speech-recognition-base.tsx +276 -0
- package/src/ui/speech-recognition/speech-recognition.test.tsx +74 -0
- package/src/ui/speech-recognition/speech-recognition.tsx +1 -0
- package/src/ui/speech-recognition/types.ts +50 -0
- package/src/ui/speech-recognition/variants.ts +47 -0
- package/src/ui/speech-synthesizer/animated/animations.ts +62 -0
- package/src/ui/speech-synthesizer/animated/index.ts +8 -0
- package/src/ui/speech-synthesizer/animated/speech-synthesizer-animated.tsx +260 -0
- package/src/ui/speech-synthesizer/animated/types.ts +11 -0
- package/src/ui/speech-synthesizer/index.ts +14 -0
- package/src/ui/speech-synthesizer/speech-synthesizer-base.tsx +255 -0
- package/src/ui/speech-synthesizer/speech-synthesizer.test.tsx +87 -0
- package/src/ui/speech-synthesizer/speech-synthesizer.tsx +1 -0
- package/src/ui/speech-synthesizer/types.ts +57 -0
- package/src/ui/speech-synthesizer/variants.ts +55 -0
- package/dist/chunk-K7UU3K54.js.map +0 -1
- package/dist/chunk-MY3DQVNF.js +0 -19
- package/dist/chunk-PJATBFEK.mjs.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/ui/split-button/variants.ts","../../src/ui/split-button/split-button-base.tsx","../../src/ui/split-button/split-button.tsx"],"names":["cva","zuiSplitButtonRoot","zuiSplitButtonFullWidth","zuiSplitButtonDropdown","zuiSplitButtonGroup","zuiSplitButtonPrimary","zuiSplitButtonTrigger","zuiSplitButtonTriggerSizes","zuiSplitButtonContent","zuiSplitButtonItemDisabled","useState","useRef","useEffect","jsx","cn","jsxs","Dropdown","buttonVariants","FiLoader","DropdownTrigger","FiChevronDown","DropdownContent","DropdownItem"],"mappings":"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","file":"split-button.js","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiSplitButtonContent,\n zuiSplitButtonDropdown,\n zuiSplitButtonFullWidth,\n zuiSplitButtonGroup,\n zuiSplitButtonItemDisabled,\n zuiSplitButtonPrimary,\n zuiSplitButtonRoot,\n zuiSplitButtonTrigger,\n zuiSplitButtonTriggerSizes,\n} from \"../../design-system\";\n\nexport const splitButtonRootVariants = cva(zuiSplitButtonRoot, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonDropdownVariants = cva(zuiSplitButtonDropdown, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonGroupVariants = cva(zuiSplitButtonGroup, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonPrimaryVariants = cva(zuiSplitButtonPrimary);\nexport const splitButtonTriggerVariants = cva(zuiSplitButtonTrigger, {\n variants: {\n size: zuiSplitButtonTriggerSizes,\n },\n defaultVariants: {\n size: \"md\",\n },\n});\nexport const splitButtonContentVariants = cva(zuiSplitButtonContent);\nexport const splitButtonItemDisabledVariants = cva(zuiSplitButtonItemDisabled);\n","\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { FiChevronDown, FiLoader } from \"react-icons/fi\";\n\nimport {\n Dropdown,\n DropdownContent,\n DropdownItem,\n DropdownTrigger,\n} from \"../dropdown\";\nimport { buttonVariants } from \"../buttons\";\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n SplitButtonAppearance,\n SplitButtonProps,\n SplitButtonVariant,\n} from \"./types\";\nimport {\n splitButtonContentVariants,\n splitButtonDropdownVariants,\n splitButtonGroupVariants,\n splitButtonItemDisabledVariants,\n splitButtonPrimaryVariants,\n splitButtonRootVariants,\n splitButtonTriggerVariants,\n} from \"./variants\";\n\nconst variantAppearanceMap = {\n primary: \"default\",\n secondary: \"secondary\",\n outline: \"outline\",\n ghost: \"ghost\",\n danger: \"destructive\",\n success: \"green\",\n} as const satisfies Record<SplitButtonVariant, SplitButtonAppearance>;\n\nfunction resolveAppearance({\n appearance,\n variant,\n}: {\n appearance?: SplitButtonAppearance;\n variant?: SplitButtonVariant;\n}) {\n return appearance ?? (variant ? variantAppearanceMap[variant] : \"default\");\n}\n\nexport function SplitButtonBase({\n label,\n onClick,\n items,\n disabled = false,\n loading = false,\n appearance,\n variant,\n size = \"md\",\n startIcon,\n fullWidth = false,\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n triggerLabel,\n triggerOn = \"click\",\n className,\n ref,\n ...rest\n}: SplitButtonProps) {\n const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n const isUnavailable = disabled || loading;\n const resolvedAppearance = resolveAppearance({ appearance, variant });\n const isControlled = controlledOpen !== undefined;\n const open = isUnavailable\n ? false\n : isControlled\n ? controlledOpen\n : uncontrolledOpen;\n\n const setOpen = (nextOpen: boolean) => {\n if (isUnavailable && nextOpen) {\n return;\n }\n if (!isControlled) {\n setUncontrolledOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n };\n\n const fullWidthFlag = fullWidth ? \"true\" : undefined;\n const menuLabel = triggerLabel ?? `More ${label} actions`;\n\n // Shared timeout ref for hover mode: delays close so the cursor can\n // travel through the mt-2 gap between the button and the menu panel\n // without dismissing the menu.\n const hoverCloseRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const scheduleClose = () => {\n cancelClose();\n hoverCloseRef.current = setTimeout(() => setOpen(false), 120);\n };\n\n const cancelClose = () => {\n if (hoverCloseRef.current !== null) {\n clearTimeout(hoverCloseRef.current);\n hoverCloseRef.current = null;\n }\n };\n\n useEffect(() => cancelClose, []);\n\n useEffect(() => {\n if (isUnavailable && !isControlled) {\n setUncontrolledOpen(false);\n onOpenChange?.(false);\n }\n }, [isUnavailable, onOpenChange, isControlled]);\n\n const dropdownHoverHandlers =\n triggerOn === \"hover\"\n ? {\n onMouseEnter: () => {\n cancelClose();\n setOpen(true);\n },\n onMouseLeave: scheduleClose,\n }\n : undefined;\n\n const contentHoverHandlers =\n triggerOn === \"hover\"\n ? { onMouseEnter: cancelClose, onMouseLeave: scheduleClose }\n : undefined;\n\n return (\n <div\n ref={ref}\n data-slot=\"split-button\"\n data-full-width={fullWidthFlag}\n className={cn(splitButtonRootVariants({ fullWidth }), className)}\n {...rest}\n >\n <Dropdown\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={setOpen}\n data-full-width={fullWidthFlag}\n className={splitButtonDropdownVariants({ fullWidth })}\n {...dropdownHoverHandlers}\n >\n <div\n data-slot=\"split-button-group\"\n data-full-width={fullWidthFlag}\n className={splitButtonGroupVariants({ fullWidth })}\n >\n <button\n type=\"button\"\n data-slot=\"split-button-primary\"\n data-full-width={fullWidthFlag}\n disabled={isUnavailable}\n onClick={onClick}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonPrimaryVariants(),\n )}\n >\n {loading ? (\n <FiLoader\n aria-hidden\n className=\"animate-spin\"\n data-slot=\"split-button-spinner-icon\"\n />\n ) : (\n startIcon\n )}\n <span>{label}</span>\n {loading ? (\n <span className=\"sr-only\" role=\"status\" aria-label=\"Loading\" />\n ) : null}\n </button>\n\n <DropdownTrigger\n aria-label={menuLabel}\n disabled={isUnavailable}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonTriggerVariants({ size }),\n )}\n >\n <FiChevronDown aria-hidden />\n </DropdownTrigger>\n </div>\n\n <DropdownContent\n className={splitButtonContentVariants()}\n placement=\"bottom\"\n {...contentHoverHandlers}\n >\n {items.map((item) => (\n <DropdownItem\n key={item.id}\n leftIcon={item.icon}\n aria-disabled={item.disabled ? \"true\" : undefined}\n className={\n item.disabled ? splitButtonItemDisabledVariants() : undefined\n }\n onClick={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onKeyDown={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onSelect={() => {\n setOpen(false);\n item.onSelect?.();\n }}\n >\n {item.label}\n </DropdownItem>\n ))}\n </DropdownContent>\n </Dropdown>\n </div>\n );\n}\n\nSplitButtonBase.displayName = \"SplitButton\";\n","// split-button.tsx — default static entry (no framer-motion)\nimport { SplitButtonBase } from \"./split-button-base\";\nimport type { SplitButtonProps } from \"./types\";\n\nexport const SplitButton = (props: SplitButtonProps) => {\n return <SplitButtonBase {...props} />;\n};\n\nSplitButton.displayName = \"SplitButton\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/ui/split-button/variants.ts","../../src/ui/split-button/split-button-base.tsx","../../src/ui/split-button/split-button.tsx"],"names":["cva","zuiSplitButtonRoot","zuiSplitButtonFullWidth","zuiSplitButtonDropdown","zuiSplitButtonGroup","zuiSplitButtonPrimary","zuiSplitButtonTrigger","zuiSplitButtonTriggerSizes","zuiSplitButtonContent","zuiSplitButtonItemDisabled","useState","useRef","useEffect","jsx","cn","jsxs","Dropdown","buttonVariants","FiLoader","DropdownTrigger","FiChevronDown","DropdownContent","DropdownItem"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,IAAM,uBAAA,GAA0BA,2BAAIC,mCAAA,EAAoB;AAAA,EAC7D,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,MACT,IAAA,EAAMC;AAAA;AACR;AAEJ,CAAC;AACM,IAAM,2BAAA,GAA8BF,2BAAIG,uCAAA,EAAwB;AAAA,EACrE,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,MACT,IAAA,EAAMD;AAAA;AACR;AAEJ,CAAC;AACM,IAAM,wBAAA,GAA2BF,2BAAII,oCAAA,EAAqB;AAAA,EAC/D,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,MACT,IAAA,EAAMF;AAAA;AACR;AAEJ,CAAC;AACM,IAAM,0BAAA,GAA6BF,2BAAIK,sCAAqB;AAC5D,IAAM,0BAAA,GAA6BL,2BAAIM,sCAAA,EAAuB;AAAA,EACnE,QAAA,EAAU;AAAA,IACR,IAAA,EAAMC;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC;AACM,IAAM,0BAAA,GAA6BP,2BAAIQ,sCAAqB;AAC5D,IAAM,+BAAA,GAAkCR,2BAAIS,2CAA0B;AChB7E,IAAM,oBAAA,GAAuB;AAAA,EAC3B,OAAA,EAAS,SAAA;AAAA,EACT,SAAA,EAAW,WAAA;AAAA,EACX,OAAA,EAAS,SAAA;AAAA,EACT,KAAA,EAAO,OAAA;AAAA,EACP,MAAA,EAAQ,aAAA;AAAA,EACR,OAAA,EAAS;AACX,CAAA;AAEA,SAAS,iBAAA,CAAkB;AAAA,EACzB,UAAA;AAAA,EACA;AACF,CAAA,EAGG;AACD,EAAA,OAAO,UAAA,KAAe,OAAA,GAAU,oBAAA,CAAqB,OAAO,CAAA,GAAI,SAAA,CAAA;AAClE;AAEO,SAAS,eAAA,CAAgB;AAAA,EAC9B,KAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,OAAA,GAAU,KAAA;AAAA,EACV,UAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,SAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,IAAA,EAAM,cAAA;AAAA,EACN,WAAA,GAAc,KAAA;AAAA,EACd,YAAA;AAAA,EACA,YAAA;AAAA,EACA,SAAA,GAAY,OAAA;AAAA,EACZ,SAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAqB;AACnB,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAIC,eAAS,WAAW,CAAA;AACpE,EAAA,MAAM,gBAAgB,QAAA,IAAY,OAAA;AAClC,EAAA,MAAM,kBAAA,GAAqB,iBAAA,CAAkB,EAAE,UAAA,EAAY,SAAS,CAAA;AACpE,EAAA,MAAM,eAAe,cAAA,KAAmB,MAAA;AACxC,EAAA,MAAM,IAAA,GAAO,aAAA,GACT,KAAA,GACA,YAAA,GACE,cAAA,GACA,gBAAA;AAEN,EAAA,MAAM,OAAA,GAAU,CAAC,QAAA,KAAsB;AACrC,IAAA,IAAI,iBAAiB,QAAA,EAAU;AAC7B,MAAA;AAAA,IACF;AACA,IAAA,IAAI,CAAC,YAAA,EAAc;AACjB,MAAA,mBAAA,CAAoB,QAAQ,CAAA;AAAA,IAC9B;AACA,IAAA,YAAA,GAAe,QAAQ,CAAA;AAAA,EACzB,CAAA;AAEA,EAAA,MAAM,aAAA,GAAgB,YAAY,MAAA,GAAS,MAAA;AAC3C,EAAA,MAAM,SAAA,GAAY,YAAA,IAAgB,CAAA,KAAA,EAAQ,KAAK,CAAA,QAAA,CAAA;AAK/C,EAAA,MAAM,aAAA,GAAgBC,aAA6C,IAAI,CAAA;AAEvE,EAAA,MAAM,gBAAgB,MAAM;AAC1B,IAAA,WAAA,EAAY;AACZ,IAAA,aAAA,CAAc,UAAU,UAAA,CAAW,MAAM,OAAA,CAAQ,KAAK,GAAG,GAAG,CAAA;AAAA,EAC9D,CAAA;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,IAAI,aAAA,CAAc,YAAY,IAAA,EAAM;AAClC,MAAA,YAAA,CAAa,cAAc,OAAO,CAAA;AAClC,MAAA,aAAA,CAAc,OAAA,GAAU,IAAA;AAAA,IAC1B;AAAA,EACF,CAAA;AAEA,EAAAC,eAAA,CAAU,MAAM,WAAA,EAAa,EAAE,CAAA;AAE/B,EAAAA,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,aAAA,IAAiB,CAAC,YAAA,EAAc;AAClC,MAAA,mBAAA,CAAoB,KAAK,CAAA;AACzB,MAAA,YAAA,GAAe,KAAK,CAAA;AAAA,IACtB;AAAA,EACF,CAAA,EAAG,CAAC,aAAA,EAAe,YAAA,EAAc,YAAY,CAAC,CAAA;AAE9C,EAAA,MAAM,qBAAA,GACJ,cAAc,OAAA,GACV;AAAA,IACE,cAAc,MAAM;AAClB,MAAA,WAAA,EAAY;AACZ,MAAA,OAAA,CAAQ,IAAI,CAAA;AAAA,IACd,CAAA;AAAA,IACA,YAAA,EAAc;AAAA,GAChB,GACA,MAAA;AAEN,EAAA,MAAM,oBAAA,GACJ,cAAc,OAAA,GACV,EAAE,cAAc,WAAA,EAAa,YAAA,EAAc,eAAc,GACzD,MAAA;AAEN,EAAA,uBACEC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,cAAA;AAAA,MACV,iBAAA,EAAiB,aAAA;AAAA,MACjB,WAAWC,mBAAA,CAAG,uBAAA,CAAwB,EAAE,SAAA,EAAW,GAAG,SAAS,CAAA;AAAA,MAC9D,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAAC,eAAA;AAAA,QAACC,yBAAA;AAAA,QAAA;AAAA,UACC,IAAA;AAAA,UACA,WAAA;AAAA,UACA,YAAA,EAAc,OAAA;AAAA,UACd,iBAAA,EAAiB,aAAA;AAAA,UACjB,SAAA,EAAW,2BAAA,CAA4B,EAAE,SAAA,EAAW,CAAA;AAAA,UACnD,GAAG,qBAAA;AAAA,UAEJ,QAAA,EAAA;AAAA,4BAAAD,eAAA;AAAA,cAAC,KAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EAAU,oBAAA;AAAA,gBACV,iBAAA,EAAiB,aAAA;AAAA,gBACjB,SAAA,EAAW,wBAAA,CAAyB,EAAE,SAAA,EAAW,CAAA;AAAA,gBAEjD,QAAA,EAAA;AAAA,kCAAAA,eAAA;AAAA,oBAAC,QAAA;AAAA,oBAAA;AAAA,sBACC,IAAA,EAAK,QAAA;AAAA,sBACL,WAAA,EAAU,sBAAA;AAAA,sBACV,iBAAA,EAAiB,aAAA;AAAA,sBACjB,QAAA,EAAU,aAAA;AAAA,sBACV,OAAA;AAAA,sBACA,SAAA,EAAWD,mBAAA;AAAA,wBACTG,+BAAA,CAAe,EAAE,UAAA,EAAY,kBAAA,EAAoB,MAAM,CAAA;AAAA,wBACvD,0BAAA;AAA2B,uBAC7B;AAAA,sBAEC,QAAA,EAAA;AAAA,wBAAA,OAAA,mBACCJ,cAAA;AAAA,0BAACK,WAAA;AAAA,0BAAA;AAAA,4BACC,aAAA,EAAW,IAAA;AAAA,4BACX,SAAA,EAAU,cAAA;AAAA,4BACV,WAAA,EAAU;AAAA;AAAA,yBACZ,GAEA,SAAA;AAAA,wCAEFL,cAAA,CAAC,UAAM,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,wBACZ,OAAA,kCACE,MAAA,EAAA,EAAK,SAAA,EAAU,WAAU,IAAA,EAAK,QAAA,EAAS,YAAA,EAAW,SAAA,EAAU,CAAA,GAC3D;AAAA;AAAA;AAAA,mBACN;AAAA,kCAEAA,cAAA;AAAA,oBAACM,gCAAA;AAAA,oBAAA;AAAA,sBACC,YAAA,EAAY,SAAA;AAAA,sBACZ,QAAA,EAAU,aAAA;AAAA,sBACV,SAAA,EAAWL,mBAAA;AAAA,wBACTG,+BAAA,CAAe,EAAE,UAAA,EAAY,kBAAA,EAAoB,MAAM,CAAA;AAAA,wBACvD,0BAAA,CAA2B,EAAE,IAAA,EAAM;AAAA,uBACrC;AAAA,sBAEA,QAAA,kBAAAJ,cAAA,CAACO,gBAAA,EAAA,EAAc,aAAA,EAAW,IAAA,EAAC;AAAA;AAAA;AAC7B;AAAA;AAAA,aACF;AAAA,4BAEAP,cAAA;AAAA,cAACQ,gCAAA;AAAA,cAAA;AAAA,gBACC,WAAW,0BAAA,EAA2B;AAAA,gBACtC,SAAA,EAAU,QAAA;AAAA,gBACT,GAAG,oBAAA;AAAA,gBAEH,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,qBACVR,cAAA;AAAA,kBAACS,6BAAA;AAAA,kBAAA;AAAA,oBAEC,UAAU,IAAA,CAAK,IAAA;AAAA,oBACf,eAAA,EAAe,IAAA,CAAK,QAAA,GAAW,MAAA,GAAS,MAAA;AAAA,oBACxC,SAAA,EACE,IAAA,CAAK,QAAA,GAAW,+BAAA,EAAgC,GAAI,MAAA;AAAA,oBAEtD,OAAA,EAAS,CAAC,KAAA,KAAU;AAClB,sBAAA,IAAI,KAAK,QAAA,EAAU;AACjB,wBAAA,KAAA,CAAM,cAAA,EAAe;AACrB,wBAAA,KAAA,CAAM,eAAA,EAAgB;AAAA,sBACxB;AAAA,oBACF,CAAA;AAAA,oBACA,SAAA,EAAW,CAAC,KAAA,KAAU;AACpB,sBAAA,IAAI,KAAK,QAAA,EAAU;AACjB,wBAAA,KAAA,CAAM,cAAA,EAAe;AACrB,wBAAA,KAAA,CAAM,eAAA,EAAgB;AAAA,sBACxB;AAAA,oBACF,CAAA;AAAA,oBACA,UAAU,MAAM;AACd,sBAAA,OAAA,CAAQ,KAAK,CAAA;AACb,sBAAA,IAAA,CAAK,QAAA,IAAW;AAAA,oBAClB,CAAA;AAAA,oBAEC,QAAA,EAAA,IAAA,CAAK;AAAA,mBAAA;AAAA,kBAvBD,IAAA,CAAK;AAAA,iBAyBb;AAAA;AAAA;AACH;AAAA;AAAA;AACF;AAAA,GACF;AAEJ;AAEA,eAAA,CAAgB,WAAA,GAAc,aAAA;ACnOvB,IAAM,WAAA,GAAc,CAAC,KAAA,KAA4B;AACtD,EAAA,uBAAOT,cAAAA,CAAC,eAAA,EAAA,EAAiB,GAAG,KAAA,EAAO,CAAA;AACrC;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"split-button.js","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiSplitButtonContent,\n zuiSplitButtonDropdown,\n zuiSplitButtonFullWidth,\n zuiSplitButtonGroup,\n zuiSplitButtonItemDisabled,\n zuiSplitButtonPrimary,\n zuiSplitButtonRoot,\n zuiSplitButtonTrigger,\n zuiSplitButtonTriggerSizes,\n} from \"../../design-system\";\n\nexport const splitButtonRootVariants = cva(zuiSplitButtonRoot, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonDropdownVariants = cva(zuiSplitButtonDropdown, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonGroupVariants = cva(zuiSplitButtonGroup, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonPrimaryVariants = cva(zuiSplitButtonPrimary);\nexport const splitButtonTriggerVariants = cva(zuiSplitButtonTrigger, {\n variants: {\n size: zuiSplitButtonTriggerSizes,\n },\n defaultVariants: {\n size: \"md\",\n },\n});\nexport const splitButtonContentVariants = cva(zuiSplitButtonContent);\nexport const splitButtonItemDisabledVariants = cva(zuiSplitButtonItemDisabled);\n","\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { FiChevronDown, FiLoader } from \"react-icons/fi\";\n\nimport {\n Dropdown,\n DropdownContent,\n DropdownItem,\n DropdownTrigger,\n} from \"../dropdown\";\nimport { buttonVariants } from \"../buttons\";\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n SplitButtonAppearance,\n SplitButtonProps,\n SplitButtonVariant,\n} from \"./types\";\nimport {\n splitButtonContentVariants,\n splitButtonDropdownVariants,\n splitButtonGroupVariants,\n splitButtonItemDisabledVariants,\n splitButtonPrimaryVariants,\n splitButtonRootVariants,\n splitButtonTriggerVariants,\n} from \"./variants\";\n\nconst variantAppearanceMap = {\n primary: \"default\",\n secondary: \"secondary\",\n outline: \"outline\",\n ghost: \"ghost\",\n danger: \"destructive\",\n success: \"green\",\n} as const satisfies Record<SplitButtonVariant, SplitButtonAppearance>;\n\nfunction resolveAppearance({\n appearance,\n variant,\n}: {\n appearance?: SplitButtonAppearance;\n variant?: SplitButtonVariant;\n}) {\n return appearance ?? (variant ? variantAppearanceMap[variant] : \"default\");\n}\n\nexport function SplitButtonBase({\n label,\n onClick,\n items,\n disabled = false,\n loading = false,\n appearance,\n variant,\n size = \"md\",\n startIcon,\n fullWidth = false,\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n triggerLabel,\n triggerOn = \"click\",\n className,\n ref,\n ...rest\n}: SplitButtonProps) {\n const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n const isUnavailable = disabled || loading;\n const resolvedAppearance = resolveAppearance({ appearance, variant });\n const isControlled = controlledOpen !== undefined;\n const open = isUnavailable\n ? false\n : isControlled\n ? controlledOpen\n : uncontrolledOpen;\n\n const setOpen = (nextOpen: boolean) => {\n if (isUnavailable && nextOpen) {\n return;\n }\n if (!isControlled) {\n setUncontrolledOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n };\n\n const fullWidthFlag = fullWidth ? \"true\" : undefined;\n const menuLabel = triggerLabel ?? `More ${label} actions`;\n\n // Shared timeout ref for hover mode: delays close so the cursor can\n // travel through the mt-2 gap between the button and the menu panel\n // without dismissing the menu.\n const hoverCloseRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const scheduleClose = () => {\n cancelClose();\n hoverCloseRef.current = setTimeout(() => setOpen(false), 120);\n };\n\n const cancelClose = () => {\n if (hoverCloseRef.current !== null) {\n clearTimeout(hoverCloseRef.current);\n hoverCloseRef.current = null;\n }\n };\n\n useEffect(() => cancelClose, []);\n\n useEffect(() => {\n if (isUnavailable && !isControlled) {\n setUncontrolledOpen(false);\n onOpenChange?.(false);\n }\n }, [isUnavailable, onOpenChange, isControlled]);\n\n const dropdownHoverHandlers =\n triggerOn === \"hover\"\n ? {\n onMouseEnter: () => {\n cancelClose();\n setOpen(true);\n },\n onMouseLeave: scheduleClose,\n }\n : undefined;\n\n const contentHoverHandlers =\n triggerOn === \"hover\"\n ? { onMouseEnter: cancelClose, onMouseLeave: scheduleClose }\n : undefined;\n\n return (\n <div\n ref={ref}\n data-slot=\"split-button\"\n data-full-width={fullWidthFlag}\n className={cn(splitButtonRootVariants({ fullWidth }), className)}\n {...rest}\n >\n <Dropdown\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={setOpen}\n data-full-width={fullWidthFlag}\n className={splitButtonDropdownVariants({ fullWidth })}\n {...dropdownHoverHandlers}\n >\n <div\n data-slot=\"split-button-group\"\n data-full-width={fullWidthFlag}\n className={splitButtonGroupVariants({ fullWidth })}\n >\n <button\n type=\"button\"\n data-slot=\"split-button-primary\"\n data-full-width={fullWidthFlag}\n disabled={isUnavailable}\n onClick={onClick}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonPrimaryVariants(),\n )}\n >\n {loading ? (\n <FiLoader\n aria-hidden\n className=\"animate-spin\"\n data-slot=\"split-button-spinner-icon\"\n />\n ) : (\n startIcon\n )}\n <span>{label}</span>\n {loading ? (\n <span className=\"sr-only\" role=\"status\" aria-label=\"Loading\" />\n ) : null}\n </button>\n\n <DropdownTrigger\n aria-label={menuLabel}\n disabled={isUnavailable}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonTriggerVariants({ size }),\n )}\n >\n <FiChevronDown aria-hidden />\n </DropdownTrigger>\n </div>\n\n <DropdownContent\n className={splitButtonContentVariants()}\n placement=\"bottom\"\n {...contentHoverHandlers}\n >\n {items.map((item) => (\n <DropdownItem\n key={item.id}\n leftIcon={item.icon}\n aria-disabled={item.disabled ? \"true\" : undefined}\n className={\n item.disabled ? splitButtonItemDisabledVariants() : undefined\n }\n onClick={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onKeyDown={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onSelect={() => {\n setOpen(false);\n item.onSelect?.();\n }}\n >\n {item.label}\n </DropdownItem>\n ))}\n </DropdownContent>\n </Dropdown>\n </div>\n );\n}\n\nSplitButtonBase.displayName = \"SplitButton\";\n","// split-button.tsx — default static entry (no framer-motion)\nimport { SplitButtonBase } from \"./split-button-base\";\nimport type { SplitButtonProps } from \"./types\";\n\nexport const SplitButton = (props: SplitButtonProps) => {\n return <SplitButtonBase {...props} />;\n};\n\nSplitButton.displayName = \"SplitButton\";\n"]}
|
package/dist/ui/split-button.mjs
CHANGED
|
@@ -2,10 +2,12 @@
|
|
|
2
2
|
import { Dropdown, DropdownTrigger, DropdownContent, DropdownItem } from '../chunk-IHDM7AHY.mjs';
|
|
3
3
|
import '../chunk-VXDEPZKH.mjs';
|
|
4
4
|
import '../chunk-VBNW2B4D.mjs';
|
|
5
|
-
import '../chunk-
|
|
6
|
-
import { buttonVariants } from '../chunk-
|
|
7
|
-
import { zuiSplitButtonRoot, zuiSplitButtonFullWidth, zuiSplitButtonDropdown, zuiSplitButtonGroup, zuiSplitButtonPrimary, zuiSplitButtonTrigger, zuiSplitButtonTriggerSizes, zuiSplitButtonContent, zuiSplitButtonItemDisabled } from '../chunk-
|
|
5
|
+
import '../chunk-R2JXARKB.mjs';
|
|
6
|
+
import { buttonVariants } from '../chunk-YDD5HQGX.mjs';
|
|
7
|
+
import { zuiSplitButtonRoot, zuiSplitButtonFullWidth, zuiSplitButtonDropdown, zuiSplitButtonGroup, zuiSplitButtonPrimary, zuiSplitButtonTrigger, zuiSplitButtonTriggerSizes, zuiSplitButtonContent, zuiSplitButtonItemDisabled } from '../chunk-TZTUL6C4.mjs';
|
|
8
8
|
import '../chunk-2NQKFH26.mjs';
|
|
9
|
+
import '../chunk-XY3TKIIH.mjs';
|
|
10
|
+
import '../chunk-FX5KR2GP.mjs';
|
|
9
11
|
import '../chunk-ZBAKTM2R.mjs';
|
|
10
12
|
import '../chunk-4ZBMDWWY.mjs';
|
|
11
13
|
import '../chunk-YH6MOKHR.mjs';
|
|
@@ -15,10 +17,10 @@ import '../chunk-PUSCPBT2.mjs';
|
|
|
15
17
|
import '../chunk-CIZQQ32L.mjs';
|
|
16
18
|
import '../chunk-LRYKMXKI.mjs';
|
|
17
19
|
import '../chunk-XFJIX2YP.mjs';
|
|
20
|
+
import '../chunk-N4MLFU2Q.mjs';
|
|
21
|
+
import '../chunk-K2VCZK4I.mjs';
|
|
18
22
|
import '../chunk-4WG3VNVL.mjs';
|
|
19
23
|
import '../chunk-YPTHTFVF.mjs';
|
|
20
|
-
import '../chunk-XY3TKIIH.mjs';
|
|
21
|
-
import '../chunk-FX5KR2GP.mjs';
|
|
22
24
|
import '../chunk-3IE4IELX.mjs';
|
|
23
25
|
import '../chunk-BUEI4RMR.mjs';
|
|
24
26
|
import '../chunk-4U6PVVST.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/ui/split-button/variants.ts","../../src/ui/split-button/split-button-base.tsx","../../src/ui/split-button/split-button.tsx"],"names":["jsx"],"mappings":"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","file":"split-button.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiSplitButtonContent,\n zuiSplitButtonDropdown,\n zuiSplitButtonFullWidth,\n zuiSplitButtonGroup,\n zuiSplitButtonItemDisabled,\n zuiSplitButtonPrimary,\n zuiSplitButtonRoot,\n zuiSplitButtonTrigger,\n zuiSplitButtonTriggerSizes,\n} from \"../../design-system\";\n\nexport const splitButtonRootVariants = cva(zuiSplitButtonRoot, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonDropdownVariants = cva(zuiSplitButtonDropdown, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonGroupVariants = cva(zuiSplitButtonGroup, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonPrimaryVariants = cva(zuiSplitButtonPrimary);\nexport const splitButtonTriggerVariants = cva(zuiSplitButtonTrigger, {\n variants: {\n size: zuiSplitButtonTriggerSizes,\n },\n defaultVariants: {\n size: \"md\",\n },\n});\nexport const splitButtonContentVariants = cva(zuiSplitButtonContent);\nexport const splitButtonItemDisabledVariants = cva(zuiSplitButtonItemDisabled);\n","\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { FiChevronDown, FiLoader } from \"react-icons/fi\";\n\nimport {\n Dropdown,\n DropdownContent,\n DropdownItem,\n DropdownTrigger,\n} from \"../dropdown\";\nimport { buttonVariants } from \"../buttons\";\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n SplitButtonAppearance,\n SplitButtonProps,\n SplitButtonVariant,\n} from \"./types\";\nimport {\n splitButtonContentVariants,\n splitButtonDropdownVariants,\n splitButtonGroupVariants,\n splitButtonItemDisabledVariants,\n splitButtonPrimaryVariants,\n splitButtonRootVariants,\n splitButtonTriggerVariants,\n} from \"./variants\";\n\nconst variantAppearanceMap = {\n primary: \"default\",\n secondary: \"secondary\",\n outline: \"outline\",\n ghost: \"ghost\",\n danger: \"destructive\",\n success: \"green\",\n} as const satisfies Record<SplitButtonVariant, SplitButtonAppearance>;\n\nfunction resolveAppearance({\n appearance,\n variant,\n}: {\n appearance?: SplitButtonAppearance;\n variant?: SplitButtonVariant;\n}) {\n return appearance ?? (variant ? variantAppearanceMap[variant] : \"default\");\n}\n\nexport function SplitButtonBase({\n label,\n onClick,\n items,\n disabled = false,\n loading = false,\n appearance,\n variant,\n size = \"md\",\n startIcon,\n fullWidth = false,\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n triggerLabel,\n triggerOn = \"click\",\n className,\n ref,\n ...rest\n}: SplitButtonProps) {\n const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n const isUnavailable = disabled || loading;\n const resolvedAppearance = resolveAppearance({ appearance, variant });\n const isControlled = controlledOpen !== undefined;\n const open = isUnavailable\n ? false\n : isControlled\n ? controlledOpen\n : uncontrolledOpen;\n\n const setOpen = (nextOpen: boolean) => {\n if (isUnavailable && nextOpen) {\n return;\n }\n if (!isControlled) {\n setUncontrolledOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n };\n\n const fullWidthFlag = fullWidth ? \"true\" : undefined;\n const menuLabel = triggerLabel ?? `More ${label} actions`;\n\n // Shared timeout ref for hover mode: delays close so the cursor can\n // travel through the mt-2 gap between the button and the menu panel\n // without dismissing the menu.\n const hoverCloseRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const scheduleClose = () => {\n cancelClose();\n hoverCloseRef.current = setTimeout(() => setOpen(false), 120);\n };\n\n const cancelClose = () => {\n if (hoverCloseRef.current !== null) {\n clearTimeout(hoverCloseRef.current);\n hoverCloseRef.current = null;\n }\n };\n\n useEffect(() => cancelClose, []);\n\n useEffect(() => {\n if (isUnavailable && !isControlled) {\n setUncontrolledOpen(false);\n onOpenChange?.(false);\n }\n }, [isUnavailable, onOpenChange, isControlled]);\n\n const dropdownHoverHandlers =\n triggerOn === \"hover\"\n ? {\n onMouseEnter: () => {\n cancelClose();\n setOpen(true);\n },\n onMouseLeave: scheduleClose,\n }\n : undefined;\n\n const contentHoverHandlers =\n triggerOn === \"hover\"\n ? { onMouseEnter: cancelClose, onMouseLeave: scheduleClose }\n : undefined;\n\n return (\n <div\n ref={ref}\n data-slot=\"split-button\"\n data-full-width={fullWidthFlag}\n className={cn(splitButtonRootVariants({ fullWidth }), className)}\n {...rest}\n >\n <Dropdown\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={setOpen}\n data-full-width={fullWidthFlag}\n className={splitButtonDropdownVariants({ fullWidth })}\n {...dropdownHoverHandlers}\n >\n <div\n data-slot=\"split-button-group\"\n data-full-width={fullWidthFlag}\n className={splitButtonGroupVariants({ fullWidth })}\n >\n <button\n type=\"button\"\n data-slot=\"split-button-primary\"\n data-full-width={fullWidthFlag}\n disabled={isUnavailable}\n onClick={onClick}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonPrimaryVariants(),\n )}\n >\n {loading ? (\n <FiLoader\n aria-hidden\n className=\"animate-spin\"\n data-slot=\"split-button-spinner-icon\"\n />\n ) : (\n startIcon\n )}\n <span>{label}</span>\n {loading ? (\n <span className=\"sr-only\" role=\"status\" aria-label=\"Loading\" />\n ) : null}\n </button>\n\n <DropdownTrigger\n aria-label={menuLabel}\n disabled={isUnavailable}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonTriggerVariants({ size }),\n )}\n >\n <FiChevronDown aria-hidden />\n </DropdownTrigger>\n </div>\n\n <DropdownContent\n className={splitButtonContentVariants()}\n placement=\"bottom\"\n {...contentHoverHandlers}\n >\n {items.map((item) => (\n <DropdownItem\n key={item.id}\n leftIcon={item.icon}\n aria-disabled={item.disabled ? \"true\" : undefined}\n className={\n item.disabled ? splitButtonItemDisabledVariants() : undefined\n }\n onClick={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onKeyDown={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onSelect={() => {\n setOpen(false);\n item.onSelect?.();\n }}\n >\n {item.label}\n </DropdownItem>\n ))}\n </DropdownContent>\n </Dropdown>\n </div>\n );\n}\n\nSplitButtonBase.displayName = \"SplitButton\";\n","// split-button.tsx — default static entry (no framer-motion)\nimport { SplitButtonBase } from \"./split-button-base\";\nimport type { SplitButtonProps } from \"./types\";\n\nexport const SplitButton = (props: SplitButtonProps) => {\n return <SplitButtonBase {...props} />;\n};\n\nSplitButton.displayName = \"SplitButton\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/ui/split-button/variants.ts","../../src/ui/split-button/split-button-base.tsx","../../src/ui/split-button/split-button.tsx"],"names":["jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcO,IAAM,uBAAA,GAA0B,IAAI,kBAAA,EAAoB;AAAA,EAC7D,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ,CAAC;AACM,IAAM,2BAAA,GAA8B,IAAI,sBAAA,EAAwB;AAAA,EACrE,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ,CAAC;AACM,IAAM,wBAAA,GAA2B,IAAI,mBAAA,EAAqB;AAAA,EAC/D,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ,CAAC;AACM,IAAM,0BAAA,GAA6B,IAAI,qBAAqB;AAC5D,IAAM,0BAAA,GAA6B,IAAI,qBAAA,EAAuB;AAAA,EACnE,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,GACR;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC;AACM,IAAM,0BAAA,GAA6B,IAAI,qBAAqB;AAC5D,IAAM,+BAAA,GAAkC,IAAI,0BAA0B;AChB7E,IAAM,oBAAA,GAAuB;AAAA,EAC3B,OAAA,EAAS,SAAA;AAAA,EACT,SAAA,EAAW,WAAA;AAAA,EACX,OAAA,EAAS,SAAA;AAAA,EACT,KAAA,EAAO,OAAA;AAAA,EACP,MAAA,EAAQ,aAAA;AAAA,EACR,OAAA,EAAS;AACX,CAAA;AAEA,SAAS,iBAAA,CAAkB;AAAA,EACzB,UAAA;AAAA,EACA;AACF,CAAA,EAGG;AACD,EAAA,OAAO,UAAA,KAAe,OAAA,GAAU,oBAAA,CAAqB,OAAO,CAAA,GAAI,SAAA,CAAA;AAClE;AAEO,SAAS,eAAA,CAAgB;AAAA,EAC9B,KAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,OAAA,GAAU,KAAA;AAAA,EACV,UAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA,GAAO,IAAA;AAAA,EACP,SAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,IAAA,EAAM,cAAA;AAAA,EACN,WAAA,GAAc,KAAA;AAAA,EACd,YAAA;AAAA,EACA,YAAA;AAAA,EACA,SAAA,GAAY,OAAA;AAAA,EACZ,SAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAqB;AACnB,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,SAAS,WAAW,CAAA;AACpE,EAAA,MAAM,gBAAgB,QAAA,IAAY,OAAA;AAClC,EAAA,MAAM,kBAAA,GAAqB,iBAAA,CAAkB,EAAE,UAAA,EAAY,SAAS,CAAA;AACpE,EAAA,MAAM,eAAe,cAAA,KAAmB,MAAA;AACxC,EAAA,MAAM,IAAA,GAAO,aAAA,GACT,KAAA,GACA,YAAA,GACE,cAAA,GACA,gBAAA;AAEN,EAAA,MAAM,OAAA,GAAU,CAAC,QAAA,KAAsB;AACrC,IAAA,IAAI,iBAAiB,QAAA,EAAU;AAC7B,MAAA;AAAA,IACF;AACA,IAAA,IAAI,CAAC,YAAA,EAAc;AACjB,MAAA,mBAAA,CAAoB,QAAQ,CAAA;AAAA,IAC9B;AACA,IAAA,YAAA,GAAe,QAAQ,CAAA;AAAA,EACzB,CAAA;AAEA,EAAA,MAAM,aAAA,GAAgB,YAAY,MAAA,GAAS,MAAA;AAC3C,EAAA,MAAM,SAAA,GAAY,YAAA,IAAgB,CAAA,KAAA,EAAQ,KAAK,CAAA,QAAA,CAAA;AAK/C,EAAA,MAAM,aAAA,GAAgB,OAA6C,IAAI,CAAA;AAEvE,EAAA,MAAM,gBAAgB,MAAM;AAC1B,IAAA,WAAA,EAAY;AACZ,IAAA,aAAA,CAAc,UAAU,UAAA,CAAW,MAAM,OAAA,CAAQ,KAAK,GAAG,GAAG,CAAA;AAAA,EAC9D,CAAA;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,IAAI,aAAA,CAAc,YAAY,IAAA,EAAM;AAClC,MAAA,YAAA,CAAa,cAAc,OAAO,CAAA;AAClC,MAAA,aAAA,CAAc,OAAA,GAAU,IAAA;AAAA,IAC1B;AAAA,EACF,CAAA;AAEA,EAAA,SAAA,CAAU,MAAM,WAAA,EAAa,EAAE,CAAA;AAE/B,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,aAAA,IAAiB,CAAC,YAAA,EAAc;AAClC,MAAA,mBAAA,CAAoB,KAAK,CAAA;AACzB,MAAA,YAAA,GAAe,KAAK,CAAA;AAAA,IACtB;AAAA,EACF,CAAA,EAAG,CAAC,aAAA,EAAe,YAAA,EAAc,YAAY,CAAC,CAAA;AAE9C,EAAA,MAAM,qBAAA,GACJ,cAAc,OAAA,GACV;AAAA,IACE,cAAc,MAAM;AAClB,MAAA,WAAA,EAAY;AACZ,MAAA,OAAA,CAAQ,IAAI,CAAA;AAAA,IACd,CAAA;AAAA,IACA,YAAA,EAAc;AAAA,GAChB,GACA,MAAA;AAEN,EAAA,MAAM,oBAAA,GACJ,cAAc,OAAA,GACV,EAAE,cAAc,WAAA,EAAa,YAAA,EAAc,eAAc,GACzD,MAAA;AAEN,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,WAAA,EAAU,cAAA;AAAA,MACV,iBAAA,EAAiB,aAAA;AAAA,MACjB,WAAW,EAAA,CAAG,uBAAA,CAAwB,EAAE,SAAA,EAAW,GAAG,SAAS,CAAA;AAAA,MAC9D,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAA,IAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,IAAA;AAAA,UACA,WAAA;AAAA,UACA,YAAA,EAAc,OAAA;AAAA,UACd,iBAAA,EAAiB,aAAA;AAAA,UACjB,SAAA,EAAW,2BAAA,CAA4B,EAAE,SAAA,EAAW,CAAA;AAAA,UACnD,GAAG,qBAAA;AAAA,UAEJ,QAAA,EAAA;AAAA,4BAAA,IAAA;AAAA,cAAC,KAAA;AAAA,cAAA;AAAA,gBACC,WAAA,EAAU,oBAAA;AAAA,gBACV,iBAAA,EAAiB,aAAA;AAAA,gBACjB,SAAA,EAAW,wBAAA,CAAyB,EAAE,SAAA,EAAW,CAAA;AAAA,gBAEjD,QAAA,EAAA;AAAA,kCAAA,IAAA;AAAA,oBAAC,QAAA;AAAA,oBAAA;AAAA,sBACC,IAAA,EAAK,QAAA;AAAA,sBACL,WAAA,EAAU,sBAAA;AAAA,sBACV,iBAAA,EAAiB,aAAA;AAAA,sBACjB,QAAA,EAAU,aAAA;AAAA,sBACV,OAAA;AAAA,sBACA,SAAA,EAAW,EAAA;AAAA,wBACT,cAAA,CAAe,EAAE,UAAA,EAAY,kBAAA,EAAoB,MAAM,CAAA;AAAA,wBACvD,0BAAA;AAA2B,uBAC7B;AAAA,sBAEC,QAAA,EAAA;AAAA,wBAAA,OAAA,mBACC,GAAA;AAAA,0BAAC,QAAA;AAAA,0BAAA;AAAA,4BACC,aAAA,EAAW,IAAA;AAAA,4BACX,SAAA,EAAU,cAAA;AAAA,4BACV,WAAA,EAAU;AAAA;AAAA,yBACZ,GAEA,SAAA;AAAA,wCAEF,GAAA,CAAC,UAAM,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,wBACZ,OAAA,uBACE,MAAA,EAAA,EAAK,SAAA,EAAU,WAAU,IAAA,EAAK,QAAA,EAAS,YAAA,EAAW,SAAA,EAAU,CAAA,GAC3D;AAAA;AAAA;AAAA,mBACN;AAAA,kCAEA,GAAA;AAAA,oBAAC,eAAA;AAAA,oBAAA;AAAA,sBACC,YAAA,EAAY,SAAA;AAAA,sBACZ,QAAA,EAAU,aAAA;AAAA,sBACV,SAAA,EAAW,EAAA;AAAA,wBACT,cAAA,CAAe,EAAE,UAAA,EAAY,kBAAA,EAAoB,MAAM,CAAA;AAAA,wBACvD,0BAAA,CAA2B,EAAE,IAAA,EAAM;AAAA,uBACrC;AAAA,sBAEA,QAAA,kBAAA,GAAA,CAAC,aAAA,EAAA,EAAc,aAAA,EAAW,IAAA,EAAC;AAAA;AAAA;AAC7B;AAAA;AAAA,aACF;AAAA,4BAEA,GAAA;AAAA,cAAC,eAAA;AAAA,cAAA;AAAA,gBACC,WAAW,0BAAA,EAA2B;AAAA,gBACtC,SAAA,EAAU,QAAA;AAAA,gBACT,GAAG,oBAAA;AAAA,gBAEH,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,qBACV,GAAA;AAAA,kBAAC,YAAA;AAAA,kBAAA;AAAA,oBAEC,UAAU,IAAA,CAAK,IAAA;AAAA,oBACf,eAAA,EAAe,IAAA,CAAK,QAAA,GAAW,MAAA,GAAS,MAAA;AAAA,oBACxC,SAAA,EACE,IAAA,CAAK,QAAA,GAAW,+BAAA,EAAgC,GAAI,MAAA;AAAA,oBAEtD,OAAA,EAAS,CAAC,KAAA,KAAU;AAClB,sBAAA,IAAI,KAAK,QAAA,EAAU;AACjB,wBAAA,KAAA,CAAM,cAAA,EAAe;AACrB,wBAAA,KAAA,CAAM,eAAA,EAAgB;AAAA,sBACxB;AAAA,oBACF,CAAA;AAAA,oBACA,SAAA,EAAW,CAAC,KAAA,KAAU;AACpB,sBAAA,IAAI,KAAK,QAAA,EAAU;AACjB,wBAAA,KAAA,CAAM,cAAA,EAAe;AACrB,wBAAA,KAAA,CAAM,eAAA,EAAgB;AAAA,sBACxB;AAAA,oBACF,CAAA;AAAA,oBACA,UAAU,MAAM;AACd,sBAAA,OAAA,CAAQ,KAAK,CAAA;AACb,sBAAA,IAAA,CAAK,QAAA,IAAW;AAAA,oBAClB,CAAA;AAAA,oBAEC,QAAA,EAAA,IAAA,CAAK;AAAA,mBAAA;AAAA,kBAvBD,IAAA,CAAK;AAAA,iBAyBb;AAAA;AAAA;AACH;AAAA;AAAA;AACF;AAAA,GACF;AAEJ;AAEA,eAAA,CAAgB,WAAA,GAAc,aAAA;ACnOvB,IAAM,WAAA,GAAc,CAAC,KAAA,KAA4B;AACtD,EAAA,uBAAOA,GAAAA,CAAC,eAAA,EAAA,EAAiB,GAAG,KAAA,EAAO,CAAA;AACrC;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"split-button.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n zuiSplitButtonContent,\n zuiSplitButtonDropdown,\n zuiSplitButtonFullWidth,\n zuiSplitButtonGroup,\n zuiSplitButtonItemDisabled,\n zuiSplitButtonPrimary,\n zuiSplitButtonRoot,\n zuiSplitButtonTrigger,\n zuiSplitButtonTriggerSizes,\n} from \"../../design-system\";\n\nexport const splitButtonRootVariants = cva(zuiSplitButtonRoot, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonDropdownVariants = cva(zuiSplitButtonDropdown, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonGroupVariants = cva(zuiSplitButtonGroup, {\n variants: {\n fullWidth: {\n true: zuiSplitButtonFullWidth,\n },\n },\n});\nexport const splitButtonPrimaryVariants = cva(zuiSplitButtonPrimary);\nexport const splitButtonTriggerVariants = cva(zuiSplitButtonTrigger, {\n variants: {\n size: zuiSplitButtonTriggerSizes,\n },\n defaultVariants: {\n size: \"md\",\n },\n});\nexport const splitButtonContentVariants = cva(zuiSplitButtonContent);\nexport const splitButtonItemDisabledVariants = cva(zuiSplitButtonItemDisabled);\n","\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { FiChevronDown, FiLoader } from \"react-icons/fi\";\n\nimport {\n Dropdown,\n DropdownContent,\n DropdownItem,\n DropdownTrigger,\n} from \"../dropdown\";\nimport { buttonVariants } from \"../buttons\";\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n SplitButtonAppearance,\n SplitButtonProps,\n SplitButtonVariant,\n} from \"./types\";\nimport {\n splitButtonContentVariants,\n splitButtonDropdownVariants,\n splitButtonGroupVariants,\n splitButtonItemDisabledVariants,\n splitButtonPrimaryVariants,\n splitButtonRootVariants,\n splitButtonTriggerVariants,\n} from \"./variants\";\n\nconst variantAppearanceMap = {\n primary: \"default\",\n secondary: \"secondary\",\n outline: \"outline\",\n ghost: \"ghost\",\n danger: \"destructive\",\n success: \"green\",\n} as const satisfies Record<SplitButtonVariant, SplitButtonAppearance>;\n\nfunction resolveAppearance({\n appearance,\n variant,\n}: {\n appearance?: SplitButtonAppearance;\n variant?: SplitButtonVariant;\n}) {\n return appearance ?? (variant ? variantAppearanceMap[variant] : \"default\");\n}\n\nexport function SplitButtonBase({\n label,\n onClick,\n items,\n disabled = false,\n loading = false,\n appearance,\n variant,\n size = \"md\",\n startIcon,\n fullWidth = false,\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n triggerLabel,\n triggerOn = \"click\",\n className,\n ref,\n ...rest\n}: SplitButtonProps) {\n const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n const isUnavailable = disabled || loading;\n const resolvedAppearance = resolveAppearance({ appearance, variant });\n const isControlled = controlledOpen !== undefined;\n const open = isUnavailable\n ? false\n : isControlled\n ? controlledOpen\n : uncontrolledOpen;\n\n const setOpen = (nextOpen: boolean) => {\n if (isUnavailable && nextOpen) {\n return;\n }\n if (!isControlled) {\n setUncontrolledOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n };\n\n const fullWidthFlag = fullWidth ? \"true\" : undefined;\n const menuLabel = triggerLabel ?? `More ${label} actions`;\n\n // Shared timeout ref for hover mode: delays close so the cursor can\n // travel through the mt-2 gap between the button and the menu panel\n // without dismissing the menu.\n const hoverCloseRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const scheduleClose = () => {\n cancelClose();\n hoverCloseRef.current = setTimeout(() => setOpen(false), 120);\n };\n\n const cancelClose = () => {\n if (hoverCloseRef.current !== null) {\n clearTimeout(hoverCloseRef.current);\n hoverCloseRef.current = null;\n }\n };\n\n useEffect(() => cancelClose, []);\n\n useEffect(() => {\n if (isUnavailable && !isControlled) {\n setUncontrolledOpen(false);\n onOpenChange?.(false);\n }\n }, [isUnavailable, onOpenChange, isControlled]);\n\n const dropdownHoverHandlers =\n triggerOn === \"hover\"\n ? {\n onMouseEnter: () => {\n cancelClose();\n setOpen(true);\n },\n onMouseLeave: scheduleClose,\n }\n : undefined;\n\n const contentHoverHandlers =\n triggerOn === \"hover\"\n ? { onMouseEnter: cancelClose, onMouseLeave: scheduleClose }\n : undefined;\n\n return (\n <div\n ref={ref}\n data-slot=\"split-button\"\n data-full-width={fullWidthFlag}\n className={cn(splitButtonRootVariants({ fullWidth }), className)}\n {...rest}\n >\n <Dropdown\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={setOpen}\n data-full-width={fullWidthFlag}\n className={splitButtonDropdownVariants({ fullWidth })}\n {...dropdownHoverHandlers}\n >\n <div\n data-slot=\"split-button-group\"\n data-full-width={fullWidthFlag}\n className={splitButtonGroupVariants({ fullWidth })}\n >\n <button\n type=\"button\"\n data-slot=\"split-button-primary\"\n data-full-width={fullWidthFlag}\n disabled={isUnavailable}\n onClick={onClick}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonPrimaryVariants(),\n )}\n >\n {loading ? (\n <FiLoader\n aria-hidden\n className=\"animate-spin\"\n data-slot=\"split-button-spinner-icon\"\n />\n ) : (\n startIcon\n )}\n <span>{label}</span>\n {loading ? (\n <span className=\"sr-only\" role=\"status\" aria-label=\"Loading\" />\n ) : null}\n </button>\n\n <DropdownTrigger\n aria-label={menuLabel}\n disabled={isUnavailable}\n className={cn(\n buttonVariants({ appearance: resolvedAppearance, size }),\n splitButtonTriggerVariants({ size }),\n )}\n >\n <FiChevronDown aria-hidden />\n </DropdownTrigger>\n </div>\n\n <DropdownContent\n className={splitButtonContentVariants()}\n placement=\"bottom\"\n {...contentHoverHandlers}\n >\n {items.map((item) => (\n <DropdownItem\n key={item.id}\n leftIcon={item.icon}\n aria-disabled={item.disabled ? \"true\" : undefined}\n className={\n item.disabled ? splitButtonItemDisabledVariants() : undefined\n }\n onClick={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onKeyDown={(event) => {\n if (item.disabled) {\n event.preventDefault();\n event.stopPropagation();\n }\n }}\n onSelect={() => {\n setOpen(false);\n item.onSelect?.();\n }}\n >\n {item.label}\n </DropdownItem>\n ))}\n </DropdownContent>\n </Dropdown>\n </div>\n );\n}\n\nSplitButtonBase.displayName = \"SplitButton\";\n","// split-button.tsx — default static entry (no framer-motion)\nimport { SplitButtonBase } from \"./split-button-base\";\nimport type { SplitButtonProps } from \"./types\";\n\nexport const SplitButton = (props: SplitButtonProps) => {\n return <SplitButtonBase {...props} />;\n};\n\nSplitButton.displayName = \"SplitButton\";\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zentauri-ui/zentauri-components",
|
|
3
|
-
"version": "2.3.
|
|
3
|
+
"version": "2.3.2",
|
|
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
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -38,6 +38,8 @@ export * from "./scroll-area";
|
|
|
38
38
|
export * from "./secret-reveal";
|
|
39
39
|
export * from "./select";
|
|
40
40
|
export * from "./skeleton";
|
|
41
|
+
export * from "./speech-recognition";
|
|
42
|
+
export * from "./speech-synthesizer";
|
|
41
43
|
export * from "./split-button";
|
|
42
44
|
export * from "./slider";
|
|
43
45
|
export * from "./spinner";
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
export const zuiSpeechRecognitionAppearances = {
|
|
2
|
+
default:
|
|
3
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-default-btn-bg,var(--zui-brand,oklch(20.8%_0.042_265.755)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-default-btn-bg-dark,var(--zui-brand-dark,oklch(98.4%_0.003_247.858)))]",
|
|
4
|
+
subtle:
|
|
5
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-subtle-btn-bg,var(--zui-surface-muted,oklch(92.9%_0.013_255.508)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-subtle-btn-bg-dark,var(--zui-surface-muted-dark,oklch(27.9%_0.041_260.031)))]",
|
|
6
|
+
muted:
|
|
7
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-muted-btn-bg,var(--zui-fg-muted,oklch(44.6%_0.043_257.281)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-muted-btn-bg-dark,var(--zui-fg-muted-dark,oklch(86.9%_0.022_252.894)))]",
|
|
8
|
+
primary:
|
|
9
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-primary-btn-bg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-primary-btn-bg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))]",
|
|
10
|
+
blue: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-blue-btn-bg,var(--zui-color-blue,#2563eb))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-blue-btn-bg-dark,var(--zui-color-blue-dark,#3b82f6))]",
|
|
11
|
+
cyan: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-cyan-btn-bg,var(--zui-color-cyan,#0891b2))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-cyan-btn-bg-dark,var(--zui-color-cyan-dark,#22d3ee))]",
|
|
12
|
+
green:
|
|
13
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-green-btn-bg,var(--zui-color-green,#16a34a))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-green-btn-bg-dark,var(--zui-color-green-dark,#22c55e))]",
|
|
14
|
+
lime: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-lime-btn-bg,var(--zui-color-lime,#65a30d))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-lime-btn-bg-dark,var(--zui-color-lime-dark,#a3e635))]",
|
|
15
|
+
emerald:
|
|
16
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-emerald-btn-bg,var(--zui-color-emerald,oklch(69.6%_0.17_162.48)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-emerald-btn-bg-dark,var(--zui-color-emerald-dark,oklch(43.2%_0.095_166.913)))]",
|
|
17
|
+
indigo:
|
|
18
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-indigo-btn-bg,var(--zui-color-indigo,oklch(39.8%_0.195_277.366)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-indigo-btn-bg-dark,var(--zui-color-indigo-dark,oklch(51.1%_0.262_276.966)))]",
|
|
19
|
+
purple:
|
|
20
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-purple-btn-bg,var(--zui-color-purple,oklch(43.8%_0.218_303.724)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-purple-btn-bg-dark,var(--zui-color-purple-dark,oklch(55.8%_0.288_302.321)))]",
|
|
21
|
+
pink: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-pink-btn-bg,var(--zui-color-pink,oklch(45.9%_0.187_3.815)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-pink-btn-bg-dark,var(--zui-color-pink-dark,oklch(59.2%_0.249_0.584)))]",
|
|
22
|
+
rose: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-rose-btn-bg,var(--zui-color-rose,oklch(64.5%_0.246_16.439)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-rose-btn-bg-dark,var(--zui-color-rose-dark,oklch(51.4%_0.222_16.935)))]",
|
|
23
|
+
sky: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-sky-btn-bg,var(--zui-color-sky,oklch(68.5%_0.169_237.323)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-sky-btn-bg-dark,var(--zui-color-sky-dark,oklch(50%_0.134_242.749)))]",
|
|
24
|
+
teal: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-teal-btn-bg,var(--zui-color-teal,oklch(70.4%_0.14_182.503)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-teal-btn-bg-dark,var(--zui-color-teal-dark,oklch(51.1%_0.096_186.391)))]",
|
|
25
|
+
yellow:
|
|
26
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-yellow-btn-bg,var(--zui-color-yellow,oklch(79.5%_0.184_86.047)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-yellow-btn-bg-dark,var(--zui-color-yellow-dark,oklch(47.6%_0.114_61.907)))]",
|
|
27
|
+
orange:
|
|
28
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-orange-btn-bg,var(--zui-color-orange,oklch(70.5%_0.213_47.604)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-orange-btn-bg-dark,var(--zui-color-orange-dark,oklch(47%_0.157_37.304)))]",
|
|
29
|
+
red: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-red-btn-bg,var(--zui-color-red,#dc2626))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-red-btn-bg-dark,var(--zui-color-red-dark,#ef4444))]",
|
|
30
|
+
slate:
|
|
31
|
+
"[--zui-recognition-btn-bg:var(--zui-speech-recognition-slate-btn-bg,var(--zui-color-slate,#475569))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-slate-btn-bg-dark,var(--zui-color-slate-dark,#64748b))]",
|
|
32
|
+
gray: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-gray-btn-bg,var(--zui-color-gray,oklch(55.1%_0.027_264.364)))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-gray-btn-bg-dark,var(--zui-color-gray-dark,oklch(55.1%_0.027_264.364)))]",
|
|
33
|
+
zinc: "[--zui-recognition-btn-bg:var(--zui-speech-recognition-zinc-btn-bg,var(--zui-color-zinc,#52525b))] dark:[--zui-recognition-btn-bg:var(--zui-speech-recognition-zinc-btn-bg-dark,var(--zui-color-zinc-dark,#71717a))]",
|
|
34
|
+
} as const;
|
|
35
|
+
|
|
36
|
+
export const zuiSpeechRecognitionBase = [
|
|
37
|
+
"inline-flex flex-col gap-2",
|
|
38
|
+
"rounded-[var(--zui-speech-recognition-radius,var(--zui-radius,0.75rem))]",
|
|
39
|
+
"bg-[var(--zui-speech-recognition-bg,var(--zui-surface,#ffffff))] dark:bg-[var(--zui-speech-recognition-bg-dark,var(--zui-surface-dark,#0f172a))]",
|
|
40
|
+
"border border-[var(--zui-speech-recognition-border,var(--zui-border,#e2e8f0))] dark:border-[var(--zui-speech-recognition-border-dark,var(--zui-border-dark,#1e293b))]",
|
|
41
|
+
"p-4",
|
|
42
|
+
] as const;
|
|
43
|
+
|
|
44
|
+
export const zuiSpeechRecognitionStatusBase = [
|
|
45
|
+
"text-[color:var(--zui-speech-recognition-status-fg,var(--zui-fg-muted,oklch(44.6%_0.043_257.281)))] dark:text-[color:var(--zui-speech-recognition-status-fg-dark,var(--zui-fg-muted-dark,oklch(86.9%_0.022_252.894)))]",
|
|
46
|
+
"text-xs",
|
|
47
|
+
"transition-opacity",
|
|
48
|
+
] as const;
|
|
49
|
+
|
|
50
|
+
export const zuiSpeechRecognitionTranscriptBase = [
|
|
51
|
+
"text-[color:var(--zui-speech-recognition-transcript-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-speech-recognition-transcript-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))]",
|
|
52
|
+
"text-sm",
|
|
53
|
+
"min-h-[1.25rem]",
|
|
54
|
+
"leading-relaxed",
|
|
55
|
+
] as const;
|
|
56
|
+
|
|
57
|
+
export const zuiSpeechRecognitionSizes = {
|
|
58
|
+
sm: "gap-1.5 p-3",
|
|
59
|
+
md: "gap-2 p-4",
|
|
60
|
+
lg: "gap-3 p-5",
|
|
61
|
+
} as const;
|
|
62
|
+
|
|
63
|
+
export const zuiSpeechRecognitionBtnBase = [
|
|
64
|
+
"inline-flex items-center justify-center rounded-full",
|
|
65
|
+
"size-10",
|
|
66
|
+
"transition-all duration-200",
|
|
67
|
+
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
|
|
68
|
+
"bg-[var(--zui-recognition-btn-bg,var(--zui-brand,oklch(20.8%_0.042_265.755)))] dark:bg-[var(--zui-recognition-btn-bg,var(--zui-brand-dark,oklch(98.4%_0.003_247.858)))]",
|
|
69
|
+
"text-[color:var(--zui-speech-recognition-btn-fg,var(--zui-bg,#ffffff))] dark:text-[color:var(--zui-speech-recognition-btn-fg-dark,var(--zui-bg-dark,#0f172a))]",
|
|
70
|
+
] as const;
|
|
71
|
+
|
|
72
|
+
export const zuiSpeechRecognitionBtnSizes = {
|
|
73
|
+
sm: "size-8",
|
|
74
|
+
md: "size-10",
|
|
75
|
+
lg: "size-12",
|
|
76
|
+
} as const;
|
|
77
|
+
|
|
78
|
+
export const zuiSpeechRecognitionBtnActive = [
|
|
79
|
+
"ring-2 ring-[var(--zui-speech-recognition-active-ring,var(--zui-status-error,#dc2626))] dark:ring-[var(--zui-speech-recognition-active-ring-dark,var(--zui-status-error-dark,#ef4444))]",
|
|
80
|
+
"ring-offset-2",
|
|
81
|
+
"animate-pulse",
|
|
82
|
+
] as const;
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
export const zuiSpeechSynthesizerAppearances = {
|
|
2
|
+
default:
|
|
3
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-default-btn-bg,var(--zui-brand,oklch(20.8%_0.042_265.755)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-default-btn-bg-dark,var(--zui-brand-dark,oklch(98.4%_0.003_247.858)))]",
|
|
4
|
+
subtle:
|
|
5
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-subtle-btn-bg,var(--zui-surface-muted,oklch(92.9%_0.013_255.508)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-subtle-btn-bg-dark,var(--zui-surface-muted-dark,oklch(27.9%_0.041_260.031)))]",
|
|
6
|
+
muted:
|
|
7
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-muted-btn-bg,var(--zui-fg-muted,oklch(44.6%_0.043_257.281)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-muted-btn-bg-dark,var(--zui-fg-muted-dark,oklch(86.9%_0.022_252.894)))]",
|
|
8
|
+
primary:
|
|
9
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-primary-btn-bg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-primary-btn-bg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))]",
|
|
10
|
+
blue: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-blue-btn-bg,var(--zui-color-blue,#2563eb))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-blue-btn-bg-dark,var(--zui-color-blue-dark,#3b82f6))]",
|
|
11
|
+
cyan: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-cyan-btn-bg,var(--zui-color-cyan,#0891b2))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-cyan-btn-bg-dark,var(--zui-color-cyan-dark,#22d3ee))]",
|
|
12
|
+
green:
|
|
13
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-green-btn-bg,var(--zui-color-green,#16a34a))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-green-btn-bg-dark,var(--zui-color-green-dark,#22c55e))]",
|
|
14
|
+
lime: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-lime-btn-bg,var(--zui-color-lime,#65a30d))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-lime-btn-bg-dark,var(--zui-color-lime-dark,#a3e635))]",
|
|
15
|
+
emerald:
|
|
16
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-emerald-btn-bg,var(--zui-color-emerald,oklch(69.6%_0.17_162.48)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-emerald-btn-bg-dark,var(--zui-color-emerald-dark,oklch(43.2%_0.095_166.913)))]",
|
|
17
|
+
indigo:
|
|
18
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-indigo-btn-bg,var(--zui-color-indigo,oklch(39.8%_0.195_277.366)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-indigo-btn-bg-dark,var(--zui-color-indigo-dark,oklch(51.1%_0.262_276.966)))]",
|
|
19
|
+
purple:
|
|
20
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-purple-btn-bg,var(--zui-color-purple,oklch(43.8%_0.218_303.724)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-purple-btn-bg-dark,var(--zui-color-purple-dark,oklch(55.8%_0.288_302.321)))]",
|
|
21
|
+
pink: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-pink-btn-bg,var(--zui-color-pink,oklch(45.9%_0.187_3.815)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-pink-btn-bg-dark,var(--zui-color-pink-dark,oklch(59.2%_0.249_0.584)))]",
|
|
22
|
+
rose: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-rose-btn-bg,var(--zui-color-rose,oklch(64.5%_0.246_16.439)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-rose-btn-bg-dark,var(--zui-color-rose-dark,oklch(51.4%_0.222_16.935)))]",
|
|
23
|
+
sky: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-sky-btn-bg,var(--zui-color-sky,oklch(68.5%_0.169_237.323)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-sky-btn-bg-dark,var(--zui-color-sky-dark,oklch(50%_0.134_242.749)))]",
|
|
24
|
+
teal: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-teal-btn-bg,var(--zui-color-teal,oklch(70.4%_0.14_182.503)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-teal-btn-bg-dark,var(--zui-color-teal-dark,oklch(51.1%_0.096_186.391)))]",
|
|
25
|
+
yellow:
|
|
26
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-yellow-btn-bg,var(--zui-color-yellow,oklch(79.5%_0.184_86.047)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-yellow-btn-bg-dark,var(--zui-color-yellow-dark,oklch(47.6%_0.114_61.907)))]",
|
|
27
|
+
orange:
|
|
28
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-orange-btn-bg,var(--zui-color-orange,oklch(70.5%_0.213_47.604)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-orange-btn-bg-dark,var(--zui-color-orange-dark,oklch(47%_0.157_37.304)))]",
|
|
29
|
+
red: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-red-btn-bg,var(--zui-color-red,#dc2626))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-red-btn-bg-dark,var(--zui-color-red-dark,#ef4444))]",
|
|
30
|
+
slate:
|
|
31
|
+
"[--zui-synth-btn-bg:var(--zui-speech-synthesizer-slate-btn-bg,var(--zui-color-slate,#475569))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-slate-btn-bg-dark,var(--zui-color-slate-dark,#64748b))]",
|
|
32
|
+
gray: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-gray-btn-bg,var(--zui-color-gray,oklch(55.1%_0.027_264.364)))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-gray-btn-bg-dark,var(--zui-color-gray-dark,oklch(55.1%_0.027_264.364)))]",
|
|
33
|
+
zinc: "[--zui-synth-btn-bg:var(--zui-speech-synthesizer-zinc-btn-bg,var(--zui-color-zinc,#52525b))] dark:[--zui-synth-btn-bg:var(--zui-speech-synthesizer-zinc-btn-bg-dark,var(--zui-color-zinc-dark,#71717a))]",
|
|
34
|
+
} as const;
|
|
35
|
+
|
|
36
|
+
export const zuiSpeechSynthesizerBase = [
|
|
37
|
+
"inline-flex flex-col gap-3",
|
|
38
|
+
"rounded-[var(--zui-speech-synthesizer-radius,var(--zui-radius,0.75rem))]",
|
|
39
|
+
"bg-[var(--zui-speech-synthesizer-bg,var(--zui-surface,#ffffff))] dark:bg-[var(--zui-speech-synthesizer-bg-dark,var(--zui-surface-dark,#0f172a))]",
|
|
40
|
+
"border border-[var(--zui-speech-synthesizer-border,var(--zui-border,#e2e8f0))] dark:border-[var(--zui-speech-synthesizer-border-dark,var(--zui-border-dark,#1e293b))]",
|
|
41
|
+
"p-4",
|
|
42
|
+
] as const;
|
|
43
|
+
|
|
44
|
+
export const zuiSpeechSynthesizerSizes = {
|
|
45
|
+
sm: "gap-2 p-3",
|
|
46
|
+
md: "gap-3 p-4",
|
|
47
|
+
lg: "gap-4 p-5",
|
|
48
|
+
} as const;
|
|
49
|
+
|
|
50
|
+
export const zuiSpeechSynthesizerBtnBase = [
|
|
51
|
+
"inline-flex items-center justify-center rounded-full",
|
|
52
|
+
"size-10",
|
|
53
|
+
"transition-all duration-200",
|
|
54
|
+
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
|
|
55
|
+
"bg-[var(--zui-synth-btn-bg,var(--zui-brand,oklch(20.8%_0.042_265.755)))] dark:bg-[var(--zui-synth-btn-bg,var(--zui-brand-dark,oklch(98.4%_0.003_247.858)))]",
|
|
56
|
+
"text-[color:var(--zui-speech-synthesizer-btn-fg,var(--zui-bg,#ffffff))] dark:text-[color:var(--zui-speech-synthesizer-btn-fg-dark,var(--zui-bg-dark,#0f172a))]",
|
|
57
|
+
] as const;
|
|
58
|
+
|
|
59
|
+
export const zuiSpeechSynthesizerBtnSizes = {
|
|
60
|
+
sm: "size-8",
|
|
61
|
+
md: "size-10",
|
|
62
|
+
lg: "size-12",
|
|
63
|
+
} as const;
|
|
64
|
+
|
|
65
|
+
export const zuiSpeechSynthesizerBtnActive = [
|
|
66
|
+
"ring-2 ring-[var(--zui-speech-synthesizer-active-ring,var(--zui-color-green,#16a34a))] dark:ring-[var(--zui-speech-synthesizer-active-ring-dark,var(--zui-color-green-dark,#22c55e))]",
|
|
67
|
+
"ring-offset-2",
|
|
68
|
+
"animate-pulse",
|
|
69
|
+
] as const;
|
|
70
|
+
|
|
71
|
+
export const zuiSpeechSynthesizerTextBase = [
|
|
72
|
+
"text-[color:var(--zui-speech-synthesizer-text-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-speech-synthesizer-text-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))]",
|
|
73
|
+
"text-sm",
|
|
74
|
+
"leading-relaxed",
|
|
75
|
+
] as const;
|
|
76
|
+
|
|
77
|
+
export const zuiSpeechSynthesizerControlsBase = [
|
|
78
|
+
"inline-flex items-center gap-2",
|
|
79
|
+
] as const;
|
|
80
|
+
|
|
81
|
+
export const zuiSpeechSynthesizerProgressBase = [
|
|
82
|
+
"relative w-full h-1 overflow-hidden rounded-full",
|
|
83
|
+
"bg-[var(--zui-speech-synthesizer-track-bg,var(--zui-surface-muted,#0000001a))] dark:bg-[var(--zui-speech-synthesizer-track-bg-dark,var(--zui-surface-muted-dark,#ffffff1a))]",
|
|
84
|
+
] as const;
|
|
85
|
+
|
|
86
|
+
export const zuiSpeechSynthesizerProgressBarBase = [
|
|
87
|
+
"h-full rounded-full",
|
|
88
|
+
"bg-[var(--zui-synth-btn-bg,var(--zui-brand,oklch(20.8%_0.042_265.755)))] dark:bg-[var(--zui-synth-btn-bg,var(--zui-brand-dark,oklch(98.4%_0.003_247.858)))]",
|
|
89
|
+
"transition-all duration-300",
|
|
90
|
+
] as const;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import type { Transition, Variants } from "framer-motion";
|
|
2
|
+
|
|
3
|
+
export type SpeechRecognitionAnimation = "none" | "pulse" | "wave" | "glow";
|
|
4
|
+
|
|
5
|
+
export type SpeechRecognitionAnimationPresets = Record<
|
|
6
|
+
SpeechRecognitionAnimation,
|
|
7
|
+
{
|
|
8
|
+
transition: Transition;
|
|
9
|
+
variants: Variants;
|
|
10
|
+
}
|
|
11
|
+
>;
|
|
12
|
+
|
|
13
|
+
export const speechRecognitionAnimationPresets: SpeechRecognitionAnimationPresets =
|
|
14
|
+
{
|
|
15
|
+
none: {
|
|
16
|
+
transition: { duration: 0 },
|
|
17
|
+
variants: {
|
|
18
|
+
initial: { scale: 1 },
|
|
19
|
+
animate: { scale: 1 },
|
|
20
|
+
},
|
|
21
|
+
},
|
|
22
|
+
pulse: {
|
|
23
|
+
transition: {
|
|
24
|
+
duration: 1,
|
|
25
|
+
repeat: Infinity,
|
|
26
|
+
repeatType: "reverse",
|
|
27
|
+
ease: "easeInOut",
|
|
28
|
+
},
|
|
29
|
+
variants: {
|
|
30
|
+
initial: { scale: 1, opacity: 0.7 },
|
|
31
|
+
animate: { scale: 1.15, opacity: 1 },
|
|
32
|
+
},
|
|
33
|
+
},
|
|
34
|
+
wave: {
|
|
35
|
+
transition: {
|
|
36
|
+
duration: 0.8,
|
|
37
|
+
repeat: Infinity,
|
|
38
|
+
repeatType: "reverse",
|
|
39
|
+
ease: "easeInOut",
|
|
40
|
+
},
|
|
41
|
+
variants: {
|
|
42
|
+
initial: { scale: 1, rotate: 0 },
|
|
43
|
+
animate: { scale: 1.1, rotate: -5 },
|
|
44
|
+
},
|
|
45
|
+
},
|
|
46
|
+
glow: {
|
|
47
|
+
transition: {
|
|
48
|
+
duration: 1.5,
|
|
49
|
+
repeat: Infinity,
|
|
50
|
+
repeatType: "reverse",
|
|
51
|
+
ease: "easeInOut",
|
|
52
|
+
},
|
|
53
|
+
variants: {
|
|
54
|
+
initial: {
|
|
55
|
+
boxShadow: "0 0 0px rgba(59,130,246,0)",
|
|
56
|
+
},
|
|
57
|
+
animate: {
|
|
58
|
+
boxShadow: "0 0 20px rgba(59,130,246,0.5)",
|
|
59
|
+
},
|
|
60
|
+
},
|
|
61
|
+
},
|
|
62
|
+
};
|