npm - @intlayer/design-system - Versions diffs - 5.1.3 → 5.1.5 - Mend

@intlayer/design-system 5.1.3 → 5.1.5

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.

Files changed (197) hide show

package/dist/components/Modal/Modal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.mjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion as m } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport type { FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Button } from '../Button';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\ntype ModalProps = {\n children: React.ReactNode;\n isOpen: boolean;\n onClose?: () => void;\n container?: HTMLElement;\n disableScroll?: boolean;\n hasCloseButton?: boolean;\n title?: string;\n size?: Size;\n} & Pick<\n ContainerProps,\n \| 'className'\n \| 'transparency'\n \| 'border'\n \| 'background'\n \| 'roundedSize'\n \| 'borderColor'\n \| 'padding'\n \| 'separator'\n \| 'gap'\n>;\n\nconst modalVariants = cva(\n 'cursor-default overflow-auto p-3 shadow justify-center',\n {\n variants: {\n ~~variant~~: {\n sm: 'max-h-[30vh] w-[95vw] max-w-xl',\n md: 'max-h-[50vh] w-[95vw] max-w-xl',\n lg: 'max-h-[70vh] w-[95vw] max-w-2xl',\n xl: 'max-h-[95vh] w-[95vw] max-w-~~3xl~~',\n unset: 'max-h-[95vh] w-[95vw]',\n },\n },\n defaultVariants: {\n ~~variant~~: 'unset',\n },\n }\n);\n\ntype Size = 'sm' \| 'md' \| 'lg' \| 'xl' \| 'unset';\n\nconst MotionModal = m.create(Container);\n\n/*\n Usage example:\n * ```jsx\n * <Modal isOpen={isOpen} onClose={onClose}>\n * Modal content\n * </Modal>\n * ```\n */\nexport const Modal: FC<ModalProps> = ({\n children,\n isOpen,\n container,\n disableScroll = false,\n onClose,\n hasCloseButton = false,\n title,\n size = 'md',\n ...props\n}) => {\n const containerElement = useGetElementOrWindow(container);\n\n useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n if (!containerElement) return <></>;\n\n const hasTitle = typeof title === 'string';\n\n return createPortal(\n <m.div\n className=\"bg-background/40 dark:bg-background-dark/40 invisible fixed left-0 top-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto backdrop-blur\"\n animate={isOpen ? 'visible' : 'invisible'}\n variants={{\n visible: {\n opacity: 1,\n visibility: 'visible',\n transition: { duration: 0.1, when: 'beforeChildren' },\n },\n invisible: {\n opacity: 0,\n visibility: 'hidden',\n transition: { duration: 0.1, when: 'afterChildren' },\n },\n }}\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n aria-hidden={!isOpen}\n >\n <MotionModal\n onClick={(e) => e.stopPropagation()}\n initial={{ scale: isOpen ? 0.5 : 1 }}\n animate={{ scale: isOpen ? 1 : 0.5 }}\n transition={{ duration: 0.3 }}\n className={modalVariants({\n ~~variant:~~ size,\n })}\n role=\"dialog\"\n aria-modal\n roundedSize=\"2xl\"\n {...props}\n >\n <div\n className={cn(\n 'cursor-default',\n hasCloseButton && hasTitle\n ? `flex items-center justify-center`\n : hasCloseButton\n ? `flex items-center justify-end`\n : hasTitle\n ? `items-center`\n : `hidden`\n )}\n >\n {hasTitle && (\n <H3 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </H3>\n )}\n {hasCloseButton && (\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label=\"Close modal\"\n className=\"ml-auto\"\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n Icon={X}\n size=\"icon-md\"\n />\n )}\n </div>\n <div className=\"flex flex-1 flex-col items-center overflow-auto\">\n {children}\n </div>\n </MotionModal>\n </m.div>,\n containerElement\n );\n};\n"],"names":["m"],"mappings":";;;;;;;;;;;;;;;;;;;AAmCA,MAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,~~SAAS~~;AAAA,~~QACP~~,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,MAAA;AAAA,IAEX;AAAA,IACA,iBAAiB;AAAA,MACf,~~SAAS~~;AAAA,IAAA;AAAA,~~EACX~~;AAEJ;AAIA,MAAM,cAAcA,OAAE,OAAO,SAAS;AAU/B,MAAM,QAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACE,QAAA,mBAAmB,sBAAsB,SAAS;AAExD,oBAAkB,EAAE,KAAK,SAAS,eAAe,UAAU,eAAe;AAEtE,MAAA,CAAC,iBAAkB,QAAS,oBAAA,UAAA,CAAA,CAAA;AAE1B,QAAA,WAAW,OAAO,UAAU;AAE3B,SAAA;AAAA,IACL;AAAA,MAACA,OAAE;AAAA,MAAF;AAAA,QACC,WAAU;AAAA,QACV,SAAS,SAAS,YAAY;AAAA,QAC9B,UAAU;AAAA,UACR,SAAS;AAAA,YACP,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,YAAY,EAAE,UAAU,KAAK,MAAM,iBAAiB;AAAA,UACtD;AAAA,UACA,WAAW;AAAA,YACT,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,YAAY,EAAE,UAAU,KAAK,MAAM,gBAAgB;AAAA,UAAA;AAAA,QAEvD;AAAA,QACA,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AACR,oBAAA;AAAA,QACZ;AAAA,QACA,eAAa,CAAC;AAAA,QAEd,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,YAClC,SAAS,EAAE,OAAO,SAAS,MAAM,EAAE;AAAA,YACnC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAI;AAAA,YACnC,YAAY,EAAE,UAAU,IAAI;AAAA,YAC5B,WAAW,cAAc;AAAA,cACvB,~~SAAS~~;AAAA,YAAA,~~CACV~~;AAAA,YACD,MAAK;AAAA,YACL,cAAU;AAAA,YACV,aAAY;AAAA,YACX,GAAG;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW;AAAA,oBACT;AAAA,oBACA,kBAAkB,WACd,qCACA,iBACE,kCACA,WACE,iBACA;AAAA,kBACV;AAAA,kBAEC,UAAA;AAAA,oBAAA,YACE,oBAAA,IAAA,EAAG,WAAU,~~sDACX~~,UACH,OAAA;AAAA,oBAED,kBACC;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,SAAQ;AAAA,wBACR,OAAM;AAAA,wBACN,OAAM;AAAA,wBACN,WAAU;AAAA,wBACV,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AACR,oCAAA;AAAA,wBACZ;AAAA,wBACA,MAAM;AAAA,wBACN,MAAK;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACP;AAAA,gBAAA;AAAA,cAEJ;AAAA,cACC,oBAAA,OAAA,EAAI,WAAU,mDACZ,SACH,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,~~MACF~~;AAAA,IACF;AAAA,IACA;AAAA,EACF;AACF;"}
1	+ {"version":3,"file":"Modal.mjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { cva } from 'class-variance-authority';\nimport { motion as m } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport { type FC } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useGetElementOrWindow, useScrollBlockage } from '../../hooks/index';\nimport { cn } from '../../utils/cn';\nimport { Button } from '../Button';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\ntype ModalProps = {\n children: React.ReactNode;\n isOpen: boolean;\n onClose?: () => void;\n container?: HTMLElement;\n disableScroll?: boolean;\n hasCloseButton?: boolean;\n title?: string;\n size?: Size;\n} & Pick<\n ContainerProps,\n \| 'className'\n \| 'transparency'\n \| 'border'\n \| 'background'\n \| 'roundedSize'\n \| 'borderColor'\n \| 'padding'\n \| 'separator'\n \| 'gap'\n>;\n\nconst modalVariants = cva(\n 'cursor-default overflow-auto py-3 shadow justify-center',\n {\n variants: {\n size: {\n sm: 'h-auto max-h-[30vh] w-[95vw] max-w-xl',\n md: 'h-auto max-h-[50vh] w-[95vw] max-w-xl',\n lg: 'h-auto max-h-[70vh] w-[95vw] max-w-2xl',\n xl: 'h-auto max-h-[95vh] w-[95vw] max-w-6xl',\n unset: 'h-auto max-h-[95vh] w-[95vw]',\n },\n },\n defaultVariants: {\n size: 'unset',\n },\n }\n);\n\ntype Size = 'sm' \| 'md' \| 'lg' \| 'xl' \| 'unset';\n\nconst MotionModal = m.create(Container);\n\n/*\n Usage example:\n * ```jsx\n * <Modal isOpen={isOpen} onClose={onClose}>\n * Modal content\n * </Modal>\n * ```\n */\nexport const Modal: FC<ModalProps> = ({\n children,\n isOpen,\n container,\n disableScroll = false,\n onClose,\n hasCloseButton = false,\n title,\n size = 'md',\n className,\n ...props\n}) => {\n const containerElement = useGetElementOrWindow(container);\n\n useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n if (!containerElement) return <></>;\n\n const hasTitle = typeof title === 'string';\n\n return createPortal(\n <m.div\n className=\"bg-background/40 dark:bg-background-dark/40 invisible fixed left-0 top-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto backdrop-blur\"\n animate={isOpen ? 'visible' : 'invisible'}\n variants={{\n visible: {\n opacity: 1,\n visibility: 'visible',\n transition: { duration: 0.1, when: 'beforeChildren' },\n },\n invisible: {\n opacity: 0,\n visibility: 'hidden',\n transition: { duration: 0.1, when: 'afterChildren' },\n },\n }}\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n aria-hidden={!isOpen}\n >\n <div className=\"flex justify-center p-4\">\n <MotionModal\n onClick={(e) => e.stopPropagation()}\n initial={{ scale: isOpen ? 0.5 : 1 }}\n animate={{ scale: isOpen ? 1 : 0.5 }}\n transition={{ duration: 0.3 }}\n className={modalVariants({\n size,\n className,\n })}\n role=\"dialog\"\n aria-modal\n roundedSize=\"2xl\"\n {...props}\n >\n <div\n className={cn(\n 'cursor-default px-4',\n hasCloseButton && hasTitle\n ? `flex items-center justify-center`\n : hasCloseButton\n ? `flex items-center justify-end`\n : hasTitle\n ? `items-center`\n : `hidden`\n )}\n >\n {hasTitle && (\n <H3 className=\"ml-4 flex items-center justify-center text-lg font-bold\">\n {title}\n </H3>\n )}\n {hasCloseButton && (\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label=\"Close modal\"\n className=\"ml-auto\"\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n Icon={X}\n size=\"icon-md\"\n />\n )}\n </div>\n <div className=\"flex flex-1 flex-col items-center overflow-auto\">\n {children}\n </div>\n </MotionModal>\n </div>\n </m.div>,\n containerElement\n );\n};\n"],"names":["m"],"mappings":";;;;;;;;;;;;;;;;;;;AAmCA,MAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,MAAA;AAAA,IAEX;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ;AAIA,MAAM,cAAcA,OAAE,OAAO,SAAS;AAU/B,MAAM,QAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,GAAG;AACL,MAAM;AACE,QAAA,mBAAmB,sBAAsB,SAAS;AAExD,oBAAkB,EAAE,KAAK,SAAS,eAAe,UAAU,eAAe;AAEtE,MAAA,CAAC,iBAAkB,QAAS,oBAAA,UAAA,CAAA,CAAA;AAE1B,QAAA,WAAW,OAAO,UAAU;AAE3B,SAAA;AAAA,IACL;AAAA,MAACA,OAAE;AAAA,MAAF;AAAA,QACC,WAAU;AAAA,QACV,SAAS,SAAS,YAAY;AAAA,QAC9B,UAAU;AAAA,UACR,SAAS;AAAA,YACP,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,YAAY,EAAE,UAAU,KAAK,MAAM,iBAAiB;AAAA,UACtD;AAAA,UACA,WAAW;AAAA,YACT,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,YAAY,EAAE,UAAU,KAAK,MAAM,gBAAgB;AAAA,UAAA;AAAA,QAEvD;AAAA,QACA,SAAS,CAAC,MAAM;AACd,YAAE,gBAAgB;AACR,oBAAA;AAAA,QACZ;AAAA,QACA,eAAa,CAAC;AAAA,QAEd,UAAA,oBAAC,OAAI,EAAA,WAAU,2BACb,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,YAClC,SAAS,EAAE,OAAO,SAAS,MAAM,EAAE;AAAA,YACnC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAI;AAAA,YACnC,YAAY,EAAE,UAAU,IAAI;AAAA,YAC5B,WAAW,cAAc;AAAA,cACvB;AAAA,cACA;AAAA,YAAA,CACD;AAAA,YACD,MAAK;AAAA,YACL,cAAU;AAAA,YACV,aAAY;AAAA,YACX,GAAG;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW;AAAA,oBACT;AAAA,oBACA,kBAAkB,WACd,qCACA,iBACE,kCACA,WACE,iBACA;AAAA,kBACV;AAAA,kBAEC,UAAA;AAAA,oBAAA,YACE,oBAAA,IAAA,EAAG,WAAU,2DACX,UACH,OAAA;AAAA,oBAED,kBACC;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,SAAQ;AAAA,wBACR,OAAM;AAAA,wBACN,OAAM;AAAA,wBACN,WAAU;AAAA,wBACV,SAAS,CAAC,MAAM;AACd,4BAAE,gBAAgB;AACR,oCAAA;AAAA,wBACZ;AAAA,wBACA,MAAM;AAAA,wBACN,MAAK;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACP;AAAA,gBAAA;AAAA,cAEJ;AAAA,cACC,oBAAA,OAAA,EAAI,WAAU,mDACZ,SACH,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,EAEJ,CAAA;AAAA,MAAA;AAAA,IACF;AAAA,IACA;AAAA,EACF;AACF;"}

package/dist/components/RightDrawer/RightDrawer.cjs CHANGED Viewed

@@ -112,7 +112,7 @@ const RightDrawer = ({
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-full flex-col overflow-y-auto p-2", children: /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: "flex-1",
+            className: "flex flex-1 flex-col",
             onClick: handleSpareSpaceClick,
             ref: childrenContainerRef,
             children

package/dist/components/RightDrawer/RightDrawer.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RightDrawer.cjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n RefObject,\n} from 'react';\nimport { useShallow } from 'zustand/react/shallow';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Button } from '../Button';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { close, open, isOpen } = useRightDrawerStore(\n useShallow((s) => ({\n close: () => s.close(identifier),\n open: () => s.open(identifier),\n isOpen: s.isOpen(identifier),\n }))\n );\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? `right_drawer_${identifier}` : 'right_drawer',\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n try {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n\n // Check if click is outside the drawer panel\n const isClickOutside =\n event.target && !panelRef.current.contains(event.target as Node);\n\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (\n (isClickAble && isClickOutside && isAtTopAndVisible) \|\|\n !event.target\n ) {\n close();\n onClose?.();\n }\n } catch (_e) {\n close();\n onClose?.();\n }\n };\n\n window.addEventListener('mousedown', handleClickOutside);\n return () => window.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick, identifier]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp, identifier]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label={backButton.text ?? 'Go back'}\n onClick={backButton.onBack}\n Icon={ChevronLeft}\n >\n {backButton?.text}\n </Button>\n )}\n </div>\n <div>\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label=\"Close\"\n className=\"ml-auto\"\n onClick={close}\n Icon={X}\n size=\"icon-md\"\n />\n </div>\n </div>\n {title && (\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n )}\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex-1\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":["useDevice","useRef","useRightDrawerStore","useShallow","useScrollBlockage","useEffect","isElementAtTopAndNotCovered","jsx","MaxWidthSmoother","jsxs","Container","Button","ChevronLeft","X"],"mappings":"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"}
1	+ {"version":3,"file":"RightDrawer.cjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n RefObject,\n} from 'react';\nimport { useShallow } from 'zustand/react/shallow';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Button } from '../Button';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { close, open, isOpen } = useRightDrawerStore(\n useShallow((s) => ({\n close: () => s.close(identifier),\n open: () => s.open(identifier),\n isOpen: s.isOpen(identifier),\n }))\n );\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? `right_drawer_${identifier}` : 'right_drawer',\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n try {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n\n // Check if click is outside the drawer panel\n const isClickOutside =\n event.target && !panelRef.current.contains(event.target as Node);\n\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (\n (isClickAble && isClickOutside && isAtTopAndVisible) \|\|\n !event.target\n ) {\n close();\n onClose?.();\n }\n } catch (_e) {\n close();\n onClose?.();\n }\n };\n\n window.addEventListener('mousedown', handleClickOutside);\n return () => window.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick, identifier]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp, identifier]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label={backButton.text ?? 'Go back'}\n onClick={backButton.onBack}\n Icon={ChevronLeft}\n >\n {backButton?.text}\n </Button>\n )}\n </div>\n <div>\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label=\"Close\"\n className=\"ml-auto\"\n onClick={close}\n Icon={X}\n size=\"icon-md\"\n />\n </div>\n </div>\n {title && (\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n )}\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex flex-1 flex-col\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":["useDevice","useRef","useRightDrawerStore","useShallow","useScrollBlockage","useEffect","isElementAtTopAndNotCovered","jsx","MaxWidthSmoother","jsxs","Container","Button","ChevronLeft","X"],"mappings":"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"}

package/dist/components/RightDrawer/RightDrawer.mjs CHANGED Viewed

@@ -110,7 +110,7 @@ const RightDrawer = ({
         /* @__PURE__ */ jsx("div", { className: "flex h-full flex-col overflow-y-auto p-2", children: /* @__PURE__ */ jsx(
           "div",
           {
-            className: "flex-1",
+            className: "flex flex-1 flex-col",
             onClick: handleSpareSpaceClick,
             ref: childrenContainerRef,
             children

package/dist/components/RightDrawer/RightDrawer.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RightDrawer.mjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n RefObject,\n} from 'react';\nimport { useShallow } from 'zustand/react/shallow';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Button } from '../Button';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { close, open, isOpen } = useRightDrawerStore(\n useShallow((s) => ({\n close: () => s.close(identifier),\n open: () => s.open(identifier),\n isOpen: s.isOpen(identifier),\n }))\n );\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? `right_drawer_${identifier}` : 'right_drawer',\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n try {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n\n // Check if click is outside the drawer panel\n const isClickOutside =\n event.target && !panelRef.current.contains(event.target as Node);\n\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (\n (isClickAble && isClickOutside && isAtTopAndVisible) \|\|\n !event.target\n ) {\n close();\n onClose?.();\n }\n } catch (_e) {\n close();\n onClose?.();\n }\n };\n\n window.addEventListener('mousedown', handleClickOutside);\n return () => window.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick, identifier]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp, identifier]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label={backButton.text ?? 'Go back'}\n onClick={backButton.onBack}\n Icon={ChevronLeft}\n >\n {backButton?.text}\n </Button>\n )}\n </div>\n <div>\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label=\"Close\"\n className=\"ml-auto\"\n onClick={close}\n Icon={X}\n size=\"icon-md\"\n />\n </div>\n </div>\n {title && (\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n )}\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex-1\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"RightDrawer.mjs","sources":["../../../src/components/RightDrawer/RightDrawer.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions /\n/ eslint-disable jsx-a11y/click-events-have-key-events */\n'use client';\n\nimport { ChevronLeft, X } from 'lucide-react';\nimport {\n type ReactNode,\n type FC,\n useEffect,\n useRef,\n type MouseEventHandler,\n RefObject,\n} from 'react';\nimport { useShallow } from 'zustand/react/shallow';\nimport { useDevice } from '../../hooks/useDevice';\nimport { useScrollBlockage } from '../../hooks/useScrollBlockage';\nimport { isElementAtTopAndNotCovered } from '../../utils/isElementAtTopAndNotCovered';\nimport { Button } from '../Button';\nimport { Container } from '../Container';\nimport { MaxWidthSmoother } from '../MaxWidthSmoother/index';\nimport { useRightDrawerStore } from './useRightDrawerStore';\n\ntype BackButtonProps = {\n onBack: () => void;\n text?: string;\n};\n\ntype RightDrawerProps = {\n title?: ReactNode;\n identifier: string;\n children?: ReactNode;\n header?: ReactNode;\n closeOnOutsideClick?: boolean;\n backButton?: BackButtonProps;\n isOpen?: boolean;\n onClose?: () => void;\n};\n\nexport const RightDrawer: FC<RightDrawerProps> = ({\n title,\n identifier,\n children,\n header,\n closeOnOutsideClick = true,\n backButton,\n isOpen: isOpenProp,\n onClose,\n}) => {\n const { isMobile } = useDevice('md');\n const panelRef = useRef<HTMLDivElement>(null);\n const childrenContainerRef = useRef<HTMLDivElement>(null);\n const { close, open, isOpen } = useRightDrawerStore(\n useShallow((s) => ({\n close: () => s.close(identifier),\n open: () => s.open(identifier),\n isOpen: s.isOpen(identifier),\n }))\n );\n\n useScrollBlockage({\n disableScroll: isOpen,\n key: identifier ? `right_drawer_${identifier}` : 'right_drawer',\n });\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n try {\n if (!panelRef.current) return;\n\n // Check if drawer is open and click outside is enabled\n const isClickAble = isOpen && closeOnOutsideClick;\n\n // Check if click is outside the drawer panel\n const isClickOutside =\n event.target && !panelRef.current.contains(event.target as Node);\n\n // Check if event propagation has been stopped\n const isAtTopAndVisible = isElementAtTopAndNotCovered(panelRef.current);\n\n if (\n (isClickAble && isClickOutside && isAtTopAndVisible) \|\|\n !event.target\n ) {\n close();\n onClose?.();\n }\n } catch (_e) {\n close();\n onClose?.();\n }\n };\n\n window.addEventListener('mousedown', handleClickOutside);\n return () => window.removeEventListener('mousedown', handleClickOutside);\n }, [isOpen, close, onClose, closeOnOutsideClick, identifier]); // Make sure the effect runs only if isOpen or close changes\n\n useEffect(() => {\n if (isOpenProp !== undefined) {\n if (isOpenProp) {\n open();\n } else {\n close();\n onClose?.();\n }\n }\n }, [close, open, onClose, isOpenProp, identifier]);\n\n const handleSpareSpaceClick: MouseEventHandler<HTMLDivElement> = (e) => {\n // Check if the click trigger the background\n if (e.target !== e.currentTarget) {\n return;\n }\n\n if (isMobile) {\n close();\n onClose?.();\n }\n };\n\n return (\n <div className=\"fixed right-0 top-0 z-50 flex h-full justify-end\">\n <MaxWidthSmoother isHidden={!isOpen} align=\"right\">\n <Container\n className=\"text-text dark:text-text-dark relative flex h-screen w-screen flex-col md:w-[400px]\"\n ref={panelRef}\n roundedSize=\"none\"\n >\n <div className=\"flex flex-col gap-3 p-6\">\n <div className=\"flex justify-between gap-3\">\n <div>\n {backButton && (\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label={backButton.text ?? 'Go back'}\n onClick={backButton.onBack}\n Icon={ChevronLeft}\n >\n {backButton?.text}\n </Button>\n )}\n </div>\n <div>\n <Button\n variant=\"hoverable\"\n color=\"text\"\n label=\"Close\"\n className=\"ml-auto\"\n onClick={close}\n Icon={X}\n size=\"icon-md\"\n />\n </div>\n </div>\n {title && (\n <h2 className=\"flex items-center justify-center text-lg font-bold\">\n {title}\n </h2>\n )}\n {header}\n </div>\n\n <div className=\"flex h-full flex-col overflow-y-auto p-2\">\n <div\n className=\"flex flex-1 flex-col\"\n onClick={handleSpareSpaceClick}\n ref={childrenContainerRef}\n >\n {children}\n </div>\n </div>\n </Container>\n </MaxWidthSmoother>\n </div>\n );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Select/Multiselect.cjs CHANGED Viewed

@@ -317,7 +317,6 @@ const MultiSelectItem = ({ className, value, children, ...props }) => {
     }
   );
 };
-MultiSelectItem.displayName = "MultiSelectItem";
 const MultiSelect = MultiSelectRoot;
 MultiSelect.Trigger = MultiSelectTrigger;
 MultiSelect.Input = MultiSelectInput;

package/dist/components/Select/Multiselect.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Multiselect.cjs","sources":["../../../src/components/Select/Multiselect.tsx"],"sourcesContent":["'use client';\n\nimport { X as RemoveIcon, Check } from 'lucide-react';\nimport {\n type ComponentProps,\n type Dispatch,\n type FC,\n type HTMLAttributes,\n type KeyboardEvent,\n type LegacyRef,\n type MouseEventHandler,\n type RefObject,\n type SetStateAction,\n type SyntheticEvent,\n createContext,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Badge } from '../Badge';\nimport { Command, CommandRoot } from '../Command';\n\ntype MultiSelectContextProps = {\n value: string[];\n onValueChange: (value: string) => void;\n open: boolean;\n setOpen: (value: boolean) => void;\n inputValue: string;\n setInputValue: Dispatch<SetStateAction<string>>;\n activeIndex: number;\n setActiveIndex: Dispatch<SetStateAction<number>>;\n ref: RefObject<HTMLInputElement \| null>;\n handleSelect: (e: SyntheticEvent<HTMLInputElement>) => void;\n};\n\nconst MultiSelectContext = createContext<MultiSelectContextProps \| null>(null);\n\nconst useMultiSelect = () => {\n const context = useContext(MultiSelectContext);\n if (!context) {\n throw new Error('useMultiSelect must be used within MultiSelectProvider');\n }\n return context;\n};\n\n/*\n MultiSelect Docs: {@link: https://shadcn-extension.vercel.app/docs/multi-select}\n /\n\ntype MultiSelectProps = ComponentProps<typeof CommandRoot> & {\n values?: string[];\n defaultValues?: string[];\n onValueChange?: (value: string[]) => void;\n loop?: boolean;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelectTrigger>\n * <MultiSelectInput placeholder=\"Select your framework\" />\n * </MultiSelectTrigger>\n * <MultiSelectContent>\n * <MultiSelectList>\n * <MultiSelectItem value={\"React\"}>React</MultiSelectItem>\n * <MultiSelectItem value={\"Vue\"}>Vue</MultiSelectItem>\n * <MultiSelectItem value={\"Svelte\"}>Svelte</MultiSelectItem>\n * </MultiSelectList>\n * </MultiSelectContent>\n * </MultiSelect>\n * ```\n /\nconst MultiSelectRoot: FC<MultiSelectProps> = ({\n values: valuesProp,\n defaultValues,\n onValueChange: onValueChange,\n loop = false,\n className,\n children,\n dir,\n ...props\n}) => {\n const [value, setValue] = useState<string[]>(defaultValues ?? []);\n const [inputValue, setInputValue] = useState('');\n const [open, setOpen] = useState<boolean>(false);\n const [activeIndex, setActiveIndex] = useState<number>(-1);\n const inputRef = useRef<HTMLInputElement>(null);\n const [isValueSelected, setIsValueSelected] = useState(false);\n const [selectedValue, setSelectedValue] = useState('');\n\n useEffect(() => {\n if (valuesProp) {\n setValue(valuesProp);\n }\n }, [valuesProp]);\n\n const onValueChangeHandler = useCallback(\n (val: string) => {\n if (value.includes(val)) {\n const newValue = value.filter((item) => item !== val);\n setValue(newValue);\n onValueChange?.(newValue);\n } else {\n const newValue = [...value, val];\n setValue(newValue);\n onValueChange?.(newValue);\n }\n },\n\n [value]\n );\n\n const handleSelect = useCallback(\n (e: SyntheticEvent<HTMLInputElement>) => {\n e.preventDefault();\n const target = e.currentTarget;\n const selection = target.value.substring(\n target.selectionStart ?? 0,\n target.selectionEnd ?? 0\n );\n\n setSelectedValue(selection);\n setIsValueSelected(selection === inputValue);\n },\n [inputValue]\n );\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n e.stopPropagation();\n const target = inputRef.current;\n\n if (!target) return;\n\n const moveNext = () => {\n const nextIndex = activeIndex + 1;\n setActiveIndex(\n nextIndex > value.length - 1 ? (loop ? 0 : -1) : nextIndex\n );\n };\n\n const movePrev = () => {\n const prevIndex = activeIndex - 1;\n setActiveIndex(prevIndex < 0 ? value.length - 1 : prevIndex);\n };\n\n const moveCurrent = () => {\n const newIndex =\n activeIndex - 1 <= 0\n ? value.length - 1 === 0\n ? -1\n : 0\n : activeIndex - 1;\n setActiveIndex(newIndex);\n };\n\n switch (e.key) {\n case 'ArrowLeft':\n if (dir === 'rtl') {\n if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n } else if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n break;\n\n case 'ArrowRight':\n if (dir === 'rtl') {\n if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n } else if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n break;\n\n case 'Backspace':\n case 'Delete':\n if (value.length > 0) {\n if (activeIndex !== -1 && activeIndex < value.length) {\n onValueChangeHandler(value[activeIndex]);\n moveCurrent();\n } else if (\n (target.selectionStart === 0 && selectedValue === inputValue) \|\|\n isValueSelected\n ) {\n onValueChangeHandler(value[value.length - 1]);\n }\n }\n break;\n\n case 'Enter':\n setOpen(true);\n break;\n\n case 'Escape':\n if (activeIndex !== -1) {\n setActiveIndex(-1);\n } else if (open) {\n setOpen(false);\n }\n break;\n }\n },\n\n [value, inputValue, activeIndex, loop]\n );\n\n const memoValue = useMemo(\n () => ({\n value,\n onValueChange: onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n ref: inputRef,\n handleSelect,\n }),\n [\n value,\n onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n inputRef,\n handleSelect,\n ]\n );\n\n return (\n <MultiSelectContext value={memoValue}>\n <CommandRoot\n onKeyDown={handleKeyDown}\n className={cn(\n 'flex w-full flex-col gap-2 overflow-visible bg-transparent',\n className\n )}\n dir={dir}\n {...props}\n >\n {children}\n </CommandRoot>\n </MultiSelectContext>\n );\n};\n\nconst MultiSelectTrigger: FC<\n HTMLAttributes<HTMLDivElement> & {\n getBadgeValue?: (value: string) => string;\n validationStyleEnabled?: boolean;\n }\n> = ({\n className,\n getBadgeValue = (value) => value,\n validationStyleEnabled = false,\n children,\n ...props\n}) => {\n const { value, onValueChange, activeIndex } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n return (\n <div\n className={cn(\n 'flex w-full flex-col gap-3 rounded-lg p-1 py-2',\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {value.length > 0 && (\n <div className=\"flex w-full flex-wrap gap-1\">\n {value.map((item, index) => (\n <Badge\n key={item}\n className={cn(\n 'flex items-center gap-1 rounded-xl px-1',\n activeIndex === index && 'ring-muted-foreground ring-2'\n )}\n color=\"text\"\n >\n <span className=\"text-xs\">{getBadgeValue(item)}</span>\n <button\n aria-label={`Remove ${item} option`}\n aria-roledescription=\"button to remove option\"\n onMouseDown={mousePreventDefault}\n onClick={() => onValueChange(item)}\n >\n <span className=\"sr-only\">Remove {item} option</span>\n <RemoveIcon className=\"size-4 cursor-pointer\" />\n </button>\n </Badge>\n ))}\n </div>\n )}\n {children}\n </div>\n );\n};\n\nconst MultiSelectInput: FC<ComponentProps<typeof Command.Input>> = ({\n className,\n ...props\n}) => {\n const {\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n handleSelect,\n ref: inputRef,\n } = useMultiSelect();\n\n return (\n <Command.Input\n {...props}\n tabIndex={0}\n ref={inputRef as LegacyRef<HTMLInputElement>}\n value={inputValue}\n onValueChange={activeIndex === -1 ? setInputValue : undefined}\n onSelect={handleSelect}\n onBlur={() => setOpen(false)}\n onFocus={() => setOpen(true)}\n onClick={() => setActiveIndex(-1)}\n className={cn(\n 'ml-2 flex-1 cursor-pointer outline-none',\n className,\n activeIndex !== -1 && 'caret-transparent'\n )}\n />\n );\n};\n\nconst MultiSelectContent: FC<HTMLAttributes<HTMLDivElement>> = ({\n children,\n}) => {\n const { open } = useMultiSelect();\n return <div className=\"relative\">{open && children}</div>;\n};\n\nconst MultiSelectList: typeof Command.List = ({ className, children }) => (\n <Command.List\n className={cn(\n 'border-muted bg-input-background dark:bg-input-background-dark absolute top-0 z-10 flex w-full flex-col gap-2 rounded-lg border p-2 shadow-md transition-colors',\n className\n )}\n >\n {children}\n <Command.Empty>\n <span className=\"text-muted-foreground\">No results found</span>\n </Command.Empty>\n </Command.List>\n);\n\nconst MultiSelectItem: FC<\n { value: string } & ComponentProps<typeof Command.Item>\n> = ({ className, value, children, ...props }) => {\n const { value: Options, onValueChange, setInputValue } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n const isIncluded = Options.includes(value);\n return (\n <Command.Item\n {...props}\n onSelect={() => {\n onValueChange(value);\n setInputValue('');\n }}\n className={cn(\n 'flex cursor-pointer justify-between rounded-lg px-2 py-1 transition-colors',\n 'hover:bg-neutral/10 dark:hover:bg-neutral-dark/10',\n className,\n isIncluded && 'opacity-50',\n props.disabled && 'cursor-not-allowed opacity-50'\n )}\n onMouseDown={mousePreventDefault}\n >\n {children}\n {isIncluded && <Check className=\"size-4\" />}\n </Command.Item>\n );\n};\n\nMultiSelectItem.displayName = 'MultiSelectItem';\n\ntype MultiSelectType = typeof MultiSelectRoot & {\n Trigger: typeof MultiSelectTrigger;\n Input: typeof MultiSelectInput;\n Content: typeof MultiSelectContent;\n List: typeof MultiSelectList;\n Item: typeof MultiSelectItem;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelect.Trigger>\n * <MultiSelect.Input placeholder=\"Select your framework\" />\n * </MultiSelect.Trigger>\n * <MultiSelect.Content>\n * <MultiSelect.List>\n * <MultiSelect.Item value={\"React\"}>React</MultiSelect.Item>\n * <MultiSelect.Item value={\"Vue\"}>Vue</MultiSelect.Item>\n * <MultiSelect.Item value={\"Svelte\"}>Svelte</MultiSelect.Item>\n * </MultiSelect.List>\n * </MultiSelect.Content>\n * </MultiSelect>\n * ```\n */\nexport const MultiSelect = MultiSelectRoot as MultiSelectType;\nMultiSelect.Trigger = MultiSelectTrigger;\nMultiSelect.Input = MultiSelectInput;\nMultiSelect.Content = MultiSelectContent;\nMultiSelect.List = MultiSelectList;\nMultiSelect.Item = MultiSelectItem;\n"],"names":["createContext","useContext","useState","useRef","useEffect","useCallback","useMemo","jsx","CommandRoot","cn","jsxs","Badge","RemoveIcon","Command","Check"],"mappings":"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"}
1	+ {"version":3,"file":"Multiselect.cjs","sources":["../../../src/components/Select/Multiselect.tsx"],"sourcesContent":["'use client';\n\nimport { X as RemoveIcon, Check } from 'lucide-react';\nimport {\n type ComponentProps,\n type Dispatch,\n type FC,\n type HTMLAttributes,\n type KeyboardEvent,\n type LegacyRef,\n type MouseEventHandler,\n type RefObject,\n type SetStateAction,\n type SyntheticEvent,\n createContext,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Badge } from '../Badge';\nimport { Command, CommandRoot } from '../Command';\n\ntype MultiSelectContextProps = {\n value: string[];\n onValueChange: (value: string) => void;\n open: boolean;\n setOpen: (value: boolean) => void;\n inputValue: string;\n setInputValue: Dispatch<SetStateAction<string>>;\n activeIndex: number;\n setActiveIndex: Dispatch<SetStateAction<number>>;\n ref: RefObject<HTMLInputElement \| null>;\n handleSelect: (e: SyntheticEvent<HTMLInputElement>) => void;\n};\n\nconst MultiSelectContext = createContext<MultiSelectContextProps \| null>(null);\n\nconst useMultiSelect = () => {\n const context = useContext(MultiSelectContext);\n if (!context) {\n throw new Error('useMultiSelect must be used within MultiSelectProvider');\n }\n return context;\n};\n\n/*\n MultiSelect Docs: {@link: https://shadcn-extension.vercel.app/docs/multi-select}\n /\n\ntype MultiSelectProps = ComponentProps<typeof CommandRoot> & {\n values?: string[];\n defaultValues?: string[];\n onValueChange?: (value: string[]) => void;\n loop?: boolean;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelectTrigger>\n * <MultiSelectInput placeholder=\"Select your framework\" />\n * </MultiSelectTrigger>\n * <MultiSelectContent>\n * <MultiSelectList>\n * <MultiSelectItem value={\"React\"}>React</MultiSelectItem>\n * <MultiSelectItem value={\"Vue\"}>Vue</MultiSelectItem>\n * <MultiSelectItem value={\"Svelte\"}>Svelte</MultiSelectItem>\n * </MultiSelectList>\n * </MultiSelectContent>\n * </MultiSelect>\n * ```\n /\nconst MultiSelectRoot: FC<MultiSelectProps> = ({\n values: valuesProp,\n defaultValues,\n onValueChange: onValueChange,\n loop = false,\n className,\n children,\n dir,\n ...props\n}) => {\n const [value, setValue] = useState<string[]>(defaultValues ?? []);\n const [inputValue, setInputValue] = useState('');\n const [open, setOpen] = useState<boolean>(false);\n const [activeIndex, setActiveIndex] = useState<number>(-1);\n const inputRef = useRef<HTMLInputElement>(null);\n const [isValueSelected, setIsValueSelected] = useState(false);\n const [selectedValue, setSelectedValue] = useState('');\n\n useEffect(() => {\n if (valuesProp) {\n setValue(valuesProp);\n }\n }, [valuesProp]);\n\n const onValueChangeHandler = useCallback(\n (val: string) => {\n if (value.includes(val)) {\n const newValue = value.filter((item) => item !== val);\n setValue(newValue);\n onValueChange?.(newValue);\n } else {\n const newValue = [...value, val];\n setValue(newValue);\n onValueChange?.(newValue);\n }\n },\n\n [value]\n );\n\n const handleSelect = useCallback(\n (e: SyntheticEvent<HTMLInputElement>) => {\n e.preventDefault();\n const target = e.currentTarget;\n const selection = target.value.substring(\n target.selectionStart ?? 0,\n target.selectionEnd ?? 0\n );\n\n setSelectedValue(selection);\n setIsValueSelected(selection === inputValue);\n },\n [inputValue]\n );\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n e.stopPropagation();\n const target = inputRef.current;\n\n if (!target) return;\n\n const moveNext = () => {\n const nextIndex = activeIndex + 1;\n setActiveIndex(\n nextIndex > value.length - 1 ? (loop ? 0 : -1) : nextIndex\n );\n };\n\n const movePrev = () => {\n const prevIndex = activeIndex - 1;\n setActiveIndex(prevIndex < 0 ? value.length - 1 : prevIndex);\n };\n\n const moveCurrent = () => {\n const newIndex =\n activeIndex - 1 <= 0\n ? value.length - 1 === 0\n ? -1\n : 0\n : activeIndex - 1;\n setActiveIndex(newIndex);\n };\n\n switch (e.key) {\n case 'ArrowLeft':\n if (dir === 'rtl') {\n if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n } else if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n break;\n\n case 'ArrowRight':\n if (dir === 'rtl') {\n if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n } else if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n break;\n\n case 'Backspace':\n case 'Delete':\n if (value.length > 0) {\n if (activeIndex !== -1 && activeIndex < value.length) {\n onValueChangeHandler(value[activeIndex]);\n moveCurrent();\n } else if (\n (target.selectionStart === 0 && selectedValue === inputValue) \|\|\n isValueSelected\n ) {\n onValueChangeHandler(value[value.length - 1]);\n }\n }\n break;\n\n case 'Enter':\n setOpen(true);\n break;\n\n case 'Escape':\n if (activeIndex !== -1) {\n setActiveIndex(-1);\n } else if (open) {\n setOpen(false);\n }\n break;\n }\n },\n\n [value, inputValue, activeIndex, loop]\n );\n\n const memoValue = useMemo(\n () => ({\n value,\n onValueChange: onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n ref: inputRef,\n handleSelect,\n }),\n [\n value,\n onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n inputRef,\n handleSelect,\n ]\n );\n\n return (\n <MultiSelectContext value={memoValue}>\n <CommandRoot\n onKeyDown={handleKeyDown}\n className={cn(\n 'flex w-full flex-col gap-2 overflow-visible bg-transparent',\n className\n )}\n dir={dir}\n {...props}\n >\n {children}\n </CommandRoot>\n </MultiSelectContext>\n );\n};\n\nconst MultiSelectTrigger: FC<\n HTMLAttributes<HTMLDivElement> & {\n getBadgeValue?: (value: string) => string;\n validationStyleEnabled?: boolean;\n }\n> = ({\n className,\n getBadgeValue = (value) => value,\n validationStyleEnabled = false,\n children,\n ...props\n}) => {\n const { value, onValueChange, activeIndex } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n return (\n <div\n className={cn(\n 'flex w-full flex-col gap-3 rounded-lg p-1 py-2',\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {value.length > 0 && (\n <div className=\"flex w-full flex-wrap gap-1\">\n {value.map((item, index) => (\n <Badge\n key={item}\n className={cn(\n 'flex items-center gap-1 rounded-xl px-1',\n activeIndex === index && 'ring-muted-foreground ring-2'\n )}\n color=\"text\"\n >\n <span className=\"text-xs\">{getBadgeValue(item)}</span>\n <button\n aria-label={`Remove ${item} option`}\n aria-roledescription=\"button to remove option\"\n onMouseDown={mousePreventDefault}\n onClick={() => onValueChange(item)}\n >\n <span className=\"sr-only\">Remove {item} option</span>\n <RemoveIcon className=\"size-4 cursor-pointer\" />\n </button>\n </Badge>\n ))}\n </div>\n )}\n {children}\n </div>\n );\n};\n\nconst MultiSelectInput: FC<ComponentProps<typeof Command.Input>> = ({\n className,\n ...props\n}) => {\n const {\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n handleSelect,\n ref: inputRef,\n } = useMultiSelect();\n\n return (\n <Command.Input\n {...props}\n tabIndex={0}\n ref={inputRef as LegacyRef<HTMLInputElement>}\n value={inputValue}\n onValueChange={activeIndex === -1 ? setInputValue : undefined}\n onSelect={handleSelect}\n onBlur={() => setOpen(false)}\n onFocus={() => setOpen(true)}\n onClick={() => setActiveIndex(-1)}\n className={cn(\n 'ml-2 flex-1 cursor-pointer outline-none',\n className,\n activeIndex !== -1 && 'caret-transparent'\n )}\n />\n );\n};\n\nconst MultiSelectContent: FC<HTMLAttributes<HTMLDivElement>> = ({\n children,\n}) => {\n const { open } = useMultiSelect();\n return <div className=\"relative\">{open && children}</div>;\n};\n\nconst MultiSelectList: typeof Command.List = ({ className, children }) => (\n <Command.List\n className={cn(\n 'border-muted bg-input-background dark:bg-input-background-dark absolute top-0 z-10 flex w-full flex-col gap-2 rounded-lg border p-2 shadow-md transition-colors',\n className\n )}\n >\n {children}\n <Command.Empty>\n <span className=\"text-muted-foreground\">No results found</span>\n </Command.Empty>\n </Command.List>\n);\n\nconst MultiSelectItem: FC<\n { value: string } & ComponentProps<typeof Command.Item>\n> = ({ className, value, children, ...props }) => {\n const { value: Options, onValueChange, setInputValue } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n const isIncluded = Options.includes(value);\n return (\n <Command.Item\n {...props}\n onSelect={() => {\n onValueChange(value);\n setInputValue('');\n }}\n className={cn(\n 'flex cursor-pointer justify-between rounded-lg px-2 py-1 transition-colors',\n 'hover:bg-neutral/10 dark:hover:bg-neutral-dark/10',\n className,\n isIncluded && 'opacity-50',\n props.disabled && 'cursor-not-allowed opacity-50'\n )}\n onMouseDown={mousePreventDefault}\n >\n {children}\n {isIncluded && <Check className=\"size-4\" />}\n </Command.Item>\n );\n};\n\ntype MultiSelectType = typeof MultiSelectRoot & {\n Trigger: typeof MultiSelectTrigger;\n Input: typeof MultiSelectInput;\n Content: typeof MultiSelectContent;\n List: typeof MultiSelectList;\n Item: typeof MultiSelectItem;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelect.Trigger>\n * <MultiSelect.Input placeholder=\"Select your framework\" />\n * </MultiSelect.Trigger>\n * <MultiSelect.Content>\n * <MultiSelect.List>\n * <MultiSelect.Item value={\"React\"}>React</MultiSelect.Item>\n * <MultiSelect.Item value={\"Vue\"}>Vue</MultiSelect.Item>\n * <MultiSelect.Item value={\"Svelte\"}>Svelte</MultiSelect.Item>\n * </MultiSelect.List>\n * </MultiSelect.Content>\n * </MultiSelect>\n * ```\n */\nexport const MultiSelect = MultiSelectRoot as MultiSelectType;\nMultiSelect.Trigger = MultiSelectTrigger;\nMultiSelect.Input = MultiSelectInput;\nMultiSelect.Content = MultiSelectContent;\nMultiSelect.List = MultiSelectList;\nMultiSelect.Item = MultiSelectItem;\n"],"names":["createContext","useContext","useState","useRef","useEffect","useCallback","useMemo","jsx","CommandRoot","cn","jsxs","Badge","RemoveIcon","Command","Check"],"mappings":"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"}

package/dist/components/Select/Multiselect.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Multiselect.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Multiselect.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,EAAE,EACP,KAAK,cAAc,EAcpB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAyBlD;;GAEG;AAEH,KAAK,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,GAAG;IAC3D,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,eAAe,EAAE,EAAE,CAAC,gBAAgB,CAmLzC,CAAC;AAEF,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAC1B,cAAc,CAAC,cAAc,CAAC,GAAG;IAC/B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC1C,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC,CA4DF,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,KAAK,CAAC,CAgC9D,CAAC;AAEF,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,cAAc,CAAC,cAAc,CAAC,CAK1D,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,OAAO,OAAO,CAAC,IAYrC,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,EAAE,CACvB;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,IAAI,CAAC,CAiCxD,CAAC;~~AAIF~~,KAAK,eAAe,GAAG,OAAO,eAAe,GAAG;IAC9C,OAAO,EAAE,OAAO,kBAAkB,CAAC;IACnC,KAAK,EAAE,OAAO,gBAAgB,CAAC;IAC/B,OAAO,EAAE,OAAO,kBAAkB,CAAC;IACnC,IAAI,EAAE,OAAO,eAAe,CAAC;IAC7B,IAAI,EAAE,OAAO,eAAe,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,WAAW,EAAsB,eAAe,CAAC"}
1	+ {"version":3,"file":"Multiselect.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Multiselect.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,EAAE,EACP,KAAK,cAAc,EAcpB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAyBlD;;GAEG;AAEH,KAAK,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,GAAG;IAC3D,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,eAAe,EAAE,EAAE,CAAC,gBAAgB,CAmLzC,CAAC;AAEF,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAC1B,cAAc,CAAC,cAAc,CAAC,GAAG;IAC/B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC1C,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC,CA4DF,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,KAAK,CAAC,CAgC9D,CAAC;AAEF,QAAA,MAAM,kBAAkB,EAAE,EAAE,CAAC,cAAc,CAAC,cAAc,CAAC,CAK1D,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,OAAO,OAAO,CAAC,IAYrC,CAAC;AAEF,QAAA,MAAM,eAAe,EAAE,EAAE,CACvB;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,IAAI,CAAC,CAiCxD,CAAC;AAEF,KAAK,eAAe,GAAG,OAAO,eAAe,GAAG;IAC9C,OAAO,EAAE,OAAO,kBAAkB,CAAC;IACnC,KAAK,EAAE,OAAO,gBAAgB,CAAC;IAC/B,OAAO,EAAE,OAAO,kBAAkB,CAAC;IACnC,IAAI,EAAE,OAAO,eAAe,CAAC;IAC7B,IAAI,EAAE,OAAO,eAAe,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,WAAW,EAAsB,eAAe,CAAC"}

package/dist/components/Select/Multiselect.mjs CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Check, X } from "lucide-react";
+import { X, Check } from "lucide-react";
 import { createContext, useState, useRef, useEffect, useCallback, useMemo, useContext } from "react";
 import { cn } from "../../utils/cn.mjs";
 import { Badge } from "../Badge/index.mjs";
@@ -315,7 +315,6 @@ const MultiSelectItem = ({ className, value, children, ...props }) => {
     }
   );
 };
-MultiSelectItem.displayName = "MultiSelectItem";
 const MultiSelect = MultiSelectRoot;
 MultiSelect.Trigger = MultiSelectTrigger;
 MultiSelect.Input = MultiSelectInput;

package/dist/components/Select/Multiselect.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Multiselect.mjs","sources":["../../../src/components/Select/Multiselect.tsx"],"sourcesContent":["'use client';\n\nimport { X as RemoveIcon, Check } from 'lucide-react';\nimport {\n type ComponentProps,\n type Dispatch,\n type FC,\n type HTMLAttributes,\n type KeyboardEvent,\n type LegacyRef,\n type MouseEventHandler,\n type RefObject,\n type SetStateAction,\n type SyntheticEvent,\n createContext,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Badge } from '../Badge';\nimport { Command, CommandRoot } from '../Command';\n\ntype MultiSelectContextProps = {\n value: string[];\n onValueChange: (value: string) => void;\n open: boolean;\n setOpen: (value: boolean) => void;\n inputValue: string;\n setInputValue: Dispatch<SetStateAction<string>>;\n activeIndex: number;\n setActiveIndex: Dispatch<SetStateAction<number>>;\n ref: RefObject<HTMLInputElement \| null>;\n handleSelect: (e: SyntheticEvent<HTMLInputElement>) => void;\n};\n\nconst MultiSelectContext = createContext<MultiSelectContextProps \| null>(null);\n\nconst useMultiSelect = () => {\n const context = useContext(MultiSelectContext);\n if (!context) {\n throw new Error('useMultiSelect must be used within MultiSelectProvider');\n }\n return context;\n};\n\n/*\n MultiSelect Docs: {@link: https://shadcn-extension.vercel.app/docs/multi-select}\n /\n\ntype MultiSelectProps = ComponentProps<typeof CommandRoot> & {\n values?: string[];\n defaultValues?: string[];\n onValueChange?: (value: string[]) => void;\n loop?: boolean;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelectTrigger>\n * <MultiSelectInput placeholder=\"Select your framework\" />\n * </MultiSelectTrigger>\n * <MultiSelectContent>\n * <MultiSelectList>\n * <MultiSelectItem value={\"React\"}>React</MultiSelectItem>\n * <MultiSelectItem value={\"Vue\"}>Vue</MultiSelectItem>\n * <MultiSelectItem value={\"Svelte\"}>Svelte</MultiSelectItem>\n * </MultiSelectList>\n * </MultiSelectContent>\n * </MultiSelect>\n * ```\n /\nconst MultiSelectRoot: FC<MultiSelectProps> = ({\n values: valuesProp,\n defaultValues,\n onValueChange: onValueChange,\n loop = false,\n className,\n children,\n dir,\n ...props\n}) => {\n const [value, setValue] = useState<string[]>(defaultValues ?? []);\n const [inputValue, setInputValue] = useState('');\n const [open, setOpen] = useState<boolean>(false);\n const [activeIndex, setActiveIndex] = useState<number>(-1);\n const inputRef = useRef<HTMLInputElement>(null);\n const [isValueSelected, setIsValueSelected] = useState(false);\n const [selectedValue, setSelectedValue] = useState('');\n\n useEffect(() => {\n if (valuesProp) {\n setValue(valuesProp);\n }\n }, [valuesProp]);\n\n const onValueChangeHandler = useCallback(\n (val: string) => {\n if (value.includes(val)) {\n const newValue = value.filter((item) => item !== val);\n setValue(newValue);\n onValueChange?.(newValue);\n } else {\n const newValue = [...value, val];\n setValue(newValue);\n onValueChange?.(newValue);\n }\n },\n\n [value]\n );\n\n const handleSelect = useCallback(\n (e: SyntheticEvent<HTMLInputElement>) => {\n e.preventDefault();\n const target = e.currentTarget;\n const selection = target.value.substring(\n target.selectionStart ?? 0,\n target.selectionEnd ?? 0\n );\n\n setSelectedValue(selection);\n setIsValueSelected(selection === inputValue);\n },\n [inputValue]\n );\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n e.stopPropagation();\n const target = inputRef.current;\n\n if (!target) return;\n\n const moveNext = () => {\n const nextIndex = activeIndex + 1;\n setActiveIndex(\n nextIndex > value.length - 1 ? (loop ? 0 : -1) : nextIndex\n );\n };\n\n const movePrev = () => {\n const prevIndex = activeIndex - 1;\n setActiveIndex(prevIndex < 0 ? value.length - 1 : prevIndex);\n };\n\n const moveCurrent = () => {\n const newIndex =\n activeIndex - 1 <= 0\n ? value.length - 1 === 0\n ? -1\n : 0\n : activeIndex - 1;\n setActiveIndex(newIndex);\n };\n\n switch (e.key) {\n case 'ArrowLeft':\n if (dir === 'rtl') {\n if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n } else if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n break;\n\n case 'ArrowRight':\n if (dir === 'rtl') {\n if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n } else if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n break;\n\n case 'Backspace':\n case 'Delete':\n if (value.length > 0) {\n if (activeIndex !== -1 && activeIndex < value.length) {\n onValueChangeHandler(value[activeIndex]);\n moveCurrent();\n } else if (\n (target.selectionStart === 0 && selectedValue === inputValue) \|\|\n isValueSelected\n ) {\n onValueChangeHandler(value[value.length - 1]);\n }\n }\n break;\n\n case 'Enter':\n setOpen(true);\n break;\n\n case 'Escape':\n if (activeIndex !== -1) {\n setActiveIndex(-1);\n } else if (open) {\n setOpen(false);\n }\n break;\n }\n },\n\n [value, inputValue, activeIndex, loop]\n );\n\n const memoValue = useMemo(\n () => ({\n value,\n onValueChange: onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n ref: inputRef,\n handleSelect,\n }),\n [\n value,\n onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n inputRef,\n handleSelect,\n ]\n );\n\n return (\n <MultiSelectContext value={memoValue}>\n <CommandRoot\n onKeyDown={handleKeyDown}\n className={cn(\n 'flex w-full flex-col gap-2 overflow-visible bg-transparent',\n className\n )}\n dir={dir}\n {...props}\n >\n {children}\n </CommandRoot>\n </MultiSelectContext>\n );\n};\n\nconst MultiSelectTrigger: FC<\n HTMLAttributes<HTMLDivElement> & {\n getBadgeValue?: (value: string) => string;\n validationStyleEnabled?: boolean;\n }\n> = ({\n className,\n getBadgeValue = (value) => value,\n validationStyleEnabled = false,\n children,\n ...props\n}) => {\n const { value, onValueChange, activeIndex } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n return (\n <div\n className={cn(\n 'flex w-full flex-col gap-3 rounded-lg p-1 py-2',\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {value.length > 0 && (\n <div className=\"flex w-full flex-wrap gap-1\">\n {value.map((item, index) => (\n <Badge\n key={item}\n className={cn(\n 'flex items-center gap-1 rounded-xl px-1',\n activeIndex === index && 'ring-muted-foreground ring-2'\n )}\n color=\"text\"\n >\n <span className=\"text-xs\">{getBadgeValue(item)}</span>\n <button\n aria-label={`Remove ${item} option`}\n aria-roledescription=\"button to remove option\"\n onMouseDown={mousePreventDefault}\n onClick={() => onValueChange(item)}\n >\n <span className=\"sr-only\">Remove {item} option</span>\n <RemoveIcon className=\"size-4 cursor-pointer\" />\n </button>\n </Badge>\n ))}\n </div>\n )}\n {children}\n </div>\n );\n};\n\nconst MultiSelectInput: FC<ComponentProps<typeof Command.Input>> = ({\n className,\n ...props\n}) => {\n const {\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n handleSelect,\n ref: inputRef,\n } = useMultiSelect();\n\n return (\n <Command.Input\n {...props}\n tabIndex={0}\n ref={inputRef as LegacyRef<HTMLInputElement>}\n value={inputValue}\n onValueChange={activeIndex === -1 ? setInputValue : undefined}\n onSelect={handleSelect}\n onBlur={() => setOpen(false)}\n onFocus={() => setOpen(true)}\n onClick={() => setActiveIndex(-1)}\n className={cn(\n 'ml-2 flex-1 cursor-pointer outline-none',\n className,\n activeIndex !== -1 && 'caret-transparent'\n )}\n />\n );\n};\n\nconst MultiSelectContent: FC<HTMLAttributes<HTMLDivElement>> = ({\n children,\n}) => {\n const { open } = useMultiSelect();\n return <div className=\"relative\">{open && children}</div>;\n};\n\nconst MultiSelectList: typeof Command.List = ({ className, children }) => (\n <Command.List\n className={cn(\n 'border-muted bg-input-background dark:bg-input-background-dark absolute top-0 z-10 flex w-full flex-col gap-2 rounded-lg border p-2 shadow-md transition-colors',\n className\n )}\n >\n {children}\n <Command.Empty>\n <span className=\"text-muted-foreground\">No results found</span>\n </Command.Empty>\n </Command.List>\n);\n\nconst MultiSelectItem: FC<\n { value: string } & ComponentProps<typeof Command.Item>\n> = ({ className, value, children, ...props }) => {\n const { value: Options, onValueChange, setInputValue } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n const isIncluded = Options.includes(value);\n return (\n <Command.Item\n {...props}\n onSelect={() => {\n onValueChange(value);\n setInputValue('');\n }}\n className={cn(\n 'flex cursor-pointer justify-between rounded-lg px-2 py-1 transition-colors',\n 'hover:bg-neutral/10 dark:hover:bg-neutral-dark/10',\n className,\n isIncluded && 'opacity-50',\n props.disabled && 'cursor-not-allowed opacity-50'\n )}\n onMouseDown={mousePreventDefault}\n >\n {children}\n {isIncluded && <Check className=\"size-4\" />}\n </Command.Item>\n );\n};\n\nMultiSelectItem.displayName = 'MultiSelectItem';\n\ntype MultiSelectType = typeof MultiSelectRoot & {\n Trigger: typeof MultiSelectTrigger;\n Input: typeof MultiSelectInput;\n Content: typeof MultiSelectContent;\n List: typeof MultiSelectList;\n Item: typeof MultiSelectItem;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelect.Trigger>\n * <MultiSelect.Input placeholder=\"Select your framework\" />\n * </MultiSelect.Trigger>\n * <MultiSelect.Content>\n * <MultiSelect.List>\n * <MultiSelect.Item value={\"React\"}>React</MultiSelect.Item>\n * <MultiSelect.Item value={\"Vue\"}>Vue</MultiSelect.Item>\n * <MultiSelect.Item value={\"Svelte\"}>Svelte</MultiSelect.Item>\n * </MultiSelect.List>\n * </MultiSelect.Content>\n * </MultiSelect>\n * ```\n */\nexport const MultiSelect = MultiSelectRoot as MultiSelectType;\nMultiSelect.Trigger = MultiSelectTrigger;\nMultiSelect.Input = MultiSelectInput;\nMultiSelect.Content = MultiSelectContent;\nMultiSelect.List = MultiSelectList;\nMultiSelect.Item = MultiSelectItem;\n"],"names":["RemoveIcon"],"mappings":"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"}
1	+ {"version":3,"file":"Multiselect.mjs","sources":["../../../src/components/Select/Multiselect.tsx"],"sourcesContent":["'use client';\n\nimport { X as RemoveIcon, Check } from 'lucide-react';\nimport {\n type ComponentProps,\n type Dispatch,\n type FC,\n type HTMLAttributes,\n type KeyboardEvent,\n type LegacyRef,\n type MouseEventHandler,\n type RefObject,\n type SetStateAction,\n type SyntheticEvent,\n createContext,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Badge } from '../Badge';\nimport { Command, CommandRoot } from '../Command';\n\ntype MultiSelectContextProps = {\n value: string[];\n onValueChange: (value: string) => void;\n open: boolean;\n setOpen: (value: boolean) => void;\n inputValue: string;\n setInputValue: Dispatch<SetStateAction<string>>;\n activeIndex: number;\n setActiveIndex: Dispatch<SetStateAction<number>>;\n ref: RefObject<HTMLInputElement \| null>;\n handleSelect: (e: SyntheticEvent<HTMLInputElement>) => void;\n};\n\nconst MultiSelectContext = createContext<MultiSelectContextProps \| null>(null);\n\nconst useMultiSelect = () => {\n const context = useContext(MultiSelectContext);\n if (!context) {\n throw new Error('useMultiSelect must be used within MultiSelectProvider');\n }\n return context;\n};\n\n/*\n MultiSelect Docs: {@link: https://shadcn-extension.vercel.app/docs/multi-select}\n /\n\ntype MultiSelectProps = ComponentProps<typeof CommandRoot> & {\n values?: string[];\n defaultValues?: string[];\n onValueChange?: (value: string[]) => void;\n loop?: boolean;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelectTrigger>\n * <MultiSelectInput placeholder=\"Select your framework\" />\n * </MultiSelectTrigger>\n * <MultiSelectContent>\n * <MultiSelectList>\n * <MultiSelectItem value={\"React\"}>React</MultiSelectItem>\n * <MultiSelectItem value={\"Vue\"}>Vue</MultiSelectItem>\n * <MultiSelectItem value={\"Svelte\"}>Svelte</MultiSelectItem>\n * </MultiSelectList>\n * </MultiSelectContent>\n * </MultiSelect>\n * ```\n /\nconst MultiSelectRoot: FC<MultiSelectProps> = ({\n values: valuesProp,\n defaultValues,\n onValueChange: onValueChange,\n loop = false,\n className,\n children,\n dir,\n ...props\n}) => {\n const [value, setValue] = useState<string[]>(defaultValues ?? []);\n const [inputValue, setInputValue] = useState('');\n const [open, setOpen] = useState<boolean>(false);\n const [activeIndex, setActiveIndex] = useState<number>(-1);\n const inputRef = useRef<HTMLInputElement>(null);\n const [isValueSelected, setIsValueSelected] = useState(false);\n const [selectedValue, setSelectedValue] = useState('');\n\n useEffect(() => {\n if (valuesProp) {\n setValue(valuesProp);\n }\n }, [valuesProp]);\n\n const onValueChangeHandler = useCallback(\n (val: string) => {\n if (value.includes(val)) {\n const newValue = value.filter((item) => item !== val);\n setValue(newValue);\n onValueChange?.(newValue);\n } else {\n const newValue = [...value, val];\n setValue(newValue);\n onValueChange?.(newValue);\n }\n },\n\n [value]\n );\n\n const handleSelect = useCallback(\n (e: SyntheticEvent<HTMLInputElement>) => {\n e.preventDefault();\n const target = e.currentTarget;\n const selection = target.value.substring(\n target.selectionStart ?? 0,\n target.selectionEnd ?? 0\n );\n\n setSelectedValue(selection);\n setIsValueSelected(selection === inputValue);\n },\n [inputValue]\n );\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n e.stopPropagation();\n const target = inputRef.current;\n\n if (!target) return;\n\n const moveNext = () => {\n const nextIndex = activeIndex + 1;\n setActiveIndex(\n nextIndex > value.length - 1 ? (loop ? 0 : -1) : nextIndex\n );\n };\n\n const movePrev = () => {\n const prevIndex = activeIndex - 1;\n setActiveIndex(prevIndex < 0 ? value.length - 1 : prevIndex);\n };\n\n const moveCurrent = () => {\n const newIndex =\n activeIndex - 1 <= 0\n ? value.length - 1 === 0\n ? -1\n : 0\n : activeIndex - 1;\n setActiveIndex(newIndex);\n };\n\n switch (e.key) {\n case 'ArrowLeft':\n if (dir === 'rtl') {\n if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n } else if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n break;\n\n case 'ArrowRight':\n if (dir === 'rtl') {\n if (value.length > 0 && target.selectionStart === 0) {\n movePrev();\n }\n } else if (value.length > 0 && (activeIndex !== -1 \|\| loop)) {\n moveNext();\n }\n break;\n\n case 'Backspace':\n case 'Delete':\n if (value.length > 0) {\n if (activeIndex !== -1 && activeIndex < value.length) {\n onValueChangeHandler(value[activeIndex]);\n moveCurrent();\n } else if (\n (target.selectionStart === 0 && selectedValue === inputValue) \|\|\n isValueSelected\n ) {\n onValueChangeHandler(value[value.length - 1]);\n }\n }\n break;\n\n case 'Enter':\n setOpen(true);\n break;\n\n case 'Escape':\n if (activeIndex !== -1) {\n setActiveIndex(-1);\n } else if (open) {\n setOpen(false);\n }\n break;\n }\n },\n\n [value, inputValue, activeIndex, loop]\n );\n\n const memoValue = useMemo(\n () => ({\n value,\n onValueChange: onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n ref: inputRef,\n handleSelect,\n }),\n [\n value,\n onValueChangeHandler,\n open,\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n inputRef,\n handleSelect,\n ]\n );\n\n return (\n <MultiSelectContext value={memoValue}>\n <CommandRoot\n onKeyDown={handleKeyDown}\n className={cn(\n 'flex w-full flex-col gap-2 overflow-visible bg-transparent',\n className\n )}\n dir={dir}\n {...props}\n >\n {children}\n </CommandRoot>\n </MultiSelectContext>\n );\n};\n\nconst MultiSelectTrigger: FC<\n HTMLAttributes<HTMLDivElement> & {\n getBadgeValue?: (value: string) => string;\n validationStyleEnabled?: boolean;\n }\n> = ({\n className,\n getBadgeValue = (value) => value,\n validationStyleEnabled = false,\n children,\n ...props\n}) => {\n const { value, onValueChange, activeIndex } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n return (\n <div\n className={cn(\n 'flex w-full flex-col gap-3 rounded-lg p-1 py-2',\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {value.length > 0 && (\n <div className=\"flex w-full flex-wrap gap-1\">\n {value.map((item, index) => (\n <Badge\n key={item}\n className={cn(\n 'flex items-center gap-1 rounded-xl px-1',\n activeIndex === index && 'ring-muted-foreground ring-2'\n )}\n color=\"text\"\n >\n <span className=\"text-xs\">{getBadgeValue(item)}</span>\n <button\n aria-label={`Remove ${item} option`}\n aria-roledescription=\"button to remove option\"\n onMouseDown={mousePreventDefault}\n onClick={() => onValueChange(item)}\n >\n <span className=\"sr-only\">Remove {item} option</span>\n <RemoveIcon className=\"size-4 cursor-pointer\" />\n </button>\n </Badge>\n ))}\n </div>\n )}\n {children}\n </div>\n );\n};\n\nconst MultiSelectInput: FC<ComponentProps<typeof Command.Input>> = ({\n className,\n ...props\n}) => {\n const {\n setOpen,\n inputValue,\n setInputValue,\n activeIndex,\n setActiveIndex,\n handleSelect,\n ref: inputRef,\n } = useMultiSelect();\n\n return (\n <Command.Input\n {...props}\n tabIndex={0}\n ref={inputRef as LegacyRef<HTMLInputElement>}\n value={inputValue}\n onValueChange={activeIndex === -1 ? setInputValue : undefined}\n onSelect={handleSelect}\n onBlur={() => setOpen(false)}\n onFocus={() => setOpen(true)}\n onClick={() => setActiveIndex(-1)}\n className={cn(\n 'ml-2 flex-1 cursor-pointer outline-none',\n className,\n activeIndex !== -1 && 'caret-transparent'\n )}\n />\n );\n};\n\nconst MultiSelectContent: FC<HTMLAttributes<HTMLDivElement>> = ({\n children,\n}) => {\n const { open } = useMultiSelect();\n return <div className=\"relative\">{open && children}</div>;\n};\n\nconst MultiSelectList: typeof Command.List = ({ className, children }) => (\n <Command.List\n className={cn(\n 'border-muted bg-input-background dark:bg-input-background-dark absolute top-0 z-10 flex w-full flex-col gap-2 rounded-lg border p-2 shadow-md transition-colors',\n className\n )}\n >\n {children}\n <Command.Empty>\n <span className=\"text-muted-foreground\">No results found</span>\n </Command.Empty>\n </Command.List>\n);\n\nconst MultiSelectItem: FC<\n { value: string } & ComponentProps<typeof Command.Item>\n> = ({ className, value, children, ...props }) => {\n const { value: Options, onValueChange, setInputValue } = useMultiSelect();\n\n const mousePreventDefault: MouseEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n e.preventDefault();\n e.stopPropagation();\n },\n []\n );\n\n const isIncluded = Options.includes(value);\n return (\n <Command.Item\n {...props}\n onSelect={() => {\n onValueChange(value);\n setInputValue('');\n }}\n className={cn(\n 'flex cursor-pointer justify-between rounded-lg px-2 py-1 transition-colors',\n 'hover:bg-neutral/10 dark:hover:bg-neutral-dark/10',\n className,\n isIncluded && 'opacity-50',\n props.disabled && 'cursor-not-allowed opacity-50'\n )}\n onMouseDown={mousePreventDefault}\n >\n {children}\n {isIncluded && <Check className=\"size-4\" />}\n </Command.Item>\n );\n};\n\ntype MultiSelectType = typeof MultiSelectRoot & {\n Trigger: typeof MultiSelectTrigger;\n Input: typeof MultiSelectInput;\n Content: typeof MultiSelectContent;\n List: typeof MultiSelectList;\n Item: typeof MultiSelectItem;\n};\n\n/\n \n * Usage example:\n * ```jsx\n * <MultiSelect\n * values={value}\n * onValuesChange={setValue}\n * loop\n * >\n * <MultiSelect.Trigger>\n * <MultiSelect.Input placeholder=\"Select your framework\" />\n * </MultiSelect.Trigger>\n * <MultiSelect.Content>\n * <MultiSelect.List>\n * <MultiSelect.Item value={\"React\"}>React</MultiSelect.Item>\n * <MultiSelect.Item value={\"Vue\"}>Vue</MultiSelect.Item>\n * <MultiSelect.Item value={\"Svelte\"}>Svelte</MultiSelect.Item>\n * </MultiSelect.List>\n * </MultiSelect.Content>\n * </MultiSelect>\n * ```\n */\nexport const MultiSelect = MultiSelectRoot as MultiSelectType;\nMultiSelect.Trigger = MultiSelectTrigger;\nMultiSelect.Input = MultiSelectInput;\nMultiSelect.Content = MultiSelectContent;\nMultiSelect.List = MultiSelectList;\nMultiSelect.Item = MultiSelectItem;\n"],"names":["RemoveIcon"],"mappings":"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"}

package/dist/components/Select/Select.cjs CHANGED Viewed

@@ -65,7 +65,6 @@ const SelectScrollDownButton = ({ className, ...props }) => /* @__PURE__ */ jsxR
     children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, {})
   }
 );
-SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
 const SelectContent = ({ className, children, position = "popper", ...props }) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
   SelectPrimitive__namespace.Content,
   {

package/dist/components/Select/Select.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.cjs","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport {\n ChevronsUpDown,\n CheckIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from 'lucide-react';\nimport { type FC, type ComponentProps } from 'react';\nimport { cn } from '../../utils/cn';\n\nconst SelectRoot = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\nconst SelectTrigger: FC<\n ComponentProps<typeof SelectPrimitive.Trigger> & {\n validationStyleEnabled?: boolean;\n }\n> = ({ validationStyleEnabled = false, className, children, ...props }) => (\n <SelectPrimitive.Trigger\n className={cn(\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap rounded-md border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <ChevronsUpDown className=\"size-4 opacity-50\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n);\n\nconst SelectScrollUpButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollUpButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollUpButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpButton>\n);\n\nconst SelectScrollDownButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollDownButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollDownButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownButton>\n);\~~nSelectScrollDownButton.displayName =\~~n ~~SelectPrimitive.ScrollDownButton.displayName;\n~~\nexport const SelectContent: FC<\n ComponentProps<typeof SelectPrimitive.Content>\n> = ({ className, children, position = 'popper', ...props }) => (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={cn(\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 p-1 text-sm shadow-none outline-0 transition-all',\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-96 min-w-[8rem] overflow-hidden border shadow-md',\n position === 'popper' &&\n 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',\n className\n )}\n position={position}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' &&\n 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n);\n\nexport const SelectLabel: FC<ComponentProps<typeof SelectPrimitive.Label>> = ({\n className,\n ...props\n}) => (\n <SelectPrimitive.Label\n className={cn('px-1 py-0.5 text-sm font-semibold', className)}\n {...props}\n />\n);\n\nconst SelectItem: FC<ComponentProps<typeof SelectPrimitive.Item>> = ({\n className,\n children,\n ...props\n}) => (\n <SelectPrimitive.Item\n className={cn(\n 'focus:bg-neutral/10 dark:focus:bg-neutral-dark/10 relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pl-2 pr-8 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n className\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n);\n\nexport const SelectSeparator: FC<\n ComponentProps<typeof SelectPrimitive.Separator>\n> = ({ className, ...props }) => (\n <SelectPrimitive.Separator\n className={cn('-mx-1 my-1 h-px bg-red-300', className)}\n {...props}\n />\n);\n\ntype SelectType = typeof SelectRoot & {\n Group: typeof SelectGroup;\n Value: typeof SelectValue;\n Trigger: typeof SelectTrigger;\n ScrollUpButton: typeof SelectScrollUpButton;\n ScrollDownButton: typeof SelectScrollDownButton;\n Content: typeof SelectContent;\n Label: typeof SelectLabel;\n Item: typeof SelectItem;\n Separator: typeof SelectSeparator;\n};\n\n/*\n Usage example:\n * ```jsx\n * <Select>\n * <Select.Trigger>\n * <Select.Value placeholder=\"Theme\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Item value=\"light\">Light</Select.Item>\n * <Select.Item value=\"dark\">Dark</Select.Item>\n * <Select.Item value=\"system\">System</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n */\nexport const Select = SelectRoot as SelectType;\nSelect.Group = SelectGroup;\nSelect.Value = SelectValue;\nSelect.Trigger = SelectTrigger;\nSelect.ScrollUpButton = SelectScrollUpButton;\nSelect.ScrollDownButton = SelectScrollDownButton;\nSelect.Content = SelectContent;\nSelect.Label = SelectLabel;\nSelect.Item = SelectItem;\nSelect.Separator = SelectSeparator;\n"],"names":["SelectPrimitive","jsxs","cn","jsx","ChevronsUpDown","ChevronUpIcon","ChevronDownIcon","CheckIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,aAAaA,2BAAgB;AACnC,MAAM,cAAcA,2BAAgB;AACpC,MAAM,cAAcA,2BAAgB;AAEpC,MAAM,gBAIF,CAAC,EAAE,yBAAyB,OAAO,WAAW,UAAU,GAAG,MAAA,MAC7DC,2BAAA;AAAA,EAACD,2BAAgB;AAAA,EAAhB;AAAA,IACC,WAAWE,SAAA;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,0BACE;AAAA,MACF;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEH,UAAA;AAAA,MAAA;AAAA,MACDC,2BAAAA,IAACH,2BAAgB,MAAhB,EAAqB,SAAO,MAC3B,UAACG,2BAAAA,IAAAC,YAAAA,gBAAA,EAAe,WAAU,oBAAoB,CAAA,EAChD,CAAA;AAAA,IAAA;AAAA,EAAA;AACF;AAGF,MAAM,uBAEF,CAAC,EAAE,WAAW,GAAG,MACnB,MAAAD,2BAAA;AAAA,EAACH,2BAAgB;AAAA,EAAhB;AAAA,IACC,WAAWE,SAAA;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEJ,yCAACG,YAAAA,eAAc,CAAA,CAAA;AAAA,EAAA;AACjB;AAGF,MAAM,yBAEF,CAAC,EAAE,WAAW,GAAG,MACnB,MAAAF,2BAAA;AAAA,EAACH,2BAAgB;AAAA,EAAhB;AAAA,IACC,WAAWE,SAAA;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEJ,yCAACI,YAAAA,iBAAgB,CAAA,CAAA;AAAA,EAAA;AACnB;~~AAEF~~,~~uBAAuB,cACrBN,2BAAgB,iBAAiB;AAE5B,~~MAAM,gBAET,CAAC,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,MAAM,~~MACvDG~~,2BAAAA,IAAAH,2BAAgB,QAAhB,EACC,UAAAC,2BAAA;AAAA,EAACD,2BAAgB;AAAA,EAAhB;AAAA,IACC,WAAWE,SAAA;AAAA,MACT;AAAA,MACA;AAAA,MACA,aAAa,YACX;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,IACC,GAAG;AAAA,IAEJ,UAAA;AAAA,MAAAC,2BAAA,IAAC,sBAAqB,EAAA;AAAA,MACtBA,2BAAA;AAAA,QAACH,2BAAgB;AAAA,QAAhB;AAAA,UACC,WAAWE,SAAA;AAAA,YACT;AAAA,YACA,aAAa,YACX;AAAA,UACJ;AAAA,UAEC;AAAA,QAAA;AAAA,MACH;AAAA,qCACC,wBAAuB,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA;AAC1B,EACF,CAAA;AAGK,MAAM,cAAgE,CAAC;AAAA,EAC5E;AAAA,EACA,GAAG;AACL,MACEC,2BAAA;AAAA,EAACH,2BAAgB;AAAA,EAAhB;AAAA,IACC,WAAWE,SAAAA,GAAG,qCAAqC,SAAS;AAAA,IAC3D,GAAG;AAAA,EAAA;AACN;AAGF,MAAM,aAA8D,CAAC;AAAA,EACnE;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACED,2BAAA;AAAA,EAACD,2BAAgB;AAAA,EAAhB;AAAA,IACC,WAAWE,SAAA;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEJ,UAAA;AAAA,MAAAC,2BAAA,IAAC,QAAK,EAAA,WAAU,8DACd,UAAAA,2BAAA,IAACH,2BAAgB,eAAhB,EACC,UAAAG,2BAAA,IAACI,uBAAU,EAAA,WAAU,SAAS,CAAA,EAChC,CAAA,GACF;AAAA,MACCJ,2BAAAA,IAAAH,2BAAgB,UAAhB,EAA0B,SAAS,CAAA;AAAA,IAAA;AAAA,EAAA;AACtC;AAGK,MAAM,kBAET,CAAC,EAAE,WAAW,GAAG,MACnB,MAAAG,2BAAA;AAAA,EAACH,2BAAgB;AAAA,EAAhB;AAAA,IACC,WAAWE,SAAAA,GAAG,8BAA8B,SAAS;AAAA,IACpD,GAAG;AAAA,EAAA;AACN;AA8BK,MAAM,SAAS;AACtB,OAAO,QAAQ;AACf,OAAO,QAAQ;AACf,OAAO,UAAU;AACjB,OAAO,iBAAiB;AACxB,OAAO,mBAAmB;AAC1B,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,OAAO;AACd,OAAO,YAAY;;;;;"}
1	+ {"version":3,"file":"Select.cjs","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport {\n ChevronsUpDown,\n CheckIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from 'lucide-react';\nimport { type FC, type ComponentProps } from 'react';\nimport { cn } from '../../utils/cn';\n\nconst SelectRoot = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\nconst SelectTrigger: FC<\n ComponentProps<typeof SelectPrimitive.Trigger> & {\n validationStyleEnabled?: boolean;\n }\n> = ({ validationStyleEnabled = false, className, children, ...props }) => (\n <SelectPrimitive.Trigger\n className={cn(\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap rounded-md border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <ChevronsUpDown className=\"size-4 opacity-50\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n);\n\nconst SelectScrollUpButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollUpButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollUpButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpButton>\n);\n\nconst SelectScrollDownButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollDownButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollDownButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownButton>\n);\n\nexport const SelectContent: FC<\n ComponentProps<typeof SelectPrimitive.Content>\n> = ({ className, children, position = 'popper', ...props }) => (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={cn(\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 p-1 text-sm shadow-none outline-0 transition-all',\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-96 min-w-[8rem] overflow-hidden border shadow-md',\n position === 'popper' &&\n 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',\n className\n )}\n position={position}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' &&\n 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n);\n\nexport const SelectLabel: FC<ComponentProps<typeof SelectPrimitive.Label>> = ({\n className,\n ...props\n}) => (\n <SelectPrimitive.Label\n className={cn('px-1 py-0.5 text-sm font-semibold', className)}\n {...props}\n />\n);\n\nconst SelectItem: FC<ComponentProps<typeof SelectPrimitive.Item>> = ({\n className,\n children,\n ...props\n}) => (\n <SelectPrimitive.Item\n className={cn(\n 'focus:bg-neutral/10 dark:focus:bg-neutral-dark/10 relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pl-2 pr-8 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n className\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n);\n\nexport const SelectSeparator: FC<\n ComponentProps<typeof SelectPrimitive.Separator>\n> = ({ className, ...props }) => (\n <SelectPrimitive.Separator\n className={cn('-mx-1 my-1 h-px bg-red-300', className)}\n {...props}\n />\n);\n\ntype SelectType = typeof SelectRoot & {\n Group: typeof SelectGroup;\n Value: typeof SelectValue;\n Trigger: typeof SelectTrigger;\n ScrollUpButton: typeof SelectScrollUpButton;\n ScrollDownButton: typeof SelectScrollDownButton;\n Content: typeof SelectContent;\n Label: typeof SelectLabel;\n Item: typeof SelectItem;\n Separator: typeof SelectSeparator;\n};\n\n/*\n Usage example:\n * ```jsx\n * <Select>\n * <Select.Trigger>\n * <Select.Value placeholder=\"Theme\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Item value=\"light\">Light</Select.Item>\n * <Select.Item value=\"dark\">Dark</Select.Item>\n * <Select.Item value=\"system\">System</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n */\nexport const Select = SelectRoot as SelectType;\nSelect.Group = SelectGroup;\nSelect.Value = SelectValue;\nSelect.Trigger = SelectTrigger;\nSelect.ScrollUpButton = SelectScrollUpButton;\nSelect.ScrollDownButton = SelectScrollDownButton;\nSelect.Content = SelectContent;\nSelect.Label = SelectLabel;\nSelect.Item = SelectItem;\nSelect.Separator = SelectSeparator;\n"],"names":["SelectPrimitive","jsxs","cn","jsx","ChevronsUpDown","ChevronUpIcon","ChevronDownIcon","CheckIcon"],"mappings":"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"}

package/dist/components/Select/Select.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAO1D,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGrD,QAAA,MAAM,UAAU,iCAAuB,CAAC;AACxC,QAAA,MAAM,WAAW,6HAAwB,CAAC;AAC1C,QAAA,MAAM,WAAW,8HAAwB,CAAC;AAE1C,QAAA,MAAM,aAAa,EAAE,EAAE,CACrB,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IAC/C,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC,CAmBF,CAAC;AAEF,QAAA,MAAM,oBAAoB,EAAE,EAAE,CAC5B,cAAc,CAAC,OAAO,eAAe,CAAC,cAAc,CAAC,CAWtD,CAAC;AAEF,QAAA,MAAM,sBAAsB,EAAE,EAAE,CAC9B,cAAc,CAAC,OAAO,eAAe,CAAC,gBAAgB,CAAC,CAWxD,CAAC;~~AAIF~~,eAAO,MAAM,aAAa,EAAE,EAAE,CAC5B,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,CA2B/C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,CAQxE,CAAC;AAEF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,CAmB/D,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,EAAE,CAC9B,cAAc,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,CAMjD,CAAC;AAEF,KAAK,UAAU,GAAG,OAAO,UAAU,GAAG;IACpC,KAAK,EAAE,OAAO,WAAW,CAAC;IAC1B,KAAK,EAAE,OAAO,WAAW,CAAC;IAC1B,OAAO,EAAE,OAAO,aAAa,CAAC;IAC9B,cAAc,EAAE,OAAO,oBAAoB,CAAC;IAC5C,gBAAgB,EAAE,OAAO,sBAAsB,CAAC;IAChD,OAAO,EAAE,OAAO,aAAa,CAAC;IAC9B,KAAK,EAAE,OAAO,WAAW,CAAC;IAC1B,IAAI,EAAE,OAAO,UAAU,CAAC;IACxB,SAAS,EAAE,OAAO,eAAe,CAAC;CACnC,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,MAAM,EAAiB,UAAU,CAAC"}
1	+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAO1D,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGrD,QAAA,MAAM,UAAU,iCAAuB,CAAC;AACxC,QAAA,MAAM,WAAW,6HAAwB,CAAC;AAC1C,QAAA,MAAM,WAAW,8HAAwB,CAAC;AAE1C,QAAA,MAAM,aAAa,EAAE,EAAE,CACrB,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IAC/C,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC,CAmBF,CAAC;AAEF,QAAA,MAAM,oBAAoB,EAAE,EAAE,CAC5B,cAAc,CAAC,OAAO,eAAe,CAAC,cAAc,CAAC,CAWtD,CAAC;AAEF,QAAA,MAAM,sBAAsB,EAAE,EAAE,CAC9B,cAAc,CAAC,OAAO,eAAe,CAAC,gBAAgB,CAAC,CAWxD,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,EAAE,CAC5B,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,CA2B/C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,CAQxE,CAAC;AAEF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,CAmB/D,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,EAAE,CAC9B,cAAc,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,CAMjD,CAAC;AAEF,KAAK,UAAU,GAAG,OAAO,UAAU,GAAG;IACpC,KAAK,EAAE,OAAO,WAAW,CAAC;IAC1B,KAAK,EAAE,OAAO,WAAW,CAAC;IAC1B,OAAO,EAAE,OAAO,aAAa,CAAC;IAC9B,cAAc,EAAE,OAAO,oBAAoB,CAAC;IAC5C,gBAAgB,EAAE,OAAO,sBAAsB,CAAC;IAChD,OAAO,EAAE,OAAO,aAAa,CAAC;IAC9B,KAAK,EAAE,OAAO,WAAW,CAAC;IAC1B,IAAI,EAAE,OAAO,UAAU,CAAC;IACxB,SAAS,EAAE,OAAO,eAAe,CAAC;CACnC,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,MAAM,EAAiB,UAAU,CAAC"}

package/dist/components/Select/Select.mjs CHANGED Viewed

@@ -46,7 +46,6 @@ const SelectScrollDownButton = ({ className, ...props }) => /* @__PURE__ */ jsx(
     children: /* @__PURE__ */ jsx(ChevronDownIcon, {})
   }
 );
-SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
 const SelectContent = ({ className, children, position = "popper", ...props }) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
   SelectPrimitive.Content,
   {

package/dist/components/Select/Select.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.mjs","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport {\n ChevronsUpDown,\n CheckIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from 'lucide-react';\nimport { type FC, type ComponentProps } from 'react';\nimport { cn } from '../../utils/cn';\n\nconst SelectRoot = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\nconst SelectTrigger: FC<\n ComponentProps<typeof SelectPrimitive.Trigger> & {\n validationStyleEnabled?: boolean;\n }\n> = ({ validationStyleEnabled = false, className, children, ...props }) => (\n <SelectPrimitive.Trigger\n className={cn(\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap rounded-md border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <ChevronsUpDown className=\"size-4 opacity-50\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n);\n\nconst SelectScrollUpButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollUpButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollUpButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpButton>\n);\n\nconst SelectScrollDownButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollDownButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollDownButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownButton>\n);\~~nSelectScrollDownButton.displayName =\~~n ~~SelectPrimitive.ScrollDownButton.displayName;\n~~\nexport const SelectContent: FC<\n ComponentProps<typeof SelectPrimitive.Content>\n> = ({ className, children, position = 'popper', ...props }) => (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={cn(\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 p-1 text-sm shadow-none outline-0 transition-all',\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-96 min-w-[8rem] overflow-hidden border shadow-md',\n position === 'popper' &&\n 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',\n className\n )}\n position={position}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' &&\n 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n);\n\nexport const SelectLabel: FC<ComponentProps<typeof SelectPrimitive.Label>> = ({\n className,\n ...props\n}) => (\n <SelectPrimitive.Label\n className={cn('px-1 py-0.5 text-sm font-semibold', className)}\n {...props}\n />\n);\n\nconst SelectItem: FC<ComponentProps<typeof SelectPrimitive.Item>> = ({\n className,\n children,\n ...props\n}) => (\n <SelectPrimitive.Item\n className={cn(\n 'focus:bg-neutral/10 dark:focus:bg-neutral-dark/10 relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pl-2 pr-8 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n className\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n);\n\nexport const SelectSeparator: FC<\n ComponentProps<typeof SelectPrimitive.Separator>\n> = ({ className, ...props }) => (\n <SelectPrimitive.Separator\n className={cn('-mx-1 my-1 h-px bg-red-300', className)}\n {...props}\n />\n);\n\ntype SelectType = typeof SelectRoot & {\n Group: typeof SelectGroup;\n Value: typeof SelectValue;\n Trigger: typeof SelectTrigger;\n ScrollUpButton: typeof SelectScrollUpButton;\n ScrollDownButton: typeof SelectScrollDownButton;\n Content: typeof SelectContent;\n Label: typeof SelectLabel;\n Item: typeof SelectItem;\n Separator: typeof SelectSeparator;\n};\n\n/*\n Usage example:\n * ```jsx\n * <Select>\n * <Select.Trigger>\n * <Select.Value placeholder=\"Theme\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Item value=\"light\">Light</Select.Item>\n * <Select.Item value=\"dark\">Dark</Select.Item>\n * <Select.Item value=\"system\">System</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n */\nexport const Select = SelectRoot as SelectType;\nSelect.Group = SelectGroup;\nSelect.Value = SelectValue;\nSelect.Trigger = SelectTrigger;\nSelect.ScrollUpButton = SelectScrollUpButton;\nSelect.ScrollDownButton = SelectScrollDownButton;\nSelect.Content = SelectContent;\nSelect.Label = SelectLabel;\nSelect.Item = SelectItem;\nSelect.Separator = SelectSeparator;\n"],"names":[],"mappings":";;;;;AAYA,MAAM,aAAa,gBAAgB;AACnC,MAAM,cAAc,gBAAgB;AACpC,MAAM,cAAc,gBAAgB;AAEpC,MAAM,gBAIF,CAAC,EAAE,yBAAyB,OAAO,WAAW,UAAU,GAAG,MAAA,MAC7D;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,0BACE;AAAA,MACF;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEH,UAAA;AAAA,MAAA;AAAA,MACD,oBAAC,gBAAgB,MAAhB,EAAqB,SAAO,MAC3B,UAAC,oBAAA,gBAAA,EAAe,WAAU,oBAAoB,CAAA,EAChD,CAAA;AAAA,IAAA;AAAA,EAAA;AACF;AAGF,MAAM,uBAEF,CAAC,EAAE,WAAW,GAAG,MACnB,MAAA;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEJ,8BAAC,eAAc,CAAA,CAAA;AAAA,EAAA;AACjB;AAGF,MAAM,yBAEF,CAAC,EAAE,WAAW,GAAG,MACnB,MAAA;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEJ,8BAAC,iBAAgB,CAAA,CAAA;AAAA,EAAA;AACnB;~~AAEF~~,~~uBAAuB,cACrB,gBAAgB,iBAAiB;AAE5B,~~MAAM,gBAET,CAAC,EAAE,WAAW,UAAU,WAAW,UAAU,GAAG,MAAM,MACvD,oBAAA,gBAAgB,QAAhB,EACC,UAAA;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,MACA,aAAa,YACX;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,IACC,GAAG;AAAA,IAEJ,UAAA;AAAA,MAAA,oBAAC,sBAAqB,EAAA;AAAA,MACtB;AAAA,QAAC,gBAAgB;AAAA,QAAhB;AAAA,UACC,WAAW;AAAA,YACT;AAAA,YACA,aAAa,YACX;AAAA,UACJ;AAAA,UAEC;AAAA,QAAA;AAAA,MACH;AAAA,0BACC,wBAAuB,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA;AAC1B,EACF,CAAA;AAGK,MAAM,cAAgE,CAAC;AAAA,EAC5E;AAAA,EACA,GAAG;AACL,MACE;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC,WAAW,GAAG,qCAAqC,SAAS;AAAA,IAC3D,GAAG;AAAA,EAAA;AACN;AAGF,MAAM,aAA8D,CAAC;AAAA,EACnE;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA,IAEJ,UAAA;AAAA,MAAA,oBAAC,QAAK,EAAA,WAAU,8DACd,UAAA,oBAAC,gBAAgB,eAAhB,EACC,UAAA,oBAAC,WAAU,EAAA,WAAU,SAAS,CAAA,EAChC,CAAA,GACF;AAAA,MACC,oBAAA,gBAAgB,UAAhB,EAA0B,SAAS,CAAA;AAAA,IAAA;AAAA,EAAA;AACtC;AAGK,MAAM,kBAET,CAAC,EAAE,WAAW,GAAG,MACnB,MAAA;AAAA,EAAC,gBAAgB;AAAA,EAAhB;AAAA,IACC,WAAW,GAAG,8BAA8B,SAAS;AAAA,IACpD,GAAG;AAAA,EAAA;AACN;AA8BK,MAAM,SAAS;AACtB,OAAO,QAAQ;AACf,OAAO,QAAQ;AACf,OAAO,UAAU;AACjB,OAAO,iBAAiB;AACxB,OAAO,mBAAmB;AAC1B,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,OAAO;AACd,OAAO,YAAY;"}
1	+ {"version":3,"file":"Select.mjs","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport {\n ChevronsUpDown,\n CheckIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from 'lucide-react';\nimport { type FC, type ComponentProps } from 'react';\nimport { cn } from '../../utils/cn';\n\nconst SelectRoot = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\nconst SelectTrigger: FC<\n ComponentProps<typeof SelectPrimitive.Trigger> & {\n validationStyleEnabled?: boolean;\n }\n> = ({ validationStyleEnabled = false, className, children, ...props }) => (\n <SelectPrimitive.Trigger\n className={cn(\n 'border-input ring-offset-background placeholder:text-muted-foreground focus:ring-ring flex w-full items-center justify-between whitespace-nowrap rounded-md border px-3 py-2 text-sm focus:outline-none focus:ring-1 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 px-2 py-1 text-sm shadow-none outline-0 transition-all',\n 'border-input-border dark:border-input-border-dark hover:border-input-border-hover dark:hover:border-input-border-hover-dark focus:border-input-border-focus dark:focus:border-input-border-focus focus:outline-0 focus:[box-shadow:none]',\n 'aria-[invalid=true]:border-error dark:aria-[invalid=true]:border-error-dark',\n validationStyleEnabled &&\n 'valid:border-success dark:valid:border-success-dark invalid:border-error dark:invalid:border-error-dark',\n className\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <ChevronsUpDown className=\"size-4 opacity-50\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n);\n\nconst SelectScrollUpButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollUpButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollUpButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpButton>\n);\n\nconst SelectScrollDownButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollDownButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollDownButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownButton>\n);\n\nexport const SelectContent: FC<\n ComponentProps<typeof SelectPrimitive.Content>\n> = ({ className, children, position = 'popper', ...props }) => (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={cn(\n 'bg-input-background dark:bg-input-background-dark text-input-text dark:text-input-text-dark w-full select-text resize-none rounded-xl border-2 p-1 text-sm shadow-none outline-0 transition-all',\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-96 min-w-[8rem] overflow-hidden border shadow-md',\n position === 'popper' &&\n 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',\n className\n )}\n position={position}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' &&\n 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n);\n\nexport const SelectLabel: FC<ComponentProps<typeof SelectPrimitive.Label>> = ({\n className,\n ...props\n}) => (\n <SelectPrimitive.Label\n className={cn('px-1 py-0.5 text-sm font-semibold', className)}\n {...props}\n />\n);\n\nconst SelectItem: FC<ComponentProps<typeof SelectPrimitive.Item>> = ({\n className,\n children,\n ...props\n}) => (\n <SelectPrimitive.Item\n className={cn(\n 'focus:bg-neutral/10 dark:focus:bg-neutral-dark/10 relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pl-2 pr-8 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n className\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n);\n\nexport const SelectSeparator: FC<\n ComponentProps<typeof SelectPrimitive.Separator>\n> = ({ className, ...props }) => (\n <SelectPrimitive.Separator\n className={cn('-mx-1 my-1 h-px bg-red-300', className)}\n {...props}\n />\n);\n\ntype SelectType = typeof SelectRoot & {\n Group: typeof SelectGroup;\n Value: typeof SelectValue;\n Trigger: typeof SelectTrigger;\n ScrollUpButton: typeof SelectScrollUpButton;\n ScrollDownButton: typeof SelectScrollDownButton;\n Content: typeof SelectContent;\n Label: typeof SelectLabel;\n Item: typeof SelectItem;\n Separator: typeof SelectSeparator;\n};\n\n/*\n Usage example:\n * ```jsx\n * <Select>\n * <Select.Trigger>\n * <Select.Value placeholder=\"Theme\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Item value=\"light\">Light</Select.Item>\n * <Select.Item value=\"dark\">Dark</Select.Item>\n * <Select.Item value=\"system\">System</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n */\nexport const Select = SelectRoot as SelectType;\nSelect.Group = SelectGroup;\nSelect.Value = SelectValue;\nSelect.Trigger = SelectTrigger;\nSelect.ScrollUpButton = SelectScrollUpButton;\nSelect.ScrollDownButton = SelectScrollDownButton;\nSelect.Content = SelectContent;\nSelect.Label = SelectLabel;\nSelect.Item = SelectItem;\nSelect.Separator = SelectSeparator;\n"],"names":[],"mappings":"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"}

package/dist/components/index.cjs CHANGED Viewed

@@ -7,7 +7,6 @@ const components_RightDrawer_useRightDrawerStore = require("./RightDrawer/useRig
 const components_PressableSpan_PressableSpan = require("./PressableSpan/PressableSpan.cjs");
 const components_ContentSelector_ContentSelector = require("./ContentSelector/ContentSelector.cjs");
 const components_DictionaryEditor_DictionaryEditor = require("./DictionaryEditor/DictionaryEditor.cjs");
-const components_DictionaryFieldEditor_DictionariesSelector_DictionariesSelector = require("./DictionaryFieldEditor/DictionariesSelector/DictionariesSelector.cjs");
 const components_DictionaryFieldEditor_DictionaryCreationForm_DictionaryCreationForm = require("./DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.cjs");
 const components_DictionaryFieldEditor_DictionaryFieldEditor = require("./DictionaryFieldEditor/DictionaryFieldEditor.cjs");
 const components_DictionaryFieldEditor_VersionSwitcherDropDown_VersionSwitcher = require("./DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.cjs");
@@ -79,6 +78,7 @@ const components_LocaleSwitcherDropDown_LocaleSwitcher = require("./LocaleSwitch
 const components_LocaleSwitcherContentDropDown_LocaleSwitcherContent = require("./LocaleSwitcherContentDropDown/LocaleSwitcherContent.cjs");
 const components_LocaleSwitcherContentDropDown_LocaleSwitcherContentContext = require("./LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.cjs");
 const components_ClickOutsideDiv_index = require("./ClickOutsideDiv/index.cjs");
+const components_KeyboardScreenAdapter_index = require("./KeyboardScreenAdapter/index.cjs");
 exports.MaxHeightSmoother = components_MaxHeightSmoother_index.MaxHeightSmoother;
 exports.MaxWidthSmoother = components_MaxWidthSmoother_index.MaxWidthSmoother;
 exports.RightDrawer = components_RightDrawer_RightDrawer.RightDrawer;
@@ -86,7 +86,6 @@ exports.useRightDrawerStore = components_RightDrawer_useRightDrawerStore.useRigh
 exports.PressableSpan = components_PressableSpan_PressableSpan.PressableSpan;
 exports.ContentSelector = components_ContentSelector_ContentSelector.ContentSelector;
 exports.DictionaryEditor = components_DictionaryEditor_DictionaryEditor.DictionaryEditor;
-exports.DictionariesSelector = components_DictionaryFieldEditor_DictionariesSelector_DictionariesSelector.DictionariesSelector;
 exports.DictionaryCreationForm = components_DictionaryFieldEditor_DictionaryCreationForm_DictionaryCreationForm.DictionaryCreationForm;
 exports.DictionaryFieldEditor = components_DictionaryFieldEditor_DictionaryFieldEditor.DictionaryFieldEditor;
 exports.VersionSwitcher = components_DictionaryFieldEditor_VersionSwitcherDropDown_VersionSwitcher.VersionSwitcher;
@@ -183,4 +182,5 @@ exports.LocaleSwitcherContent = components_LocaleSwitcherContentDropDown_LocaleS
 exports.LocaleSwitcherContentProvider = components_LocaleSwitcherContentDropDown_LocaleSwitcherContentContext.LocaleSwitcherContentProvider;
 exports.useLocaleSwitcherContent = components_LocaleSwitcherContentDropDown_LocaleSwitcherContentContext.useLocaleSwitcherContent;
 exports.ClickOutsideDiv = components_ClickOutsideDiv_index.ClickOutsideDiv;
+exports.KeyboardScreenAdapter = components_KeyboardScreenAdapter_index.KeyboardScreenAdapter;
 //# sourceMappingURL=index.cjs.map

package/dist/components/index.d.ts CHANGED Viewed

@@ -43,4 +43,5 @@ export * from './Accordion';
 export * from './LocaleSwitcherDropDown';
 export * from './LocaleSwitcherContentDropDown';
 export * from './ClickOutsideDiv';
+export * from './KeyboardScreenAdapter';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,YAAY,CAAC;AAC3B,cAAc,yBAAyB,CAAC;AACxC,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,OAAO,CAAC;AACtB,cAAc,aAAa,CAAC;AAC5B,cAAc,0BAA0B,CAAC;AACzC,cAAc,iCAAiC,CAAC;AAChD,cAAc,mBAAmB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,YAAY,CAAC;AAC3B,cAAc,yBAAyB,CAAC;AACxC,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,OAAO,CAAC;AACtB,cAAc,aAAa,CAAC;AAC5B,cAAc,0BAA0B,CAAC;AACzC,cAAc,iCAAiC,CAAC;AAChD,cAAc,mBAAmB,CAAC;AAClC,cAAc,yBAAyB,CAAC"}

package/dist/components/index.mjs CHANGED Viewed

@@ -5,7 +5,6 @@ import { useRightDrawerStore } from "./RightDrawer/useRightDrawerStore.mjs";
 import { PressableSpan } from "./PressableSpan/PressableSpan.mjs";
 import { ContentSelector } from "./ContentSelector/ContentSelector.mjs";
 import { DictionaryEditor } from "./DictionaryEditor/DictionaryEditor.mjs";
-import { DictionariesSelector } from "./DictionaryFieldEditor/DictionariesSelector/DictionariesSelector.mjs";
 import { DictionaryCreationForm } from "./DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.mjs";
 import { DictionaryFieldEditor } from "./DictionaryFieldEditor/DictionaryFieldEditor.mjs";
 import { VersionSwitcher } from "./DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs";
@@ -77,6 +76,7 @@ import { LocaleSwitcher } from "./LocaleSwitcherDropDown/LocaleSwitcher.mjs";
 import { LocaleSwitcherContent } from "./LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs";
 import { LocaleSwitcherContentProvider, useLocaleSwitcherContent } from "./LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.mjs";
 import { ClickOutsideDiv } from "./ClickOutsideDiv/index.mjs";
+import { KeyboardScreenAdapter } from "./KeyboardScreenAdapter/index.mjs";
 export {
   Accordion,
   AuthModal,
@@ -96,7 +96,6 @@ export {
   ContentSelector,
   CopyToClipboard,
   DesktopThemeSwitcher,
-  DictionariesSelector,
   DictionaryCreationForm,
   DictionaryEditor,
   DictionaryFieldEditor,
@@ -121,6 +120,7 @@ export {
   InformationTag,
   Input,
   InputPassword,
+  KeyboardScreenAdapter,
   Label,
   Link,
   Loader,