@keboola/design 12.0.0 → 13.0.1
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/AGENTS.md +12 -7
- package/CHANGELOG.md +101 -0
- package/COMPONENT-API.md +15 -5
- package/dist/{AIKit-BD4r7ff-.js → AIKit-VB7CXeQk.js} +23 -11
- package/dist/AIKit-VB7CXeQk.js.map +1 -0
- package/dist/{AlertModal-Th2khjPi.js → AlertModal-mbSnuuka.js} +5 -5
- package/dist/AlertModal-mbSnuuka.js.map +1 -0
- package/dist/{Badge-DIjhwPvh.js → Badge-Dz0cj6rj.js} +2 -2
- package/dist/{Badge-DIjhwPvh.js.map → Badge-Dz0cj6rj.js.map} +1 -1
- package/dist/{BrandEditor-BU23Vl8V.js → BrandEditor-P8OZX2hi.js} +7 -7
- package/dist/{BrandEditor-BU23Vl8V.js.map → BrandEditor-P8OZX2hi.js.map} +1 -1
- package/dist/{Breadcrumb-p9HtMLCc.js → Breadcrumb-BUoAZyhO.js} +2 -2
- package/dist/{Breadcrumb-p9HtMLCc.js.map → Breadcrumb-BUoAZyhO.js.map} +1 -1
- package/dist/{Button-Ca4Q3VJU.js → Button-B21oVcPU.js} +3 -4
- package/dist/Button-B21oVcPU.js.map +1 -0
- package/dist/{Card-Cr9MBNHu.js → Card-BQmBWHXl.js} +32 -4
- package/dist/Card-BQmBWHXl.js.map +1 -0
- package/dist/{ClipboardButton-DHa1trtI.js → ClipboardButton-srUgWgwH.js} +2 -2
- package/dist/{ClipboardButton-DHa1trtI.js.map → ClipboardButton-srUgWgwH.js.map} +1 -1
- package/dist/{CodeEditor-BSo-oLFG.js → CodeEditor-jZMw1ioj.js} +2 -2
- package/dist/{CodeEditor-BSo-oLFG.js.map → CodeEditor-jZMw1ioj.js.map} +1 -1
- package/dist/{ColorInput-DSMqrs2-.js → ColorInput-B3gBZ8Ya.js} +2 -2
- package/dist/{ColorInput-DSMqrs2-.js.map → ColorInput-B3gBZ8Ya.js.map} +1 -1
- package/dist/{ColorModeSwitch-D7EuWyJz.js → ColorModeSwitch-BBzn1D0u.js} +3 -3
- package/dist/{ColorModeSwitch-D7EuWyJz.js.map → ColorModeSwitch-BBzn1D0u.js.map} +1 -1
- package/dist/{Combobox-CxRAYOBt.js → Combobox-BNhW0TDB.js} +22 -10
- package/dist/Combobox-BNhW0TDB.js.map +1 -0
- package/dist/{Command-BU_cVurn.js → Command-BQPiZCNz.js} +2 -2
- package/dist/{Command-BU_cVurn.js.map → Command-BQPiZCNz.js.map} +1 -1
- package/dist/{CopyField-6_c-NdLO.js → CopyField-Ba7h8MqZ.js} +3 -3
- package/dist/CopyField-Ba7h8MqZ.js.map +1 -0
- package/dist/{DateInput-DyEErfJf.js → DateInput-D0nWUasV.js} +2 -2
- package/dist/{DateInput-DyEErfJf.js.map → DateInput-D0nWUasV.js.map} +1 -1
- package/dist/{DateRangeInput-Dg7-VUd9.js → DateRangeInput-i6wE45-V.js} +2 -2
- package/dist/{DateRangeInput-Dg7-VUd9.js.map → DateRangeInput-i6wE45-V.js.map} +1 -1
- package/dist/{DateRangePicker-BoPnh4aH.js → DateRangePicker-BAnuz6vO.js} +2 -2
- package/dist/{DateRangePicker-BoPnh4aH.js.map → DateRangePicker-BAnuz6vO.js.map} +1 -1
- package/dist/{DropdownMenu-gRM-A8qU.js → DropdownMenu-C5FLPkvR.js} +12 -24
- package/dist/DropdownMenu-C5FLPkvR.js.map +1 -0
- package/dist/{FieldItem-2wMXQ0Qw.js → FieldItem-BHViBJS3.js} +2 -2
- package/dist/{FieldItem-2wMXQ0Qw.js.map → FieldItem-BHViBJS3.js.map} +1 -1
- package/dist/{FileUpload-C83tXuE2.js → FileUpload-Ch2hrIWq.js} +2 -2
- package/dist/{FileUpload-C83tXuE2.js.map → FileUpload-Ch2hrIWq.js.map} +1 -1
- package/dist/{Form-95rVLfX8.js → Form-VkzfVPyT.js} +5 -5
- package/dist/{Form-95rVLfX8.js.map → Form-VkzfVPyT.js.map} +1 -1
- package/dist/{FormGroup-CmNiAtU6.js → FormGroup-CmCppxOn.js} +3 -3
- package/dist/{FormGroup-CmNiAtU6.js.map → FormGroup-CmCppxOn.js.map} +1 -1
- package/dist/{FullScreenModal-CD7mYeTz.js → FullScreenModal-Cwnm8WdM.js} +2 -2
- package/dist/{FullScreenModal-CD7mYeTz.js.map → FullScreenModal-Cwnm8WdM.js.map} +1 -1
- package/dist/{InputGroup-B4QOPxHl.js → InputGroup-CrlMRz4X.js} +2 -2
- package/dist/{InputGroup-B4QOPxHl.js.map → InputGroup-CrlMRz4X.js.map} +1 -1
- package/dist/{MermaidDiagram-BQvz6bhv.js → MermaidDiagram-B30x2yV7.js} +2 -2
- package/dist/{MermaidDiagram-BQvz6bhv.js.map → MermaidDiagram-B30x2yV7.js.map} +1 -1
- package/dist/{Modal-Driyqs_N.js → Modal-BkSuS9Yz.js} +2 -2
- package/dist/{Modal-Driyqs_N.js.map → Modal-BkSuS9Yz.js.map} +1 -1
- package/dist/{MultiActionButtonGroup-BPnmzBtw.js → MultiActionButtonGroup-AWLj1Tg7.js} +2 -2
- package/dist/{MultiActionButtonGroup-BPnmzBtw.js.map → MultiActionButtonGroup-AWLj1Tg7.js.map} +1 -1
- package/dist/{PageToolbar-DOAtAnfL.js → PageToolbar-C06RKIif.js} +3 -3
- package/dist/{PageToolbar-DOAtAnfL.js.map → PageToolbar-C06RKIif.js.map} +1 -1
- package/dist/{Pagination-LaSg-5cl.js → Pagination-DH3f6LN0.js} +2 -2
- package/dist/{Pagination-LaSg-5cl.js.map → Pagination-DH3f6LN0.js.map} +1 -1
- package/dist/{Popconfirm-SLz0zodk.js → Popconfirm-Dhzn7sy6.js} +2 -2
- package/dist/{Popconfirm-SLz0zodk.js.map → Popconfirm-Dhzn7sy6.js.map} +1 -1
- package/dist/{RadioGroup-CBPRLRN0.js → RadioGroup-CYEp8Wnx.js} +3 -116
- package/dist/RadioGroup-CYEp8Wnx.js.map +1 -0
- package/dist/{SearchInput-CEfQDNl3.js → SearchInput-D3qMkHaW.js} +2 -2
- package/dist/{SearchInput-CEfQDNl3.js.map → SearchInput-D3qMkHaW.js.map} +1 -1
- package/dist/{SectionNav-B_qf0AXi.js → SectionNav-BTBiitiQ.js} +4 -4
- package/dist/{SectionNav-B_qf0AXi.js.map → SectionNav-BTBiitiQ.js.map} +1 -1
- package/dist/{Select-ByRvkZ3D.js → Select-B4uK0QVm.js} +4 -3
- package/dist/Select-B4uK0QVm.js.map +1 -0
- package/dist/{Sheet-C-yXk5Da.js → Sheet-D0fAE14T.js} +2 -2
- package/dist/{Sheet-C-yXk5Da.js.map → Sheet-D0fAE14T.js.map} +1 -1
- package/dist/{Sidebar-Ds0E6PbR.js → Sidebar-BTv636Cq.js} +4 -4
- package/dist/{Sidebar-Ds0E6PbR.js.map → Sidebar-BTv636Cq.js.map} +1 -1
- package/dist/{Slider-DWdu9NuM.js → Slider-B0ou9r0B.js} +2 -2
- package/dist/{Slider-DWdu9NuM.js.map → Slider-B0ou9r0B.js.map} +1 -1
- package/dist/{Tabs-Dt9oLYHC.js → Tabs-CTDmye1N.js} +2 -2
- package/dist/{Tabs-Dt9oLYHC.js.map → Tabs-CTDmye1N.js.map} +1 -1
- package/dist/{TextInput-CDG2XpBl.js → TextInput-BWYXbfs4.js} +2 -2
- package/dist/{TextInput-CDG2XpBl.js.map → TextInput-BWYXbfs4.js.map} +1 -1
- package/dist/{ThemeProvider-DXsxFg1U.js → ThemeProvider-VF38VfUa.js} +3 -3
- package/dist/{ThemeProvider-DXsxFg1U.js.map → ThemeProvider-VF38VfUa.js.map} +1 -1
- package/dist/{ZoomableSvg-BzXVfgnI.js → ZoomableSvg-C65nta_r.js} +3 -3
- package/dist/{ZoomableSvg-BzXVfgnI.js.map → ZoomableSvg-C65nta_r.js.map} +1 -1
- package/dist/editors.js +3 -3
- package/dist/flint.js +1 -1
- package/dist/index.d.ts +375 -375
- package/dist/index.js +40 -40
- package/dist/internal/blocks/AIKit.js +1 -1
- package/dist/internal/blocks/BrandEditor.js +1 -1
- package/dist/internal/blocks/ChartPanel.js +1 -1
- package/dist/internal/blocks/ChipEditor.js +2 -2
- package/dist/internal/blocks/ClipboardButton.js +1 -1
- package/dist/internal/blocks/ColorInput.js +1 -1
- package/dist/internal/blocks/ColorModeSwitch.js +1 -1
- package/dist/internal/blocks/Command.js +1 -1
- package/dist/internal/blocks/CopyField.js +1 -1
- package/dist/internal/blocks/DateInput.js +1 -1
- package/dist/internal/blocks/DateRangeInput.js +1 -1
- package/dist/internal/blocks/EmptyConfigurationActionCard.js +1 -1
- package/dist/internal/blocks/ExportMenu.js +2 -2
- package/dist/internal/blocks/Form/connectors/ComboboxField.js +2 -2
- package/dist/internal/blocks/Form/connectors/ComboboxField.js.map +1 -1
- package/dist/internal/blocks/Form/connectors/MultiComboboxField.js +1 -1
- package/dist/internal/blocks/Form/connectors/MultiComboboxField.js.map +1 -1
- package/dist/internal/blocks/Form.js +1 -1
- package/dist/internal/blocks/FormGroup.js +1 -1
- package/dist/internal/blocks/MultiActionButtonGroup.js +1 -1
- package/dist/internal/blocks/MultiCombobox.js +4 -5
- package/dist/internal/blocks/MultiCombobox.js.map +1 -1
- package/dist/internal/blocks/NumberInput.js +1 -1
- package/dist/internal/blocks/PageToolbar.js +1 -1
- package/dist/internal/blocks/PasswordInput.js +1 -1
- package/dist/internal/blocks/SearchInput.js +1 -1
- package/dist/internal/blocks/SearchInputWithNavigation.js +2 -2
- package/dist/internal/blocks/SectionNav.js +1 -1
- package/dist/internal/blocks/SplitButton.js +2 -2
- package/dist/internal/blocks/StatCard.js +1 -1
- package/dist/internal/blocks/TextInput.js +1 -1
- package/dist/internal/blocks/Textarea.js +1 -1
- package/dist/internal/blocks/TimeInput.js +1 -1
- package/dist/internal/components/AlertModal.js +1 -1
- package/dist/internal/components/Badge.js +1 -1
- package/dist/internal/components/Breadcrumb.js +1 -1
- package/dist/internal/components/Button.js +1 -1
- package/dist/internal/components/Card.js +1 -1
- package/dist/internal/components/CollapsiblePanel.js +1 -1
- package/dist/internal/components/CollapsiblePanel.js.map +1 -1
- package/dist/internal/components/Combobox.js +1 -1
- package/dist/internal/components/DateRangePicker.js +1 -1
- package/dist/internal/components/DropdownMenu.js +1 -1
- package/dist/internal/components/FileUpload.js +1 -1
- package/dist/internal/components/FullScreenModal.js +1 -1
- package/dist/internal/components/InputGroup.js +1 -1
- package/dist/internal/components/Modal.js +1 -1
- package/dist/internal/components/Pagination.js +1 -1
- package/dist/internal/components/Popconfirm.js +1 -1
- package/dist/internal/components/RadioGroup.js +1 -1
- package/dist/internal/components/Select.js +1 -1
- package/dist/internal/components/Sheet.js +1 -1
- package/dist/internal/components/Sidebar.js +1 -1
- package/dist/internal/components/Slider.js +1 -1
- package/dist/internal/components/Tabs.js +1 -1
- package/dist/internal/components/ThemeProvider.js +2 -2
- package/dist/internal/components/ZoomableSvg.js +1 -1
- package/dist/internal/utils/accessibleName.js +11 -0
- package/dist/internal/utils/accessibleName.js.map +1 -0
- package/dist/markdown-editor.js +5 -5
- package/dist/mermaid.js +1 -1
- package/dist/rjsf.js +8 -8
- package/dist/styles-DBGXH5-_.js +127 -0
- package/dist/styles-DBGXH5-_.js.map +1 -0
- package/dist/styles.css +1 -1
- package/dist/testing.js +3 -4
- package/dist/testing.js.map +1 -1
- package/package.json +23 -23
- package/src/theme.css +6 -1
- package/dist/AIKit-BD4r7ff-.js.map +0 -1
- package/dist/AlertModal-Th2khjPi.js.map +0 -1
- package/dist/Button-Ca4Q3VJU.js.map +0 -1
- package/dist/Card-Cr9MBNHu.js.map +0 -1
- package/dist/Combobox-CxRAYOBt.js.map +0 -1
- package/dist/CopyField-6_c-NdLO.js.map +0 -1
- package/dist/DropdownMenu-gRM-A8qU.js.map +0 -1
- package/dist/RadioGroup-CBPRLRN0.js.map +0 -1
- package/dist/Select-ByRvkZ3D.js.map +0 -1
- package/dist/internal/components/StatusDot.js +0 -60
- package/dist/internal/components/StatusDot.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal-Driyqs_N.js","names":[],"sources":["../src/components/Modal/ModalBody.tsx","../src/components/Modal/ModalContent.tsx","../src/components/Modal/ModalFooter.tsx","../src/components/Modal/ModalActions.tsx","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalIcon.tsx","../src/components/Modal/ModalImage.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\n/** Props for `Modal.Body`. Accepts all `<div>` attributes; `as=\"form\"` is reserved for future use. */\ntype Props = ComponentProps<'div'> & {\n as?: 'form';\n};\n\n/**\n * Scrollable body slot for `Modal`. Place form fields, content blocks, or detail panels here.\n * Takes available height inside `Modal.Content` and scrolls when content overflows.\n */\nexport const ModalBody = ({ className, ...props }: Props) => (\n <div\n data-slot=\"modal-body\"\n className={cn(\n // scrollable body - takes available space and scrolls when content overflows\n 'tw:flex-1',\n 'tw:overflow-y-auto',\n\n // argo: soft top/bottom edge fade in place of header/footer separators (pure-CSS utility)\n 'tw:group-data-[argo=true]/modal:scroll-fade-y',\n\n // Own horizontal padding, matching Header/Footer so content edges align (ModalContent adds none)\n 'tw:group-data-[argo=false]/modal:px-7',\n 'tw:group-data-[argo=true]/modal:px-4',\n 'tw:py-1',\n\n // normalize nested Lucide icon sizing, matching Popover/HoverCard/Alert content surfaces\n \"tw:[&_svg.lucide:not([class*='tw:size-'])]:size-4\",\n 'tw:[&_svg]:shrink-0',\n className,\n )}\n {...props}\n />\n);\n","import type { ComponentProps } from 'react';\nimport { Content, Portal } from '@radix-ui/react-dialog';\n\nimport { cn } from '../../utils';\nimport { useArgoDesign } from '../ThemeProvider/context';\n\nimport { ModalOverlay } from './ModalOverlay';\n\ntype Props = ComponentProps<typeof Content> & {\n size?: 'small' | 'medium' | 'large';\n};\n\nexport const ModalContent = ({\n size = 'medium',\n className,\n children,\n onEscapeKeyDown,\n ...props\n}: Props) => {\n const renderArgo = useArgoDesign();\n\n const handleEscapeKeyDown: typeof onEscapeKeyDown = (event) => {\n // Keeps parent modals (e.g. FullScreenModal) open\n event.stopPropagation();\n onEscapeKeyDown?.(event);\n };\n\n return (\n <Portal>\n <ModalOverlay>\n <Content\n // props first so callers can't override the computed data-argo / data-size\n {...props}\n data-argo={renderArgo}\n data-size={size}\n className={cn(\n 'tailwindcss-preflight',\n 'tw:group/modal',\n\n 'tw:fixed',\n 'tw:left-1/2',\n 'tw:-translate-x-1/2',\n 'tw:z-[1051]',\n\n 'tw:data-[argo=false]:top-20',\n 'tw:data-[argo=true]:top-1/2',\n 'tw:data-[argo=true]:-translate-y-1/2',\n\n 'tw:w-full',\n 'tw:max-w-2xl',\n 'tw:max-h-[calc(100vh-2*theme(spacing.20))]',\n\n 'tw:flex',\n 'tw:flex-col',\n 'tw:gap-4',\n 'tw:data-[argo=false]:rounded-lg',\n 'tw:data-[argo=true]:rounded-3xl',\n 'tw:bg-card',\n 'tw:text-card-foreground',\n\n // Vertical padding here survives an omitted Header/Footer; horizontal is theirs, so the\n // Body scrollbar sits at the modal edge.\n 'tw:data-[argo=false]:py-8',\n 'tw:data-[argo=true]:py-4',\n\n 'tw:duration-200',\n 'tw:data-[state=open]:animate-in',\n 'tw:data-[state=open]:fade-in-0',\n 'tw:data-[state=closed]:animate-out',\n 'tw:data-[state=closed]:fade-out-0',\n\n // No -1/2 slide classes: centring uses `translate`, the animation `transform`; they\n // compose, so a -50% slide would stack to -100% and fly in from the top-left.\n\n // legacy is top-anchored, so its slide has no centring translate to double\n 'tw:data-[argo=false]:data-[state=open]:zoom-in-80',\n 'tw:data-[argo=false]:data-[state=open]:slide-in-from-top-[48%]',\n 'tw:data-[argo=false]:data-[state=closed]:zoom-out-80',\n 'tw:data-[argo=false]:data-[state=closed]:slide-out-to-top-[48%]',\n\n 'tw:data-[argo=true]:data-[state=open]:zoom-in-95',\n 'tw:data-[argo=true]:data-[state=closed]:zoom-out-95',\n\n {\n 'tw:max-w-[480px]': size === 'small',\n 'tw:max-w-4xl': size === 'large',\n },\n\n className,\n )}\n onEscapeKeyDown={handleEscapeKeyDown}\n >\n {children}\n </Content>\n </ModalOverlay>\n </Portal>\n );\n};\n","import type { ComponentPropsWithRef } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentPropsWithRef<'div'>;\n\n/**\n * The modal's action row.\n *\n * - A child that should fill the row carries `tw:w-full` itself; the footer is already full width.\n * - tailwind-merge replaces only within a group: `tw:flex-col` keeps `items-center`, so add `tw:items-stretch`.\n */\nexport const ModalFooter = ({ className, ...props }: Props) => (\n <div\n {...props}\n className={cn(\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-end',\n 'tw:gap-2',\n\n 'tw:group-data-[argo=false]/modal:px-7',\n 'tw:group-data-[argo=true]/modal:px-4',\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\n/**\n * Container for the header's top-right controls — any `actions` passed to `Modal.Header` plus the\n * close icon. Sits in the header grid's last column, top-aligned. Mirrors `Alert`'s action slot.\n */\nexport const ModalActions = ({ className, ...props }: Props) => (\n <div\n className={cn(\n 'tw:col-start-3',\n 'tw:row-start-1',\n 'tw:self-start',\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-1',\n // argo: gutter separating the actions/close from the title (carried here so the grid needs no\n // column gap — see ModalHeader)\n 'tw:group-data-[argo=true]/modal:ml-3',\n className,\n )}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Close } from '@radix-ui/react-dialog';\n\nimport { X } from '../../icons';\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Separator } from '../Separator';\n\nimport { ModalActions } from './ModalActions';\nimport { ModalDescription } from './ModalDescription';\nimport { ModalTitle } from './ModalTitle';\n\ntype Props = {\n /** Status icon slot — `<Modal.Icon />` or `<Modal.Image />`. */\n icon?: ReactNode;\n /** Visible subtitle below the title (also fills `aria-describedby`). */\n description?: ReactNode;\n /** Screen-reader-only description; fills `aria-describedby` without rendering visibly. */\n 'aria-description'?: string;\n /** Controls rendered top-right, before the close icon. */\n actions?: ReactNode;\n /** Hide the top-right close icon. */\n hideCloseIcon?: boolean;\n} & ComponentProps<'div'>;\n\n/** Modal header: `[icon] | title (children) | actions + close` on row 1, `description` on row 2. */\nexport const ModalHeader = ({\n className,\n icon,\n description,\n 'aria-description': ariaDescription,\n actions,\n hideCloseIcon = false,\n children,\n ...props\n}: Props) => (\n <div\n {...props}\n data-slot=\"modal-header\"\n className={cn(\n 'tw:grid',\n 'tw:grid-cols-[auto_1fr_auto]',\n 'tw:items-center',\n 'tw:group-data-[argo=false]/modal:px-7',\n 'tw:group-data-[argo=true]/modal:px-4',\n className,\n )}\n >\n {icon}\n\n {children && <ModalTitle className=\"tw:col-start-2 tw:row-start-1\">{children}</ModalTitle>}\n {(actions || !hideCloseIcon) && (\n <ModalActions>\n {actions}\n {!hideCloseIcon && (\n <Close asChild>\n <Button variant=\"invisible\" size=\"icon-sm\">\n <X />\n <span className=\"tw:sr-only\">Close</span>\n </Button>\n </Close>\n )}\n </ModalActions>\n )}\n {(description || ariaDescription) && (\n <ModalDescription\n className={cn(\n 'tw:col-start-1',\n 'tw:col-end-4',\n 'tw:row-start-2',\n description ? 'tw:mt-1' : 'tw:sr-only',\n )}\n >\n {description ?? ariaDescription}\n </ModalDescription>\n )}\n\n {/* Legacy-only separator; shown when a Body follows, hidden when that body hosts Tabs. */}\n <div\n className={cn(\n 'tw:col-start-1',\n 'tw:col-end-4',\n 'tw:mt-5',\n 'tw:hidden',\n 'tw:group-data-[argo=false]/modal:[[data-slot=modal-header]:has(~[data-slot=modal-body])_&]:block',\n 'tw:group-data-[argo=false]/modal:[[data-slot=modal-header]:has(~[data-slot=modal-body]_[data-slot=tabs-root])_&]:!hidden',\n )}\n >\n <Separator orientation=\"horizontal\" />\n </div>\n </div>\n);\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\ntype NamedColor = 'orange' | 'blue' | 'red' | 'green' | 'gray' | 'violet';\n\ntype Props = {\n color: NamedColor | (string & {});\n icon: ReactNode;\n};\n\nconst NAMED_COLORS = new Set<string>(['orange', 'blue', 'red', 'green', 'gray', 'violet']);\n\n/**\n * Status-coloured icon for `Modal`, authored inside `Modal.Header`; remote images use `Modal.Image`.\n *\n * - Legacy: solid circular badge, absolutely docked to `Modal.Content`'s top-left.\n * - Argo (`data-argo` on `Modal.Content`): soft-tinted inline badge next to the title.\n * - CSS (`group-data-[argo=true]/modal:`) toggles the two, no context.\n * - `color` is categorical (`red` destructive … `violet` agent), fixed across brand themes.\n */\nexport const ModalIcon = ({ color, icon }: Props) => {\n const customColor = color && !NAMED_COLORS.has(color) ? color : undefined;\n\n return (\n <span\n data-slot=\"modal-icon\"\n className={cn(\n 'tw:flex',\n 'tw:shrink-0',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:[&_svg]:aspect-square',\n\n // legacy\n 'tw:group-data-[argo=false]/modal:absolute',\n 'tw:group-data-[argo=false]/modal:top-0',\n 'tw:group-data-[argo=false]/modal:left-8',\n 'tw:group-data-[argo=false]/modal:-translate-y-1/2',\n 'tw:group-data-[argo=false]/modal:size-12',\n 'tw:group-data-[argo=false]/modal:rounded-full',\n 'tw:group-data-[argo=false]/modal:[&_svg:not([class*=\"tw:size-\"])]:size-6',\n\n // argo\n 'tw:group-data-[argo=true]/modal:col-start-1',\n 'tw:group-data-[argo=true]/modal:row-start-1',\n 'tw:group-data-[argo=true]/modal:self-start',\n 'tw:group-data-[argo=true]/modal:mr-3',\n 'tw:group-data-[argo=true]/modal:size-8',\n 'tw:group-data-[argo=true]/modal:rounded',\n 'tw:group-data-[argo=true]/modal:overflow-hidden',\n 'tw:group-data-[argo=true]/modal:[&_svg:not([class*=\"tw:size-\"])]:size-5',\n\n // legacy palette\n {\n 'tw:group-data-[argo=false]/modal:bg-warning-500': color === 'orange',\n 'tw:group-data-[argo=false]/modal:bg-blue-500': color === 'blue',\n 'tw:group-data-[argo=false]/modal:bg-green-500': color === 'green',\n 'tw:group-data-[argo=false]/modal:bg-error-500': color === 'red',\n 'tw:group-data-[argo=false]/modal:bg-neutral-150': color === 'gray',\n 'tw:group-data-[argo=false]/modal:bg-purple-100': color === 'violet',\n 'tw:group-data-[argo=false]/modal:text-white': color !== 'violet',\n 'tw:group-data-[argo=false]/modal:text-purple-500': color === 'violet',\n },\n\n // argo palette\n {\n 'tw:group-data-[argo=true]/modal:bg-warning-100 tw:group-data-[argo=true]/modal:text-warning-500':\n color === 'orange',\n 'tw:group-data-[argo=true]/modal:bg-blue-100 tw:group-data-[argo=true]/modal:text-blue-600':\n color === 'blue',\n 'tw:group-data-[argo=true]/modal:bg-green-100 tw:group-data-[argo=true]/modal:text-green-900':\n color === 'green',\n 'tw:group-data-[argo=true]/modal:bg-error-100 tw:group-data-[argo=true]/modal:text-error-500':\n color === 'red',\n 'tw:group-data-[argo=true]/modal:bg-neutral-100 tw:group-data-[argo=true]/modal:text-neutral-500':\n color === 'gray',\n 'tw:group-data-[argo=true]/modal:bg-purple-100 tw:group-data-[argo=true]/modal:text-purple-500':\n color === 'violet',\n },\n\n // custom (non-named) colour\n { 'tw:text-white': !!customColor },\n )}\n style={customColor ? { backgroundColor: customColor } : undefined}\n >\n {icon}\n </span>\n );\n};\n","import { useEffect, useState } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = {\n src: string;\n /** Accessible alt text. Defaults to `\"\"` (decorative) — provide it when the image carries meaning. */\n alt?: string;\n};\n\nexport const ModalImage = ({ src, alt = '' }: Props) => {\n const [hasImageError, setHasImageError] = useState(false);\n\n // Reset the error state when the source changes, so a reused badge (new logo, or a retry after a\n // transient failure) isn't permanently hidden by an earlier onError.\n useEffect(() => setHasImageError(false), [src]);\n\n if (hasImageError) return null;\n\n return (\n <span\n data-slot=\"modal-image\"\n className={cn(\n 'tw:shrink-0',\n 'tw:overflow-hidden',\n\n // legacy: circular badge floating at the top-left of the modal\n 'tw:group-data-[argo=false]/modal:absolute',\n 'tw:group-data-[argo=false]/modal:top-0',\n 'tw:group-data-[argo=false]/modal:left-8',\n 'tw:group-data-[argo=false]/modal:-translate-y-1/2',\n 'tw:group-data-[argo=false]/modal:size-12',\n 'tw:group-data-[argo=false]/modal:rounded-full',\n\n // argo: inline badge in the header grid's first column\n 'tw:group-data-[argo=true]/modal:flex',\n 'tw:group-data-[argo=true]/modal:col-start-1',\n 'tw:group-data-[argo=true]/modal:row-start-1',\n 'tw:group-data-[argo=true]/modal:self-start',\n 'tw:group-data-[argo=true]/modal:mr-3',\n 'tw:group-data-[argo=true]/modal:items-center',\n 'tw:group-data-[argo=true]/modal:justify-center',\n 'tw:group-data-[argo=true]/modal:rounded',\n 'tw:group-data-[argo=true]/modal:size-8',\n )}\n >\n <img\n src={src}\n alt={alt}\n className=\"tw:size-full tw:object-contain\"\n onError={() => setHasImageError(true)}\n />\n </span>\n );\n};\n","import type { ComponentProps } from 'react';\nimport { Close, Root, Trigger } from '@radix-ui/react-dialog';\n\nimport { ModalBody } from './ModalBody';\nimport { ModalContent } from './ModalContent';\nimport { ModalFooter } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalIcon } from './ModalIcon';\nimport { ModalImage } from './ModalImage';\nimport { ModalOverlay } from './ModalOverlay';\n\ntype Props = ComponentProps<typeof Root>;\n\n/**\n * Blocking dialog the user must act on before continuing. Built on Radix Dialog.\n *\n * - Not for side editing (`Sheet`), anchored confirms (`Popconfirm`) or hover previews (`HoverCard`).\n * - `Modal.Content` wraps Header + Body + Footer; a form's `FormBody` goes in Body, its buttons in Footer.\n *\n * @see RECIPES.md#modal-form\n * @see RECIPES.md#confirm-dialog\n */\nexport const Modal = (props: Props) => <Root {...props} />;\n\nModal.Close = Close;\nModal.Trigger = Trigger;\n\nModal.Content = ModalContent;\nModal.Body = ModalBody;\nModal.Icon = ModalIcon;\nModal.Image = ModalImage;\nModal.Footer = ModalFooter;\nModal.Header = ModalHeader;\nModal.Overlay = ModalOverlay;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Modal-BkSuS9Yz.js","names":[],"sources":["../src/components/Modal/ModalBody.tsx","../src/components/Modal/ModalContent.tsx","../src/components/Modal/ModalFooter.tsx","../src/components/Modal/ModalActions.tsx","../src/components/Modal/ModalHeader.tsx","../src/components/Modal/ModalIcon.tsx","../src/components/Modal/ModalImage.tsx","../src/components/Modal/Modal.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\n/** Props for `Modal.Body`. Accepts all `<div>` attributes; `as=\"form\"` is reserved for future use. */\ntype Props = ComponentProps<'div'> & {\n as?: 'form';\n};\n\n/**\n * Scrollable body slot for `Modal`. Place form fields, content blocks, or detail panels here.\n * Takes available height inside `Modal.Content` and scrolls when content overflows.\n */\nexport const ModalBody = ({ className, ...props }: Props) => (\n <div\n data-slot=\"modal-body\"\n className={cn(\n // scrollable body - takes available space and scrolls when content overflows\n 'tw:flex-1',\n 'tw:overflow-y-auto',\n\n // argo: soft top/bottom edge fade in place of header/footer separators (pure-CSS utility)\n 'tw:group-data-[argo=true]/modal:scroll-fade-y',\n\n // Own horizontal padding, matching Header/Footer so content edges align (ModalContent adds none)\n 'tw:group-data-[argo=false]/modal:px-7',\n 'tw:group-data-[argo=true]/modal:px-4',\n 'tw:py-1',\n\n // normalize nested Lucide icon sizing, matching Popover/HoverCard/Alert content surfaces\n \"tw:[&_svg.lucide:not([class*='tw:size-'])]:size-4\",\n 'tw:[&_svg]:shrink-0',\n className,\n )}\n {...props}\n />\n);\n","import type { ComponentProps } from 'react';\nimport { Content, Portal } from '@radix-ui/react-dialog';\n\nimport { cn } from '../../utils';\nimport { useArgoDesign } from '../ThemeProvider/context';\n\nimport { ModalOverlay } from './ModalOverlay';\n\ntype Props = ComponentProps<typeof Content> & {\n size?: 'small' | 'medium' | 'large';\n};\n\nexport const ModalContent = ({\n size = 'medium',\n className,\n children,\n onEscapeKeyDown,\n ...props\n}: Props) => {\n const renderArgo = useArgoDesign();\n\n const handleEscapeKeyDown: typeof onEscapeKeyDown = (event) => {\n // Keeps parent modals (e.g. FullScreenModal) open\n event.stopPropagation();\n onEscapeKeyDown?.(event);\n };\n\n return (\n <Portal>\n <ModalOverlay>\n <Content\n // props first so callers can't override the computed data-argo / data-size\n {...props}\n data-argo={renderArgo}\n data-size={size}\n className={cn(\n 'tailwindcss-preflight',\n 'tw:group/modal',\n\n 'tw:fixed',\n 'tw:left-1/2',\n 'tw:-translate-x-1/2',\n 'tw:z-[1051]',\n\n 'tw:data-[argo=false]:top-20',\n 'tw:data-[argo=true]:top-1/2',\n 'tw:data-[argo=true]:-translate-y-1/2',\n\n 'tw:w-full',\n 'tw:max-w-2xl',\n 'tw:max-h-[calc(100vh-2*theme(spacing.20))]',\n\n 'tw:flex',\n 'tw:flex-col',\n 'tw:gap-4',\n 'tw:data-[argo=false]:rounded-lg',\n 'tw:data-[argo=true]:rounded-3xl',\n 'tw:bg-card',\n 'tw:text-card-foreground',\n\n // Vertical padding here survives an omitted Header/Footer; horizontal is theirs, so the\n // Body scrollbar sits at the modal edge.\n 'tw:data-[argo=false]:py-8',\n 'tw:data-[argo=true]:py-4',\n\n 'tw:duration-200',\n 'tw:data-[state=open]:animate-in',\n 'tw:data-[state=open]:fade-in-0',\n 'tw:data-[state=closed]:animate-out',\n 'tw:data-[state=closed]:fade-out-0',\n\n // No -1/2 slide classes: centring uses `translate`, the animation `transform`; they\n // compose, so a -50% slide would stack to -100% and fly in from the top-left.\n\n // legacy is top-anchored, so its slide has no centring translate to double\n 'tw:data-[argo=false]:data-[state=open]:zoom-in-80',\n 'tw:data-[argo=false]:data-[state=open]:slide-in-from-top-[48%]',\n 'tw:data-[argo=false]:data-[state=closed]:zoom-out-80',\n 'tw:data-[argo=false]:data-[state=closed]:slide-out-to-top-[48%]',\n\n 'tw:data-[argo=true]:data-[state=open]:zoom-in-95',\n 'tw:data-[argo=true]:data-[state=closed]:zoom-out-95',\n\n {\n 'tw:max-w-[480px]': size === 'small',\n 'tw:max-w-4xl': size === 'large',\n },\n\n className,\n )}\n onEscapeKeyDown={handleEscapeKeyDown}\n >\n {children}\n </Content>\n </ModalOverlay>\n </Portal>\n );\n};\n","import type { ComponentPropsWithRef } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentPropsWithRef<'div'>;\n\n/**\n * The modal's action row.\n *\n * - A child that should fill the row carries `tw:w-full` itself; the footer is already full width.\n * - tailwind-merge replaces only within a group: `tw:flex-col` keeps `items-center`, so add `tw:items-stretch`.\n */\nexport const ModalFooter = ({ className, ...props }: Props) => (\n <div\n {...props}\n className={cn(\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-end',\n 'tw:gap-2',\n\n 'tw:group-data-[argo=false]/modal:px-7',\n 'tw:group-data-[argo=true]/modal:px-4',\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\n/**\n * Container for the header's top-right controls — any `actions` passed to `Modal.Header` plus the\n * close icon. Sits in the header grid's last column, top-aligned. Mirrors `Alert`'s action slot.\n */\nexport const ModalActions = ({ className, ...props }: Props) => (\n <div\n className={cn(\n 'tw:col-start-3',\n 'tw:row-start-1',\n 'tw:self-start',\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-1',\n // argo: gutter separating the actions/close from the title (carried here so the grid needs no\n // column gap — see ModalHeader)\n 'tw:group-data-[argo=true]/modal:ml-3',\n className,\n )}\n {...props}\n />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Close } from '@radix-ui/react-dialog';\n\nimport { X } from '../../icons';\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Separator } from '../Separator';\n\nimport { ModalActions } from './ModalActions';\nimport { ModalDescription } from './ModalDescription';\nimport { ModalTitle } from './ModalTitle';\n\ntype Props = {\n /** Status icon slot — `<Modal.Icon />` or `<Modal.Image />`. */\n icon?: ReactNode;\n /** Visible subtitle below the title (also fills `aria-describedby`). */\n description?: ReactNode;\n /** Screen-reader-only description; fills `aria-describedby` without rendering visibly. */\n 'aria-description'?: string;\n /** Controls rendered top-right, before the close icon. */\n actions?: ReactNode;\n /** Hide the top-right close icon. */\n hideCloseIcon?: boolean;\n} & ComponentProps<'div'>;\n\n/** Modal header: `[icon] | title (children) | actions + close` on row 1, `description` on row 2. */\nexport const ModalHeader = ({\n className,\n icon,\n description,\n 'aria-description': ariaDescription,\n actions,\n hideCloseIcon = false,\n children,\n ...props\n}: Props) => (\n <div\n {...props}\n data-slot=\"modal-header\"\n className={cn(\n 'tw:grid',\n 'tw:grid-cols-[auto_1fr_auto]',\n 'tw:items-center',\n 'tw:group-data-[argo=false]/modal:px-7',\n 'tw:group-data-[argo=true]/modal:px-4',\n className,\n )}\n >\n {icon}\n\n {children && <ModalTitle className=\"tw:col-start-2 tw:row-start-1\">{children}</ModalTitle>}\n {(actions || !hideCloseIcon) && (\n <ModalActions>\n {actions}\n {!hideCloseIcon && (\n <Close asChild>\n <Button variant=\"invisible\" size=\"icon-sm\">\n <X />\n <span className=\"tw:sr-only\">Close</span>\n </Button>\n </Close>\n )}\n </ModalActions>\n )}\n {(description || ariaDescription) && (\n <ModalDescription\n className={cn(\n 'tw:col-start-1',\n 'tw:col-end-4',\n 'tw:row-start-2',\n description ? 'tw:mt-1' : 'tw:sr-only',\n )}\n >\n {description ?? ariaDescription}\n </ModalDescription>\n )}\n\n {/* Legacy-only separator; shown when a Body follows, hidden when that body hosts Tabs. */}\n <div\n className={cn(\n 'tw:col-start-1',\n 'tw:col-end-4',\n 'tw:mt-5',\n 'tw:hidden',\n 'tw:group-data-[argo=false]/modal:[[data-slot=modal-header]:has(~[data-slot=modal-body])_&]:block',\n 'tw:group-data-[argo=false]/modal:[[data-slot=modal-header]:has(~[data-slot=modal-body]_[data-slot=tabs-root])_&]:!hidden',\n )}\n >\n <Separator orientation=\"horizontal\" />\n </div>\n </div>\n);\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\ntype NamedColor = 'orange' | 'blue' | 'red' | 'green' | 'gray' | 'violet';\n\ntype Props = {\n color: NamedColor | (string & {});\n icon: ReactNode;\n};\n\nconst NAMED_COLORS = new Set<string>(['orange', 'blue', 'red', 'green', 'gray', 'violet']);\n\n/**\n * Status-coloured icon for `Modal`, authored inside `Modal.Header`; remote images use `Modal.Image`.\n *\n * - Legacy: solid circular badge, absolutely docked to `Modal.Content`'s top-left.\n * - Argo (`data-argo` on `Modal.Content`): soft-tinted inline badge next to the title.\n * - CSS (`group-data-[argo=true]/modal:`) toggles the two, no context.\n * - `color` is categorical (`red` destructive … `violet` agent), fixed across brand themes.\n */\nexport const ModalIcon = ({ color, icon }: Props) => {\n const customColor = color && !NAMED_COLORS.has(color) ? color : undefined;\n\n return (\n <span\n data-slot=\"modal-icon\"\n className={cn(\n 'tw:flex',\n 'tw:shrink-0',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:[&_svg]:aspect-square',\n\n // legacy\n 'tw:group-data-[argo=false]/modal:absolute',\n 'tw:group-data-[argo=false]/modal:top-0',\n 'tw:group-data-[argo=false]/modal:left-8',\n 'tw:group-data-[argo=false]/modal:-translate-y-1/2',\n 'tw:group-data-[argo=false]/modal:size-12',\n 'tw:group-data-[argo=false]/modal:rounded-full',\n 'tw:group-data-[argo=false]/modal:[&_svg:not([class*=\"tw:size-\"])]:size-6',\n\n // argo\n 'tw:group-data-[argo=true]/modal:col-start-1',\n 'tw:group-data-[argo=true]/modal:row-start-1',\n 'tw:group-data-[argo=true]/modal:self-start',\n 'tw:group-data-[argo=true]/modal:mr-3',\n 'tw:group-data-[argo=true]/modal:size-8',\n 'tw:group-data-[argo=true]/modal:rounded',\n 'tw:group-data-[argo=true]/modal:overflow-hidden',\n 'tw:group-data-[argo=true]/modal:[&_svg:not([class*=\"tw:size-\"])]:size-5',\n\n // legacy palette\n {\n 'tw:group-data-[argo=false]/modal:bg-warning-500': color === 'orange',\n 'tw:group-data-[argo=false]/modal:bg-blue-500': color === 'blue',\n 'tw:group-data-[argo=false]/modal:bg-green-500': color === 'green',\n 'tw:group-data-[argo=false]/modal:bg-error-500': color === 'red',\n 'tw:group-data-[argo=false]/modal:bg-neutral-150': color === 'gray',\n 'tw:group-data-[argo=false]/modal:bg-purple-100': color === 'violet',\n 'tw:group-data-[argo=false]/modal:text-white': color !== 'violet',\n 'tw:group-data-[argo=false]/modal:text-purple-500': color === 'violet',\n },\n\n // argo palette\n {\n 'tw:group-data-[argo=true]/modal:bg-warning-100 tw:group-data-[argo=true]/modal:text-warning-500':\n color === 'orange',\n 'tw:group-data-[argo=true]/modal:bg-blue-100 tw:group-data-[argo=true]/modal:text-blue-600':\n color === 'blue',\n 'tw:group-data-[argo=true]/modal:bg-green-100 tw:group-data-[argo=true]/modal:text-green-900':\n color === 'green',\n 'tw:group-data-[argo=true]/modal:bg-error-100 tw:group-data-[argo=true]/modal:text-error-500':\n color === 'red',\n 'tw:group-data-[argo=true]/modal:bg-neutral-100 tw:group-data-[argo=true]/modal:text-neutral-500':\n color === 'gray',\n 'tw:group-data-[argo=true]/modal:bg-purple-100 tw:group-data-[argo=true]/modal:text-purple-500':\n color === 'violet',\n },\n\n // custom (non-named) colour\n { 'tw:text-white': !!customColor },\n )}\n style={customColor ? { backgroundColor: customColor } : undefined}\n >\n {icon}\n </span>\n );\n};\n","import { useEffect, useState } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = {\n src: string;\n /** Accessible alt text. Defaults to `\"\"` (decorative) — provide it when the image carries meaning. */\n alt?: string;\n};\n\nexport const ModalImage = ({ src, alt = '' }: Props) => {\n const [hasImageError, setHasImageError] = useState(false);\n\n // Reset the error state when the source changes, so a reused badge (new logo, or a retry after a\n // transient failure) isn't permanently hidden by an earlier onError.\n useEffect(() => setHasImageError(false), [src]);\n\n if (hasImageError) return null;\n\n return (\n <span\n data-slot=\"modal-image\"\n className={cn(\n 'tw:shrink-0',\n 'tw:overflow-hidden',\n\n // legacy: circular badge floating at the top-left of the modal\n 'tw:group-data-[argo=false]/modal:absolute',\n 'tw:group-data-[argo=false]/modal:top-0',\n 'tw:group-data-[argo=false]/modal:left-8',\n 'tw:group-data-[argo=false]/modal:-translate-y-1/2',\n 'tw:group-data-[argo=false]/modal:size-12',\n 'tw:group-data-[argo=false]/modal:rounded-full',\n\n // argo: inline badge in the header grid's first column\n 'tw:group-data-[argo=true]/modal:flex',\n 'tw:group-data-[argo=true]/modal:col-start-1',\n 'tw:group-data-[argo=true]/modal:row-start-1',\n 'tw:group-data-[argo=true]/modal:self-start',\n 'tw:group-data-[argo=true]/modal:mr-3',\n 'tw:group-data-[argo=true]/modal:items-center',\n 'tw:group-data-[argo=true]/modal:justify-center',\n 'tw:group-data-[argo=true]/modal:rounded',\n 'tw:group-data-[argo=true]/modal:size-8',\n )}\n >\n <img\n src={src}\n alt={alt}\n className=\"tw:size-full tw:object-contain\"\n onError={() => setHasImageError(true)}\n />\n </span>\n );\n};\n","import type { ComponentProps } from 'react';\nimport { Close, Root, Trigger } from '@radix-ui/react-dialog';\n\nimport { ModalBody } from './ModalBody';\nimport { ModalContent } from './ModalContent';\nimport { ModalFooter } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalIcon } from './ModalIcon';\nimport { ModalImage } from './ModalImage';\nimport { ModalOverlay } from './ModalOverlay';\n\ntype Props = ComponentProps<typeof Root>;\n\n/**\n * Blocking dialog the user must act on before continuing. Built on Radix Dialog.\n *\n * - Not for side editing (`Sheet`), anchored confirms (`Popconfirm`) or hover previews (`HoverCard`).\n * - `Modal.Content` wraps Header + Body + Footer; a form's `FormBody` goes in Body, its buttons in Footer.\n *\n * @see RECIPES.md#modal-form\n * @see RECIPES.md#confirm-dialog\n */\nexport const Modal = (props: Props) => <Root {...props} />;\n\nModal.Close = Close;\nModal.Trigger = Trigger;\n\nModal.Content = ModalContent;\nModal.Body = ModalBody;\nModal.Icon = ModalIcon;\nModal.Image = ModalImage;\nModal.Footer = ModalFooter;\nModal.Header = ModalHeader;\nModal.Overlay = ModalOverlay;\n"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { cn } from "./classNames-BzrkDnOD.js";
|
|
2
2
|
import { Tooltip } from "./utils-Bd28bWgm.js";
|
|
3
|
-
import { Button } from "./Button-
|
|
3
|
+
import { Button } from "./Button-B21oVcPU.js";
|
|
4
4
|
import { ButtonGroup } from "./internal/components/ButtonGroup.js";
|
|
5
5
|
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
//#region src/blocks/MultiActionButtonGroup/MultiActionButton.tsx
|
|
@@ -30,4 +30,4 @@ MultiActionButtonGroup.Button = MultiActionButton;
|
|
|
30
30
|
//#endregion
|
|
31
31
|
export { MultiActionButtonGroup };
|
|
32
32
|
|
|
33
|
-
//# sourceMappingURL=MultiActionButtonGroup-
|
|
33
|
+
//# sourceMappingURL=MultiActionButtonGroup-AWLj1Tg7.js.map
|
package/dist/{MultiActionButtonGroup-BPnmzBtw.js.map → MultiActionButtonGroup-AWLj1Tg7.js.map}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiActionButtonGroup-
|
|
1
|
+
{"version":3,"file":"MultiActionButtonGroup-AWLj1Tg7.js","names":[],"sources":["../src/blocks/MultiActionButtonGroup/MultiActionButton.tsx","../src/blocks/MultiActionButtonGroup/MultiActionButtonGroup.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nimport { Button } from '../../components/Button';\nimport { Tooltip } from '../../components/Tooltip';\n\ntype Props = {\n disabled?: boolean;\n icon: ReactNode;\n isLoading?: boolean;\n label: string;\n onClick: ComponentProps<typeof Button>['onClick'];\n tooltipContent: ReactNode;\n tooltipVariant?: ComponentProps<typeof Tooltip>['variant'];\n 'data-testid'?: string;\n};\n\nexport const MultiActionButton = ({\n disabled,\n icon,\n isLoading,\n label,\n onClick,\n tooltipContent,\n tooltipVariant,\n 'data-testid': dataTestId,\n}: Props) => (\n <Tooltip placement=\"top\" tooltip={tooltipContent} triggerAsChild variant={tooltipVariant}>\n <Button\n disabled={disabled}\n isLoading={isLoading}\n aria-label={label}\n onClick={onClick}\n variant=\"invisible\"\n size=\"icon\"\n data-testid={dataTestId}\n >\n {!isLoading && icon}\n </Button>\n </Tooltip>\n);\n","import type { PropsWithChildren } from 'react';\n\nimport { ButtonGroup } from '../../components/ButtonGroup';\nimport { cn } from '../../utils';\n\nimport { MultiActionButton } from './MultiActionButton';\n\ntype Props = {\n className?: string;\n} & PropsWithChildren;\n\nexport const MultiActionButtonGroup = ({ children, className }: Props) => (\n <ButtonGroup className={cn('tw:text-nowrap', className)}>{children}</ButtonGroup>\n);\n\nMultiActionButtonGroup.Button = MultiActionButton;\n"],"mappings":";;;;;;AAgBA,MAAa,qBAAqB,EAChC,UACA,MACA,WACA,OACA,SACA,gBACA,gBACA,eAAe,iBAEf,oBAAC,SAAD;CAAS,WAAU;CAAM,SAAS;CAAgB,gBAAA;CAAe,SAAS;CACxE,UAAA,oBAAC,QAAD;EACY;EACC;EACX,cAAY;EACH;EACT,SAAQ;EACR,MAAK;EACL,eAAa;EAEZ,UAAA,CAAC,aAAa;CACT,CAAA;AACD,CAAA;;;AC3BX,MAAa,0BAA0B,EAAE,UAAU,gBACjD,oBAAC,aAAD;CAAa,WAAW,GAAG,kBAAkB,SAAS;CAAI;AAAsB,CAAA;AAGlF,uBAAuB,SAAS"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { cn } from "./classNames-BzrkDnOD.js";
|
|
2
2
|
import { ChevronDown, Plus, X } from "./icons-wcA70iQx.js";
|
|
3
|
-
import { Button } from "./Button-
|
|
3
|
+
import { Button } from "./Button-B21oVcPU.js";
|
|
4
4
|
import { Popover } from "./Popover-CEk915I1.js";
|
|
5
|
-
import { Badge } from "./Badge-
|
|
5
|
+
import { Badge } from "./Badge-Dz0cj6rj.js";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
//#region src/blocks/PageToolbar/PageToolbarToken.tsx
|
|
8
8
|
/**
|
|
@@ -120,4 +120,4 @@ const PageToolbar = Object.assign(Root, {
|
|
|
120
120
|
//#endregion
|
|
121
121
|
export { PageToolbar };
|
|
122
122
|
|
|
123
|
-
//# sourceMappingURL=PageToolbar-
|
|
123
|
+
//# sourceMappingURL=PageToolbar-C06RKIif.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageToolbar-
|
|
1
|
+
{"version":3,"file":"PageToolbar-C06RKIif.js","names":[],"sources":["../src/blocks/PageToolbar/PageToolbarToken.tsx","../src/blocks/PageToolbar/PageToolbar.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { Badge } from '../../components/Badge';\nimport { Button } from '../../components/Button';\nimport { Popover } from '../../components/Popover';\nimport { ChevronDown, X } from '../../icons';\n\ntype PageToolbarTokenProps = Omit<\n ComponentPropsWithoutRef<typeof Badge>,\n 'variant' | 'color' | 'suffix' | 'children' | 'asChild' | 'popover'\n> & {\n children: ReactNode;\n /** Popover content rendered when the chevron-down trigger is clicked — typically a value editor. */\n popover: ReactNode;\n onRemove: () => void;\n removeAriaLabel: string;\n};\n\n/**\n * Editable filter token (Query Builder variant) — `Badge` pill with a `chevron-down`\n * popover trigger for editing values and an `×` dismiss button. The popover content\n * is supplied by the caller via the `popover` slot (typically a `Combobox` or option list).\n */\nexport const PageToolbarToken = ({\n children,\n popover,\n onRemove,\n removeAriaLabel,\n ...props\n}: PageToolbarTokenProps) => (\n <Popover>\n <Badge\n {...props}\n asChild\n variant=\"pill\"\n color=\"blue-inverse\"\n suffix={\n <Button\n type=\"button\"\n variant=\"inline\"\n size=\"icon-2xs\"\n aria-label={removeAriaLabel}\n onClick={onRemove}\n >\n <X className=\"tw:size-3\" />\n </Button>\n }\n >\n <Popover.Trigger\n type=\"button\"\n className=\"tw:inline-flex tw:cursor-pointer tw:items-center tw:gap-1 tw:bg-inherit tw:text-inherit tailwindcss-preflight\"\n >\n {children}\n <ChevronDown className=\"tw:size-3\" />\n </Popover.Trigger>\n </Badge>\n <Popover.Content align=\"start\">{popover}</Popover.Content>\n </Popover>\n);\n","import type { ComponentProps, ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport { Badge } from '../../components/Badge';\nimport { Button } from '../../components/Button';\nimport { Plus, X } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { PageToolbarToken } from './PageToolbarToken';\n\ntype DivProps = ComponentProps<'div'>;\n\nconst Root = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn('tw:flex tw:flex-wrap tw:items-center tw:gap-3 tw:w-full', className)}\n {...props}\n >\n {children}\n </div>\n);\n\nconst Search = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn(\n 'tw:mr-auto tw:flex tw:items-center tw:gap-2 tw:w-full tw:sm:w-auto tw:sm:min-w-64 tw:sm:max-w-md',\n // The search field fills the slot, else it stays content-width and truncates its placeholder.\n // - First child only: stretching the filter pills after it would size them like the input.\n // - `min-w-0` so a long value shrinks the input rather than overflowing the toolbar.\n 'tw:*:first:min-w-0 tw:*:first:flex-1',\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n\nconst Right = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn('tw:flex tw:flex-wrap tw:items-center tw:gap-2', className)}\n {...props}\n >\n {children}\n </div>\n);\n\nconst ControlGroup = ({ ref, className, children, ...props }: DivProps) => (\n <div ref={ref} className={cn('tw:flex tw:items-center tw:gap-2', className)} {...props}>\n {children}\n </div>\n);\n\nconst ActiveFilters = ({ ref, className, children, ...props }: DivProps) => (\n <div\n ref={ref}\n className={cn('tw:flex tw:flex-wrap tw:items-center tw:gap-2 tw:basis-full', className)}\n {...props}\n >\n {children}\n </div>\n);\n\ntype ChipProps = Omit<\n ComponentPropsWithoutRef<typeof Badge>,\n 'variant' | 'color' | 'suffix' | 'children'\n> & {\n children: ReactNode;\n onRemove: () => void;\n removeAriaLabel: string;\n};\n\nconst Chip = ({ children, onRemove, removeAriaLabel, ...props }: ChipProps) => (\n <Badge\n {...props}\n variant=\"pill\"\n color=\"blue-inverse\"\n suffix={\n <Button\n type=\"button\"\n variant=\"inline\"\n size=\"icon-2xs\"\n aria-label={removeAriaLabel}\n onClick={onRemove}\n >\n <X className=\"tw:size-3\" />\n </Button>\n }\n >\n {children}\n </Badge>\n);\n\ntype ActionProps = ComponentPropsWithoutRef<typeof Button>;\n\nconst AddFilter = ({ className, children, ...props }: ActionProps) => (\n <Button variant=\"invisible\" size=\"small\" className={cn('tw:gap-1.5', className)} {...props}>\n <Plus className=\"tw:size-4\" />\n {children ?? 'Add filter'}\n </Button>\n);\n\nconst Clear = ({ className, children, ...props }: ActionProps) => (\n <Button variant=\"invisible\" size=\"small\" className={cn('tw:ml-auto', className)} {...props}>\n {children ?? 'Clear all'}\n </Button>\n);\n\n/**\n * Search / filter toolbar for index pages, between `PageLayout.Header` and `PageLayout.Content`.\n *\n * - Right cluster order: `Filters` → `Sort` → `Actions` → `View`; nothing after `View`.\n * - `ActiveFilters` only while a filter is active; chips or tokens, never both in one toolbar.\n *\n * @see https://github.com/evviku/design-system-docs/blob/main/docs/patterns/toolbar/toolbar.md\n */\nexport const PageToolbar = Object.assign(Root, {\n Search,\n Right,\n Filters: ControlGroup,\n Sort: ControlGroup,\n Actions: ControlGroup,\n /** Always last in the right cluster. */\n View: ControlGroup,\n /** Render only while a filter is active. */\n ActiveFilters,\n /** Non-editable filter chip. */\n Chip,\n /** Editable filter token; the caller supplies the edit popover via `popover`. */\n Token: PageToolbarToken,\n AddFilter,\n Clear,\n});\n"],"mappings":";;;;;;;;;;;;AAuBA,MAAa,oBAAoB,EAC/B,UACA,SACA,UACA,iBACA,GAAG,YAEH,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,OAAD;CACE,GAAI;CACJ,SAAA;CACA,SAAQ;CACR,OAAM;CACN,QACE,oBAAC,QAAD;EACE,MAAK;EACL,SAAQ;EACR,MAAK;EACL,cAAY;EACZ,SAAS;EAET,UAAA,oBAAC,GAAD,EAAG,WAAU,YAAa,CAAA;CACpB,CAAA;CAGV,UAAA,qBAAC,QAAQ,SAAT;EACE,MAAK;EACL,WAAU;EAFZ,UAAA,CAIG,UACD,oBAAC,aAAD,EAAa,WAAU,YAAa,CAAA,CACrB;;AACZ,CAAA,GACP,oBAAC,QAAQ,SAAT;CAAiB,OAAM;CAAS,UAAA;AAAyB,CAAA,CAClD,EAAA,CAAA;;;AC9CX,MAAM,QAAQ,EAAE,KAAK,WAAW,UAAU,GAAG,YAC3C,oBAAC,OAAD;CACO;CACL,WAAW,GAAG,2DAA2D,SAAS;CAClF,GAAI;CAEH;AACE,CAAA;AAGP,MAAM,UAAU,EAAE,KAAK,WAAW,UAAU,GAAG,YAC7C,oBAAC,OAAD;CACO;CACL,WAAW,GACT,oGAIA,wCACA,SACF;CACA,GAAI;CAEH;AACE,CAAA;AAGP,MAAM,SAAS,EAAE,KAAK,WAAW,UAAU,GAAG,YAC5C,oBAAC,OAAD;CACO;CACL,WAAW,GAAG,iDAAiD,SAAS;CACxE,GAAI;CAEH;AACE,CAAA;AAGP,MAAM,gBAAgB,EAAE,KAAK,WAAW,UAAU,GAAG,YACnD,oBAAC,OAAD;CAAU;CAAK,WAAW,GAAG,oCAAoC,SAAS;CAAG,GAAI;CAC9E;AACE,CAAA;AAGP,MAAM,iBAAiB,EAAE,KAAK,WAAW,UAAU,GAAG,YACpD,oBAAC,OAAD;CACO;CACL,WAAW,GAAG,+DAA+D,SAAS;CACtF,GAAI;CAEH;AACE,CAAA;AAYP,MAAM,QAAQ,EAAE,UAAU,UAAU,iBAAiB,GAAG,YACtD,oBAAC,OAAD;CACE,GAAI;CACJ,SAAQ;CACR,OAAM;CACN,QACE,oBAAC,QAAD;EACE,MAAK;EACL,SAAQ;EACR,MAAK;EACL,cAAY;EACZ,SAAS;EAET,UAAA,oBAAC,GAAD,EAAG,WAAU,YAAa,CAAA;CACpB,CAAA;CAGT;AACI,CAAA;AAKT,MAAM,aAAa,EAAE,WAAW,UAAU,GAAG,YAC3C,qBAAC,QAAD;CAAQ,SAAQ;CAAY,MAAK;CAAQ,WAAW,GAAG,cAAc,SAAS;CAAG,GAAI;CAArF,UAAA,CACE,oBAAC,MAAD,EAAM,WAAU,YAAa,CAAA,GAC5B,YAAY,YACP;;AAGV,MAAM,SAAS,EAAE,WAAW,UAAU,GAAG,YACvC,oBAAC,QAAD;CAAQ,SAAQ;CAAY,MAAK;CAAQ,WAAW,GAAG,cAAc,SAAS;CAAG,GAAI;CAClF,UAAA,YAAY;AACP,CAAA;;;;;;;;;AAWV,MAAa,cAAc,OAAO,OAAO,MAAM;CAC7C;CACA;CACA,SAAS;CACT,MAAM;CACN,SAAS;;CAET,MAAM;;CAEN;;CAEA;;CAEA,OAAO;CACP;CACA;AACF,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { cn } from "./classNames-BzrkDnOD.js";
|
|
2
2
|
import { ChevronLeft, ChevronRight, Ellipsis } from "./icons-wcA70iQx.js";
|
|
3
|
-
import { Button } from "./Button-
|
|
3
|
+
import { Button } from "./Button-B21oVcPU.js";
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
//#region src/components/Pagination/PaginationButton.tsx
|
|
6
6
|
const PaginationButton = ({ ref, active: isActive = false, className, children, size = "icon", ...props }) => /* @__PURE__ */ jsx(Button, {
|
|
@@ -67,4 +67,4 @@ Pagination.Ellipsis = PaginationEllipsis;
|
|
|
67
67
|
//#endregion
|
|
68
68
|
export { Pagination };
|
|
69
69
|
|
|
70
|
-
//# sourceMappingURL=Pagination-
|
|
70
|
+
//# sourceMappingURL=Pagination-DH3f6LN0.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination-
|
|
1
|
+
{"version":3,"file":"Pagination-DH3f6LN0.js","names":[],"sources":["../src/components/Pagination/PaginationButton.tsx","../src/components/Pagination/PaginationContent.tsx","../src/components/Pagination/PaginationEllipsis.tsx","../src/components/Pagination/PaginationItem.tsx","../src/components/Pagination/PaginationNext.tsx","../src/components/Pagination/PaginationPrevious.tsx","../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\n\ntype Props = {\n active?: boolean;\n} & Omit<ComponentProps<typeof Button>, 'variant'>;\n\nexport const PaginationButton = ({\n ref,\n active: isActive = false,\n className,\n children,\n size = 'icon',\n ...props\n}: Props) => (\n <Button\n {...props}\n ref={ref}\n variant=\"invisible\"\n size={size}\n data-slot=\"pagination-link\"\n aria-current={isActive ? 'page' : undefined}\n data-active={isActive}\n className={cn(\n 'tw:data-[active=true]:bg-accent',\n 'tw:data-[active=true]:text-accent-foreground',\n 'tw:data-[active=true]:border-accent',\n className,\n )}\n >\n {children}\n </Button>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'ul'>;\n\nexport const PaginationContent = ({ className, ...props }: Props) => (\n <ul\n {...props}\n className={cn('tw:flex', 'tw:flex-row', 'tw:items-center', 'tw:gap-1', className)}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { Ellipsis } from '../../icons';\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'span'>;\n\nexport const PaginationEllipsis = ({ className, ...props }: Props) => (\n <span\n aria-hidden=\"true\"\n className={cn(\n // layout\n 'tw:flex',\n 'tw:p-2.5',\n 'tw:items-center',\n 'tw:justify-center',\n\n 'tw:text-foreground',\n 'tw:[&_svg:not([class*=\"tw:size-\"])]:size-4',\n className,\n )}\n {...props}\n >\n <Ellipsis />\n </span>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'li'>;\n\nexport const PaginationItem = ({ className, ...props }: Props) => (\n <li className={cn('tw:list-none', className)} {...props} />\n);\n","import type { ComponentProps } from 'react';\n\nimport { ChevronRight } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { PaginationButton } from './PaginationButton';\n\ntype Props = ComponentProps<typeof PaginationButton>;\n\nexport const PaginationNext = ({ children, className, ...props }: Props) => (\n <PaginationButton\n {...props}\n aria-label=\"Go to next page\"\n size=\"medium\"\n className={cn('tw:flex-row-reverse', className)}\n >\n <ChevronRight className=\"tw:size-5\" />\n {children ?? 'Next'}\n </PaginationButton>\n);\n","import type { ComponentProps } from 'react';\n\nimport { ChevronLeft } from '../../icons';\n\nimport { PaginationButton } from './PaginationButton';\n\ntype Props = ComponentProps<typeof PaginationButton>;\n\nexport const PaginationPrevious = ({ children, ...props }: Props) => (\n <PaginationButton {...props} size=\"medium\" aria-label=\"Go to previous page\">\n <ChevronLeft className=\"tw:size-5\" />\n {children ?? 'Previous'}\n </PaginationButton>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nimport { PaginationButton } from './PaginationButton';\nimport { PaginationContent } from './PaginationContent';\nimport { PaginationEllipsis } from './PaginationEllipsis';\nimport { PaginationItem } from './PaginationItem';\nimport { PaginationNext } from './PaginationNext';\nimport { PaginationPrevious } from './PaginationPrevious';\n\ntype Props = ComponentProps<'nav'>;\n\nexport const Pagination = ({ className, ...props }: Props) => (\n <nav\n {...props}\n aria-label=\"pagination\"\n className={cn(\n 'tailwindcss-preflight',\n 'tw:mx-auto',\n 'tw:flex',\n 'tw:w-full',\n 'tw:justify-center',\n className,\n )}\n />\n);\n\nPagination.Content = PaginationContent;\nPagination.Item = PaginationItem;\nPagination.Button = PaginationButton;\nPagination.Previous = PaginationPrevious;\nPagination.Next = PaginationNext;\nPagination.Ellipsis = PaginationEllipsis;\n"],"mappings":";;;;;AASA,MAAa,oBAAoB,EAC/B,KACA,QAAQ,WAAW,OACnB,WACA,UACA,OAAO,QACP,GAAG,YAEH,oBAAC,QAAD;CACE,GAAI;CACC;CACL,SAAQ;CACF;CACN,aAAU;CACV,gBAAc,WAAW,SAAS,KAAA;CAClC,eAAa;CACb,WAAW,GACT,mCACA,gDACA,uCACA,SACF;CAEC;AACK,CAAA;;;AC3BV,MAAa,qBAAqB,EAAE,WAAW,GAAG,YAChD,oBAAC,MAAD;CACE,GAAI;CACJ,WAAW,GAAG,WAAW,eAAe,mBAAmB,YAAY,SAAS;AACjF,CAAA;;;ACHH,MAAa,sBAAsB,EAAE,WAAW,GAAG,YACjD,oBAAC,QAAD;CACE,eAAY;CACZ,WAAW,GAET,WACA,YACA,mBACA,qBAEA,sBACA,gDACA,SACF;CACA,GAAI;CAEJ,UAAA,oBAAC,UAAD,CAAW,CAAA;AACP,CAAA;;;AClBR,MAAa,kBAAkB,EAAE,WAAW,GAAG,YAC7C,oBAAC,MAAD;CAAI,WAAW,GAAG,gBAAgB,SAAS;CAAG,GAAI;AAAQ,CAAA;;;ACE5D,MAAa,kBAAkB,EAAE,UAAU,WAAW,GAAG,YACvD,qBAAC,kBAAD;CACE,GAAI;CACJ,cAAW;CACX,MAAK;CACL,WAAW,GAAG,uBAAuB,SAAS;CAJhD,UAAA,CAME,oBAAC,cAAD,EAAc,WAAU,YAAa,CAAA,GACpC,YAAY,MACG;;;;ACVpB,MAAa,sBAAsB,EAAE,UAAU,GAAG,YAChD,qBAAC,kBAAD;CAAkB,GAAI;CAAO,MAAK;CAAS,cAAW;CAAtD,UAAA,CACE,oBAAC,aAAD,EAAa,WAAU,YAAa,CAAA,GACnC,YAAY,UACG;;;;ACCpB,MAAa,cAAc,EAAE,WAAW,GAAG,YACzC,oBAAC,OAAD;CACE,GAAI;CACJ,cAAW;CACX,WAAW,GACT,yBACA,cACA,WACA,aACA,qBACA,SACF;AACD,CAAA;AAGH,WAAW,UAAU;AACrB,WAAW,OAAO;AAClB,WAAW,SAAS;AACpB,WAAW,WAAW;AACtB,WAAW,OAAO;AAClB,WAAW,WAAW"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { cn } from "./classNames-BzrkDnOD.js";
|
|
2
|
-
import { Button } from "./Button-
|
|
2
|
+
import { Button } from "./Button-B21oVcPU.js";
|
|
3
3
|
import { useStableCallback } from "./internal/hooks/useStableCallback.js";
|
|
4
4
|
import { Popover } from "./Popover-CEk915I1.js";
|
|
5
5
|
import { Slot } from "@radix-ui/react-slot";
|
|
@@ -163,4 +163,4 @@ Popconfirm.Trigger = PopconfirmTrigger;
|
|
|
163
163
|
//#endregion
|
|
164
164
|
export { Popconfirm };
|
|
165
165
|
|
|
166
|
-
//# sourceMappingURL=Popconfirm-
|
|
166
|
+
//# sourceMappingURL=Popconfirm-Dhzn7sy6.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popconfirm-SLz0zodk.js","names":[],"sources":["../src/components/Popconfirm/context.ts","../src/components/Popconfirm/PopconfirmBody.tsx","../src/components/Popconfirm/PopconfirmCancel.tsx","../src/components/Popconfirm/PopconfirmConfirm.tsx","../src/components/Popconfirm/PopconfirmContent.tsx","../src/components/Popconfirm/PopconfirmFooter.tsx","../src/components/Popconfirm/PopconfirmTrigger.tsx","../src/components/Popconfirm/Popconfirm.tsx"],"sourcesContent":["import { createContext, type MouseEvent, use } from 'react';\n\nexport type PopconfirmContextType = {\n variant: 'confirm' | 'danger';\n onConfirm: (event: MouseEvent<HTMLButtonElement>) => void | Promise<void>;\n onCancel: (event: MouseEvent<HTMLButtonElement>) => void;\n enabled: boolean;\n isLoading: boolean;\n};\n\nconst PopconfirmContext = createContext<PopconfirmContextType | null>(null);\n\nexport const PopconfirmContextProvider = PopconfirmContext;\n\nexport const usePopconfirmContext = () => {\n const context = use(PopconfirmContext);\n if (!context) throw new Error('usePopconfirmContext must be used within a Popconfirm');\n return context;\n};\n","import type { ComponentProps } from 'react';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmBody = (props: Props) => <div {...props} />;\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmCancel = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onCancel, isLoading } = usePopconfirmContext();\n\n const handleClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onCancel(event);\n };\n\n return (\n <Popover.Close asChild onClick={handleClick} disabled={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button variant=\"outline\" size=\"small\" {...props} ref={ref} className={cn(className)}>\n {children ?? 'Cancel'}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button/Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children' | 'isLoading'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmConfirm = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onConfirm, variant, isLoading } = usePopconfirmContext();\n\n const handleOnClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onConfirm(event);\n };\n\n const defaultLabel = (() => {\n if (children) return children;\n return variant === 'danger' ? 'Delete' : 'Confirm';\n })();\n\n return (\n <Popover.Close asChild onClick={handleOnClick} disabled={isLoading} data-loading={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button\n size=\"small\"\n variant={variant === 'danger' ? 'danger' : 'primary'}\n {...props}\n ref={ref}\n className={cn('tw:flex-1', className)}\n isLoading={isLoading}\n >\n {defaultLabel}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = Omit<ComponentProps<typeof Popover.Content>, 'showArrow'>;\n\nexport const PopconfirmContent = ({ className, onInteractOutside, ...props }: Props) => {\n const { isLoading } = usePopconfirmContext();\n\n const handleOnInteractOutside: Props['onInteractOutside'] = (event) => {\n if (isLoading) event.preventDefault();\n onInteractOutside?.(event);\n };\n\n return (\n <Popover.Content\n {...props}\n onInteractOutside={handleOnInteractOutside}\n className={cn('tw:flex', 'tw:flex-col', 'tw:gap-3', 'tw:px-4', 'tw:py-3', className)}\n />\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmFooter = ({ className, ...props }: Props) => (\n <div {...props} className={cn('tw:flex tw:gap-2 tw:w-full', className)} />\n);\n","import type { ComponentProps, MouseEventHandler } from 'react';\n\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = ComponentProps<typeof Popover.Trigger>;\n\nexport const PopconfirmTrigger = ({ onClick, ...props }: Props) => {\n const { enabled, onConfirm } = usePopconfirmContext();\n\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (!enabled) {\n event.preventDefault();\n onConfirm(event);\n }\n\n onClick?.(event);\n };\n\n return <Popover.Trigger {...props} onClick={handleClick} />;\n};\n","import { useMemo, useState } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\n\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { Popover } from '../Popover';\n\nimport { PopconfirmContextProvider, type PopconfirmContextType } from './context';\nimport { PopconfirmBody } from './PopconfirmBody';\nimport { PopconfirmCancel } from './PopconfirmCancel';\nimport { PopconfirmConfirm } from './PopconfirmConfirm';\nimport { PopconfirmContent } from './PopconfirmContent';\nimport { PopconfirmFooter } from './PopconfirmFooter';\nimport { PopconfirmTrigger } from './PopconfirmTrigger';\n\nconst noop = () => void 0;\n\ntype Props = {\n children: ReactNode;\n skipAsyncWait?: boolean;\n} & ComponentProps<typeof Popover> &\n Omit<Partial<PopconfirmContextType>, 'isLoading'>;\n\nexport const Popconfirm = ({\n children,\n onConfirm = noop,\n onCancel = noop,\n variant = 'confirm',\n enabled = true,\n onOpenChange = noop,\n open,\n skipAsyncWait = false,\n ...rest\n}: Props) => {\n const [isLoading, setIsLoading] = useState(false);\n const [isOpen, setIsOpen] = useState(false);\n\n const handleConfirm = useStableCallback(onConfirm);\n const handleCancel = useStableCallback(onCancel);\n\n const handleOnOpenChange = (open: boolean) => {\n setIsOpen(open);\n onOpenChange(open);\n };\n\n const context = useMemo<PopconfirmContextType>(\n () => ({\n variant,\n isLoading,\n enabled,\n onConfirm: (event) => {\n const result = handleConfirm(event);\n\n if (!(result instanceof Promise) || skipAsyncWait) return;\n\n // The async confirm's outcome drives the popover.\n // - `preventDefault` stops the click closing it, so it stays up while the action runs.\n // - Resolved closes it; rejected leaves it up so the failure stays visible.\n // - The rejection is deliberately not caught — the host's global handler reports it.\n event.preventDefault();\n setIsLoading(true);\n result.then(() => setIsOpen(false)).finally(() => setIsLoading(false));\n },\n onCancel: handleCancel,\n }),\n [variant, isLoading, enabled, skipAsyncWait, handleConfirm, handleCancel],\n );\n\n return (\n <Popover {...rest} open={open || isOpen} onOpenChange={handleOnOpenChange}>\n <PopconfirmContextProvider value={context}>{children}</PopconfirmContextProvider>\n </Popover>\n );\n};\n\nPopconfirm.Confirm = PopconfirmConfirm;\nPopconfirm.Cancel = PopconfirmCancel;\nPopconfirm.Footer = PopconfirmFooter;\nPopconfirm.Content = PopconfirmContent;\nPopconfirm.Body = PopconfirmBody;\nPopconfirm.Trigger = PopconfirmTrigger;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Popconfirm-Dhzn7sy6.js","names":[],"sources":["../src/components/Popconfirm/context.ts","../src/components/Popconfirm/PopconfirmBody.tsx","../src/components/Popconfirm/PopconfirmCancel.tsx","../src/components/Popconfirm/PopconfirmConfirm.tsx","../src/components/Popconfirm/PopconfirmContent.tsx","../src/components/Popconfirm/PopconfirmFooter.tsx","../src/components/Popconfirm/PopconfirmTrigger.tsx","../src/components/Popconfirm/Popconfirm.tsx"],"sourcesContent":["import { createContext, type MouseEvent, use } from 'react';\n\nexport type PopconfirmContextType = {\n variant: 'confirm' | 'danger';\n onConfirm: (event: MouseEvent<HTMLButtonElement>) => void | Promise<void>;\n onCancel: (event: MouseEvent<HTMLButtonElement>) => void;\n enabled: boolean;\n isLoading: boolean;\n};\n\nconst PopconfirmContext = createContext<PopconfirmContextType | null>(null);\n\nexport const PopconfirmContextProvider = PopconfirmContext;\n\nexport const usePopconfirmContext = () => {\n const context = use(PopconfirmContext);\n if (!context) throw new Error('usePopconfirmContext must be used within a Popconfirm');\n return context;\n};\n","import type { ComponentProps } from 'react';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmBody = (props: Props) => <div {...props} />;\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmCancel = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onCancel, isLoading } = usePopconfirmContext();\n\n const handleClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onCancel(event);\n };\n\n return (\n <Popover.Close asChild onClick={handleClick} disabled={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button variant=\"outline\" size=\"small\" {...props} ref={ref} className={cn(className)}>\n {children ?? 'Cancel'}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps, ReactNode } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\nimport { Button } from '../Button/Button';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype SlotProps = { asChild: true } & ComponentProps<'button'>;\ntype ButtonProps = { asChild?: false; children?: ReactNode } & Omit<\n ComponentProps<typeof Button>,\n 'children' | 'isLoading'\n>;\ntype Props = SlotProps | ButtonProps;\n\nexport const PopconfirmConfirm = ({\n ref,\n onClick,\n children,\n asChild,\n className,\n ...props\n}: Props) => {\n const { onConfirm, variant, isLoading } = usePopconfirmContext();\n\n const handleOnClick: ComponentProps<'button'>['onClick'] = (event) => {\n onClick?.(event);\n onConfirm(event);\n };\n\n const defaultLabel = (() => {\n if (children) return children;\n return variant === 'danger' ? 'Delete' : 'Confirm';\n })();\n\n return (\n <Popover.Close asChild onClick={handleOnClick} disabled={isLoading} data-loading={isLoading}>\n {asChild ? (\n <Slot {...props} ref={ref} className={className}>\n {children}\n </Slot>\n ) : (\n <Button\n size=\"small\"\n variant={variant === 'danger' ? 'danger' : 'primary'}\n {...props}\n ref={ref}\n className={cn('tw:flex-1', className)}\n isLoading={isLoading}\n >\n {defaultLabel}\n </Button>\n )}\n </Popover.Close>\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = Omit<ComponentProps<typeof Popover.Content>, 'showArrow'>;\n\nexport const PopconfirmContent = ({ className, onInteractOutside, ...props }: Props) => {\n const { isLoading } = usePopconfirmContext();\n\n const handleOnInteractOutside: Props['onInteractOutside'] = (event) => {\n if (isLoading) event.preventDefault();\n onInteractOutside?.(event);\n };\n\n return (\n <Popover.Content\n {...props}\n onInteractOutside={handleOnInteractOutside}\n className={cn('tw:flex', 'tw:flex-col', 'tw:gap-3', 'tw:px-4', 'tw:py-3', className)}\n />\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const PopconfirmFooter = ({ className, ...props }: Props) => (\n <div {...props} className={cn('tw:flex tw:gap-2 tw:w-full', className)} />\n);\n","import type { ComponentProps, MouseEventHandler } from 'react';\n\nimport { Popover } from '../Popover';\n\nimport { usePopconfirmContext } from './context';\n\ntype Props = ComponentProps<typeof Popover.Trigger>;\n\nexport const PopconfirmTrigger = ({ onClick, ...props }: Props) => {\n const { enabled, onConfirm } = usePopconfirmContext();\n\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (!enabled) {\n event.preventDefault();\n onConfirm(event);\n }\n\n onClick?.(event);\n };\n\n return <Popover.Trigger {...props} onClick={handleClick} />;\n};\n","import { useMemo, useState } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\n\nimport { useStableCallback } from '../../hooks/useStableCallback';\nimport { Popover } from '../Popover';\n\nimport { PopconfirmContextProvider, type PopconfirmContextType } from './context';\nimport { PopconfirmBody } from './PopconfirmBody';\nimport { PopconfirmCancel } from './PopconfirmCancel';\nimport { PopconfirmConfirm } from './PopconfirmConfirm';\nimport { PopconfirmContent } from './PopconfirmContent';\nimport { PopconfirmFooter } from './PopconfirmFooter';\nimport { PopconfirmTrigger } from './PopconfirmTrigger';\n\nconst noop = () => void 0;\n\ntype Props = {\n children: ReactNode;\n skipAsyncWait?: boolean;\n} & ComponentProps<typeof Popover> &\n Omit<Partial<PopconfirmContextType>, 'isLoading'>;\n\nexport const Popconfirm = ({\n children,\n onConfirm = noop,\n onCancel = noop,\n variant = 'confirm',\n enabled = true,\n onOpenChange = noop,\n open,\n skipAsyncWait = false,\n ...rest\n}: Props) => {\n const [isLoading, setIsLoading] = useState(false);\n const [isOpen, setIsOpen] = useState(false);\n\n const handleConfirm = useStableCallback(onConfirm);\n const handleCancel = useStableCallback(onCancel);\n\n const handleOnOpenChange = (open: boolean) => {\n setIsOpen(open);\n onOpenChange(open);\n };\n\n const context = useMemo<PopconfirmContextType>(\n () => ({\n variant,\n isLoading,\n enabled,\n onConfirm: (event) => {\n const result = handleConfirm(event);\n\n if (!(result instanceof Promise) || skipAsyncWait) return;\n\n // The async confirm's outcome drives the popover.\n // - `preventDefault` stops the click closing it, so it stays up while the action runs.\n // - Resolved closes it; rejected leaves it up so the failure stays visible.\n // - The rejection is deliberately not caught — the host's global handler reports it.\n event.preventDefault();\n setIsLoading(true);\n result.then(() => setIsOpen(false)).finally(() => setIsLoading(false));\n },\n onCancel: handleCancel,\n }),\n [variant, isLoading, enabled, skipAsyncWait, handleConfirm, handleCancel],\n );\n\n return (\n <Popover {...rest} open={open || isOpen} onOpenChange={handleOnOpenChange}>\n <PopconfirmContextProvider value={context}>{children}</PopconfirmContextProvider>\n </Popover>\n );\n};\n\nPopconfirm.Confirm = PopconfirmConfirm;\nPopconfirm.Cancel = PopconfirmCancel;\nPopconfirm.Footer = PopconfirmFooter;\nPopconfirm.Content = PopconfirmContent;\nPopconfirm.Body = PopconfirmBody;\nPopconfirm.Trigger = PopconfirmTrigger;\n"],"mappings":";;;;;;;;AAUA,MAAM,oBAAoB,cAA4C,IAAI;AAE1E,MAAa,4BAA4B;AAEzC,MAAa,6BAA6B;CACxC,MAAM,UAAU,IAAI,iBAAiB;CACrC,IAAI,CAAC,SAAS,MAAM,IAAI,MAAM,uDAAuD;CACrF,OAAO;AACT;;;ACdA,MAAa,kBAAkB,UAAiB,oBAAC,OAAD,EAAK,GAAI,MAAQ,CAAA;;;ACYjE,MAAa,oBAAoB,EAC/B,KACA,SACA,UACA,SACA,WACA,GAAG,YACQ;CACX,MAAM,EAAE,UAAU,cAAc,qBAAqB;CAErD,MAAM,eAAoD,UAAU;EAClE,UAAU,KAAK;EACf,SAAS,KAAK;CAChB;CAEA,OACE,oBAAC,QAAQ,OAAT;EAAe,SAAA;EAAQ,SAAS;EAAa,UAAU;EACpD,UAAA,UACC,oBAAC,MAAD;GAAM,GAAI;GAAY;GAAgB;GACnC;EACG,CAAA,IAEN,oBAAC,QAAD;GAAQ,SAAQ;GAAU,MAAK;GAAQ,GAAI;GAAY;GAAK,WAAW,GAAG,SAAS;GAChF,UAAA,YAAY;EACP,CAAA;CAEG,CAAA;AAEnB;;;AC5BA,MAAa,qBAAqB,EAChC,KACA,SACA,UACA,SACA,WACA,GAAG,YACQ;CACX,MAAM,EAAE,WAAW,SAAS,cAAc,qBAAqB;CAE/D,MAAM,iBAAsD,UAAU;EACpE,UAAU,KAAK;EACf,UAAU,KAAK;CACjB;CAEA,MAAM,sBAAsB;EAC1B,IAAI,UAAU,OAAO;EACrB,OAAO,YAAY,WAAW,WAAW;CAC3C,EAAA,CAAG;CAEH,OACE,oBAAC,QAAQ,OAAT;EAAe,SAAA;EAAQ,SAAS;EAAe,UAAU;EAAW,gBAAc;EAC/E,UAAA,UACC,oBAAC,MAAD;GAAM,GAAI;GAAY;GAAgB;GACnC;EACG,CAAA,IAEN,oBAAC,QAAD;GACE,MAAK;GACL,SAAS,YAAY,WAAW,WAAW;GAC3C,GAAI;GACC;GACL,WAAW,GAAG,aAAa,SAAS;GACzB;GAEV,UAAA;EACK,CAAA;CAEG,CAAA;AAEnB;;;AC/CA,MAAa,qBAAqB,EAAE,WAAW,mBAAmB,GAAG,YAAmB;CACtF,MAAM,EAAE,cAAc,qBAAqB;CAE3C,MAAM,2BAAuD,UAAU;EACrE,IAAI,WAAW,MAAM,eAAe;EACpC,oBAAoB,KAAK;CAC3B;CAEA,OACE,oBAAC,QAAQ,SAAT;EACE,GAAI;EACJ,mBAAmB;EACnB,WAAW,GAAG,WAAW,eAAe,YAAY,WAAW,WAAW,SAAS;CACpF,CAAA;AAEL;;;AClBA,MAAa,oBAAoB,EAAE,WAAW,GAAG,YAC/C,oBAAC,OAAD;CAAK,GAAI;CAAO,WAAW,GAAG,8BAA8B,SAAS;AAAI,CAAA;;;ACC3E,MAAa,qBAAqB,EAAE,SAAS,GAAG,YAAmB;CACjE,MAAM,EAAE,SAAS,cAAc,qBAAqB;CAEpD,MAAM,eAAqD,UAAU;EACnE,IAAI,CAAC,SAAS;GACZ,MAAM,eAAe;GACrB,UAAU,KAAK;EACjB;EAEA,UAAU,KAAK;CACjB;CAEA,OAAO,oBAAC,QAAQ,SAAT;EAAiB,GAAI;EAAO,SAAS;CAAc,CAAA;AAC5D;;;ACPA,MAAM,aAAa,KAAK;AAQxB,MAAa,cAAc,EACzB,UACA,YAAY,MACZ,WAAW,MACX,UAAU,WACV,UAAU,MACV,eAAe,MACf,MACA,gBAAgB,OAChB,GAAG,WACQ;CACX,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAChD,MAAM,CAAC,QAAQ,aAAa,SAAS,KAAK;CAE1C,MAAM,gBAAgB,kBAAkB,SAAS;CACjD,MAAM,eAAe,kBAAkB,QAAQ;CAE/C,MAAM,sBAAsB,SAAkB;EAC5C,UAAU,IAAI;EACd,aAAa,IAAI;CACnB;CAEA,MAAM,UAAU,eACP;EACL;EACA;EACA;EACA,YAAY,UAAU;GACpB,MAAM,SAAS,cAAc,KAAK;GAElC,IAAI,EAAE,kBAAkB,YAAY,eAAe;GAMnD,MAAM,eAAe;GACrB,aAAa,IAAI;GACjB,OAAO,WAAW,UAAU,KAAK,CAAC,CAAC,CAAC,cAAc,aAAa,KAAK,CAAC;EACvE;EACA,UAAU;CACZ,IACA;EAAC;EAAS;EAAW;EAAS;EAAe;EAAe;CAAY,CAC1E;CAEA,OACE,oBAAC,SAAD;EAAS,GAAI;EAAM,MAAM,QAAQ;EAAQ,cAAc;EACrD,UAAA,oBAAC,2BAAD;GAA2B,OAAO;GAAU;EAAoC,CAAA;CACzE,CAAA;AAEb;AAEA,WAAW,UAAU;AACrB,WAAW,SAAS;AACpB,WAAW,SAAS;AACpB,WAAW,UAAU;AACrB,WAAW,OAAO;AAClB,WAAW,UAAU"}
|
|
@@ -2,6 +2,7 @@ import { cn } from "./classNames-BzrkDnOD.js";
|
|
|
2
2
|
import { Tooltip } from "./utils-Bd28bWgm.js";
|
|
3
3
|
import { useArgoDesign } from "./context-U293r3v-.js";
|
|
4
4
|
import { Circle } from "./icons-wcA70iQx.js";
|
|
5
|
+
import { radioCircleVariants, radioIndicatorVariants, radioItemButtonVariants, radioVariants } from "./styles-DBGXH5-_.js";
|
|
5
6
|
import { Separator } from "./internal/components/Separator.js";
|
|
6
7
|
import { FieldBox } from "./FieldBox-D7DYtX_m.js";
|
|
7
8
|
import { createContext, use, useId } from "react";
|
|
@@ -17,124 +18,10 @@ const RadioGroupContext = createContext({
|
|
|
17
18
|
const RadioGroupProvider = RadioGroupContext;
|
|
18
19
|
const useRadioGroupContext = () => use(RadioGroupContext);
|
|
19
20
|
//#endregion
|
|
20
|
-
//#region src/components/RadioGroup/styles.ts
|
|
21
|
-
const radioVariants = cva([
|
|
22
|
-
"tw:bg-transparent",
|
|
23
|
-
"tw:p-0",
|
|
24
|
-
"tw:peer",
|
|
25
|
-
"tw:cursor-pointer",
|
|
26
|
-
"tw:whitespace-nowrap",
|
|
27
|
-
"tw:shrink-0",
|
|
28
|
-
"tw:flex",
|
|
29
|
-
"tw:items-center",
|
|
30
|
-
"tw:justify-center",
|
|
31
|
-
"tw:disabled:cursor-not-allowed",
|
|
32
|
-
"tw:size-4",
|
|
33
|
-
"tw:rounded-full",
|
|
34
|
-
"tw:border",
|
|
35
|
-
"tw:border-solid"
|
|
36
|
-
], {
|
|
37
|
-
defaultVariants: { variant: "default" },
|
|
38
|
-
variants: { variant: {
|
|
39
|
-
default: [
|
|
40
|
-
"tw:disabled:opacity-40",
|
|
41
|
-
"tw:data-[state=checked]:border-primary",
|
|
42
|
-
"tw:data-[state=unchecked]:border-neutral-200",
|
|
43
|
-
"tw:data-[state=unchecked]:hover:border-primary",
|
|
44
|
-
"tw:data-[state=unchecked]:disabled:hover:border-neutral-200",
|
|
45
|
-
"tw:focus-visible:ring-2",
|
|
46
|
-
"tw:focus-visible:ring-ring/30"
|
|
47
|
-
],
|
|
48
|
-
argo: [
|
|
49
|
-
"tw:disabled:opacity-50",
|
|
50
|
-
"tw:border-input",
|
|
51
|
-
"tw:transition-colors",
|
|
52
|
-
"tw:data-[state=checked]:bg-primary",
|
|
53
|
-
"tw:data-[state=checked]:border-primary",
|
|
54
|
-
"tw:data-[state=unchecked]:not-disabled:hover:bg-accent",
|
|
55
|
-
"tw:data-[state=checked]:not-disabled:hover:bg-primary",
|
|
56
|
-
"tw:focus-visible:outline-hidden",
|
|
57
|
-
"tw:focus-visible:border-primary",
|
|
58
|
-
"tw:focus-visible:ring-2",
|
|
59
|
-
"tw:focus-visible:ring-ring/50"
|
|
60
|
-
]
|
|
61
|
-
} }
|
|
62
|
-
});
|
|
63
|
-
const radioIndicatorVariants = cva(["tw:size-2.5", "tw:fill-current"], {
|
|
64
|
-
defaultVariants: { variant: "default" },
|
|
65
|
-
variants: { variant: {
|
|
66
|
-
default: ["tw:text-primary"],
|
|
67
|
-
argo: ["tw:text-primary-foreground"]
|
|
68
|
-
} }
|
|
69
|
-
});
|
|
70
|
-
const radioItemButtonVariants = cva([
|
|
71
|
-
"tw:bg-transparent",
|
|
72
|
-
"tw:p-0",
|
|
73
|
-
"tw:peer",
|
|
74
|
-
"tw:cursor-pointer",
|
|
75
|
-
"tw:whitespace-nowrap",
|
|
76
|
-
"tw:flex",
|
|
77
|
-
"tw:items-center",
|
|
78
|
-
"tw:justify-center",
|
|
79
|
-
"tw:disabled:cursor-not-allowed",
|
|
80
|
-
"tw:w-full",
|
|
81
|
-
"tw:px-2",
|
|
82
|
-
"tw:py-1.5",
|
|
83
|
-
"tw:uppercase",
|
|
84
|
-
"tw:font-semibold",
|
|
85
|
-
"tw:font-sans",
|
|
86
|
-
"tw:text-[11px]",
|
|
87
|
-
"tw:whitespace-nowrap",
|
|
88
|
-
"tw:tracking-widest",
|
|
89
|
-
"tw:leading-[18px]",
|
|
90
|
-
"tw:border",
|
|
91
|
-
"tw:border-solid",
|
|
92
|
-
"tw:rounded"
|
|
93
|
-
], {
|
|
94
|
-
defaultVariants: { variant: "default" },
|
|
95
|
-
variants: { variant: {
|
|
96
|
-
default: [
|
|
97
|
-
"tw:disabled:opacity-40",
|
|
98
|
-
"tw:text-secondary-600",
|
|
99
|
-
"tw:border-secondary-500",
|
|
100
|
-
"tw:data-[state=unchecked]:hover:bg-secondary-500",
|
|
101
|
-
"tw:data-[state=unchecked]:hover:text-white",
|
|
102
|
-
"tw:data-[state=unchecked]:disabled:hover:bg-white",
|
|
103
|
-
"tw:data-[state=unchecked]:disabled:hover:text-secondary-500",
|
|
104
|
-
"tw:data-[state=checked]:disabled:cursor-not-allowed",
|
|
105
|
-
"tw:data-[state=unchecked]:bg-white",
|
|
106
|
-
"tw:data-[state=checked]:bg-secondary-500",
|
|
107
|
-
"tw:data-[state=checked]:text-white",
|
|
108
|
-
"tw:data-[state=checked]:cursor-default",
|
|
109
|
-
"tw:focus-visible:outline",
|
|
110
|
-
"tw:focus-visible:outline-ring",
|
|
111
|
-
"tw:focus-visible:ring-4",
|
|
112
|
-
"tw:focus-visible:ring-ring/30"
|
|
113
|
-
],
|
|
114
|
-
argo: [
|
|
115
|
-
"tw:disabled:opacity-50",
|
|
116
|
-
"tw:text-foreground",
|
|
117
|
-
"tw:border-input",
|
|
118
|
-
"tw:transition-colors",
|
|
119
|
-
"tw:data-[state=unchecked]:bg-muted",
|
|
120
|
-
"tw:data-[state=unchecked]:not-disabled:hover:bg-accent",
|
|
121
|
-
"tw:data-[state=unchecked]:not-disabled:hover:text-accent-foreground",
|
|
122
|
-
"tw:data-[state=checked]:bg-primary",
|
|
123
|
-
"tw:data-[state=checked]:border-primary",
|
|
124
|
-
"tw:data-[state=checked]:text-primary-foreground",
|
|
125
|
-
"tw:data-[state=checked]:not-disabled:cursor-default",
|
|
126
|
-
"tw:focus-visible:outline-hidden",
|
|
127
|
-
"tw:focus-visible:border-primary",
|
|
128
|
-
"tw:focus-visible:ring-2",
|
|
129
|
-
"tw:focus-visible:ring-ring/50"
|
|
130
|
-
]
|
|
131
|
-
} }
|
|
132
|
-
});
|
|
133
|
-
//#endregion
|
|
134
21
|
//#region src/components/RadioGroup/Radio.tsx
|
|
135
22
|
const Radio = ({ className, styleVariant = "default", ...props }) => /* @__PURE__ */ jsx(Item, {
|
|
136
23
|
...props,
|
|
137
|
-
className: cn(radioVariants({ variant: styleVariant }), className),
|
|
24
|
+
className: cn(radioCircleVariants({ variant: styleVariant }), radioVariants({ variant: styleVariant }), className),
|
|
138
25
|
children: /* @__PURE__ */ jsx(Indicator, {
|
|
139
26
|
className: cn("tw:flex", "tw:items-center", "tw:justify-center"),
|
|
140
27
|
children: /* @__PURE__ */ jsx(Circle, { className: radioIndicatorVariants({ variant: styleVariant }) })
|
|
@@ -230,4 +117,4 @@ RadioGroup.Separator = RadioGroupSeparator;
|
|
|
230
117
|
//#endregion
|
|
231
118
|
export { RadioGroup };
|
|
232
119
|
|
|
233
|
-
//# sourceMappingURL=RadioGroup-
|
|
120
|
+
//# sourceMappingURL=RadioGroup-CYEp8Wnx.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RadioGroup-CYEp8Wnx.js","names":[],"sources":["../src/components/RadioGroup/context.ts","../src/components/RadioGroup/Radio.tsx","../src/components/RadioGroup/RadioGroupItemButton.tsx","../src/components/RadioGroup/RadioGroupItem.tsx","../src/components/RadioGroup/RadioGroupSeparator.tsx","../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { createContext, use } from 'react';\n\nexport type Variant = 'radio' | 'button' | 'radio-block';\nexport type Orientation = 'vertical' | 'horizontal';\n\nconst RadioGroupContext = createContext<{\n variant: Variant;\n orientation: Orientation;\n}>({\n variant: 'radio',\n orientation: 'horizontal',\n});\n\nexport const RadioGroupProvider = RadioGroupContext;\n\nexport const useRadioGroupContext = () => use(RadioGroupContext);\n","import type { ComponentProps } from 'react';\nimport { Indicator, Item } from '@radix-ui/react-radio-group';\n\nimport { Circle } from '../../icons';\nimport { cn } from '../../utils';\n\nimport type { RadioStyleVariant } from './styles';\nimport { radioCircleVariants, radioIndicatorVariants, radioVariants } from './styles';\n\ntype Props = ComponentProps<typeof Item> & { styleVariant?: RadioStyleVariant };\n\nexport const Radio = ({ className, styleVariant = 'default', ...props }: Props) => (\n <Item\n {...props}\n className={cn(\n radioCircleVariants({ variant: styleVariant }),\n radioVariants({ variant: styleVariant }),\n className,\n )}\n >\n <Indicator className={cn('tw:flex', 'tw:items-center', 'tw:justify-center')}>\n {/* Lucide Circle is stroke-only — force fill to match the stroke (currentColor)\n so the indicator reads as a solid dot. */}\n <Circle className={radioIndicatorVariants({ variant: styleVariant })} />\n </Indicator>\n </Item>\n);\n","import type { ComponentProps } from 'react';\nimport { Item } from '@radix-ui/react-radio-group';\n\nimport { cn } from '../../utils';\n\nimport type { RadioStyleVariant } from './styles';\nimport { radioItemButtonVariants } from './styles';\n\ntype Props = ComponentProps<typeof Item> & { styleVariant?: RadioStyleVariant };\n\nexport const RadioGroupItemButton = ({\n ref,\n className,\n children,\n styleVariant = 'default',\n ...props\n}: Props) => (\n <Item\n ref={ref}\n {...props}\n className={cn(radioItemButtonVariants({ variant: styleVariant }), className)}\n >\n {children}\n </Item>\n);\n","import { useId } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\nimport type { Item } from '@radix-ui/react-radio-group';\n\nimport { cn } from '../../utils';\nimport { FieldBox } from '../FieldBox';\nimport { useArgoDesign } from '../ThemeProvider/context';\nimport type { Props as TooltipProps } from '../Tooltip';\nimport { Tooltip } from '../Tooltip';\n\nimport { useRadioGroupContext } from './context';\nimport { Radio } from './Radio';\nimport { RadioGroupItemButton } from './RadioGroupItemButton';\n\ntype ItemProps = Omit<ComponentProps<typeof Item>, 'asChild' | 'value'>;\n\ntype Props<T extends string = string> = ItemProps & {\n value: T;\n tooltip?: ReactNode;\n tooltipVariant?: TooltipProps['variant'];\n tooltipPlacement?: TooltipProps['placement'];\n description?: ReactNode;\n};\n\nexport const RadioGroupItem = <T extends string = string>({\n children,\n className,\n tooltip,\n tooltipVariant,\n tooltipPlacement,\n description,\n ...props\n}: Props<T>) => {\n const { variant } = useRadioGroupContext();\n const styleVariant = useArgoDesign() ? 'argo' : 'default';\n const id = useId();\n\n const item = (() => {\n if (variant === 'button')\n return (\n <RadioGroupItemButton styleVariant={styleVariant} {...props} className={className}>\n {children}\n </RadioGroupItemButton>\n );\n\n return (\n <FieldBox\n variant={variant === 'radio-block' ? 'boxed' : 'default'}\n htmlFor={id}\n control={<Radio styleVariant={styleVariant} {...props} id={id} />}\n className={cn(variant === 'radio-block' && 'tw:flex-1', className)}\n >\n <FieldBox.Title>{children}</FieldBox.Title>\n {description && <FieldBox.Description>{description}</FieldBox.Description>}\n </FieldBox>\n );\n })();\n\n if (!tooltip) {\n return item;\n }\n\n return (\n <Tooltip tooltip={tooltip} variant={tooltipVariant} placement={tooltipPlacement} triggerAsChild>\n {item}\n </Tooltip>\n );\n};\n","import { Separator } from '../Separator';\n\nimport { useRadioGroupContext } from './context';\n\nexport const RadioGroupSeparator = () => {\n const { orientation } = useRadioGroupContext();\n const invertedOrientation = orientation === 'horizontal' ? 'vertical' : 'horizontal';\n const size = orientation === 'horizontal' ? '1/2' : 'full';\n const className = orientation === 'horizontal' ? 'tw:mx-2' : 'tw:my-2';\n\n return <Separator orientation={invertedOrientation} size={size} className={className} />;\n};\n","import type { ComponentProps } from 'react';\nimport * as RRadioGroup from '@radix-ui/react-radio-group';\nimport { cva } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nimport type { Orientation, Variant } from './context';\nimport { RadioGroupProvider } from './context';\nimport { RadioGroupItem } from './RadioGroupItem';\nimport { RadioGroupSeparator } from './RadioGroupSeparator';\n\nconst radioGroupVariants = cva(['tw:flex'], {\n variants: {\n orientation: {\n horizontal: ['tw:gap-2'],\n vertical: ['tw:flex-col', 'tw:gap-3'],\n },\n variant: {\n button: [],\n radio: [],\n 'radio-block': ['tw:w-full'],\n },\n },\n});\n\ntype Props<Value> = {\n variant?: Variant;\n orientation?: Orientation;\n onValueChange?: (value: Value) => void;\n value?: Value | null;\n defaultValue?: Value | null;\n} & Omit<\n ComponentProps<typeof RRadioGroup.Root>,\n 'asChild' | 'orientation' | 'onValueChange' | 'onChange' | 'value' | 'defaultValue'\n>;\n\nexport const RadioGroup = <Value extends string = string>({\n variant = 'radio',\n className,\n disabled = false,\n orientation = 'horizontal',\n onValueChange,\n children,\n value,\n defaultValue,\n ...props\n}: Props<Value>) => (\n <RRadioGroup.Root\n {...props}\n onValueChange={onValueChange}\n orientation={orientation}\n className={cn(radioGroupVariants({ orientation, variant, className }))}\n disabled={disabled}\n value={value ?? void 0}\n defaultValue={defaultValue ?? void 0}\n >\n <RadioGroupProvider value={{ variant, orientation }}>{children}</RadioGroupProvider>\n </RRadioGroup.Root>\n);\n\nRadioGroup.Item = RadioGroupItem;\nRadioGroup.Separator = RadioGroupSeparator;\n"],"mappings":";;;;;;;;;;;;;AAKA,MAAM,oBAAoB,cAGvB;CACD,SAAS;CACT,aAAa;AACf,CAAC;AAED,MAAa,qBAAqB;AAElC,MAAa,6BAA6B,IAAI,iBAAiB;;;ACJ/D,MAAa,SAAS,EAAE,WAAW,eAAe,WAAW,GAAG,YAC9D,oBAAC,MAAD;CACE,GAAI;CACJ,WAAW,GACT,oBAAoB,EAAE,SAAS,aAAa,CAAC,GAC7C,cAAc,EAAE,SAAS,aAAa,CAAC,GACvC,SACF;CAEA,UAAA,oBAAC,WAAD;EAAW,WAAW,GAAG,WAAW,mBAAmB,mBAAmB;EAGxE,UAAA,oBAAC,QAAD,EAAQ,WAAW,uBAAuB,EAAE,SAAS,aAAa,CAAC,EAAI,CAAA;CAC9D,CAAA;AACP,CAAA;;;ACfR,MAAa,wBAAwB,EACnC,KACA,WACA,UACA,eAAe,WACf,GAAG,YAEH,oBAAC,MAAD;CACO;CACL,GAAI;CACJ,WAAW,GAAG,wBAAwB,EAAE,SAAS,aAAa,CAAC,GAAG,SAAS;CAE1E;AACG,CAAA;;;ACCR,MAAa,kBAA6C,EACxD,UACA,WACA,SACA,gBACA,kBACA,aACA,GAAG,YACW;CACd,MAAM,EAAE,YAAY,qBAAqB;CACzC,MAAM,eAAe,cAAc,IAAI,SAAS;CAChD,MAAM,KAAK,MAAM;CAEjB,MAAM,cAAc;EAClB,IAAI,YAAY,UACd,OACE,oBAAC,sBAAD;GAAoC;GAAc,GAAI;GAAkB;GACrE;EACmB,CAAA;EAG1B,OACE,qBAAC,UAAD;GACE,SAAS,YAAY,gBAAgB,UAAU;GAC/C,SAAS;GACT,SAAS,oBAAC,OAAD;IAAqB;IAAc,GAAI;IAAW;GAAK,CAAA;GAChE,WAAW,GAAG,YAAY,iBAAiB,aAAa,SAAS;GAJnE,UAAA,CAME,oBAAC,SAAS,OAAV,EAAiB,SAAyB,CAAA,GACzC,eAAe,oBAAC,SAAS,aAAV,EAAA,UAAuB,YAAkC,CAAA,CACjE;;CAEd,EAAA,CAAG;CAEH,IAAI,CAAC,SACH,OAAO;CAGT,OACE,oBAAC,SAAD;EAAkB;EAAS,SAAS;EAAgB,WAAW;EAAkB,gBAAA;EAC9E,UAAA;CACM,CAAA;AAEb;;;AC/DA,MAAa,4BAA4B;CACvC,MAAM,EAAE,gBAAgB,qBAAqB;CAK7C,OAAO,oBAAC,WAAD;EAAW,aAJU,gBAAgB,eAAe,aAAa;EAIpB,MAHvC,gBAAgB,eAAe,QAAQ;EAGY,WAF9C,gBAAgB,eAAe,YAAY;CAE0B,CAAA;AACzF;;;ACAA,MAAM,qBAAqB,IAAI,CAAC,SAAS,GAAG,EAC1C,UAAU;CACR,aAAa;EACX,YAAY,CAAC,UAAU;EACvB,UAAU,CAAC,eAAe,UAAU;CACtC;CACA,SAAS;EACP,QAAQ,CAAC;EACT,OAAO,CAAC;EACR,eAAe,CAAC,WAAW;CAC7B;AACF,EACF,CAAC;AAaD,MAAa,cAA6C,EACxD,UAAU,SACV,WACA,WAAW,OACX,cAAc,cACd,eACA,UACA,OACA,cACA,GAAG,YAEH,oBAAC,YAAY,MAAb;CACE,GAAI;CACW;CACF;CACb,WAAW,GAAG,mBAAmB;EAAE;EAAa;EAAS;CAAU,CAAC,CAAC;CAC3D;CACV,OAAO,SAAS,KAAK;CACrB,cAAc,gBAAgB,KAAK;CAEnC,UAAA,oBAAC,oBAAD;EAAoB,OAAO;GAAE;GAAS;EAAY;EAAI;CAA6B,CAAA;AACnE,CAAA;AAGpB,WAAW,OAAO;AAClB,WAAW,YAAY"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { debounce } from "./utils-Bd28bWgm.js";
|
|
2
2
|
import { Search, X } from "./icons-wcA70iQx.js";
|
|
3
|
-
import { InputGroup } from "./InputGroup-
|
|
3
|
+
import { InputGroup } from "./InputGroup-CrlMRz4X.js";
|
|
4
4
|
import { useEffect, useMemo, useRef, useState } from "react";
|
|
5
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
6
|
//#region src/blocks/SearchInput/SearchInput.tsx
|
|
@@ -94,4 +94,4 @@ const SearchInput = ({ ref, state, variant, focusVariant, sizing, className, val
|
|
|
94
94
|
//#endregion
|
|
95
95
|
export { SearchInput };
|
|
96
96
|
|
|
97
|
-
//# sourceMappingURL=SearchInput-
|
|
97
|
+
//# sourceMappingURL=SearchInput-D3qMkHaW.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchInput-
|
|
1
|
+
{"version":3,"file":"SearchInput-D3qMkHaW.js","names":[],"sources":["../src/blocks/SearchInput/SearchInput.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react';\nimport type { ChangeEventHandler, ComponentProps, FocusEventHandler } from 'react';\n\nimport { InputGroup } from '../../components/InputGroup';\nimport { Search, X } from '../../icons';\nimport { debounce } from '../../utils';\n\ntype InputGroupProps = Pick<\n ComponentProps<typeof InputGroup>,\n 'variant' | 'focusVariant' | 'state' | 'sizing'\n>;\n\ntype InputGroupInputProps = Omit<ComponentProps<typeof InputGroup.Input>, 'value' | 'defaultValue'>;\n\n/**\n * - `onValueChange` is debounced by default (300ms).\n * - `value={null}` / `undefined` is uncontrolled (falls back to `defaultValue`, else empty).\n * - `value={\"\"}` is controlled-empty.\n */\ntype Props = InputGroupProps &\n InputGroupInputProps & {\n value?: string | null;\n defaultValue?: string | null;\n /** Debounced; fires synchronously on clear and with `disableDebounce`. Use `onChange` per keystroke. */\n onValueChange?: (value: string) => void;\n /** Called with the value on blur. */\n onValueBlur?: (value: string) => void;\n onClear?: () => void;\n /** Shows the clear (x) button while the value is non-empty. */\n allowClear?: boolean;\n /** `onValueChange` fires on every keystroke. */\n disableDebounce?: boolean;\n /** In ms, default 300; ignored with `disableDebounce`. */\n debounceDelay?: number;\n };\n\n/**\n * Debounced search input with a search icon and optional clear button.\n *\n * - Use for list / table search and free-text filters, e.g. in `PageToolbar.Search`.\n * - Not for plain text (`TextInput`) or picking from a known list (`Combobox`).\n *\n * @see RECIPES.md#filter-toolbar\n */\nexport const SearchInput = ({\n ref,\n\n // group props\n state,\n variant,\n focusVariant,\n sizing,\n className,\n\n // own props\n value: valueProp,\n defaultValue,\n onValueChange,\n onValueBlur,\n onChange,\n onBlur,\n onClear,\n allowClear = false,\n disableDebounce = false,\n debounceDelay = 300,\n\n // input props\n disabled,\n readOnly,\n ...restInputProps\n}: Props) => {\n const [internalValue, setInternalValue] = useState<string>(\n valueProp != null ? valueProp : (defaultValue ?? ''),\n );\n\n // A pending debounced call; the controlled-value sync skips while set so typed characters survive.\n const debounceInFlightRef = useRef(false);\n const cancelRef = useRef<() => void>(() => {});\n\n const debouncedOnValueChange = useMemo(() => {\n if (!onValueChange || disableDebounce) {\n cancelRef.current = () => {};\n return onValueChange;\n }\n const d = debounce((val: string) => {\n debounceInFlightRef.current = false;\n onValueChange(val);\n }, debounceDelay);\n cancelRef.current = d.cancel;\n return d;\n }, [onValueChange, disableDebounce, debounceDelay]);\n\n useEffect(() => {\n return () => cancelRef.current();\n }, [debouncedOnValueChange]);\n\n // Skipped while a debounced call is in flight, so the input doesn't snap back mid-typing.\n useEffect(() => {\n if (valueProp == null) return;\n if (debounceInFlightRef.current) return;\n setInternalValue(valueProp);\n }, [valueProp]);\n\n const canClear = allowClear && !!internalValue && !disabled && !readOnly;\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const val = event.target.value;\n setInternalValue(val);\n if (!disableDebounce && debouncedOnValueChange) debounceInFlightRef.current = true;\n debouncedOnValueChange?.(val);\n onChange?.(event);\n };\n\n const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n onValueBlur?.(event.target.value);\n onBlur?.(event);\n };\n\n const handleClear = () => {\n cancelRef.current();\n debounceInFlightRef.current = false;\n setInternalValue('');\n onValueChange?.('');\n onClear?.();\n };\n\n return (\n <InputGroup\n state={state}\n variant={variant}\n sizing={sizing}\n focusVariant={focusVariant}\n className={className}\n >\n <InputGroup.Addon align=\"inline-start\">\n <Search className=\"tw:size-4 tw:shrink-0 tw:text-muted-foreground\" />\n </InputGroup.Addon>\n\n <InputGroup.Input\n {...restInputProps}\n ref={ref}\n value={internalValue}\n onChange={handleChange}\n onBlur={handleBlur}\n disabled={disabled}\n readOnly={readOnly}\n />\n\n {canClear && (\n <InputGroup.Addon align=\"inline-end\">\n <InputGroup.Button\n aria-label=\"Clear search\"\n onMouseDown={(event) => event.preventDefault()}\n onClick={handleClear}\n >\n <X className=\"tw:size-4\" />\n </InputGroup.Button>\n </InputGroup.Addon>\n )}\n </InputGroup>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;AA4CA,MAAa,eAAe,EAC1B,KAGA,OACA,SACA,cACA,QACA,WAGA,OAAO,WACP,cACA,eACA,aACA,UACA,QACA,SACA,aAAa,OACb,kBAAkB,OAClB,gBAAgB,KAGhB,UACA,UACA,GAAG,qBACQ;CACX,MAAM,CAAC,eAAe,oBAAoB,SACxC,aAAa,OAAO,YAAa,gBAAgB,EACnD;CAGA,MAAM,sBAAsB,OAAO,KAAK;CACxC,MAAM,YAAY,aAAyB,CAAC,CAAC;CAE7C,MAAM,yBAAyB,cAAc;EAC3C,IAAI,CAAC,iBAAiB,iBAAiB;GACrC,UAAU,gBAAgB,CAAC;GAC3B,OAAO;EACT;EACA,MAAM,IAAI,UAAU,QAAgB;GAClC,oBAAoB,UAAU;GAC9B,cAAc,GAAG;EACnB,GAAG,aAAa;EAChB,UAAU,UAAU,EAAE;EACtB,OAAO;CACT,GAAG;EAAC;EAAe;EAAiB;CAAa,CAAC;CAElD,gBAAgB;EACd,aAAa,UAAU,QAAQ;CACjC,GAAG,CAAC,sBAAsB,CAAC;CAG3B,gBAAgB;EACd,IAAI,aAAa,MAAM;EACvB,IAAI,oBAAoB,SAAS;EACjC,iBAAiB,SAAS;CAC5B,GAAG,CAAC,SAAS,CAAC;CAEd,MAAM,WAAW,cAAc,CAAC,CAAC,iBAAiB,CAAC,YAAY,CAAC;CAEhE,MAAM,gBAAsD,UAAU;EACpE,MAAM,MAAM,MAAM,OAAO;EACzB,iBAAiB,GAAG;EACpB,IAAI,CAAC,mBAAmB,wBAAwB,oBAAoB,UAAU;EAC9E,yBAAyB,GAAG;EAC5B,WAAW,KAAK;CAClB;CAEA,MAAM,cAAmD,UAAU;EACjE,cAAc,MAAM,OAAO,KAAK;EAChC,SAAS,KAAK;CAChB;CAEA,MAAM,oBAAoB;EACxB,UAAU,QAAQ;EAClB,oBAAoB,UAAU;EAC9B,iBAAiB,EAAE;EACnB,gBAAgB,EAAE;EAClB,UAAU;CACZ;CAEA,OACE,qBAAC,YAAD;EACS;EACE;EACD;EACM;EACH;EALb,UAAA;GAOE,oBAAC,WAAW,OAAZ;IAAkB,OAAM;IACtB,UAAA,oBAAC,QAAD,EAAQ,WAAU,iDAAkD,CAAA;GACpD,CAAA;GAElB,oBAAC,WAAW,OAAZ;IACE,GAAI;IACC;IACL,OAAO;IACP,UAAU;IACV,QAAQ;IACE;IACA;GACX,CAAA;GAEA,YACC,oBAAC,WAAW,OAAZ;IAAkB,OAAM;IACtB,UAAA,oBAAC,WAAW,QAAZ;KACE,cAAW;KACX,cAAc,UAAU,MAAM,eAAe;KAC7C,SAAS;KAET,UAAA,oBAAC,GAAD,EAAG,WAAU,YAAa,CAAA;IACT,CAAA;GACH,CAAA;EAEV;;AAEhB"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { cn } from "./classNames-BzrkDnOD.js";
|
|
2
2
|
import { noop } from "./utils-Bd28bWgm.js";
|
|
3
3
|
import { ChevronDown } from "./icons-wcA70iQx.js";
|
|
4
|
-
import { Button } from "./Button-
|
|
5
|
-
import { DropdownMenu } from "./DropdownMenu-
|
|
6
|
-
import { Badge } from "./Badge-
|
|
4
|
+
import { Button } from "./Button-B21oVcPU.js";
|
|
5
|
+
import { DropdownMenu } from "./DropdownMenu-C5FLPkvR.js";
|
|
6
|
+
import { Badge } from "./Badge-Dz0cj6rj.js";
|
|
7
7
|
import { Collapsible } from "./Collapsible-BQXWEOBC.js";
|
|
8
8
|
import { useState } from "react";
|
|
9
9
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -241,4 +241,4 @@ const SectionNav = ({ groups, activeId, renderItem, showDescriptions = false, la
|
|
|
241
241
|
//#endregion
|
|
242
242
|
export { SectionNav };
|
|
243
243
|
|
|
244
|
-
//# sourceMappingURL=SectionNav-
|
|
244
|
+
//# sourceMappingURL=SectionNav-BTBiitiQ.js.map
|