@keboola/design 11.0.1 → 11.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS.md +16 -1
- package/CHANGELOG.md +2138 -0
- package/COMPONENT-API.md +40 -1
- package/dist/{AIKit-Dre37SJr.js → AIKit-DiS0CVOW.js} +6 -6
- package/dist/{AIKit-Dre37SJr.js.map → AIKit-DiS0CVOW.js.map} +1 -1
- package/dist/{AlertModal-BUC4Es8o.js → AlertModal-Dp_XuJBW.js} +3 -6
- package/dist/{AlertModal-BUC4Es8o.js.map → AlertModal-Dp_XuJBW.js.map} +1 -1
- package/dist/{BrandEditor-B8o9zdZO.js → BrandEditor-DyzgfVkl.js} +6 -6
- package/dist/{BrandEditor-B8o9zdZO.js.map → BrandEditor-DyzgfVkl.js.map} +1 -1
- package/dist/{Breadcrumb-DJp7WwSv.js → Breadcrumb-Frst8MTA.js} +3 -3
- package/dist/{Breadcrumb-DJp7WwSv.js.map → Breadcrumb-Frst8MTA.js.map} +1 -1
- package/dist/{Button-nzmDNS2q.js → Button-6xBX0nNl.js} +15 -15
- package/dist/Button-6xBX0nNl.js.map +1 -0
- package/dist/{ClipboardButton-ez5V3fkk.js → ClipboardButton-ClcluT0C.js} +2 -2
- package/dist/{ClipboardButton-ez5V3fkk.js.map → ClipboardButton-ClcluT0C.js.map} +1 -1
- package/dist/{CodeEditor-BfQJfbhL.js → CodeEditor-DyaN-Ij2.js} +58 -10
- package/dist/CodeEditor-DyaN-Ij2.js.map +1 -0
- package/dist/{ColorInput-Dx8Dsv7Y.js → ColorInput-B8z4j4Y_.js} +2 -2
- package/dist/{ColorInput-Dx8Dsv7Y.js.map → ColorInput-B8z4j4Y_.js.map} +1 -1
- package/dist/{ColorModeSwitch-CCqj7tjE.js → ColorModeSwitch-dZFZyqy1.js} +3 -3
- package/dist/{ColorModeSwitch-CCqj7tjE.js.map → ColorModeSwitch-dZFZyqy1.js.map} +1 -1
- package/dist/{Combobox-c_xBjf0P.js → Combobox-Dgm6Z4ib.js} +9 -5
- package/dist/Combobox-Dgm6Z4ib.js.map +1 -0
- package/dist/{Command-CQ_bQsJp.js → Command-C0aZfVTq.js} +2 -2
- package/dist/{Command-CQ_bQsJp.js.map → Command-C0aZfVTq.js.map} +1 -1
- package/dist/{DateInput-CMD3dY-T.js → DateInput-B3UdzRfW.js} +3 -3
- package/dist/{DateInput-CMD3dY-T.js.map → DateInput-B3UdzRfW.js.map} +1 -1
- package/dist/{DatePicker-BbFbmsGl.js → DatePicker-Dw3DpbUh.js} +2 -2
- package/dist/{DatePicker-BbFbmsGl.js.map → DatePicker-Dw3DpbUh.js.map} +1 -1
- package/dist/{DateRangeInput-D3BhiKyk.js → DateRangeInput-DTuySEiq.js} +3 -3
- package/dist/{DateRangeInput-D3BhiKyk.js.map → DateRangeInput-DTuySEiq.js.map} +1 -1
- package/dist/{DateRangePicker-BiUgtt_M.js → DateRangePicker-DCmMHg4s.js} +4 -4
- package/dist/{DateRangePicker-BiUgtt_M.js.map → DateRangePicker-DCmMHg4s.js.map} +1 -1
- package/dist/{DropdownMenu-B6ZbYvaM.js → DropdownMenu-t90tVw6l.js} +8 -8
- package/dist/DropdownMenu-t90tVw6l.js.map +1 -0
- package/dist/FieldItem-CAPj9lj3.d.ts +111 -0
- package/dist/FieldItem-D-h1NeBo.js +108 -0
- package/dist/FieldItem-D-h1NeBo.js.map +1 -0
- package/dist/{FileUpload-sXRv7JiY.js → FileUpload-BRv0TaZk.js} +2 -2
- package/dist/{FileUpload-sXRv7JiY.js.map → FileUpload-BRv0TaZk.js.map} +1 -1
- package/dist/{Form-BDCef6O9.js → Form-DHvcFoEi.js} +18 -78
- package/dist/{Form-BDCef6O9.js.map → Form-DHvcFoEi.js.map} +1 -1
- package/dist/{FormGroup-S9mPNHKH.js → FormGroup-C41n65cE.js} +7 -7
- package/dist/FormGroup-C41n65cE.js.map +1 -0
- package/dist/{FullScreenModal-CJa2VkJ2.js → FullScreenModal-Cb3PGgh4.js} +2 -2
- package/dist/{FullScreenModal-CJa2VkJ2.js.map → FullScreenModal-Cb3PGgh4.js.map} +1 -1
- package/dist/{InputGroup-BJWsI35s.js → InputGroup-CdTq8H7c.js} +2 -2
- package/dist/{InputGroup-BJWsI35s.js.map → InputGroup-CdTq8H7c.js.map} +1 -1
- package/dist/{MermaidDiagram-BB06gymm.js → MermaidDiagram-ChL3WIQT.js} +2 -2
- package/dist/{MermaidDiagram-BB06gymm.js.map → MermaidDiagram-ChL3WIQT.js.map} +1 -1
- package/dist/{Modal-BA5Wc3sx.js → Modal-wqG8nJiK.js} +2 -2
- package/dist/{Modal-BA5Wc3sx.js.map → Modal-wqG8nJiK.js.map} +1 -1
- package/dist/{MultiActionButtonGroup-CiBHxsSk.js → MultiActionButtonGroup-BiIIubiL.js} +2 -2
- package/dist/{MultiActionButtonGroup-CiBHxsSk.js.map → MultiActionButtonGroup-BiIIubiL.js.map} +1 -1
- package/dist/{Navbar-t16usFZQ.js → Navbar-BfaPeLUL.js} +5 -2
- package/dist/Navbar-BfaPeLUL.js.map +1 -0
- package/dist/{PageToolbar-0_1OBzaZ.js → PageToolbar-OQg3mPF-.js} +4 -4
- package/dist/PageToolbar-OQg3mPF-.js.map +1 -0
- package/dist/{Pagination-CM_Rszz-.js → Pagination-Cjfda8KG.js} +2 -2
- package/dist/{Pagination-CM_Rszz-.js.map → Pagination-Cjfda8KG.js.map} +1 -1
- package/dist/{Popconfirm-BGe1jLov.js → Popconfirm-D7_vfxFd.js} +4 -7
- package/dist/{Popconfirm-BGe1jLov.js.map → Popconfirm-D7_vfxFd.js.map} +1 -1
- package/dist/{Popover-Ca0V6AD1.js → Popover-CzeHjvrB.js} +6 -13
- package/dist/Popover-CzeHjvrB.js.map +1 -0
- package/dist/{SearchInput-D2fcOv7E.js → SearchInput-C7dF_Ir-.js} +2 -2
- package/dist/{SearchInput-D2fcOv7E.js.map → SearchInput-C7dF_Ir-.js.map} +1 -1
- package/dist/{SectionNav--7bw2b6u.js → SectionNav-8NoTOKO8.js} +3 -3
- package/dist/{SectionNav--7bw2b6u.js.map → SectionNav-8NoTOKO8.js.map} +1 -1
- package/dist/{Select-4YX38G5h.js → Select-Is0VkePH.js} +2 -2
- package/dist/{Select-4YX38G5h.js.map → Select-Is0VkePH.js.map} +1 -1
- package/dist/{Sheet-BQrX8-h5.js → Sheet-Dw9BDvjI.js} +2 -2
- package/dist/{Sheet-BQrX8-h5.js.map → Sheet-Dw9BDvjI.js.map} +1 -1
- package/dist/{Sidebar-ROaR_AqC.js → Sidebar-Dcb4rinA.js} +2 -2
- package/dist/{Sidebar-ROaR_AqC.js.map → Sidebar-Dcb4rinA.js.map} +1 -1
- package/dist/{Slider-Da_3mS5v.js → Slider-BOPfMOMm.js} +2 -2
- package/dist/{Slider-Da_3mS5v.js.map → Slider-BOPfMOMm.js.map} +1 -1
- package/dist/{Tabs-EAihyqCt.js → Tabs-UMQuDoW8.js} +2 -2
- package/dist/{Tabs-EAihyqCt.js.map → Tabs-UMQuDoW8.js.map} +1 -1
- package/dist/{TextInput-BGed-V13.js → TextInput-CMuN1WfY.js} +2 -2
- package/dist/{TextInput-BGed-V13.js.map → TextInput-CMuN1WfY.js.map} +1 -1
- package/dist/{TimePicker-B_NegL-7.js → TimePicker-D9zktB8A.js} +2 -2
- package/dist/{TimePicker-B_NegL-7.js.map → TimePicker-D9zktB8A.js.map} +1 -1
- package/dist/{ZoomableSvg-DG9PnAm8.js → ZoomableSvg-CZEu6sAq.js} +3 -3
- package/dist/{ZoomableSvg-DG9PnAm8.js.map → ZoomableSvg-CZEu6sAq.js.map} +1 -1
- package/dist/editors.d.ts +71 -9
- package/dist/editors.js +58 -3
- package/dist/editors.js.map +1 -1
- package/dist/index.d.ts +314 -312
- package/dist/index.js +41 -40
- package/dist/internal/blocks/AIKit.js +1 -1
- package/dist/internal/blocks/BrandEditor.js +1 -1
- 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/DateInput.js +1 -1
- package/dist/internal/blocks/DateRangeInput.js +1 -1
- package/dist/internal/blocks/ExportMenu.js +2 -2
- package/dist/internal/blocks/Form/connectors/MultiComboboxField.js +56 -0
- package/dist/internal/blocks/Form/connectors/MultiComboboxField.js.map +1 -0
- 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 +8 -3
- 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/TextInput.js +1 -1
- package/dist/internal/blocks/Textarea.js +1 -1
- package/dist/internal/blocks/TimeInput.js +2 -2
- package/dist/internal/components/AlertModal.js +1 -1
- package/dist/internal/components/Breadcrumb.js +1 -1
- package/dist/internal/components/Button.js +1 -1
- package/dist/internal/components/Combobox.js +1 -1
- package/dist/internal/components/DatePicker.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/Navbar.js +1 -1
- package/dist/internal/components/Pagination.js +1 -1
- package/dist/internal/components/Popconfirm.js +1 -1
- package/dist/internal/components/Popover.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/TimePicker.js +1 -1
- package/dist/internal/components/ZoomableSvg.js +1 -1
- package/dist/markdown-editor.js +5 -5
- package/dist/mermaid.js +1 -1
- package/dist/rjsf.d.ts +13 -1
- package/dist/rjsf.js +233 -173
- package/dist/rjsf.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +7 -6
- package/dist/Button-nzmDNS2q.js.map +0 -1
- package/dist/CodeEditor-BfQJfbhL.js.map +0 -1
- package/dist/Combobox-c_xBjf0P.js.map +0 -1
- package/dist/DropdownMenu-B6ZbYvaM.js.map +0 -1
- package/dist/FormGroup-S9mPNHKH.js.map +0 -1
- package/dist/Navbar-t16usFZQ.js.map +0 -1
- package/dist/PageToolbar-0_1OBzaZ.js.map +0 -1
- package/dist/Popover-Ca0V6AD1.js.map +0 -1
- package/dist/constants-D6JcsD4_.d.ts +0 -41
package/dist/index.js
CHANGED
|
@@ -2,64 +2,65 @@ import { cn } from "./classNames-BzrkDnOD.js";
|
|
|
2
2
|
import { Tooltip, TooltipProvider, copyToClipboard, isMac } from "./utils-D0c5VAyF.js";
|
|
3
3
|
import { ArgoDesignContext, DEFAULT_BRAND_ID, DEFAULT_COLOR_SCHEME, useArgoDesign, useTheme } from "./context-KxxeMHbR.js";
|
|
4
4
|
import { mergeRefs } from "./internal/utils/mergeRefs.js";
|
|
5
|
-
import { Button, ButtonInline, argoVariants } from "./Button-
|
|
5
|
+
import { Button, ButtonInline, argoVariants } from "./Button-6xBX0nNl.js";
|
|
6
6
|
import { ButtonGroup } from "./internal/components/ButtonGroup.js";
|
|
7
|
-
import { DropdownMenu } from "./DropdownMenu-
|
|
7
|
+
import { DropdownMenu } from "./DropdownMenu-t90tVw6l.js";
|
|
8
8
|
import { ScrollArea, ScrollBar } from "./internal/components/ScrollArea.js";
|
|
9
9
|
import { SplitButton } from "./internal/blocks/SplitButton.js";
|
|
10
|
-
import { MultiActionButtonGroup } from "./MultiActionButtonGroup-
|
|
10
|
+
import { MultiActionButtonGroup } from "./MultiActionButtonGroup-BiIIubiL.js";
|
|
11
11
|
import { Toggle } from "./internal/components/Toggle.js";
|
|
12
12
|
import { ToggleGroup } from "./ToggleGroup-Cy_10Mvu.js";
|
|
13
13
|
import { Clipboard } from "./Clipboard-CBJZiviP.js";
|
|
14
|
-
import { ClipboardButton, ClipboardInline } from "./ClipboardButton-
|
|
14
|
+
import { ClipboardButton, ClipboardInline } from "./ClipboardButton-ClcluT0C.js";
|
|
15
15
|
import { ExportMenu } from "./internal/blocks/ExportMenu.js";
|
|
16
16
|
import { CopyField } from "./CopyField-BJ96zvXs.js";
|
|
17
17
|
import { Label } from "./internal/components/Label.js";
|
|
18
18
|
import { MicrosoftButton } from "./internal/blocks/MicrosoftButton.js";
|
|
19
19
|
import { GoogleButton } from "./internal/blocks/GoogleButton.js";
|
|
20
20
|
import { Link } from "./internal/components/Link.js";
|
|
21
|
-
import { AlertModal } from "./AlertModal-
|
|
22
|
-
import { Modal } from "./Modal-
|
|
21
|
+
import { AlertModal } from "./AlertModal-Dp_XuJBW.js";
|
|
22
|
+
import { Modal } from "./Modal-wqG8nJiK.js";
|
|
23
23
|
import { Separator } from "./internal/components/Separator.js";
|
|
24
|
-
import { FullScreenModal, FullScreenModalBody, FullScreenModalHeader } from "./FullScreenModal-
|
|
24
|
+
import { FullScreenModal, FullScreenModalBody, FullScreenModalHeader } from "./FullScreenModal-Cb3PGgh4.js";
|
|
25
25
|
import { Truncated } from "./internal/components/Truncated.js";
|
|
26
|
-
import { Sheet } from "./Sheet-
|
|
27
|
-
import { Popover } from "./Popover-
|
|
28
|
-
import { Popconfirm } from "./Popconfirm-
|
|
26
|
+
import { Sheet } from "./Sheet-Dw9BDvjI.js";
|
|
27
|
+
import { Popover } from "./Popover-CzeHjvrB.js";
|
|
28
|
+
import { Popconfirm } from "./Popconfirm-D7_vfxFd.js";
|
|
29
29
|
import { HoverCard } from "./HoverCard-WfDkLK1s.js";
|
|
30
|
-
import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "./Command-
|
|
31
|
-
import { InputGroup } from "./InputGroup-
|
|
32
|
-
import { TextInput } from "./TextInput-
|
|
30
|
+
import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "./Command-C0aZfVTq.js";
|
|
31
|
+
import { InputGroup } from "./InputGroup-CdTq8H7c.js";
|
|
32
|
+
import { TextInput } from "./TextInput-CMuN1WfY.js";
|
|
33
33
|
import { SpotlightBackdrop, useTargetRect } from "./internal/components/SpotlightBackdrop.js";
|
|
34
34
|
import { Calendar } from "./Calendar-cG5NIJ4O.js";
|
|
35
|
-
import { DatePicker } from "./DatePicker-
|
|
36
|
-
import { TimePicker } from "./TimePicker-
|
|
37
|
-
import { DateRangePicker } from "./DateRangePicker-
|
|
35
|
+
import { DatePicker } from "./DatePicker-Dw3DpbUh.js";
|
|
36
|
+
import { TimePicker } from "./TimePicker-D9zktB8A.js";
|
|
37
|
+
import { DateRangePicker } from "./DateRangePicker-DCmMHg4s.js";
|
|
38
38
|
import { Switch } from "./Switch-CX2A0v50.js";
|
|
39
39
|
import { RadioGroup } from "./RadioGroup-sIveSsNa.js";
|
|
40
|
-
import { Slider } from "./Slider-
|
|
40
|
+
import { Slider } from "./Slider-BOPfMOMm.js";
|
|
41
41
|
import { Search, SearchForm } from "./Search-3UiqNZRj.js";
|
|
42
|
-
import { Select } from "./Select-
|
|
42
|
+
import { Select } from "./Select-Is0VkePH.js";
|
|
43
43
|
import { Checkbox } from "./Checkbox-GJ8-srt4.js";
|
|
44
44
|
import { Badge } from "./Badge-Ch26CXoP.js";
|
|
45
|
-
import { Combobox } from "./Combobox-
|
|
45
|
+
import { Combobox } from "./Combobox-Dgm6Z4ib.js";
|
|
46
46
|
import { MultiCombobox } from "./internal/blocks/MultiCombobox.js";
|
|
47
|
+
import { FormGroup } from "./FormGroup-C41n65cE.js";
|
|
48
|
+
import { ColorInput } from "./ColorInput-B8z4j4Y_.js";
|
|
49
|
+
import { HelpBlock } from "./internal/components/HelpBlock.js";
|
|
50
|
+
import { NumberInput } from "./internal/blocks/NumberInput.js";
|
|
47
51
|
import { Textarea } from "./internal/blocks/Textarea.js";
|
|
52
|
+
import { MultiComboboxField } from "./internal/blocks/Form/connectors/MultiComboboxField.js";
|
|
48
53
|
import { AutoSaveTextarea } from "./AutoSaveTextarea-BeuWuszr.js";
|
|
49
|
-
import {
|
|
50
|
-
import {
|
|
51
|
-
import { DateInput } from "./DateInput-CMD3dY-T.js";
|
|
52
|
-
import { NumberInput } from "./internal/blocks/NumberInput.js";
|
|
54
|
+
import { ColorModeSwitch } from "./ColorModeSwitch-dZFZyqy1.js";
|
|
55
|
+
import { DateInput } from "./DateInput-B3UdzRfW.js";
|
|
53
56
|
import { PasswordInput } from "./internal/blocks/PasswordInput.js";
|
|
54
57
|
import { TimeInput } from "./internal/blocks/TimeInput.js";
|
|
55
|
-
import { DateRangeInput } from "./DateRangeInput-
|
|
58
|
+
import { DateRangeInput } from "./DateRangeInput-DTuySEiq.js";
|
|
56
59
|
import { OtpInput, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS } from "./OtpInput-CbbymqYs.js";
|
|
57
|
-
import { SearchInput } from "./SearchInput-
|
|
60
|
+
import { SearchInput } from "./SearchInput-C7dF_Ir-.js";
|
|
58
61
|
import { SearchInputWithNavigation } from "./internal/blocks/SearchInputWithNavigation.js";
|
|
59
|
-
import { FileUpload, useFileDropTarget, useFileUploadRejections } from "./FileUpload-
|
|
60
|
-
import {
|
|
61
|
-
import { HelpBlock } from "./internal/components/HelpBlock.js";
|
|
62
|
-
import { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, UsageStats, UsageStatsRing } from "./AIKit-Dre37SJr.js";
|
|
62
|
+
import { FileUpload, useFileDropTarget, useFileUploadRejections } from "./FileUpload-BRv0TaZk.js";
|
|
63
|
+
import { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, UsageStats, UsageStatsRing } from "./AIKit-DiS0CVOW.js";
|
|
63
64
|
import { Table, tableAriaSort } from "./Table-CvYuTuNU.js";
|
|
64
65
|
import { Skeleton } from "./internal/components/Skeleton/Skeleton.js";
|
|
65
66
|
import { Avatar } from "./internal/components/Avatar.js";
|
|
@@ -81,21 +82,21 @@ import { ThemeProvider, brandSchema, exampleCustomer, keboola, keboolaLegacySide
|
|
|
81
82
|
import { AppShell } from "./AppShell-B5GQN6Zs.js";
|
|
82
83
|
import { PageLayout } from "./PageLayout-DSVM-ASz.js";
|
|
83
84
|
import { PageHeader } from "./PageHeader-Q3IpCnQd.js";
|
|
84
|
-
import { PageToolbar } from "./PageToolbar-
|
|
85
|
-
import { SectionNav } from "./SectionNav
|
|
85
|
+
import { PageToolbar } from "./PageToolbar-OQg3mPF-.js";
|
|
86
|
+
import { SectionNav } from "./SectionNav-8NoTOKO8.js";
|
|
86
87
|
import { BrandLogo } from "./BrandLogo-CJkRd0F8.js";
|
|
87
88
|
import { ResizableHandle, ResizablePanel, ResizablePanelGroup, useDefaultLayout } from "./Resizable-D3vYToZH.js";
|
|
88
|
-
import { Sidebar, SidebarProvider, useOptionalSidebar, useSidebar } from "./Sidebar-
|
|
89
|
+
import { Sidebar, SidebarProvider, useOptionalSidebar, useSidebar } from "./Sidebar-Dcb4rinA.js";
|
|
89
90
|
import { useScrollbarPosition } from "./internal/hooks/useScrollbarPosition.js";
|
|
90
|
-
import { Navbar } from "./Navbar-
|
|
91
|
+
import { Navbar } from "./Navbar-BfaPeLUL.js";
|
|
91
92
|
import { DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Workbench, useWorkbench } from "./Workbench-BzE-Vvd9.js";
|
|
92
|
-
import { Breadcrumb } from "./Breadcrumb-
|
|
93
|
-
import { Tabs, TabsContent } from "./Tabs-
|
|
93
|
+
import { Breadcrumb } from "./Breadcrumb-Frst8MTA.js";
|
|
94
|
+
import { Tabs, TabsContent } from "./Tabs-UMQuDoW8.js";
|
|
94
95
|
import { Stepper } from "./Stepper-C8sm9ZFM.js";
|
|
95
96
|
import { Timeline } from "./Timeline-6btyJl4D.js";
|
|
96
97
|
import { MarkedText } from "./MarkedText-Ckbft5mw.js";
|
|
97
98
|
import { Kbd, kbdVariants, keys } from "./Kbd-CxHAo1oo.js";
|
|
98
|
-
import { Pagination } from "./Pagination-
|
|
99
|
+
import { Pagination } from "./Pagination-Cjfda8KG.js";
|
|
99
100
|
import { DiffType, DiffView, computeDiffRows, computeLineInformation } from "./DiffView-ppTIzh2h.js";
|
|
100
101
|
import { PaneHeader } from "./internal/components/MergeEditor/PaneHeader.js";
|
|
101
102
|
import { ConflictStatusIndicator } from "./internal/components/MergeEditor/ConflictStatus/ConflictStatusIndicator.js";
|
|
@@ -103,10 +104,10 @@ import { useMergeDiff } from "./useMergeDiff-CvowEXJ1.js";
|
|
|
103
104
|
import { DashboardHero } from "./internal/blocks/DashboardHero.js";
|
|
104
105
|
import { StatCard, StatCardGrid } from "./internal/blocks/StatCard.js";
|
|
105
106
|
import { ChartPanel } from "./internal/blocks/ChartPanel.js";
|
|
106
|
-
import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "./Form-
|
|
107
|
+
import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "./Form-DHvcFoEi.js";
|
|
107
108
|
import { useAutosizeInput } from "./internal/hooks/useAutosizeInput.js";
|
|
108
109
|
import { useStableCallback } from "./internal/hooks/useStableCallback.js";
|
|
109
|
-
import { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "./ZoomableSvg-
|
|
110
|
-
import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "./BrandEditor-
|
|
110
|
+
import { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "./ZoomableSvg-CZEu6sAq.js";
|
|
111
|
+
import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "./BrandEditor-DyzgfVkl.js";
|
|
111
112
|
import { Slot } from "@radix-ui/react-slot";
|
|
112
|
-
export { Alert, AlertModal, AnswerSummary, AppShell, ArgoDesignContext, AutoSaveTextarea, Avatar, Badge, BrandEditor, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, Calendar, Card, ChartPanel, Checkbox, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, Combobox, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DashboardHero, DateInput, DatePicker, DateRangeInput, DateRangePicker, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, ErrorState, ExportMenu, FileUpload, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HelpBlock, HoverCard, InlineStepDetail, InlineStepLabel, InputGroup, Kbd, Label, Link, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkedText, MessageBubble, MicrosoftButton, Modal, MultiActionButtonGroup, MultiCombobox, Navbar, NumberInput, OtpInput, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, PanelWithDetails, PasswordInput, PlanApproval, PlanRewritingIndicator, Popconfirm, Popover, Progress, PromptInput, Question, QuestionBlock, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, Select, Separator, Sheet, Sidebar, SidebarProvider, Skeleton, SkeletonList, Slider, Slot, SplitButton, SpotlightBackdrop, StatCard, StatCardGrid, Stepper, SuggestedPrompt, Switch, Table, Tabs, TabsContent, TextInput, Textarea, ThemeProvider, ThinkingIndicator, TimeInput, TimePicker, Timeline, Toaster, Toggle, ToggleGroup, ToolCallApproval, ToolCallChip, Tooltip, TooltipProvider, Truncated, UsageStats, UsageStatsRing, Workbench, ZoomableSvg, argoVariants, brandSchema, channelsToHex, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, exampleCustomer, hexToChannels, isMac, kbdVariants, keboola, keboolaLegacySidebar, keboolaLegacyTopnav, keys, mergeRefs, setServerFieldErrors, setSubmitError, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAppForm, useArgoDesign, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useWorkbench, wcagLevel, withForm };
|
|
113
|
+
export { Alert, AlertModal, AnswerSummary, AppShell, ArgoDesignContext, AutoSaveTextarea, Avatar, Badge, BrandEditor, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, Calendar, Card, ChartPanel, Checkbox, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, Combobox, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DashboardHero, DateInput, DatePicker, DateRangeInput, DateRangePicker, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, ErrorState, ExportMenu, FileUpload, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HelpBlock, HoverCard, InlineStepDetail, InlineStepLabel, InputGroup, Kbd, Label, Link, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkedText, MessageBubble, MicrosoftButton, Modal, MultiActionButtonGroup, MultiCombobox, MultiComboboxField, Navbar, NumberInput, OtpInput, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, PanelWithDetails, PasswordInput, PlanApproval, PlanRewritingIndicator, Popconfirm, Popover, Progress, PromptInput, Question, QuestionBlock, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, Select, Separator, Sheet, Sidebar, SidebarProvider, Skeleton, SkeletonList, Slider, Slot, SplitButton, SpotlightBackdrop, StatCard, StatCardGrid, Stepper, SuggestedPrompt, Switch, Table, Tabs, TabsContent, TextInput, Textarea, ThemeProvider, ThinkingIndicator, TimeInput, TimePicker, Timeline, Toaster, Toggle, ToggleGroup, ToolCallApproval, ToolCallChip, Tooltip, TooltipProvider, Truncated, UsageStats, UsageStatsRing, Workbench, ZoomableSvg, argoVariants, brandSchema, channelsToHex, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, exampleCustomer, hexToChannels, isMac, kbdVariants, keboola, keboolaLegacySidebar, keboolaLegacyTopnav, keys, mergeRefs, setServerFieldErrors, setSubmitError, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAppForm, useArgoDesign, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useWorkbench, wcagLevel, withForm };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, UsageStats, UsageStatsRing } from "../../AIKit-
|
|
1
|
+
import { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, UsageStats, UsageStatsRing } from "../../AIKit-DiS0CVOW.js";
|
|
2
2
|
export { AnswerSummary, CollapsibleStepHeader, InlineStepDetail, InlineStepLabel, Markdown, MessageBubble, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, UsageStats, UsageStatsRing };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "../../BrandEditor-
|
|
1
|
+
import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "../../BrandEditor-DyzgfVkl.js";
|
|
2
2
|
export { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ClipboardButton, ClipboardInline } from "../../ClipboardButton-
|
|
1
|
+
import { ClipboardButton, ClipboardInline } from "../../ClipboardButton-ClcluT0C.js";
|
|
2
2
|
export { ClipboardButton, ClipboardInline };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ColorInput } from "../../ColorInput-
|
|
1
|
+
import { ColorInput } from "../../ColorInput-B8z4j4Y_.js";
|
|
2
2
|
export { ColorInput };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ColorModeSwitch } from "../../ColorModeSwitch-
|
|
1
|
+
import { ColorModeSwitch } from "../../ColorModeSwitch-dZFZyqy1.js";
|
|
2
2
|
export { ColorModeSwitch };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "../../Command-
|
|
1
|
+
import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "../../Command-C0aZfVTq.js";
|
|
2
2
|
export { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { DateInput } from "../../DateInput-
|
|
1
|
+
import { DateInput } from "../../DateInput-B3UdzRfW.js";
|
|
2
2
|
export { DateInput };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { DateRangeInput } from "../../DateRangeInput-
|
|
1
|
+
import { DateRangeInput } from "../../DateRangeInput-DTuySEiq.js";
|
|
2
2
|
export { DateRangeInput };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Tooltip } from "../../utils-D0c5VAyF.js";
|
|
2
2
|
import { Download } from "../../icons-Cek151jC.js";
|
|
3
|
-
import { Button } from "../../Button-
|
|
4
|
-
import { DropdownMenu } from "../../DropdownMenu-
|
|
3
|
+
import { Button } from "../../Button-6xBX0nNl.js";
|
|
4
|
+
import { DropdownMenu } from "../../DropdownMenu-t90tVw6l.js";
|
|
5
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
6
|
//#region src/blocks/ExportMenu/ExportMenu.tsx
|
|
7
7
|
/**
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import { MultiCombobox } from "../../MultiCombobox.js";
|
|
2
|
+
import { FieldItem, useFieldContext } from "../../../../FieldItem-D-h1NeBo.js";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
|
+
//#region src/blocks/Form/connectors/MultiComboboxField.tsx
|
|
5
|
+
/**
|
|
6
|
+
* Multi-selection field. State is `string[]`.
|
|
7
|
+
*
|
|
8
|
+
* ⚠️ Imported by name, not reached as `field.MultiComboboxField`, for the same reason as
|
|
9
|
+
* `CodeEditorField`: `fieldComponents` is an object literal handed to `createFormHook`, so no bundler
|
|
10
|
+
* shakes it per key — registering this here made every `useAppForm` consumer carry Base UI's combobox
|
|
11
|
+
* and `@tanstack/react-virtual`, measured at **+45 kB brotlied** (135 → 180 kB for
|
|
12
|
+
* `import { useAppForm }`), including apps that only render a `TextField`. As a named export the
|
|
13
|
+
* weight is opt-in, and anyone rendering a multi-select pays it via `MultiCombobox` regardless.
|
|
14
|
+
*
|
|
15
|
+
* It still reads the field from context, so it composes exactly like a connector:
|
|
16
|
+
*
|
|
17
|
+
* ```tsx
|
|
18
|
+
* import { MultiComboboxField } from '@keboola/design';
|
|
19
|
+
*
|
|
20
|
+
* <form.AppField name="features">{() => <MultiComboboxField label="Features" items={FEATURES} />}</form.AppField>
|
|
21
|
+
* ```
|
|
22
|
+
*
|
|
23
|
+
* Locked to `string` items rather than generic over the item shape: a form value is what gets
|
|
24
|
+
* submitted, and a field holding `{ label, value }` objects would put presentation into the payload.
|
|
25
|
+
* Project labels with `itemToLabel` instead.
|
|
26
|
+
*
|
|
27
|
+
* Pass `allowCreate` for an enum the user may extend — an open list of synchronous action names, say.
|
|
28
|
+
* The created values land in the field value like any other.
|
|
29
|
+
*/
|
|
30
|
+
const MultiComboboxField = ({ label, action, required, requiredMark, help, tooltip, className, "aria-describedby": ariaDescribedBy, inputClassName, ...comboboxProps }) => {
|
|
31
|
+
const field = useFieldContext();
|
|
32
|
+
return /* @__PURE__ */ jsx(FieldItem, {
|
|
33
|
+
label,
|
|
34
|
+
action,
|
|
35
|
+
required,
|
|
36
|
+
requiredMark,
|
|
37
|
+
help,
|
|
38
|
+
tooltip,
|
|
39
|
+
className,
|
|
40
|
+
"aria-describedby": ariaDescribedBy,
|
|
41
|
+
children: ({ "aria-invalid": isInvalid, ...control }) => /* @__PURE__ */ jsx(MultiCombobox, {
|
|
42
|
+
...comboboxProps,
|
|
43
|
+
...control,
|
|
44
|
+
"aria-invalid": isInvalid,
|
|
45
|
+
state: isInvalid === true ? "error" : void 0,
|
|
46
|
+
className: inputClassName,
|
|
47
|
+
value: field.state.value ?? [],
|
|
48
|
+
onValueChange: (next) => field.handleChange(next),
|
|
49
|
+
onBlur: field.handleBlur
|
|
50
|
+
})
|
|
51
|
+
});
|
|
52
|
+
};
|
|
53
|
+
//#endregion
|
|
54
|
+
export { MultiComboboxField };
|
|
55
|
+
|
|
56
|
+
//# sourceMappingURL=MultiComboboxField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MultiComboboxField.js","names":[],"sources":["../../../../../src/blocks/Form/connectors/MultiComboboxField.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { MultiCombobox } from '../../MultiCombobox';\nimport { useFieldContext } from '../contexts';\n\nimport { FieldItem, type FieldItemProps } from './FieldItem';\n\ntype Props = FieldItemProps &\n Omit<\n ComponentProps<typeof MultiCombobox<string>>,\n // Owned by the field / `FieldItem` — see the connector rules in AGENTS.md.\n | 'id'\n | 'name'\n | 'value'\n | 'defaultValue'\n | 'onValueChange'\n | 'onBlur'\n | 'aria-describedby'\n | 'aria-invalid'\n | 'aria-required'\n // `className` styles the field frame; the input group gets its own prop below.\n | 'className'\n | 'state'\n > & { inputClassName?: string };\n\n/**\n * Multi-selection field. State is `string[]`.\n *\n * ⚠️ Imported by name, not reached as `field.MultiComboboxField`, for the same reason as\n * `CodeEditorField`: `fieldComponents` is an object literal handed to `createFormHook`, so no bundler\n * shakes it per key — registering this here made every `useAppForm` consumer carry Base UI's combobox\n * and `@tanstack/react-virtual`, measured at **+45 kB brotlied** (135 → 180 kB for\n * `import { useAppForm }`), including apps that only render a `TextField`. As a named export the\n * weight is opt-in, and anyone rendering a multi-select pays it via `MultiCombobox` regardless.\n *\n * It still reads the field from context, so it composes exactly like a connector:\n *\n * ```tsx\n * import { MultiComboboxField } from '@keboola/design';\n *\n * <form.AppField name=\"features\">{() => <MultiComboboxField label=\"Features\" items={FEATURES} />}</form.AppField>\n * ```\n *\n * Locked to `string` items rather than generic over the item shape: a form value is what gets\n * submitted, and a field holding `{ label, value }` objects would put presentation into the payload.\n * Project labels with `itemToLabel` instead.\n *\n * Pass `allowCreate` for an enum the user may extend — an open list of synchronous action names, say.\n * The created values land in the field value like any other.\n */\nexport const MultiComboboxField = ({\n label,\n action,\n required,\n requiredMark,\n help,\n tooltip,\n className,\n 'aria-describedby': ariaDescribedBy,\n inputClassName,\n ...comboboxProps\n}: Props) => {\n const field = useFieldContext<string[]>();\n\n return (\n <FieldItem\n label={label}\n action={action}\n required={required}\n requiredMark={requiredMark}\n help={help}\n tooltip={tooltip}\n className={className}\n aria-describedby={ariaDescribedBy}\n >\n {({ 'aria-invalid': isInvalid, ...control }) => (\n <MultiCombobox<string>\n {...comboboxProps}\n {...control}\n // `aria-invalid` doubles as the visual error state — the input group has no separate\n // \"invalid\" prop, and a field that reads invalid to a screen reader but looks untouched is\n // the worse half of the two.\n aria-invalid={isInvalid}\n state={isInvalid === true ? 'error' : undefined}\n className={inputClassName}\n // `?? []` because a field with no default is `undefined`, and `MultiCombobox` treats a\n // missing value as uncontrolled — which would silently drop every selection.\n value={field.state.value ?? []}\n onValueChange={(next) => field.handleChange(next)}\n onBlur={field.handleBlur}\n />\n )}\n </FieldItem>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,MAAa,sBAAsB,EACjC,OACA,QACA,UACA,cACA,MACA,SACA,WACA,oBAAoB,iBACpB,gBACA,GAAG,oBACQ;CACX,MAAM,QAAQ,gBAA0B;CAExC,OACE,oBAAC,WAAD;EACS;EACC;EACE;EACI;EACR;EACG;EACE;EACX,oBAAkB;EAEhB,WAAA,EAAE,gBAAgB,WAAW,GAAG,cAChC,oBAAC,eAAD;GACE,GAAI;GACJ,GAAI;GAIJ,gBAAc;GACd,OAAO,cAAc,OAAO,UAAU,KAAA;GACtC,WAAW;GAGX,OAAO,MAAM,MAAM,SAAS,CAAC;GAC7B,gBAAgB,SAAS,MAAM,aAAa,IAAI;GAChD,QAAQ,MAAM;EACf,CAAA;CAEM,CAAA;AAEf"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "../../Form-
|
|
1
|
+
import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "../../Form-DHvcFoEi.js";
|
|
2
2
|
export { setServerFieldErrors, setSubmitError, useAppForm, withForm };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { FormGroup } from "../../FormGroup-
|
|
1
|
+
import { FormGroup } from "../../FormGroup-C41n65cE.js";
|
|
2
2
|
export { FormGroup };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { MultiActionButtonGroup } from "../../MultiActionButtonGroup-
|
|
1
|
+
import { MultiActionButtonGroup } from "../../MultiActionButtonGroup-BiIIubiL.js";
|
|
2
2
|
export { MultiActionButtonGroup };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useArgoDesign } from "../../context-KxxeMHbR.js";
|
|
2
2
|
import { ChevronDown, Plus, X } from "../../icons-Cek151jC.js";
|
|
3
|
-
import { InputGroup } from "../../InputGroup-
|
|
4
|
-
import { Combobox as Combobox$1, createCreatableItem, defaultGroupToLabel, defaultItemToDisabled, defaultItemToIcon, defaultItemToLabel, defaultQueryToCreateLabel, defaultToCreateValue, isCreatableItem, isGroupItem, isGroupItems, isLabeledItem, toLabel } from "../../Combobox-
|
|
3
|
+
import { InputGroup } from "../../InputGroup-CdTq8H7c.js";
|
|
4
|
+
import { Combobox as Combobox$1, createCreatableItem, defaultGroupToLabel, defaultItemToDisabled, defaultItemToIcon, defaultItemToLabel, defaultQueryToCreateLabel, defaultToCreateValue, isCreatableItem, isGroupItem, isGroupItems, isLabeledItem, toLabel } from "../../Combobox-Dgm6Z4ib.js";
|
|
5
5
|
import { Fragment, useState } from "react";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { Combobox } from "@base-ui/react/combobox";
|
|
@@ -24,7 +24,7 @@ const isSelectAllItem = (item) => isLabeledItem(item) && item.value === "__selec
|
|
|
24
24
|
* @see RECIPES.md#creatable-multi-combobox — for free-form-plus-enumerated patterns
|
|
25
25
|
* @see RECIPES.md#filter-toolbar — for combining multi-select with other filter chips
|
|
26
26
|
*/
|
|
27
|
-
const MultiCombobox = ({ items: _itemsProp, value: _valueProp, defaultValue, onValueChange, itemToStringLabel, itemToStringValue, disabled, filter: filterProp, inputRef, variant, sizing, focusVariant, state, placeholder, allowClear, id, className, allowSelectAll = false, empty = "No items", indicator, allowCreate, queryToCreateValue, queryToCreateLabel = defaultQueryToCreateLabel, itemToDisabled = defaultItemToDisabled, itemToLabel = defaultItemToLabel, itemToIcon = defaultItemToIcon, groupToLabel = defaultGroupToLabel, itemToChipLabel, itemToChipColor, maxVisible = 3 }) => {
|
|
27
|
+
const MultiCombobox = ({ items: _itemsProp, value: _valueProp, defaultValue, onValueChange, itemToStringLabel, itemToStringValue, disabled, filter: filterProp, inputRef, variant, sizing, focusVariant, state, placeholder, allowClear, id, name, onBlur, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, className, allowSelectAll = false, empty = "No items", indicator, allowCreate, queryToCreateValue, queryToCreateLabel = defaultQueryToCreateLabel, itemToDisabled = defaultItemToDisabled, itemToLabel = defaultItemToLabel, itemToIcon = defaultItemToIcon, groupToLabel = defaultGroupToLabel, itemToChipLabel, itemToChipColor, maxVisible = 3 }) => {
|
|
28
28
|
const itemsProp = _itemsProp ?? [];
|
|
29
29
|
const valueProp = _valueProp ?? [];
|
|
30
30
|
const chipVariant = useArgoDesign() ? "pill" : "default";
|
|
@@ -134,6 +134,11 @@ const MultiCombobox = ({ items: _itemsProp, value: _valueProp, defaultValue, onV
|
|
|
134
134
|
children: [
|
|
135
135
|
/* @__PURE__ */ jsx(Combobox$1.Input, {
|
|
136
136
|
id,
|
|
137
|
+
name,
|
|
138
|
+
onBlur,
|
|
139
|
+
"aria-describedby": ariaDescribedBy,
|
|
140
|
+
"aria-invalid": ariaInvalid,
|
|
141
|
+
"aria-required": ariaRequired,
|
|
137
142
|
placeholder,
|
|
138
143
|
disabled,
|
|
139
144
|
className: "tw:w-auto tw:min-w-[120px] tw:flex-1"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiCombobox.js","names":["BaseCombobox","Combobox"],"sources":["../../../src/blocks/MultiCombobox/MultiCombobox.tsx"],"sourcesContent":["import { type ComponentProps, Fragment, type ReactNode, useState } from 'react';\nimport { Combobox as BaseCombobox } from '@base-ui/react/combobox';\n\nimport { Combobox } from '../../components/Combobox';\nimport type { Group, LabeledItem } from '../../components/Combobox/types';\nimport {\n createCreatableItem,\n defaultGroupToLabel,\n defaultItemToDisabled,\n defaultItemToIcon,\n defaultItemToLabel,\n defaultQueryToCreateLabel,\n defaultToCreateValue,\n isCreatableItem,\n isGroupItem,\n isGroupItems,\n isLabeledItem,\n toLabel,\n} from '../../components/Combobox/utils';\nimport { InputGroup } from '../../components/InputGroup';\nimport { useArgoDesign } from '../../components/ThemeProvider/context';\nimport { ChevronDown, Plus, X } from '../../icons';\n\ntype ComboboxProps<Value> = BaseCombobox.Root.Props<Value, true>;\ntype ComboboxInputProps = ComponentProps<typeof Combobox.Input>;\ntype ComboboxInputGroupProps = ComponentProps<typeof Combobox.InputGroup>;\ntype ComboboxItemProps = ComponentProps<typeof Combobox.Item>;\ntype ComboboxChipsProps = ComponentProps<typeof Combobox.Chips>;\n\ntype Indicator = NonNullable<ComboboxItemProps['indicator']>;\n\ntype CreatableProps<Value> = {\n allowCreate?: boolean;\n queryToCreateLabel?: (query: string) => ReactNode;\n queryToCreateValue?: (query: string) => Value;\n};\n\n/**\n * Props for `MultiCombobox`. Generic over `Value` (the item shape) and `GroupShape` (optional group wrapper).\n * Use `itemToLabel` / `itemToIcon` / `itemToDisabled` to project custom item shapes; use `filter` to override\n * the default substring matcher. Pass `allowCreate` to let the user add free-form values not in `items`.\n */\ntype Props<Value, GroupShape extends Group<Value> = Group<Value>> = Pick<\n ComboboxInputProps,\n 'placeholder' | 'id'\n> &\n Pick<ComboboxInputGroupProps, 'variant' | 'focusVariant' | 'sizing' | 'state' | 'className'> &\n Pick<\n ComboboxProps<Value>,\n | 'disabled'\n | 'inputRef'\n | 'value'\n | 'defaultValue'\n | 'onValueChange'\n | 'itemToStringLabel'\n | 'itemToStringValue'\n | 'filter'\n > &\n Pick<ComboboxChipsProps, 'itemToChipLabel' | 'itemToChipColor' | 'maxVisible'> &\n CreatableProps<Value> & {\n items?: readonly (Value | GroupShape)[];\n\n // root specific\n allowClear?: boolean;\n allowSelectAll?: boolean;\n empty?: ReactNode;\n indicator?: Indicator;\n\n // item specific\n itemToLabel?: (item: Value) => ReactNode;\n itemToIcon?: (item: Value) => ReactNode;\n itemToDisabled?: (item: Value) => boolean;\n\n // group specific\n groupToLabel?: (group: GroupShape) => ReactNode;\n };\n\nconst selectAllItem: LabeledItem = {\n value: '__select_all__',\n label: 'Select All',\n};\n\nconst isSelectAllItem = <Value,>(item: Value) =>\n isLabeledItem(item) && item.value === '__select_all__';\n\n/**\n * Multi-selection combobox with chip display and search. Built on Base UI Combobox.\n *\n * **When to use:** picking several items from a searchable enumerated list (filter by tags, assign labels).\n * Items render as chips above the input; `maxVisible` collapses excess into a `+N more` chip.\n * **When NOT to use:** for single selection use `Combobox`; for short enums without search use `Select`.\n * **Composition:** wrap in `FormGroup` for label + help text, or use `useAppForm` for form integration.\n * Pass `allowSelectAll` for a sticky \"Select All\" item when the full enum is small. Pass `allowCreate`\n * to let the user add free-form values that are not in `items` (e.g. entering column names by hand).\n *\n * @see RECIPES.md#creatable-multi-combobox — for free-form-plus-enumerated patterns\n * @see RECIPES.md#filter-toolbar — for combining multi-select with other filter chips\n */\nexport const MultiCombobox = <Value, GroupShape extends Group<Value> = Group<Value>>({\n // root props\n items: _itemsProp,\n value: _valueProp,\n defaultValue,\n onValueChange,\n itemToStringLabel,\n itemToStringValue,\n disabled,\n filter: filterProp,\n inputRef,\n\n // input props\n variant,\n sizing,\n focusVariant,\n state,\n placeholder,\n allowClear,\n id,\n className,\n\n // own props\n allowSelectAll = false,\n empty = 'No items',\n indicator,\n\n // creatable\n allowCreate,\n queryToCreateValue,\n queryToCreateLabel = defaultQueryToCreateLabel,\n\n // own item props\n itemToDisabled = defaultItemToDisabled,\n itemToLabel = defaultItemToLabel,\n itemToIcon = defaultItemToIcon,\n groupToLabel = defaultGroupToLabel,\n itemToChipLabel,\n itemToChipColor,\n maxVisible = 3,\n}: Props<Value, GroupShape>) => {\n const itemsProp = _itemsProp ?? [];\n const valueProp = _valueProp ?? [];\n const renderArgo = useArgoDesign();\n const chipVariant = renderArgo ? 'pill' : 'default';\n\n const [inputValue, setInputValue] = useState('');\n const [createdItems, setCreatedItems] = useState<Value[]>([]);\n const query = inputValue.trim();\n const queryLower = query.toLowerCase();\n\n // Created values are appended to `items` so Base UI can keep resolving them (as chips and as\n // list options) once the query clears — otherwise a value that isn't in `items` gets dropped.\n const baseItems = (() => {\n if (createdItems.length === 0) return itemsProp;\n if (isGroupItems(itemsProp))\n return [...itemsProp, { items: createdItems } as unknown as GroupShape];\n return [...itemsProp, ...createdItems];\n })();\n\n const allFlatItems = baseItems.flatMap((item) => (isGroupItem(item) ? item.items : item));\n const sampleItem = allFlatItems[0] as Value | undefined;\n const isAllSelected = allFlatItems.length === (valueProp?.length ?? 0);\n\n const defaultFilter = BaseCombobox.useFilter({\n multiple: true,\n value: valueProp,\n });\n\n const itemsWithSelectAllItem = (() => {\n if (!allowSelectAll) return baseItems;\n return [selectAllItem, ...baseItems];\n })();\n\n const itemToString = (item: Value) => itemToStringLabel?.(item) ?? toLabel(item);\n\n const items = (() => {\n const base = itemsWithSelectAllItem;\n if (!allowCreate || disabled || !query) return base;\n\n const exactMatch = allFlatItems.some((item) => itemToString(item).toLowerCase() === queryLower);\n const alreadySelected = valueProp.some(\n (item) => itemToString(item).toLowerCase() === queryLower,\n );\n if (exactMatch || alreadySelected) return base;\n\n const creatable = createCreatableItem(query);\n return isGroupItems(base)\n ? [...base, { items: [creatable] } as unknown as GroupShape]\n : [...base, creatable as unknown as Value];\n })();\n\n const filter = (item: Value, query: string, itemToString?: (value: Value) => string) => {\n // keep select always visible\n if (isSelectAllItem(item)) return true;\n // always offer the transient \"create\" option\n if (isCreatableItem(item)) return true;\n\n if (filterProp) return filterProp(item, query, itemToString);\n return defaultFilter.contains(item, query, itemToString);\n };\n\n const wrappedItemToStringLabel: ComboboxProps<Value>['itemToStringLabel'] = !allowCreate\n ? itemToStringLabel\n : (item) => (isCreatableItem(item) ? item.value : itemToString(item));\n\n const wrappedItemToStringValue: ComboboxProps<Value>['itemToStringValue'] =\n !allowCreate || !itemToStringValue\n ? itemToStringValue\n : (item) => (isCreatableItem(item) ? item.value : itemToStringValue(item));\n\n const value = (() => {\n if (!allowSelectAll) return valueProp;\n return isAllSelected ? [...valueProp, selectAllItem as Value] : valueProp;\n })();\n\n const handleValueChange: ComboboxProps<Value>['onValueChange'] = (next, event) => {\n if (!onValueChange) return;\n\n const created: Value[] = [];\n const converted = allowCreate\n ? next.map((item) => {\n if (!isCreatableItem(item)) return item;\n const value = defaultToCreateValue(item.value, sampleItem, queryToCreateValue) as Value;\n created.push(value);\n return value;\n })\n : next;\n\n if (allowCreate) {\n if (created.length > 0) setCreatedItems((prev) => [...prev, ...created]);\n setInputValue('');\n }\n\n const hasSelectAll = converted.some((item) => isSelectAllItem(item));\n const newValue = (() => {\n if (!allowSelectAll) return converted;\n if (!hasSelectAll) return isAllSelected ? [] : converted;\n return isAllSelected ? converted.filter((item) => !isSelectAllItem(item)) : allFlatItems;\n })();\n\n onValueChange(newValue, event);\n };\n\n const renderItem = (item: Value) => {\n return (\n <Combobox.Item\n value={item}\n indicator={indicator}\n icon={itemToIcon(item)}\n disabled={itemToDisabled(item)}\n >\n {itemToLabel(item)}\n </Combobox.Item>\n );\n };\n\n return (\n <Combobox.Root<Value, true>\n multiple\n items={items}\n value={value}\n defaultValue={defaultValue}\n filter={filter}\n onValueChange={handleValueChange}\n itemToStringLabel={wrappedItemToStringLabel}\n itemToStringValue={wrappedItemToStringValue}\n disabled={disabled}\n inputRef={inputRef}\n {...(allowCreate\n ? { inputValue, onInputValueChange: (nextValue: string) => setInputValue(nextValue) }\n : {})}\n >\n <BaseCombobox.Chips render={<Fragment />}>\n <Combobox.InputGroup\n variant={variant}\n sizing={sizing}\n state={state}\n focusVariant={focusVariant}\n className={className}\n >\n <div className=\"tw:flex tw:min-w-0 tw:flex-1 tw:flex-wrap tw:items-center tw:gap-1.5 tw:px-4 tw:py-1.5\">\n <Combobox.Chips<Value>\n maxVisible={maxVisible}\n variant={chipVariant}\n itemToChipLabel={itemToChipLabel ?? itemToLabel}\n itemToChipColor={itemToChipColor}\n />\n <div className=\"tw:flex tw:flex-1 tw:items-center tw:gap-1\">\n <Combobox.Input\n id={id}\n placeholder={placeholder}\n disabled={disabled}\n className=\"tw:w-auto tw:min-w-[120px] tw:flex-1\"\n />\n {allowClear && (\n <InputGroup.Button asChild aria-label=\"Clear\" disabled={disabled}>\n <BaseCombobox.Clear>\n <X className=\"tw:size-4\" />\n </BaseCombobox.Clear>\n </InputGroup.Button>\n )}\n <InputGroup.Button disabled={disabled} asChild aria-label=\"Open combobox\">\n <BaseCombobox.Trigger>\n <ChevronDown className=\"tw:size-4\" />\n </BaseCombobox.Trigger>\n </InputGroup.Button>\n </div>\n </div>\n </Combobox.InputGroup>\n </BaseCombobox.Chips>\n <Combobox.Content>\n <Combobox.Empty>{empty}</Combobox.Empty>\n <Combobox.List>\n {(itemOrGroup: Value | GroupShape) => {\n if (isSelectAllItem(itemOrGroup)) {\n return (\n <Combobox.Item value={itemOrGroup} indicator=\"checkbox\">\n Select All\n </Combobox.Item>\n );\n }\n\n if (isCreatableItem(itemOrGroup)) {\n return (\n <Combobox.Item value={itemOrGroup} icon={<Plus />}>\n {queryToCreateLabel(itemOrGroup.value)}\n </Combobox.Item>\n );\n }\n\n if (isGroupItem(itemOrGroup)) {\n const maybeCreatable = itemOrGroup.items[0];\n\n if (isCreatableItem(maybeCreatable)) {\n return (\n <Combobox.Item value={maybeCreatable} icon={<Plus />}>\n {queryToCreateLabel(maybeCreatable.value)}\n </Combobox.Item>\n );\n }\n\n const groupLabel = groupToLabel(itemOrGroup);\n return (\n <Combobox.Group items={itemOrGroup.items}>\n {groupLabel && <Combobox.GroupLabel>{groupLabel}</Combobox.GroupLabel>}\n <Combobox.GroupList>{renderItem}</Combobox.GroupList>\n </Combobox.Group>\n );\n }\n\n return renderItem(itemOrGroup);\n }}\n </Combobox.List>\n </Combobox.Content>\n </Combobox.Root>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MultiCombobox.js","names":["BaseCombobox","Combobox"],"sources":["../../../src/blocks/MultiCombobox/MultiCombobox.tsx"],"sourcesContent":["import { type ComponentProps, Fragment, type ReactNode, useState } from 'react';\nimport { Combobox as BaseCombobox } from '@base-ui/react/combobox';\n\nimport { Combobox } from '../../components/Combobox';\nimport type { Group, LabeledItem } from '../../components/Combobox/types';\nimport {\n createCreatableItem,\n defaultGroupToLabel,\n defaultItemToDisabled,\n defaultItemToIcon,\n defaultItemToLabel,\n defaultQueryToCreateLabel,\n defaultToCreateValue,\n isCreatableItem,\n isGroupItem,\n isGroupItems,\n isLabeledItem,\n toLabel,\n} from '../../components/Combobox/utils';\nimport { InputGroup } from '../../components/InputGroup';\nimport { useArgoDesign } from '../../components/ThemeProvider/context';\nimport { ChevronDown, Plus, X } from '../../icons';\n\ntype ComboboxProps<Value> = BaseCombobox.Root.Props<Value, true>;\ntype ComboboxInputProps = ComponentProps<typeof Combobox.Input>;\ntype ComboboxInputGroupProps = ComponentProps<typeof Combobox.InputGroup>;\ntype ComboboxItemProps = ComponentProps<typeof Combobox.Item>;\ntype ComboboxChipsProps = ComponentProps<typeof Combobox.Chips>;\n\ntype Indicator = NonNullable<ComboboxItemProps['indicator']>;\n\ntype CreatableProps<Value> = {\n allowCreate?: boolean;\n queryToCreateLabel?: (query: string) => ReactNode;\n queryToCreateValue?: (query: string) => Value;\n};\n\n/**\n * Props for `MultiCombobox`. Generic over `Value` (the item shape) and `GroupShape` (optional group wrapper).\n * Use `itemToLabel` / `itemToIcon` / `itemToDisabled` to project custom item shapes; use `filter` to override\n * the default substring matcher. Pass `allowCreate` to let the user add free-form values not in `items`.\n */\ntype Props<Value, GroupShape extends Group<Value> = Group<Value>> = Pick<\n ComboboxInputProps,\n // `name`, `onBlur` and the `aria-*` set are forwarded to the input so a form connector can hand\n // over the wiring it derives from the field — without the `aria-*` set the control cannot be linked\n // to its own help and error text, and without `onBlur` the field never registers as blurred, which\n // is the gate `FieldItem` reveals errors on.\n 'placeholder' | 'id' | 'name' | 'onBlur' | 'aria-describedby' | 'aria-invalid' | 'aria-required'\n> &\n Pick<ComboboxInputGroupProps, 'variant' | 'focusVariant' | 'sizing' | 'state' | 'className'> &\n Pick<\n ComboboxProps<Value>,\n | 'disabled'\n | 'inputRef'\n | 'value'\n | 'defaultValue'\n | 'onValueChange'\n | 'itemToStringLabel'\n | 'itemToStringValue'\n | 'filter'\n > &\n Pick<ComboboxChipsProps, 'itemToChipLabel' | 'itemToChipColor' | 'maxVisible'> &\n CreatableProps<Value> & {\n items?: readonly (Value | GroupShape)[];\n\n // root specific\n allowClear?: boolean;\n allowSelectAll?: boolean;\n empty?: ReactNode;\n indicator?: Indicator;\n\n // item specific\n itemToLabel?: (item: Value) => ReactNode;\n itemToIcon?: (item: Value) => ReactNode;\n itemToDisabled?: (item: Value) => boolean;\n\n // group specific\n groupToLabel?: (group: GroupShape) => ReactNode;\n };\n\nconst selectAllItem: LabeledItem = {\n value: '__select_all__',\n label: 'Select All',\n};\n\nconst isSelectAllItem = <Value,>(item: Value) =>\n isLabeledItem(item) && item.value === '__select_all__';\n\n/**\n * Multi-selection combobox with chip display and search. Built on Base UI Combobox.\n *\n * **When to use:** picking several items from a searchable enumerated list (filter by tags, assign labels).\n * Items render as chips above the input; `maxVisible` collapses excess into a `+N more` chip.\n * **When NOT to use:** for single selection use `Combobox`; for short enums without search use `Select`.\n * **Composition:** wrap in `FormGroup` for label + help text, or use `useAppForm` for form integration.\n * Pass `allowSelectAll` for a sticky \"Select All\" item when the full enum is small. Pass `allowCreate`\n * to let the user add free-form values that are not in `items` (e.g. entering column names by hand).\n *\n * @see RECIPES.md#creatable-multi-combobox — for free-form-plus-enumerated patterns\n * @see RECIPES.md#filter-toolbar — for combining multi-select with other filter chips\n */\nexport const MultiCombobox = <Value, GroupShape extends Group<Value> = Group<Value>>({\n // root props\n items: _itemsProp,\n value: _valueProp,\n defaultValue,\n onValueChange,\n itemToStringLabel,\n itemToStringValue,\n disabled,\n filter: filterProp,\n inputRef,\n\n // input props\n variant,\n sizing,\n focusVariant,\n state,\n placeholder,\n allowClear,\n id,\n name,\n onBlur,\n 'aria-describedby': ariaDescribedBy,\n 'aria-invalid': ariaInvalid,\n 'aria-required': ariaRequired,\n className,\n\n // own props\n allowSelectAll = false,\n empty = 'No items',\n indicator,\n\n // creatable\n allowCreate,\n queryToCreateValue,\n queryToCreateLabel = defaultQueryToCreateLabel,\n\n // own item props\n itemToDisabled = defaultItemToDisabled,\n itemToLabel = defaultItemToLabel,\n itemToIcon = defaultItemToIcon,\n groupToLabel = defaultGroupToLabel,\n itemToChipLabel,\n itemToChipColor,\n maxVisible = 3,\n}: Props<Value, GroupShape>) => {\n const itemsProp = _itemsProp ?? [];\n const valueProp = _valueProp ?? [];\n const renderArgo = useArgoDesign();\n const chipVariant = renderArgo ? 'pill' : 'default';\n\n const [inputValue, setInputValue] = useState('');\n const [createdItems, setCreatedItems] = useState<Value[]>([]);\n const query = inputValue.trim();\n const queryLower = query.toLowerCase();\n\n // Created values are appended to `items` so Base UI can keep resolving them (as chips and as\n // list options) once the query clears — otherwise a value that isn't in `items` gets dropped.\n const baseItems = (() => {\n if (createdItems.length === 0) return itemsProp;\n if (isGroupItems(itemsProp))\n return [...itemsProp, { items: createdItems } as unknown as GroupShape];\n return [...itemsProp, ...createdItems];\n })();\n\n const allFlatItems = baseItems.flatMap((item) => (isGroupItem(item) ? item.items : item));\n const sampleItem = allFlatItems[0] as Value | undefined;\n const isAllSelected = allFlatItems.length === (valueProp?.length ?? 0);\n\n const defaultFilter = BaseCombobox.useFilter({\n multiple: true,\n value: valueProp,\n });\n\n const itemsWithSelectAllItem = (() => {\n if (!allowSelectAll) return baseItems;\n return [selectAllItem, ...baseItems];\n })();\n\n const itemToString = (item: Value) => itemToStringLabel?.(item) ?? toLabel(item);\n\n const items = (() => {\n const base = itemsWithSelectAllItem;\n if (!allowCreate || disabled || !query) return base;\n\n const exactMatch = allFlatItems.some((item) => itemToString(item).toLowerCase() === queryLower);\n const alreadySelected = valueProp.some(\n (item) => itemToString(item).toLowerCase() === queryLower,\n );\n if (exactMatch || alreadySelected) return base;\n\n const creatable = createCreatableItem(query);\n return isGroupItems(base)\n ? [...base, { items: [creatable] } as unknown as GroupShape]\n : [...base, creatable as unknown as Value];\n })();\n\n const filter = (item: Value, query: string, itemToString?: (value: Value) => string) => {\n // keep select always visible\n if (isSelectAllItem(item)) return true;\n // always offer the transient \"create\" option\n if (isCreatableItem(item)) return true;\n\n if (filterProp) return filterProp(item, query, itemToString);\n return defaultFilter.contains(item, query, itemToString);\n };\n\n const wrappedItemToStringLabel: ComboboxProps<Value>['itemToStringLabel'] = !allowCreate\n ? itemToStringLabel\n : (item) => (isCreatableItem(item) ? item.value : itemToString(item));\n\n const wrappedItemToStringValue: ComboboxProps<Value>['itemToStringValue'] =\n !allowCreate || !itemToStringValue\n ? itemToStringValue\n : (item) => (isCreatableItem(item) ? item.value : itemToStringValue(item));\n\n const value = (() => {\n if (!allowSelectAll) return valueProp;\n return isAllSelected ? [...valueProp, selectAllItem as Value] : valueProp;\n })();\n\n const handleValueChange: ComboboxProps<Value>['onValueChange'] = (next, event) => {\n if (!onValueChange) return;\n\n const created: Value[] = [];\n const converted = allowCreate\n ? next.map((item) => {\n if (!isCreatableItem(item)) return item;\n const value = defaultToCreateValue(item.value, sampleItem, queryToCreateValue) as Value;\n created.push(value);\n return value;\n })\n : next;\n\n if (allowCreate) {\n if (created.length > 0) setCreatedItems((prev) => [...prev, ...created]);\n setInputValue('');\n }\n\n const hasSelectAll = converted.some((item) => isSelectAllItem(item));\n const newValue = (() => {\n if (!allowSelectAll) return converted;\n if (!hasSelectAll) return isAllSelected ? [] : converted;\n return isAllSelected ? converted.filter((item) => !isSelectAllItem(item)) : allFlatItems;\n })();\n\n onValueChange(newValue, event);\n };\n\n const renderItem = (item: Value) => {\n return (\n <Combobox.Item\n value={item}\n indicator={indicator}\n icon={itemToIcon(item)}\n disabled={itemToDisabled(item)}\n >\n {itemToLabel(item)}\n </Combobox.Item>\n );\n };\n\n return (\n <Combobox.Root<Value, true>\n multiple\n items={items}\n value={value}\n defaultValue={defaultValue}\n filter={filter}\n onValueChange={handleValueChange}\n itemToStringLabel={wrappedItemToStringLabel}\n itemToStringValue={wrappedItemToStringValue}\n disabled={disabled}\n inputRef={inputRef}\n {...(allowCreate\n ? { inputValue, onInputValueChange: (nextValue: string) => setInputValue(nextValue) }\n : {})}\n >\n <BaseCombobox.Chips render={<Fragment />}>\n <Combobox.InputGroup\n variant={variant}\n sizing={sizing}\n state={state}\n focusVariant={focusVariant}\n className={className}\n >\n <div className=\"tw:flex tw:min-w-0 tw:flex-1 tw:flex-wrap tw:items-center tw:gap-1.5 tw:px-4 tw:py-1.5\">\n <Combobox.Chips<Value>\n maxVisible={maxVisible}\n variant={chipVariant}\n itemToChipLabel={itemToChipLabel ?? itemToLabel}\n itemToChipColor={itemToChipColor}\n />\n <div className=\"tw:flex tw:flex-1 tw:items-center tw:gap-1\">\n <Combobox.Input\n id={id}\n name={name}\n onBlur={onBlur}\n aria-describedby={ariaDescribedBy}\n aria-invalid={ariaInvalid}\n aria-required={ariaRequired}\n placeholder={placeholder}\n disabled={disabled}\n className=\"tw:w-auto tw:min-w-[120px] tw:flex-1\"\n />\n {allowClear && (\n <InputGroup.Button asChild aria-label=\"Clear\" disabled={disabled}>\n <BaseCombobox.Clear>\n <X className=\"tw:size-4\" />\n </BaseCombobox.Clear>\n </InputGroup.Button>\n )}\n <InputGroup.Button disabled={disabled} asChild aria-label=\"Open combobox\">\n <BaseCombobox.Trigger>\n <ChevronDown className=\"tw:size-4\" />\n </BaseCombobox.Trigger>\n </InputGroup.Button>\n </div>\n </div>\n </Combobox.InputGroup>\n </BaseCombobox.Chips>\n <Combobox.Content>\n <Combobox.Empty>{empty}</Combobox.Empty>\n <Combobox.List>\n {(itemOrGroup: Value | GroupShape) => {\n if (isSelectAllItem(itemOrGroup)) {\n return (\n <Combobox.Item value={itemOrGroup} indicator=\"checkbox\">\n Select All\n </Combobox.Item>\n );\n }\n\n if (isCreatableItem(itemOrGroup)) {\n return (\n <Combobox.Item value={itemOrGroup} icon={<Plus />}>\n {queryToCreateLabel(itemOrGroup.value)}\n </Combobox.Item>\n );\n }\n\n if (isGroupItem(itemOrGroup)) {\n const maybeCreatable = itemOrGroup.items[0];\n\n if (isCreatableItem(maybeCreatable)) {\n return (\n <Combobox.Item value={maybeCreatable} icon={<Plus />}>\n {queryToCreateLabel(maybeCreatable.value)}\n </Combobox.Item>\n );\n }\n\n const groupLabel = groupToLabel(itemOrGroup);\n return (\n <Combobox.Group items={itemOrGroup.items}>\n {groupLabel && <Combobox.GroupLabel>{groupLabel}</Combobox.GroupLabel>}\n <Combobox.GroupList>{renderItem}</Combobox.GroupList>\n </Combobox.Group>\n );\n }\n\n return renderItem(itemOrGroup);\n }}\n </Combobox.List>\n </Combobox.Content>\n </Combobox.Root>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { InputGroup } from "../../InputGroup-
|
|
1
|
+
import { InputGroup } from "../../InputGroup-CdTq8H7c.js";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
//#region src/blocks/NumberInput/NumberInput.tsx
|
|
4
4
|
const toNumberOrNull = (event) => Number.isNaN(event.target.valueAsNumber) ? null : event.target.valueAsNumber;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { PageToolbar } from "../../PageToolbar-
|
|
1
|
+
import { PageToolbar } from "../../PageToolbar-OQg3mPF-.js";
|
|
2
2
|
export { PageToolbar };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { createChangeInputEvent } from "../../utils-D0c5VAyF.js";
|
|
2
2
|
import { mergeRefs } from "../utils/mergeRefs.js";
|
|
3
3
|
import { ArrowBigUpDash, Eye, EyeOff, X } from "../../icons-Cek151jC.js";
|
|
4
|
-
import { InputGroup } from "../../InputGroup-
|
|
4
|
+
import { InputGroup } from "../../InputGroup-CdTq8H7c.js";
|
|
5
5
|
import { useControllableState } from "../../useControllableState-M6494mCT.js";
|
|
6
6
|
import { useRef, useState } from "react";
|
|
7
7
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { SearchInput } from "../../SearchInput-
|
|
1
|
+
import { SearchInput } from "../../SearchInput-C7dF_Ir-.js";
|
|
2
2
|
export { SearchInput };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { cn } from "../../classNames-BzrkDnOD.js";
|
|
2
2
|
import { keyCodes } from "../../utils-D0c5VAyF.js";
|
|
3
3
|
import { ChevronDown, ChevronUp, Search } from "../../icons-Cek151jC.js";
|
|
4
|
-
import { Button } from "../../Button-
|
|
4
|
+
import { Button } from "../../Button-6xBX0nNl.js";
|
|
5
5
|
import { ButtonGroup } from "../components/ButtonGroup.js";
|
|
6
6
|
import { Separator } from "../components/Separator.js";
|
|
7
|
-
import { TextInput } from "../../TextInput-
|
|
7
|
+
import { TextInput } from "../../TextInput-CMuN1WfY.js";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
//#region src/blocks/SearchInputWithNavigation/SearchInputWithNavigation.tsx
|
|
10
10
|
const SearchInputWithNavigation = ({ ref, value, onValueChange, placeholder = "Search...", variant = "secondary", onClear, focusVariant, currentIndex, totalResults, onNavigateNext, onNavigatePrevious, className }) => {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { SectionNav } from "../../SectionNav
|
|
1
|
+
import { SectionNav } from "../../SectionNav-8NoTOKO8.js";
|
|
2
2
|
export { SectionNav };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ChevronDown } from "../../icons-Cek151jC.js";
|
|
2
|
-
import { Button } from "../../Button-
|
|
2
|
+
import { Button } from "../../Button-6xBX0nNl.js";
|
|
3
3
|
import { ButtonGroup } from "../components/ButtonGroup.js";
|
|
4
|
-
import { DropdownMenu } from "../../DropdownMenu-
|
|
4
|
+
import { DropdownMenu } from "../../DropdownMenu-t90tVw6l.js";
|
|
5
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
6
|
//#region src/blocks/SplitButton/SplitButton.tsx
|
|
7
7
|
const iconSizeMap = {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { TextInput } from "../../TextInput-
|
|
1
|
+
import { TextInput } from "../../TextInput-CMuN1WfY.js";
|
|
2
2
|
export { TextInput };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { InputGroup } from "../../InputGroup-
|
|
1
|
+
import { InputGroup } from "../../InputGroup-CdTq8H7c.js";
|
|
2
2
|
import { useControllableState } from "../../useControllableState-M6494mCT.js";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
//#region src/blocks/Textarea/Textarea.tsx
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { createChangeInputEvent } from "../../utils-D0c5VAyF.js";
|
|
2
2
|
import { mergeRefs } from "../utils/mergeRefs.js";
|
|
3
3
|
import { Clock, X } from "../../icons-Cek151jC.js";
|
|
4
|
-
import { InputGroup } from "../../InputGroup-
|
|
4
|
+
import { InputGroup } from "../../InputGroup-CdTq8H7c.js";
|
|
5
5
|
import { useControllableState } from "../../useControllableState-M6494mCT.js";
|
|
6
|
-
import { TimePicker } from "../../TimePicker-
|
|
6
|
+
import { TimePicker } from "../../TimePicker-D9zktB8A.js";
|
|
7
7
|
import { useRef, useState } from "react";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
//#region src/blocks/TimeInput/TimeInput.tsx
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { AlertModal } from "../../AlertModal-
|
|
1
|
+
import { AlertModal } from "../../AlertModal-Dp_XuJBW.js";
|
|
2
2
|
export { AlertModal };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Breadcrumb } from "../../Breadcrumb-
|
|
1
|
+
import { Breadcrumb } from "../../Breadcrumb-Frst8MTA.js";
|
|
2
2
|
export { Breadcrumb };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Button, ButtonInline, argoVariants } from "../../Button-
|
|
1
|
+
import { Button, ButtonInline, argoVariants } from "../../Button-6xBX0nNl.js";
|
|
2
2
|
export { Button, ButtonInline, argoVariants };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Combobox } from "../../Combobox-
|
|
1
|
+
import { Combobox } from "../../Combobox-Dgm6Z4ib.js";
|
|
2
2
|
export { Combobox };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { DatePicker } from "../../DatePicker-
|
|
1
|
+
import { DatePicker } from "../../DatePicker-Dw3DpbUh.js";
|
|
2
2
|
export { DatePicker };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { DateRangePicker } from "../../DateRangePicker-
|
|
1
|
+
import { DateRangePicker } from "../../DateRangePicker-DCmMHg4s.js";
|
|
2
2
|
export { DateRangePicker };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { DropdownMenu } from "../../DropdownMenu-
|
|
1
|
+
import { DropdownMenu } from "../../DropdownMenu-t90tVw6l.js";
|
|
2
2
|
export { DropdownMenu };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { FileUpload, useFileDropTarget, useFileUploadRejections } from "../../FileUpload-
|
|
1
|
+
import { FileUpload, useFileDropTarget, useFileUploadRejections } from "../../FileUpload-BRv0TaZk.js";
|
|
2
2
|
export { FileUpload, useFileDropTarget, useFileUploadRejections };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { FullScreenModal, FullScreenModalBody, FullScreenModalHeader } from "../../FullScreenModal-
|
|
1
|
+
import { FullScreenModal, FullScreenModalBody, FullScreenModalHeader } from "../../FullScreenModal-Cb3PGgh4.js";
|
|
2
2
|
export { FullScreenModal, FullScreenModalBody, FullScreenModalHeader };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { InputGroup } from "../../InputGroup-
|
|
1
|
+
import { InputGroup } from "../../InputGroup-CdTq8H7c.js";
|
|
2
2
|
export { InputGroup };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Modal } from "../../Modal-
|
|
1
|
+
import { Modal } from "../../Modal-wqG8nJiK.js";
|
|
2
2
|
export { Modal };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Navbar } from "../../Navbar-
|
|
1
|
+
import { Navbar } from "../../Navbar-BfaPeLUL.js";
|
|
2
2
|
export { Navbar };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Pagination } from "../../Pagination-
|
|
1
|
+
import { Pagination } from "../../Pagination-Cjfda8KG.js";
|
|
2
2
|
export { Pagination };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Popconfirm } from "../../Popconfirm-
|
|
1
|
+
import { Popconfirm } from "../../Popconfirm-D7_vfxFd.js";
|
|
2
2
|
export { Popconfirm };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Popover } from "../../Popover-
|
|
1
|
+
import { Popover } from "../../Popover-CzeHjvrB.js";
|
|
2
2
|
export { Popover };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Select } from "../../Select-
|
|
1
|
+
import { Select } from "../../Select-Is0VkePH.js";
|
|
2
2
|
export { Select };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Sheet } from "../../Sheet-
|
|
1
|
+
import { Sheet } from "../../Sheet-Dw9BDvjI.js";
|
|
2
2
|
export { Sheet };
|