@bioturing/components 0.15.5 → 0.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Badge/component.js +9 -17
- package/dist/components/Badge/component.js.map +1 -1
- package/dist/components/Breadcrumb/component.js +4 -3
- package/dist/components/Breadcrumb/component.js.map +1 -1
- package/dist/components/Button/component.js +30 -3
- package/dist/components/Button/component.js.map +1 -1
- package/dist/components/Button/style.css +1 -1
- package/dist/components/CodeBlock/component.js +7 -6
- package/dist/components/CodeBlock/component.js.map +1 -1
- package/dist/components/CodeBlock/style.css +1 -1
- package/dist/components/Collapse/component.js +11 -10
- package/dist/components/Collapse/component.js.map +1 -1
- package/dist/components/ColorSelect/component.js +138 -0
- package/dist/components/ColorSelect/component.js.map +1 -0
- package/dist/components/ColorSelect/style.css +1 -0
- package/dist/components/DSRoot/component.js +8 -7
- package/dist/components/DSRoot/component.js.map +1 -1
- package/dist/components/DSRoot/context.js +5 -4
- package/dist/components/DSRoot/context.js.map +1 -1
- package/dist/components/DragDrop/context.js +18 -0
- package/dist/components/DragDrop/context.js.map +1 -0
- package/dist/components/DragDrop/draggable.js +64 -0
- package/dist/components/DragDrop/draggable.js.map +1 -0
- package/dist/components/DragDrop/droppable.js +48 -0
- package/dist/components/DragDrop/droppable.js.map +1 -0
- package/dist/components/DragDrop/hooks.js +139 -0
- package/dist/components/DragDrop/hooks.js.map +1 -0
- package/dist/components/DragDrop/index.js +45 -0
- package/dist/components/DragDrop/index.js.map +1 -0
- package/dist/components/DragDrop/style.css +1 -0
- package/dist/components/DropdownMenu/component.js +1 -0
- package/dist/components/DropdownMenu/component.js.map +1 -1
- package/dist/components/Field/component.js +13 -12
- package/dist/components/Field/component.js.map +1 -1
- package/dist/components/Form/component.js +4 -3
- package/dist/components/Form/component.js.map +1 -1
- package/dist/components/Form/item.js +1 -0
- package/dist/components/Form/item.js.map +1 -1
- package/dist/components/IconButton/component.js +55 -43
- package/dist/components/IconButton/component.js.map +1 -1
- package/dist/components/IconButton/style.css +1 -1
- package/dist/components/Modal/Modal.js +1 -0
- package/dist/components/Modal/Modal.js.map +1 -1
- package/dist/components/Modal/ModalProvider.js +1 -0
- package/dist/components/Modal/ModalProvider.js.map +1 -1
- package/dist/components/Modal/index.js +11 -10
- package/dist/components/Modal/index.js.map +1 -1
- package/dist/components/Nav/context.js +7 -0
- package/dist/components/Nav/context.js.map +1 -0
- package/dist/components/Nav/group.js +16 -0
- package/dist/components/Nav/group.js.map +1 -0
- package/dist/components/Nav/heading.js +16 -0
- package/dist/components/Nav/heading.js.map +1 -0
- package/dist/components/Nav/index.js +13 -0
- package/dist/components/Nav/index.js.map +1 -0
- package/dist/components/Nav/item.js +36 -0
- package/dist/components/Nav/item.js.map +1 -0
- package/dist/components/Nav/style.css +1 -0
- package/dist/components/Popover/component.js +6 -5
- package/dist/components/Popover/component.js.map +1 -1
- package/dist/components/PopupPanel/component.js +100 -99
- package/dist/components/PopupPanel/component.js.map +1 -1
- package/dist/components/ScrollArea/component.js +10 -9
- package/dist/components/ScrollArea/component.js.map +1 -1
- package/dist/components/Slider/component.js +9 -8
- package/dist/components/Slider/component.js.map +1 -1
- package/dist/components/Splitter/component.js +12 -11
- package/dist/components/Splitter/component.js.map +1 -1
- package/dist/components/Stack/Stack.js +40 -34
- package/dist/components/Stack/Stack.js.map +1 -1
- package/dist/components/Stack/StackChild.js +62 -54
- package/dist/components/Stack/StackChild.js.map +1 -1
- package/dist/components/Stack/style.css +1 -1
- package/dist/components/Table/component.js +54 -50
- package/dist/components/Table/component.js.map +1 -1
- package/dist/components/Table/style.css +1 -1
- package/dist/components/Tag/component.js +60 -24
- package/dist/components/Tag/component.js.map +1 -1
- package/dist/components/Tag/style.css +1 -1
- package/dist/components/ThemeProvider/component.js +27 -26
- package/dist/components/ThemeProvider/component.js.map +1 -1
- package/dist/components/ThemeProvider/style.css +1 -1
- package/dist/components/Toast/component.js +24 -29
- package/dist/components/Toast/component.js.map +1 -1
- package/dist/components/Toast/function.js +5 -4
- package/dist/components/Toast/function.js.map +1 -1
- package/dist/components/Tooltip/component.js +4 -21
- package/dist/components/Tooltip/component.js.map +1 -1
- package/dist/components/Tour/component.js +5 -4
- package/dist/components/Tour/component.js.map +1 -1
- package/dist/components/Transition/component.js +45 -32
- package/dist/components/Transition/component.js.map +1 -1
- package/dist/components/Tree/components.js +9 -8
- package/dist/components/Tree/components.js.map +1 -1
- package/dist/components/Tree/helpers.js +1 -0
- package/dist/components/Tree/helpers.js.map +1 -1
- package/dist/components/Tree/useTreeCommon.js +12 -11
- package/dist/components/Tree/useTreeCommon.js.map +1 -1
- package/dist/components/Truncate/component.js +1 -0
- package/dist/components/Truncate/component.js.map +1 -1
- package/dist/components/Upload/component.js +13 -11
- package/dist/components/Upload/component.js.map +1 -1
- package/dist/components/Upload/dragger.js +3 -2
- package/dist/components/Upload/dragger.js.map +1 -1
- package/dist/components/Upload/hooks.js +3 -2
- package/dist/components/Upload/hooks.js.map +1 -1
- package/dist/components/Upload/style.css +1 -0
- package/dist/components/VerticalCollapsiblePanel/component.js +39 -36
- package/dist/components/VerticalCollapsiblePanel/component.js.map +1 -1
- package/dist/components/hooks/antd.js +4 -3
- package/dist/components/hooks/antd.js.map +1 -1
- package/dist/components/hooks/base-ui.js +34 -28
- package/dist/components/hooks/base-ui.js.map +1 -1
- package/dist/components/hooks/useCharts.js +19 -17
- package/dist/components/hooks/useCharts.js.map +1 -1
- package/dist/components/hooks/useControlledState.js +17 -9
- package/dist/components/hooks/useControlledState.js.map +1 -1
- package/dist/components/utils/WithAntdTokens.js +14 -13
- package/dist/components/utils/WithAntdTokens.js.map +1 -1
- package/dist/components/utils/antdUtils.js +1 -0
- package/dist/components/utils/antdUtils.js.map +1 -1
- package/dist/components/utils/colors.js +5 -0
- package/dist/components/utils/colors.js.map +1 -0
- package/dist/index.d.ts +819 -65
- package/dist/index.js +191 -159
- package/dist/index.js.map +1 -1
- package/dist/metadata.js +124 -92
- package/dist/metadata.js.map +1 -1
- package/dist/tailwind.css +1 -1
- package/dist/tokens/and-theme/tokens.js +13 -7
- package/dist/tokens/and-theme/tokens.js.map +1 -1
- package/dist/tokens/charts/{tokens.js → palettes/cloudscape.js} +22 -12
- package/dist/tokens/charts/palettes/cloudscape.js.map +1 -0
- package/dist/tokens/charts/palettes/colorbrewer.js +1525 -0
- package/dist/tokens/charts/palettes/colorbrewer.js.map +1 -0
- package/dist/tokens/charts/palettes/index.js +61 -0
- package/dist/tokens/charts/palettes/index.js.map +1 -0
- package/dist/tokens/charts/palettes/tableau.js +112 -0
- package/dist/tokens/charts/palettes/tableau.js.map +1 -0
- package/dist/tokens/utils.js.map +1 -1
- package/package.json +7 -7
- package/dist/tokens/charts/index.js +0 -18
- package/dist/tokens/charts/index.js.map +0 -1
- package/dist/tokens/charts/tokens.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component.js","sources":["../../../src/components/IconButton/component.tsx"],"sourcesContent":["\"use client\";\nimport React, {\n forwardRef,\n type ElementType,\n type ComponentPropsWithoutRef,\n type ReactElement,\n type Ref,\n type AnchorHTMLAttributes,\n ComponentPropsWithRef,\n} from \"react\";\nimport { Tooltip } from \"
|
|
1
|
+
{"version":3,"file":"component.js","sources":["../../../src/components/IconButton/component.tsx"],"sourcesContent":["\"use client\";\nimport React, {\n forwardRef,\n type ElementType,\n type ComponentPropsWithoutRef,\n type ReactElement,\n type Ref,\n type AnchorHTMLAttributes,\n ComponentPropsWithRef,\n} from \"react\";\nimport { Tooltip, TooltipProps } from \"../Tooltip\";\nimport { useCls, clsx } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\n\n// Import component-specific styles\nimport \"./style.css\";\nimport { Spin } from \"../Spin\";\n\n// Base props without href/as handling\ntype IconButtonBaseProps = {\n /**\n * Label text or element to display within tooltip\n * @default undefined\n */\n label?: React.ReactNode;\n /**\n * Size of the icon button: small (1.25rem) or medium (1.5rem)\n * @default medium\n */\n size?: \"small\" | \"medium\";\n /**\n * Whether to apply negative margin for better visual alignment\n * @default true\n */\n negativeMargin?: boolean;\n /**\n * Whether to show loading state\n * @default false\n */\n loading?: boolean;\n /**\n * Props to pass to the Tooltip component when wrapping the button\n */\n tooltipProps?: TooltipProps;\n /**\n * Custom render function for the button\n */\n render?: useRender.RenderProp<{ loading: boolean }>;\n};\n\n// Extract anchor-specific props we want to automatically handle\ntype AnchorSpecificProps = Pick<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n \"target\" | \"rel\" | \"download\" | \"hrefLang\" | \"referrerPolicy\"\n>;\n\n// Props when href is provided - as defaults to 'a' and includes anchor-specific props\ntype WithHrefProps<E extends ElementType = \"a\"> = IconButtonBaseProps & {\n href: string;\n as?: E;\n} & AnchorSpecificProps;\n\n// Props when href is not provided - as defaults to 'button'\ntype WithoutHrefProps<E extends ElementType = \"button\"> =\n IconButtonBaseProps & {\n href?: undefined;\n as?: E;\n } & {\n [K in keyof AnchorSpecificProps]?: never;\n };\n\n// Combined props type with conditional behavior\ntype IconButtonOwnProps<E extends ElementType = ElementType> =\n | WithHrefProps<E>\n | WithoutHrefProps<E>;\n\nexport type IconButtonProps<E extends ElementType = \"button\"> =\n IconButtonOwnProps<E> &\n Omit<ComponentPropsWithoutRef<E>, keyof IconButtonOwnProps<E>>;\n\n/**\n * A type-safe polymorphic component pattern\n */\ninterface PolymorphicComponentProps<E extends ElementType = \"button\"> {\n as?: E;\n href?: string;\n}\n\n/**\n * Type for wrapping the forwardRef implementation\n */\ntype IconButtonComponent = <E extends ElementType = \"button\">(\n props: IconButtonProps<E> & { ref?: ComponentPropsWithRef<E>[\"ref\"] }\n) => ReactElement;\n\n/**\n * Implementation of the IconButton component\n */\nconst IconButtonImpl = <E extends ElementType = \"button\">(\n {\n label,\n size = \"medium\",\n negativeMargin = true,\n children,\n className,\n tooltipProps = {},\n as,\n href,\n // Extract anchor-specific props\n target,\n rel,\n download,\n hrefLang,\n referrerPolicy,\n loading,\n render,\n ...rest\n }: IconButtonProps<E> & PolymorphicComponentProps<E>,\n ref: Ref<Element>\n) => {\n const cls = useCls();\n const buttonClasses = clsx(\n cls(\"icon-button\"),\n cls(`icon-button-${size}`),\n cls(negativeMargin ? \"icon-button-negative-margin\" : \"\"),\n className\n );\n\n // Use a type assertion for the component to avoid TypeScript errors\n const Component = (as || (href ? \"a\" : \"button\")) as ElementType;\n\n const elementProps = {\n ref,\n className: buttonClasses,\n ...(Component === \"button\" && { type: \"button\" }),\n ...(Component === \"a\"\n ? {\n ...(href && { href }),\n ...(target !== undefined && { target }),\n ...(rel !== undefined && { rel }),\n ...(download !== undefined && { download }),\n ...(hrefLang !== undefined && { hrefLang }),\n ...(referrerPolicy !== undefined && { referrerPolicy }),\n }\n : {}),\n \"data-loading\": loading,\n ...rest,\n };\n\n const element = useRender({\n ref,\n render: render || (\n <Component {...elementProps}>{loading ? <Spin /> : children}</Component>\n ),\n props: elementProps,\n state: {\n loading,\n },\n });\n\n return label ? (\n <Tooltip title={label} arrow={false} {...tooltipProps}>\n {element}\n </Tooltip>\n ) : (\n element\n );\n};\n\n// Export with correct typing\nexport const IconButton = forwardRef(IconButtonImpl) as IconButtonComponent;\n"],"names":["IconButtonImpl","label","size","negativeMargin","children","className","tooltipProps","as","href","target","rel","download","hrefLang","referrerPolicy","loading","render","rest","ref","cls","useCls","buttonClasses","clsx","Component","elementProps","element","useRender","jsx","Spin","Tooltip","IconButton","forwardRef"],"mappings":";;;;;;;;;AAkGA,MAAMA,IAAiB,CACrB;AAAA,EACE,OAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,gBAAAC,IAAiB;AAAA,EACjB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC,IAAe,CAAC;AAAA,EAChB,IAAAC;AAAA,EACA,MAAAC;AAAA;AAAA,EAEA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACL,GACAC,MACG;AACH,QAAMC,IAAMC,EAAO,GACbC,IAAgBC;AAAA,IACpBH,EAAI,aAAa;AAAA,IACjBA,EAAI,eAAehB,CAAI,EAAE;AAAA,IACzBgB,EAAIf,IAAiB,gCAAgC,EAAE;AAAA,IACvDE;AAAA,EACF,GAGMiB,IAAaf,MAAOC,IAAO,MAAM,WAEjCe,IAAe;AAAA,IACnB,KAAAN;AAAA,IACA,WAAWG;AAAA,IACX,GAAIE,MAAc,YAAY,EAAE,MAAM,SAAS;AAAA,IAC/C,GAAIA,MAAc,MACd;AAAA,MACE,GAAId,KAAQ,EAAE,MAAAA,EAAK;AAAA,MACnB,GAAIC,MAAW,UAAa,EAAE,QAAAA,EAAO;AAAA,MACrC,GAAIC,MAAQ,UAAa,EAAE,KAAAA,EAAI;AAAA,MAC/B,GAAIC,MAAa,UAAa,EAAE,UAAAA,EAAS;AAAA,MACzC,GAAIC,MAAa,UAAa,EAAE,UAAAA,EAAS;AAAA,MACzC,GAAIC,MAAmB,UAAa,EAAE,gBAAAA,EAAe;AAAA,IAAA,IAEvD,CAAC;AAAA,IACL,gBAAgBC;AAAA,IAChB,GAAGE;AAAA,EACL,GAEMQ,IAAUC,EAAU;AAAA,IACxB,KAAAR;AAAA,IACA,QAAQF,KACN,gBAAAW,EAACJ,GAAW,EAAA,GAAGC,GAAe,UAAUT,IAAA,gBAAAY,EAACC,GAAK,CAAA,CAAA,IAAKvB,EAAS,CAAA;AAAA,IAE9D,OAAOmB;AAAA,IACP,OAAO;AAAA,MACL,SAAAT;AAAA,IAAA;AAAA,EACF,CACD;AAEM,SAAAb,IACJ,gBAAAyB,EAAAE,GAAA,EAAQ,OAAO3B,GAAO,OAAO,IAAQ,GAAGK,GACtC,UAAAkB,EAAA,CACH,IAEAA;AAEJ,GAGaK,IAAaC,EAAW9B,CAAc;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer components{.ds-icon-button{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:999px;cursor:pointer;background-color:transparent;color:var(--ds-color-icon);transition:all .2s}.ds-icon-button:hover{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-icon-hover)}.ds-icon-button:active,.ds-icon-button.ds-popover-open{background-color:var(--ds-color-primary-bg);color:var(--ds-color-primary)}.ds-icon-button:focus{outline:none}.ds-icon-button:disabled{cursor:not-allowed;pointer-events:none;color:var(--ds-color-text-disabled)}.ds-icon-button.ds-icon-button-medium{padding:.
|
|
1
|
+
@layer components{.ds-icon-button{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:999px;cursor:pointer;background-color:transparent;color:var(--ds-color-icon);transition:all .2s}.ds-icon-button:hover{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-icon-hover)}.ds-icon-button:active,.ds-icon-button.ds-popover-open{background-color:var(--ds-color-primary-bg);color:var(--ds-color-primary)}.ds-icon-button:focus{outline:none}.ds-icon-button:disabled{cursor:not-allowed;pointer-events:none;color:var(--ds-color-text-disabled)}.ds-icon-button.ds-icon-button-medium{padding:.25rem;font-size:1.25rem;height:1.75rem;width:1.75rem}.ds-icon-button.ds-icon-button-medium.ds-icon-button-negative-margin{margin:-.25rem}.ds-icon-button.ds-icon-button-small{padding:.25rem;font-size:1rem;height:1.5rem;width:1.5rem}.ds-icon-button.ds-icon-button-small.ds-icon-button-negative-margin{margin:-.25rem}.ds-icon-button .ds-spin{font-size:.8em;line-height:1;display:flex;align-items:center;justify-content:center}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\nimport {\n default as AntModal,\n type ModalProps as AntModalProps,\n} from \"antd/es/modal\";\nimport { XIcon } from \"@bioturing/assets\";\nimport React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport { useCls } from \"../utils\";\nimport { ModalContextProvider } from \"antd/es/modal/context\";\nimport NormalCancelBtn from \"antd/es/modal/components/NormalCancelBtn\";\nimport NormalOkBtn from \"antd/es/modal/components/NormalOkBtn\";\nimport { getConfirmLocale } from \"antd/es/modal/locale\";\nimport { useLocale } from \"antd/es/locale\";\nimport { IconButton } from \"../IconButton\";\nimport { ModalSize } from \"./constants\";\nimport { ModalType } from \"./functions\";\nimport { Truncate } from \"../Truncate\";\nimport { Stack } from \"../Stack\";\n\n// Define props interface extending Ant Design's ModalProps\nexport interface ModalProps extends Omit<AntModalProps, \"centered\"> {\n /**\n * Predefined sizes for the modal\n * - xsmall: 400px\n * - small: 520px\n * - medium: 640px (default)\n * - large: 840px\n * - xlarge: 1024px\n * - fullscreen: 100vw (takes full screen width with margins)\n * @default \"medium\" for default type, \"xsmall\" for other types\n */\n size?:\n | \"xsmall\"\n | \"small\"\n | \"medium\"\n | \"large\"\n | \"xlarge\"\n | \"xxlarge\"\n | \"fullscreen\";\n /**\n * Mark modal as loading\n * @default false\n */\n loading?: boolean;\n /**\n * Hide Ok button\n * @default false\n */\n hideOkButton?: boolean;\n /**\n * Hide Cancel button\n * @default false\n */\n hideCancelButton?: boolean;\n /**\n * Custom Content Padding\n * @default \"24px\"\n */\n contentPadding?: number | string | boolean;\n /**\n * Add more content below the title\n */\n afterTitle?: React.ReactNode;\n /**\n * Add more actions before close button\n */\n beforeCloseButton?: React.ReactNode;\n /**\n * Add more actions after close button\n */\n afterCloseButton?: React.ReactNode;\n /**\n * Set header and footer to fixed position\n * @default false\n */\n defaultFixedHeaderFooter?: boolean;\n /**\n * Centered Modal\n * @default true\n */\n centered?: boolean;\n /**\n * Modal type\n * @default \"default\"\n */\n type?: ModalType;\n /**\n * Default open state for uncontrolled modal\n * @default true\n */\n defaultOpen?: boolean;\n /**\n * Modal background\n * @default \"elevated\" if size smaller than \"medium\", otherwise \"container\"\n */\n background?: \"elevated\" | \"container\";\n /**\n * Modal old close callback\n * @deprecated use onCancel instead\n */\n onClose?: () => void;\n /**\n * Make modal body scrollable\n * @default true\n */\n bodyScrollable?: boolean;\n}\n\n// Create Modal component\nexport const Modal = ({\n open: externalOpen,\n closeIcon,\n children,\n size: sizeProp,\n footer,\n width,\n style,\n styles,\n classNames,\n okButtonProps,\n cancelButtonProps,\n loading,\n onOk,\n onCancel,\n okText,\n okType = \"primary\",\n confirmLoading,\n cancelText = \"Close\",\n hideOkButton = false,\n hideCancelButton = false,\n contentPadding,\n title,\n afterTitle,\n beforeCloseButton,\n afterCloseButton,\n defaultFixedHeaderFooter = false,\n centered = true,\n type = \"default\",\n defaultOpen = true,\n background: backgroundProp,\n bodyScrollable = true,\n ...rest\n}: ModalProps) => {\n // Default close icon with Phosphor icon\n const defaultCloseIcon =\n closeIcon === undefined ? <XIcon size={16} weight=\"bold\" /> : closeIcon;\n\n // Use custom width if provided, otherwise use the size from the map\n const defaultModalSize = type === \"default\" ? \"medium\" : \"xsmall\";\n\n const size: keyof typeof ModalSize = sizeProp || defaultModalSize;\n const modalWidth = width || ModalSize[size];\n\n const background =\n backgroundProp ||\n (size &&\n size in ModalSize &&\n parseInt(ModalSize[size]) <= parseInt(ModalSize.medium)\n ? \"elevated\"\n : \"container\");\n\n // Apply additional styles for fullscreen mode\n const modalStyle = {\n \"--ds-modal-bg\": `var(--ds-color-bg-${background})`,\n ...style,\n ...(size === \"fullscreen\"\n ? { top: 0, maxWidth: \"100%\", height: \"100%\" }\n : {}),\n };\n\n const modalStyles = {\n ...styles,\n body: {\n ...((typeof contentPadding != \"undefined\"\n ? {\n \"--ds-modal-content-padding\":\n contentPadding === false || contentPadding === 0\n ? \"0\"\n : typeof contentPadding == \"number\"\n ? `${contentPadding}px`\n : contentPadding,\n }\n : {}) as React.CSSProperties),\n ...styles?.body,\n },\n };\n\n const [isContentOverflow, setIsContentOverflow] = useState(false);\n\n const cls = useCls();\n\n const resizeObserverRef = useRef<ResizeObserver | null>(null);\n\n const modalInnerRef = useCallback(\n (node: HTMLElement | null) => {\n // If the node is null (component unmounting), just return\n if (!node) return;\n\n const modalBody = node.querySelector(\".\" + cls(\"modal-body\"));\n if (!(modalBody instanceof HTMLElement)) return;\n\n // Create ResizeObserver to detect overflow\n const resizeObserver = new ResizeObserver(() => {\n const hasOverflow = modalBody.scrollHeight > modalBody.clientHeight;\n setIsContentOverflow(hasOverflow);\n });\n\n // Store reference to the observer\n resizeObserverRef.current = resizeObserver;\n\n // Start observing\n resizeObserver.observe(modalBody);\n\n // Initial check\n const hasOverflow = modalBody.scrollHeight > modalBody.clientHeight;\n setIsContentOverflow(hasOverflow);\n },\n [cls]\n );\n\n // clean up resize observer\n useEffect(() => {\n return () => {\n if (resizeObserverRef.current) {\n resizeObserverRef.current.disconnect();\n resizeObserverRef.current = null;\n }\n };\n }, []);\n\n const [locale] = useLocale(\"Modal\", getConfirmLocale());\n\n const okTextLocale: React.ReactNode = okText || locale?.okText;\n const cancelTextLocale = cancelText || locale?.cancelText;\n\n const modalOkButtonProps = {\n loading: loading,\n ...okButtonProps,\n };\n\n const modalCancelButtonProps = {\n ...cancelButtonProps,\n };\n\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n\n const uncontrolledOpen = typeof externalOpen === \"undefined\";\n\n const open = uncontrolledOpen ? internalOpen : externalOpen;\n\n const defaultFooter = (\n <ModalContextProvider\n value={{\n okButtonProps: modalOkButtonProps,\n cancelButtonProps: modalCancelButtonProps,\n onCancel,\n onOk,\n okType,\n confirmLoading,\n okTextLocale,\n cancelTextLocale,\n }}\n >\n {hideOkButton ? (\n <NormalCancelBtn />\n ) : hideCancelButton ? (\n <NormalOkBtn />\n ) : (\n <>\n <NormalCancelBtn />\n <NormalOkBtn />\n </>\n )}\n </ModalContextProvider>\n );\n const renderTitle = () => {\n return (\n <>\n <Stack align=\"center\" gap={8} className={cls(\"modal-title-wrapper\")}>\n <Stack.Child grow>\n {typeof title === \"string\" ? <Truncate>{title}</Truncate> : title}\n </Stack.Child>\n <Stack.Child stack hug align=\"center\" gap={8}>\n {beforeCloseButton}\n <IconButton\n onClick={(e: React.MouseEvent<HTMLButtonElement>) =>\n onCancel?.(e)\n }\n >\n {defaultCloseIcon}\n </IconButton>\n {afterCloseButton}\n </Stack.Child>\n {}\n </Stack>\n {afterTitle ? afterTitle : null}\n </>\n );\n };\n return (\n <AntModal\n closeIcon={false}\n open={open}\n width={modalWidth}\n style={modalStyle}\n title={renderTitle()}\n classNames={{\n ...classNames,\n wrapper: cls(\n \"modal-wrap\",\n size == \"fullscreen\" && \"modal-fullscreen\",\n isContentOverflow && \"modal-content-overflow\",\n bodyScrollable === false && \"modal-no-body-scroll\",\n defaultFixedHeaderFooter || isContentOverflow || size == \"fullscreen\"\n ? \"modal-fixed\"\n : \"\"\n ),\n }}\n styles={modalStyles}\n modalRender={(modal) => (\n <div ref={modalInnerRef} className={cls(\"modal-inner\")}>\n {modal}\n </div>\n )}\n okButtonProps={modalOkButtonProps}\n cancelButtonProps={modalCancelButtonProps}\n onOk={(e) => {\n if (uncontrolledOpen) setInternalOpen(false);\n onOk?.(e);\n }}\n onCancel={(e) => {\n if (uncontrolledOpen) setInternalOpen(false);\n onCancel?.(e);\n }}\n okText={okText}\n cancelText={cancelText}\n okType=\"primary\"\n confirmLoading={confirmLoading}\n footer={\n typeof footer === \"undefined\"\n ? hideOkButton && hideCancelButton\n ? null\n : defaultFooter\n : footer\n }\n centered={centered}\n {...rest}\n >\n {children}\n </AntModal>\n );\n};\n"],"names":["Modal","externalOpen","closeIcon","children","sizeProp","footer","width","style","styles","classNames","okButtonProps","cancelButtonProps","loading","onOk","onCancel","okText","okType","confirmLoading","cancelText","hideOkButton","hideCancelButton","contentPadding","title","afterTitle","beforeCloseButton","afterCloseButton","defaultFixedHeaderFooter","centered","type","defaultOpen","backgroundProp","bodyScrollable","rest","defaultCloseIcon","jsx","XIcon","size","modalWidth","ModalSize","modalStyle","modalStyles","isContentOverflow","setIsContentOverflow","useState","cls","useCls","resizeObserverRef","useRef","modalInnerRef","useCallback","node","modalBody","resizeObserver","hasOverflow","useEffect","locale","useLocale","getConfirmLocale","okTextLocale","cancelTextLocale","modalOkButtonProps","modalCancelButtonProps","internalOpen","setInternalOpen","uncontrolledOpen","open","defaultFooter","ModalContextProvider","NormalCancelBtn","NormalOkBtn","jsxs","Fragment","AntModal","Stack","Truncate","IconButton","e","modal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\nimport {\n default as AntModal,\n type ModalProps as AntModalProps,\n} from \"antd/es/modal\";\nimport { XIcon } from \"@bioturing/assets\";\nimport React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport { useCls } from \"../utils\";\nimport { ModalContextProvider } from \"antd/es/modal/context\";\nimport NormalCancelBtn from \"antd/es/modal/components/NormalCancelBtn\";\nimport NormalOkBtn from \"antd/es/modal/components/NormalOkBtn\";\nimport { getConfirmLocale } from \"antd/es/modal/locale\";\nimport { useLocale } from \"antd/es/locale\";\nimport { IconButton } from \"../IconButton\";\nimport { ModalSize } from \"./constants\";\nimport { ModalType } from \"./functions\";\nimport { Truncate } from \"../Truncate\";\nimport { Stack } from \"../Stack\";\n\n// Define props interface extending Ant Design's ModalProps\nexport interface ModalProps extends Omit<AntModalProps, \"centered\"> {\n /**\n * Predefined sizes for the modal\n * - xsmall: 400px\n * - small: 520px\n * - medium: 640px (default)\n * - large: 840px\n * - xlarge: 1024px\n * - fullscreen: 100vw (takes full screen width with margins)\n * @default \"medium\" for default type, \"xsmall\" for other types\n */\n size?:\n | \"xsmall\"\n | \"small\"\n | \"medium\"\n | \"large\"\n | \"xlarge\"\n | \"xxlarge\"\n | \"fullscreen\";\n /**\n * Mark modal as loading\n * @default false\n */\n loading?: boolean;\n /**\n * Hide Ok button\n * @default false\n */\n hideOkButton?: boolean;\n /**\n * Hide Cancel button\n * @default false\n */\n hideCancelButton?: boolean;\n /**\n * Custom Content Padding\n * @default \"24px\"\n */\n contentPadding?: number | string | boolean;\n /**\n * Add more content below the title\n */\n afterTitle?: React.ReactNode;\n /**\n * Add more actions before close button\n */\n beforeCloseButton?: React.ReactNode;\n /**\n * Add more actions after close button\n */\n afterCloseButton?: React.ReactNode;\n /**\n * Set header and footer to fixed position\n * @default false\n */\n defaultFixedHeaderFooter?: boolean;\n /**\n * Centered Modal\n * @default true\n */\n centered?: boolean;\n /**\n * Modal type\n * @default \"default\"\n */\n type?: ModalType;\n /**\n * Default open state for uncontrolled modal\n * @default true\n */\n defaultOpen?: boolean;\n /**\n * Modal background\n * @default \"elevated\" if size smaller than \"medium\", otherwise \"container\"\n */\n background?: \"elevated\" | \"container\";\n /**\n * Modal old close callback\n * @deprecated use onCancel instead\n */\n onClose?: () => void;\n /**\n * Make modal body scrollable\n * @default true\n */\n bodyScrollable?: boolean;\n}\n\n// Create Modal component\nexport const Modal = ({\n open: externalOpen,\n closeIcon,\n children,\n size: sizeProp,\n footer,\n width,\n style,\n styles,\n classNames,\n okButtonProps,\n cancelButtonProps,\n loading,\n onOk,\n onCancel,\n okText,\n okType = \"primary\",\n confirmLoading,\n cancelText = \"Close\",\n hideOkButton = false,\n hideCancelButton = false,\n contentPadding,\n title,\n afterTitle,\n beforeCloseButton,\n afterCloseButton,\n defaultFixedHeaderFooter = false,\n centered = true,\n type = \"default\",\n defaultOpen = true,\n background: backgroundProp,\n bodyScrollable = true,\n ...rest\n}: ModalProps) => {\n // Default close icon with Phosphor icon\n const defaultCloseIcon =\n closeIcon === undefined ? <XIcon size={16} weight=\"bold\" /> : closeIcon;\n\n // Use custom width if provided, otherwise use the size from the map\n const defaultModalSize = type === \"default\" ? \"medium\" : \"xsmall\";\n\n const size: keyof typeof ModalSize = sizeProp || defaultModalSize;\n const modalWidth = width || ModalSize[size];\n\n const background =\n backgroundProp ||\n (size &&\n size in ModalSize &&\n parseInt(ModalSize[size]) <= parseInt(ModalSize.medium)\n ? \"elevated\"\n : \"container\");\n\n // Apply additional styles for fullscreen mode\n const modalStyle = {\n \"--ds-modal-bg\": `var(--ds-color-bg-${background})`,\n ...style,\n ...(size === \"fullscreen\"\n ? { top: 0, maxWidth: \"100%\", height: \"100%\" }\n : {}),\n };\n\n const modalStyles = {\n ...styles,\n body: {\n ...((typeof contentPadding != \"undefined\"\n ? {\n \"--ds-modal-content-padding\":\n contentPadding === false || contentPadding === 0\n ? \"0\"\n : typeof contentPadding == \"number\"\n ? `${contentPadding}px`\n : contentPadding,\n }\n : {}) as React.CSSProperties),\n ...styles?.body,\n },\n };\n\n const [isContentOverflow, setIsContentOverflow] = useState(false);\n\n const cls = useCls();\n\n const resizeObserverRef = useRef<ResizeObserver | null>(null);\n\n const modalInnerRef = useCallback(\n (node: HTMLElement | null) => {\n // If the node is null (component unmounting), just return\n if (!node) return;\n\n const modalBody = node.querySelector(\".\" + cls(\"modal-body\"));\n if (!(modalBody instanceof HTMLElement)) return;\n\n // Create ResizeObserver to detect overflow\n const resizeObserver = new ResizeObserver(() => {\n const hasOverflow = modalBody.scrollHeight > modalBody.clientHeight;\n setIsContentOverflow(hasOverflow);\n });\n\n // Store reference to the observer\n resizeObserverRef.current = resizeObserver;\n\n // Start observing\n resizeObserver.observe(modalBody);\n\n // Initial check\n const hasOverflow = modalBody.scrollHeight > modalBody.clientHeight;\n setIsContentOverflow(hasOverflow);\n },\n [cls]\n );\n\n // clean up resize observer\n useEffect(() => {\n return () => {\n if (resizeObserverRef.current) {\n resizeObserverRef.current.disconnect();\n resizeObserverRef.current = null;\n }\n };\n }, []);\n\n const [locale] = useLocale(\"Modal\", getConfirmLocale());\n\n const okTextLocale: React.ReactNode = okText || locale?.okText;\n const cancelTextLocale = cancelText || locale?.cancelText;\n\n const modalOkButtonProps = {\n loading: loading,\n ...okButtonProps,\n };\n\n const modalCancelButtonProps = {\n ...cancelButtonProps,\n };\n\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n\n const uncontrolledOpen = typeof externalOpen === \"undefined\";\n\n const open = uncontrolledOpen ? internalOpen : externalOpen;\n\n const defaultFooter = (\n <ModalContextProvider\n value={{\n okButtonProps: modalOkButtonProps,\n cancelButtonProps: modalCancelButtonProps,\n onCancel,\n onOk,\n okType,\n confirmLoading,\n okTextLocale,\n cancelTextLocale,\n }}\n >\n {hideOkButton ? (\n <NormalCancelBtn />\n ) : hideCancelButton ? (\n <NormalOkBtn />\n ) : (\n <>\n <NormalCancelBtn />\n <NormalOkBtn />\n </>\n )}\n </ModalContextProvider>\n );\n const renderTitle = () => {\n return (\n <>\n <Stack align=\"center\" gap={8} className={cls(\"modal-title-wrapper\")}>\n <Stack.Child grow>\n {typeof title === \"string\" ? <Truncate>{title}</Truncate> : title}\n </Stack.Child>\n <Stack.Child stack hug align=\"center\" gap={8}>\n {beforeCloseButton}\n <IconButton\n onClick={(e: React.MouseEvent<HTMLButtonElement>) =>\n onCancel?.(e)\n }\n >\n {defaultCloseIcon}\n </IconButton>\n {afterCloseButton}\n </Stack.Child>\n {}\n </Stack>\n {afterTitle ? afterTitle : null}\n </>\n );\n };\n return (\n <AntModal\n closeIcon={false}\n open={open}\n width={modalWidth}\n style={modalStyle}\n title={renderTitle()}\n classNames={{\n ...classNames,\n wrapper: cls(\n \"modal-wrap\",\n size == \"fullscreen\" && \"modal-fullscreen\",\n isContentOverflow && \"modal-content-overflow\",\n bodyScrollable === false && \"modal-no-body-scroll\",\n defaultFixedHeaderFooter || isContentOverflow || size == \"fullscreen\"\n ? \"modal-fixed\"\n : \"\"\n ),\n }}\n styles={modalStyles}\n modalRender={(modal) => (\n <div ref={modalInnerRef} className={cls(\"modal-inner\")}>\n {modal}\n </div>\n )}\n okButtonProps={modalOkButtonProps}\n cancelButtonProps={modalCancelButtonProps}\n onOk={(e) => {\n if (uncontrolledOpen) setInternalOpen(false);\n onOk?.(e);\n }}\n onCancel={(e) => {\n if (uncontrolledOpen) setInternalOpen(false);\n onCancel?.(e);\n }}\n okText={okText}\n cancelText={cancelText}\n okType=\"primary\"\n confirmLoading={confirmLoading}\n footer={\n typeof footer === \"undefined\"\n ? hideOkButton && hideCancelButton\n ? null\n : defaultFooter\n : footer\n }\n centered={centered}\n {...rest}\n >\n {children}\n </AntModal>\n );\n};\n"],"names":["Modal","externalOpen","closeIcon","children","sizeProp","footer","width","style","styles","classNames","okButtonProps","cancelButtonProps","loading","onOk","onCancel","okText","okType","confirmLoading","cancelText","hideOkButton","hideCancelButton","contentPadding","title","afterTitle","beforeCloseButton","afterCloseButton","defaultFixedHeaderFooter","centered","type","defaultOpen","backgroundProp","bodyScrollable","rest","defaultCloseIcon","jsx","XIcon","size","modalWidth","ModalSize","modalStyle","modalStyles","isContentOverflow","setIsContentOverflow","useState","cls","useCls","resizeObserverRef","useRef","modalInnerRef","useCallback","node","modalBody","resizeObserver","hasOverflow","useEffect","locale","useLocale","getConfirmLocale","okTextLocale","cancelTextLocale","modalOkButtonProps","modalCancelButtonProps","internalOpen","setInternalOpen","uncontrolledOpen","open","defaultFooter","ModalContextProvider","NormalCancelBtn","NormalOkBtn","jsxs","Fragment","AntModal","Stack","Truncate","IconButton","e","modal"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalProvider.js","sources":["../../../src/components/Modal/ModalProvider.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useState } from \"react\";\nimport { Modal } from \"./Modal\";\nimport { modalManager } from \"./ModalService\";\nimport type { ModalConfig, ModalEvent } from \"./ModalService\";\n\nexport interface ModalProviderProps {\n children?: React.ReactNode;\n}\n\nexport const ModalProvider: React.FC<ModalProviderProps> = ({ children }) => {\n const [modals, setModals] = useState<ModalConfig[]>([]);\n\n useEffect(() => {\n const unsubscribe = modalManager.subscribe((event: ModalEvent) => {\n setModals((prev) => {\n switch (event.type) {\n case \"add\":\n return [...prev, event.payload];\n case \"update\":\n return prev.map((m) => {\n if (m.id === event.payload.id) {\n const cfg = event.payload.config;\n const merged =\n typeof cfg === \"function\" ? cfg(m) : { ...m, ...cfg };\n return { ...m, ...merged };\n }\n return m;\n });\n case \"destroy\":\n return prev.filter((m) => m.id !== event.payload.id);\n case \"destroyAll\":\n return [];\n default:\n return prev;\n }\n });\n });\n return unsubscribe;\n }, []);\n\n return (\n <>\n {children}\n {modals.map((modal) => {\n const {\n id,\n content,\n children,\n onOk,\n onCancel,\n trigger,\n ...modalProps\n } = modal;\n return (\n <Modal\n {...modalProps}\n key={id}\n // control visibility for transitions\n open={modalProps.open}\n onOk={(e) => {\n onOk?.(e);\n modalManager.emit({\n type: \"update\",\n payload: { id, config: { open: false } },\n });\n }}\n onCancel={(e) => {\n onCancel?.(e);\n modalManager.emit({\n type: \"update\",\n payload: { id, config: { open: false } },\n });\n }}\n afterClose={() => {\n // destroy and restore focus\n modalManager.emit({ type: \"destroy\", payload: { id } });\n if (trigger instanceof HTMLElement) {\n trigger.focus();\n }\n }}\n >\n {content || children}\n </Modal>\n );\n })}\n </>\n );\n};\n"],"names":["ModalProvider","children","modals","setModals","useState","useEffect","modalManager","event","prev","m","cfg","merged","jsxs","Fragment","modal","id","content","onOk","onCancel","trigger","modalProps","createElement","Modal","e"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ModalProvider.js","sources":["../../../src/components/Modal/ModalProvider.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useState } from \"react\";\nimport { Modal } from \"./Modal\";\nimport { modalManager } from \"./ModalService\";\nimport type { ModalConfig, ModalEvent } from \"./ModalService\";\n\nexport interface ModalProviderProps {\n children?: React.ReactNode;\n}\n\nexport const ModalProvider: React.FC<ModalProviderProps> = ({ children }) => {\n const [modals, setModals] = useState<ModalConfig[]>([]);\n\n useEffect(() => {\n const unsubscribe = modalManager.subscribe((event: ModalEvent) => {\n setModals((prev) => {\n switch (event.type) {\n case \"add\":\n return [...prev, event.payload];\n case \"update\":\n return prev.map((m) => {\n if (m.id === event.payload.id) {\n const cfg = event.payload.config;\n const merged =\n typeof cfg === \"function\" ? cfg(m) : { ...m, ...cfg };\n return { ...m, ...merged };\n }\n return m;\n });\n case \"destroy\":\n return prev.filter((m) => m.id !== event.payload.id);\n case \"destroyAll\":\n return [];\n default:\n return prev;\n }\n });\n });\n return unsubscribe;\n }, []);\n\n return (\n <>\n {children}\n {modals.map((modal) => {\n const {\n id,\n content,\n children,\n onOk,\n onCancel,\n trigger,\n ...modalProps\n } = modal;\n return (\n <Modal\n {...modalProps}\n key={id}\n // control visibility for transitions\n open={modalProps.open}\n onOk={(e) => {\n onOk?.(e);\n modalManager.emit({\n type: \"update\",\n payload: { id, config: { open: false } },\n });\n }}\n onCancel={(e) => {\n onCancel?.(e);\n modalManager.emit({\n type: \"update\",\n payload: { id, config: { open: false } },\n });\n }}\n afterClose={() => {\n // destroy and restore focus\n modalManager.emit({ type: \"destroy\", payload: { id } });\n if (trigger instanceof HTMLElement) {\n trigger.focus();\n }\n }}\n >\n {content || children}\n </Modal>\n );\n })}\n </>\n );\n};\n"],"names":["ModalProvider","children","modals","setModals","useState","useEffect","modalManager","event","prev","m","cfg","merged","jsxs","Fragment","modal","id","content","onOk","onCancel","trigger","modalProps","createElement","Modal","e"],"mappings":";;;;;AAUO,MAAMA,IAA8C,CAAC,EAAE,UAAAC,QAAe;AAC3E,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAwB,CAAA,CAAE;AAEtD,SAAAC,EAAU,MACYC,EAAa,UAAU,CAACC,MAAsB;AAChE,IAAAJ,EAAU,CAACK,MAAS;AAClB,cAAQD,EAAM,MAAM;AAAA,QAClB,KAAK;AACH,iBAAO,CAAC,GAAGC,GAAMD,EAAM,OAAO;AAAA,QAChC,KAAK;AACI,iBAAAC,EAAK,IAAI,CAACC,MAAM;AACrB,gBAAIA,EAAE,OAAOF,EAAM,QAAQ,IAAI;AACvB,oBAAAG,IAAMH,EAAM,QAAQ,QACpBI,IACJ,OAAOD,KAAQ,aAAaA,EAAID,CAAC,IAAI,EAAE,GAAGA,GAAG,GAAGC,EAAI;AACtD,qBAAO,EAAE,GAAGD,GAAG,GAAGE,EAAO;AAAA,YAAA;AAEpB,mBAAAF;AAAA,UAAA,CACR;AAAA,QACH,KAAK;AACI,iBAAAD,EAAK,OAAO,CAACC,MAAMA,EAAE,OAAOF,EAAM,QAAQ,EAAE;AAAA,QACrD,KAAK;AACH,iBAAO,CAAC;AAAA,QACV;AACS,iBAAAC;AAAA,MAAA;AAAA,IACX,CACD;AAAA,EAAA,CACF,GAEA,EAAE,GAIA,gBAAAI,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAAZ;AAAA,IACAC,EAAO,IAAI,CAACY,MAAU;AACf,YAAA;AAAA,QACJ,IAAAC;AAAA,QACA,SAAAC;AAAA,QACA,UAAAf;AAAAA,QACA,MAAAgB;AAAA,QACA,UAAAC;AAAA,QACA,SAAAC;AAAA,QACA,GAAGC;AAAA,MAAA,IACDN;AAEF,aAAA,gBAAAO;AAAA,QAACC;AAAA,QAAA;AAAA,UACE,GAAGF;AAAA,UACJ,KAAKL;AAAA,UAEL,MAAMK,EAAW;AAAA,UACjB,MAAM,CAACG,MAAM;AACX,YAAAN,KAAA,QAAAA,EAAOM,IACPjB,EAAa,KAAK;AAAA,cAChB,MAAM;AAAA,cACN,SAAS,EAAE,IAAAS,GAAI,QAAQ,EAAE,MAAM,GAAQ,EAAA;AAAA,YAAA,CACxC;AAAA,UACH;AAAA,UACA,UAAU,CAACQ,MAAM;AACf,YAAAL,KAAA,QAAAA,EAAWK,IACXjB,EAAa,KAAK;AAAA,cAChB,MAAM;AAAA,cACN,SAAS,EAAE,IAAAS,GAAI,QAAQ,EAAE,MAAM,GAAQ,EAAA;AAAA,YAAA,CACxC;AAAA,UACH;AAAA,UACA,YAAY,MAAM;AAEH,YAAAT,EAAA,KAAK,EAAE,MAAM,WAAW,SAAS,EAAE,IAAAS,EAAA,GAAM,GAClDI,aAAmB,eACrBA,EAAQ,MAAM;AAAA,UAChB;AAAA,QACF;AAAA,QAECH,KAAWf;AAAAA,MACd;AAAA,IAEH,CAAA;AAAA,EAAA,GACH;AAEJ;"}
|
|
@@ -1,18 +1,19 @@
|
|
|
1
|
+
"use client";
|
|
1
2
|
import o from "antd/es/app/useApp";
|
|
2
3
|
import { Modal as r } from "./Modal.js";
|
|
3
|
-
import { destroyAll as e, confirm as i, warning as
|
|
4
|
-
import { ModalProvider as
|
|
4
|
+
import { destroyAll as e, confirm as i, warning as s, error as t, success as m, info as n, open as a } from "./functions.js";
|
|
5
|
+
import { ModalProvider as d } from "./ModalProvider.js";
|
|
5
6
|
import './style.css';/* empty css */
|
|
6
|
-
const
|
|
7
|
-
Provider:
|
|
8
|
-
open:
|
|
9
|
-
info:
|
|
10
|
-
success:
|
|
11
|
-
error:
|
|
12
|
-
warning:
|
|
7
|
+
const l = () => o().modal, g = Object.assign(r, {
|
|
8
|
+
Provider: d,
|
|
9
|
+
open: a,
|
|
10
|
+
info: n,
|
|
11
|
+
success: m,
|
|
12
|
+
error: t,
|
|
13
|
+
warning: s,
|
|
13
14
|
confirm: i,
|
|
14
15
|
destroyAll: e,
|
|
15
|
-
useModal:
|
|
16
|
+
useModal: l
|
|
16
17
|
});
|
|
17
18
|
export {
|
|
18
19
|
g as Modal
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.ts"],"sourcesContent":["\"use client\";\nimport useApp from \"antd/es/app/useApp\";\nimport { Modal as MainModal } from \"./Modal\";\nimport {\n confirm,\n info,\n success,\n error,\n warning,\n open,\n destroyAll,\n type ModalFuncProps,\n} from \"./functions\";\nimport { ModalProvider, type ModalProviderProps } from \"./ModalProvider\";\n\nimport \"./style.css\";\n\nconst useModal = () => {\n return useApp().modal;\n};\n\n// Export the Modal component with static methods\nexport const Modal = Object.assign(MainModal, {\n Provider: ModalProvider,\n open,\n info,\n success,\n error,\n warning,\n confirm,\n destroyAll,\n useModal,\n});\n\nexport { ModalFuncProps, ModalProviderProps };\n"],"names":["useModal","useApp","Modal","MainModal","ModalProvider","open","info","success","error","warning","confirm","destroyAll"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.ts"],"sourcesContent":["\"use client\";\nimport useApp from \"antd/es/app/useApp\";\nimport { Modal as MainModal } from \"./Modal\";\nimport {\n confirm,\n info,\n success,\n error,\n warning,\n open,\n destroyAll,\n type ModalFuncProps,\n} from \"./functions\";\nimport { ModalProvider, type ModalProviderProps } from \"./ModalProvider\";\n\nimport \"./style.css\";\n\nconst useModal = () => {\n return useApp().modal;\n};\n\n// Export the Modal component with static methods\nexport const Modal = Object.assign(MainModal, {\n Provider: ModalProvider,\n open,\n info,\n success,\n error,\n warning,\n confirm,\n destroyAll,\n useModal,\n});\n\nexport { ModalFuncProps, ModalProviderProps };\n"],"names":["useModal","useApp","Modal","MainModal","ModalProvider","open","info","success","error","warning","confirm","destroyAll"],"mappings":";;;;;;AAiBA,MAAMA,IAAW,MACRC,EAAS,EAAA,OAILC,IAAQ,OAAO,OAAOC,GAAW;AAAA,EAC5C,UAAUC;AAAA,EACV,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAX;AACF,CAAC;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.js","sources":["../../../src/components/Nav/context.ts"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\n\nexport const NavGroupContext = React.createContext<{\n size: \"small\" | \"medium\" | \"large\";\n collapsible?: boolean;\n} | null>(null);\n\nexport const useNavGroupContext = () => {\n const context = React.useContext(NavGroupContext);\n if (!context) {\n throw new Error(\"useNavGroupContext must be used within a NavGroup\");\n }\n return context;\n};\n"],"names":["NavGroupContext","React"],"mappings":";;AAIa,MAAAA,IAAkBC,EAAM,cAG3B,IAAI;"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as o } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef as p } from "react";
|
|
4
|
+
import { NavGroupContext as i } from "./context.js";
|
|
5
|
+
import { useCls as s } from "../utils/antdUtils.js";
|
|
6
|
+
const u = p(
|
|
7
|
+
({ children: e, size: r = "medium", collapsible: m }, a) => {
|
|
8
|
+
const t = s();
|
|
9
|
+
return /* @__PURE__ */ o(i.Provider, { value: { size: r, collapsible: m }, children: /* @__PURE__ */ o("div", { className: t("nav-group", `nav-${r}`), ref: a, children: e }) });
|
|
10
|
+
}
|
|
11
|
+
);
|
|
12
|
+
u.displayName = "NavGroup";
|
|
13
|
+
export {
|
|
14
|
+
u as NavGroup
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"group.js","sources":["../../../src/components/Nav/group.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef } from \"react\";\nimport { useCls } from \"../utils\";\nimport { NavGroupContext } from \"./context\";\n\nexport interface NavGroupProps extends React.ComponentPropsWithoutRef<\"div\"> {\n /**\n * Size of the nav\n * @default \"medium\"\n */\n size?: \"small\" | \"medium\" | \"large\";\n /**\n * Weather it's collapsible or not\n */\n collapsible?: boolean;\n}\n\nconst NavGroup = forwardRef(\n (\n { children, size = \"medium\", collapsible }: NavGroupProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const cls = useCls();\n return (\n <NavGroupContext.Provider value={{ size, collapsible }}>\n <div className={cls(\"nav-group\", `nav-${size}`)} ref={ref}>\n {children}\n </div>\n </NavGroupContext.Provider>\n );\n }\n);\n\nNavGroup.displayName = \"NavGroup\";\n\nexport { NavGroup };\n"],"names":["NavGroup","forwardRef","children","size","collapsible","ref","cls","useCls","jsx","NavGroupContext"],"mappings":";;;;;AAiBA,MAAMA,IAAWC;AAAA,EACf,CACE,EAAE,UAAAC,GAAU,MAAAC,IAAO,UAAU,aAAAC,EAAA,GAC7BC,MACG;AACH,UAAMC,IAAMC,EAAO;AAEjB,WAAA,gBAAAC,EAACC,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAAN,GAAM,aAAAC,KACvC,UAAA,gBAAAI,EAAC,SAAI,WAAWF,EAAI,aAAa,OAAOH,CAAI,EAAE,GAAG,KAAAE,GAC9C,UAAAH,EACH,CAAA,GACF;AAAA,EAAA;AAGN;AAEAF,EAAS,cAAc;"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as e } from "react/jsx-runtime";
|
|
3
|
+
import { useCls as t } from "../utils/antdUtils.js";
|
|
4
|
+
import { clsx as o } from "../utils/cn.js";
|
|
5
|
+
const l = ({
|
|
6
|
+
children: a,
|
|
7
|
+
className: n,
|
|
8
|
+
...r
|
|
9
|
+
}) => {
|
|
10
|
+
const s = t();
|
|
11
|
+
return /* @__PURE__ */ e("h3", { className: o(s("nav-heading"), n), ...r, children: /* @__PURE__ */ e("span", { className: s("nav-heading-text"), children: a }) });
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
l as NavHeading
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=heading.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"heading.js","sources":["../../../src/components/Nav/heading.tsx"],"sourcesContent":["\"use client\";\nimport React from \"react\";\nimport { clsx, useCls } from \"../utils\";\n\nexport interface NavHeadingProps\n extends React.HTMLAttributes<HTMLHeadingElement> {\n children: React.ReactNode;\n}\n\nexport const NavHeading = ({\n children,\n className,\n ...rest\n}: NavHeadingProps) => {\n const cls = useCls();\n return (\n <h3 className={clsx(cls(\"nav-heading\"), className)} {...rest}>\n <span className={cls(\"nav-heading-text\")}>{children}</span>\n </h3>\n );\n};\n"],"names":["NavHeading","children","className","rest","cls","useCls","clsx"],"mappings":";;;;AASO,MAAMA,IAAa,CAAC;AAAA,EACzB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAAuB;AACrB,QAAMC,IAAMC,EAAO;AACnB,2BACG,MAAG,EAAA,WAAWC,EAAKF,EAAI,aAAa,GAAGF,CAAS,GAAI,GAAGC,GACtD,4BAAC,QAAK,EAAA,WAAWC,EAAI,kBAAkB,GAAI,UAAAH,EAAS,CAAA,GACtD;AAEJ;"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { NavItem as o } from "./item.js";
|
|
2
|
+
import { NavHeading as r } from "./heading.js";
|
|
3
|
+
import { NavGroup as m } from "./group.js";
|
|
4
|
+
import './style.css';/* empty css */
|
|
5
|
+
const e = {
|
|
6
|
+
Item: o,
|
|
7
|
+
Heading: r,
|
|
8
|
+
Group: m
|
|
9
|
+
};
|
|
10
|
+
export {
|
|
11
|
+
e as Nav
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/Nav/index.tsx"],"sourcesContent":["import { NavItem, NavItemProps } from \"./item\";\nimport { NavHeading, NavHeadingProps } from \"./heading\";\nimport { NavGroup, NavGroupProps } from \"./group\";\n\nimport \"./style.css\";\n\nexport const Nav = {\n Item: NavItem,\n Heading: NavHeading,\n Group: NavGroup,\n};\n\nexport type { NavItemProps, NavHeadingProps, NavGroupProps };\n"],"names":["Nav","NavItem","NavHeading","NavGroup"],"mappings":";;;;AAMO,MAAMA,IAAM;AAAA,EACjB,MAAMC;AAAA,EACN,SAASC;AAAA,EACT,OAAOC;AACT;"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsxs as c, jsx as a, Fragment as l } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef as d } from "react";
|
|
4
|
+
import { useRender as p } from "@base-ui-components/react/use-render";
|
|
5
|
+
import { useCls as f } from "../utils/antdUtils.js";
|
|
6
|
+
import { clsx as v } from "../utils/cn.js";
|
|
7
|
+
const x = ({
|
|
8
|
+
icon: r,
|
|
9
|
+
active: s = !1,
|
|
10
|
+
render: n,
|
|
11
|
+
onClick: N,
|
|
12
|
+
className: m,
|
|
13
|
+
children: o,
|
|
14
|
+
...t
|
|
15
|
+
}, i) => {
|
|
16
|
+
const e = f();
|
|
17
|
+
return p({
|
|
18
|
+
render: n ?? /* @__PURE__ */ a("button", { className: v(e("nav-item"), m) }),
|
|
19
|
+
ref: i,
|
|
20
|
+
props: {
|
|
21
|
+
"data-active": s || void 0,
|
|
22
|
+
"aria-expanded": t["aria-expanded"],
|
|
23
|
+
className: void 0,
|
|
24
|
+
...t,
|
|
25
|
+
children: /* @__PURE__ */ c(l, { children: [
|
|
26
|
+
/* @__PURE__ */ a("span", { className: e("nav-item-icon"), children: r }),
|
|
27
|
+
/* @__PURE__ */ a("span", { className: e("nav-item-content"), children: o })
|
|
28
|
+
] })
|
|
29
|
+
},
|
|
30
|
+
state: { active: s, icon: r }
|
|
31
|
+
});
|
|
32
|
+
}, R = d(x);
|
|
33
|
+
export {
|
|
34
|
+
R as NavItem
|
|
35
|
+
};
|
|
36
|
+
//# sourceMappingURL=item.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"item.js","sources":["../../../src/components/Nav/item.tsx"],"sourcesContent":["\"use client\";\nimport React, { useState, type MouseEvent, forwardRef } from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport { Transition } from \"../Transition\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\n\nexport interface NavItemProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n icon?: React.ReactNode;\n active?: boolean;\n render?: useRender.RenderProp<{\n active: boolean;\n icon?: React.ReactNode;\n }>;\n size?: \"small\" | \"medium\" | \"large\";\n}\n\nconst NavItemImpl = <T extends HTMLElement>(\n {\n icon,\n active = false,\n render,\n onClick,\n className,\n children,\n ...rest\n }: NavItemProps,\n ref: React.Ref<T>\n) => {\n const cls = useCls();\n\n return useRender({\n render: render ?? <button className={clsx(cls(\"nav-item\"), className)} />,\n ref,\n props: {\n \"data-active\": active || undefined,\n \"aria-expanded\": rest[\"aria-expanded\"],\n className: undefined,\n ...rest,\n children: (\n <>\n <span className={cls(\"nav-item-icon\")}>{icon}</span>\n {/* <Transition\n starting=\"opacity-0 max-w-[0]\"\n ending=\"opacity-0 max-w-[0]\"\n className={cls(\"nav-item-transition\")}\n > */}\n <span className={cls(\"nav-item-content\")}>{children}</span>\n {/* </Transition> */}\n </>\n ),\n },\n state: { active, icon },\n });\n};\n\nconst NavItem = forwardRef(NavItemImpl) as <T extends HTMLElement>(\n props: NavItemProps & { ref?: React.Ref<T> }\n) => ReturnType<typeof NavItemImpl>;\n\nexport { NavItem };\n"],"names":["NavItemImpl","icon","active","render","onClick","className","children","rest","ref","cls","useCls","useRender","jsx","clsx","jsxs","Fragment","NavItem","forwardRef"],"mappings":";;;;;;AAiBA,MAAMA,IAAc,CAClB;AAAA,EACE,MAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,MACG;AACH,QAAMC,IAAMC,EAAO;AAEnB,SAAOC,EAAU;AAAA,IACf,QAAQR,KAAU,gBAAAS,EAAC,UAAO,EAAA,WAAWC,EAAKJ,EAAI,UAAU,GAAGJ,CAAS,EAAG,CAAA;AAAA,IACvE,KAAAG;AAAA,IACA,OAAO;AAAA,MACL,eAAeN,KAAU;AAAA,MACzB,iBAAiBK,EAAK,eAAe;AAAA,MACrC,WAAW;AAAA,MACX,GAAGA;AAAA,MACH,UAEI,gBAAAO,EAAAC,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAH,EAAC,QAAK,EAAA,WAAWH,EAAI,eAAe,GAAI,UAAKR,GAAA;AAAA,0BAM5C,QAAK,EAAA,WAAWQ,EAAI,kBAAkB,GAAI,UAAAH,EAAS,CAAA;AAAA,MAAA,EAEtD,CAAA;AAAA,IAEJ;AAAA,IACA,OAAO,EAAE,QAAAJ,GAAQ,MAAAD,EAAK;AAAA,EAAA,CACvB;AACH,GAEMe,IAAUC,EAAWjB,CAAW;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ds-nav-group{display:flex;flex-direction:column;gap:.25rem}.ds-nav-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.375rem .75rem;font-size:1.25rem;color:var(--ds-color-icon);background:transparent;border-radius:var(--ds-border-radius);transition:background-color var(--ds-motion-duration-mid),color var(--ds-motion-duration-mid)}.ds-nav-item:hover{background-color:var(--ds-color-fill-tertiary);color:var(--ds-color-icon-hover)}.ds-nav-item[data-active]{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-text);font-weight:500}.ds-nav-item[aria-expanded]{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-text)}.ds-nav-item:disabled{background:transparent;color:var(--ds-color-text-disabled);cursor:not-allowed}.ds-nav-item .ds-nav-item-icon{font-size:1.25rem;line-height:1;transition:all .1s}.ds-nav-item .ds-nav-item-content{flex:1;display:flex;align-items:center;white-space:nowrap;overflow:hidden;font-size:.875rem;line-height:1rem;transition:max-width .15s,opacity .15s}.ds-nav-small .ds-nav-item,.ds-nav-item.ds-nav-item-small{padding:.25rem .5rem}:is(.ds-nav-small .ds-nav-item,.ds-nav-item.ds-nav-item-small) .ds-nav-item-icon{font-size:1rem}.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large{padding:.5rem 1rem}:is(.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large) .ds-nav-item-icon{font-size:1.5rem}:is(.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large) .ds-nav-item-content{font-size:1rem;line-height:1.5rem}.ds-nav-heading{width:100%;height:.875rem;position:relative;color:var(--ds-color-text-tertiary);text-transform:uppercase;font-weight:500;letter-spacing:.002em;font-size:.75rem;line-height:1rem;margin-bottom:.5rem}.ds-nav-small .ds-nav-heading{font-size:.625rem;line-height:1.4}.ds-nav-heading-text{display:inline-block;overflow:hidden;text-overflow:ellipsis;position:absolute;transition:all .1s;white-space:nowrap}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
|
+
"use client";
|
|
1
2
|
import { jsx as p } from "react/jsx-runtime";
|
|
2
3
|
import m from "antd/es/popover";
|
|
3
|
-
const
|
|
4
|
+
const f = ({
|
|
4
5
|
className: o,
|
|
5
6
|
style: r,
|
|
6
|
-
arrow:
|
|
7
|
-
...
|
|
8
|
-
}) => /* @__PURE__ */ p(m, { className: o, arrow:
|
|
7
|
+
arrow: e = !1,
|
|
8
|
+
...t
|
|
9
|
+
}) => /* @__PURE__ */ p(m, { className: o, arrow: e, style: r, ...t });
|
|
9
10
|
export {
|
|
10
|
-
|
|
11
|
+
f as Popover
|
|
11
12
|
};
|
|
12
13
|
//# sourceMappingURL=component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component.js","sources":["../../../src/components/Popover/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n default as AntPopover,\n type PopoverProps as AntPopoverProps,\n} from \"antd/es/popover\";\n\n// Define props interface extending Ant Design's PopoverProps\nexport interface PopoverProps extends AntPopoverProps {\n /**\n * Arrow config for of the popover\n * @default false\n */\n arrow?: AntPopoverProps[\"arrow\"];\n}\n\n// Create Popover component\nexport const Popover = ({\n className,\n style,\n arrow = false,\n ...rest\n}: PopoverProps) => {\n return (\n <AntPopover className={className} arrow={arrow} style={style} {...rest} />\n );\n};\n"],"names":["Popover","className","style","arrow","rest","AntPopover"],"mappings":"
|
|
1
|
+
{"version":3,"file":"component.js","sources":["../../../src/components/Popover/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n default as AntPopover,\n type PopoverProps as AntPopoverProps,\n} from \"antd/es/popover\";\n\n// Define props interface extending Ant Design's PopoverProps\nexport interface PopoverProps extends AntPopoverProps {\n /**\n * Arrow config for of the popover\n * @default false\n */\n arrow?: AntPopoverProps[\"arrow\"];\n}\n\n// Create Popover component\nexport const Popover = ({\n className,\n style,\n arrow = false,\n ...rest\n}: PopoverProps) => {\n return (\n <AntPopover className={className} arrow={arrow} style={style} {...rest} />\n );\n};\n"],"names":["Popover","className","style","arrow","rest","AntPopover"],"mappings":";;;AAgBO,MAAMA,IAAU,CAAC;AAAA,EACtB,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACL,wBAEKC,GAAW,EAAA,WAAAJ,GAAsB,OAAAE,GAAc,OAAAD,GAAe,GAAGE,GAAM;"}
|