@powerhousedao/design-system 6.0.0-dev.196 → 6.0.0-dev.197
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{button-CRGaTu1H.d.ts → button-C8doazjv.d.ts} +1 -1
- package/dist/{button-CRGaTu1H.d.ts.map → button-C8doazjv.d.ts.map} +1 -1
- package/dist/{character-counter-sqhtpnM2.d.ts → character-counter-BWoglM2P.d.ts} +1 -1
- package/dist/{character-counter-sqhtpnM2.d.ts.map → character-counter-BWoglM2P.d.ts.map} +1 -1
- package/dist/{checkbox-WQJ1ELix.d.ts → checkbox-BueZ7Wg_.d.ts} +3 -3
- package/dist/{checkbox-WQJ1ELix.d.ts.map → checkbox-BueZ7Wg_.d.ts.map} +1 -1
- package/dist/{checkbox-base-kQOLgBSw.d.ts → checkbox-base-CZo-4eL0.d.ts} +1 -1
- package/dist/{checkbox-base-kQOLgBSw.d.ts.map → checkbox-base-CZo-4eL0.d.ts.map} +1 -1
- package/dist/{command-BVb5bGtc.d.ts → command--QCHwqST.d.ts} +8 -8
- package/dist/{command-BVb5bGtc.d.ts.map → command--QCHwqST.d.ts.map} +1 -1
- package/dist/connect/components/toast/toast.d.ts +16 -0
- package/dist/connect/components/toast/toast.d.ts.map +1 -0
- package/dist/connect/components/toast/toast.js +71 -0
- package/dist/connect/components/toast/toast.js.map +1 -0
- package/dist/connect/index.d.ts +3 -3
- package/dist/connect/index.js +3 -2
- package/dist/{connect-CrXsa33f.js → connect-D2wTJ-7r.js} +36 -366
- package/dist/connect-D2wTJ-7r.js.map +1 -0
- package/dist/{content-B-HaysyU.d.ts → content-DFFfr1mk.d.ts} +2 -2
- package/dist/{content-B-HaysyU.d.ts.map → content-DFFfr1mk.d.ts.map} +1 -1
- package/dist/document-timeline-FWiQhfIq.js +288 -0
- package/dist/document-timeline-FWiQhfIq.js.map +1 -0
- package/dist/{enum-field-gjkjO_WS.d.ts → enum-field-CBFI4x1f.d.ts} +4 -4
- package/dist/{enum-field-gjkjO_WS.d.ts.map → enum-field-CBFI4x1f.d.ts.map} +1 -1
- package/dist/{form-C1QA8m1k.d.ts → form-CKRKn0TQ.d.ts} +1 -1
- package/dist/{form-C1QA8m1k.d.ts.map → form-CKRKn0TQ.d.ts.map} +1 -1
- package/dist/{form-description-CJVMogCL.d.ts → form-description-CYkcMEzm.d.ts} +1 -1
- package/dist/{form-description-CJVMogCL.d.ts.map → form-description-CYkcMEzm.d.ts.map} +1 -1
- package/dist/{form-group-BDgpr5u8.d.ts → form-group-C8kL6pdZ.d.ts} +1 -1
- package/dist/form-group-C8kL6pdZ.d.ts.map +1 -0
- package/dist/{form-label-CCANBlbG.d.ts → form-label-b6nQi0XO.d.ts} +1 -1
- package/dist/{form-label-CCANBlbG.d.ts.map → form-label-b6nQi0XO.d.ts.map} +1 -1
- package/dist/{form-message-TYsO9BYM.d.ts → form-message-Dq72nBXz.d.ts} +1 -1
- package/dist/{form-message-TYsO9BYM.d.ts.map → form-message-Dq72nBXz.d.ts.map} +1 -1
- package/dist/{form-server-error-message-DM79ceCA.d.ts → form-server-error-message-DXbaiTfF.d.ts} +1 -1
- package/dist/{form-server-error-message-DM79ceCA.d.ts.map → form-server-error-message-DXbaiTfF.d.ts.map} +1 -1
- package/dist/{id-autocomplete-BafWC9wr.d.ts → id-autocomplete-CLC7zy-f.d.ts} +2 -2
- package/dist/{id-autocomplete-BafWC9wr.d.ts.map → id-autocomplete-CLC7zy-f.d.ts.map} +1 -1
- package/dist/{id-autocomplete-input-container-DxxI5DR6.d.ts → id-autocomplete-input-container-DsLTOkaT.d.ts} +2 -2
- package/dist/{id-autocomplete-input-container-DxxI5DR6.d.ts.map → id-autocomplete-input-container-DsLTOkaT.d.ts.map} +1 -1
- package/dist/{id-autocomplete-list-BHBavDro.d.ts → id-autocomplete-list-CFWHGDwL.d.ts} +2 -2
- package/dist/{id-autocomplete-list-BHBavDro.d.ts.map → id-autocomplete-list-CFWHGDwL.d.ts.map} +1 -1
- package/dist/{id-autocomplete-list-option-DlFexoVY.d.ts → id-autocomplete-list-option-fOnxSbzb.d.ts} +2 -2
- package/dist/{id-autocomplete-list-option-DlFexoVY.d.ts.map → id-autocomplete-list-option-fOnxSbzb.d.ts.map} +1 -1
- package/dist/{index-CuSjRT5A.d.ts → index-B6YyDoT1.d.ts} +1 -1
- package/dist/{index-CuSjRT5A.d.ts.map → index-B6YyDoT1.d.ts.map} +1 -1
- package/dist/{index-C37KRTG6.d.ts → index-U9etrdGX.d.ts} +3 -15
- package/dist/index-U9etrdGX.d.ts.map +1 -0
- package/dist/index.d.ts +2 -2
- package/dist/index.js +1 -1
- package/dist/{input-Bl0zw1zI.d.ts → input-BpEQjaWV.d.ts} +1 -1
- package/dist/{input-Bl0zw1zI.d.ts.map → input-BpEQjaWV.d.ts.map} +1 -1
- package/dist/{json-viewer-B5JtYTX7.d.ts → json-viewer-DaTgmzkS.d.ts} +1 -1
- package/dist/{json-viewer-B5JtYTX7.d.ts.map → json-viewer-DaTgmzkS.d.ts.map} +1 -1
- package/dist/{message-list-BZ9ku5cz.d.ts → message-list-C4mPpBBa.d.ts} +2 -2
- package/dist/{message-list-BZ9ku5cz.d.ts.map → message-list-C4mPpBBa.d.ts.map} +1 -1
- package/dist/{popover-CD29J7Ou.d.ts → popover-XSBOuSih.d.ts} +1 -1
- package/dist/{popover-CD29J7Ou.d.ts.map → popover-XSBOuSih.d.ts.map} +1 -1
- package/dist/{radio-9EYSHlFT.d.ts → radio-eL0Oy86J.d.ts} +1 -1
- package/dist/{radio-9EYSHlFT.d.ts.map → radio-eL0Oy86J.d.ts.map} +1 -1
- package/dist/{radio-group-BT-3-R48.d.ts → radio-group-Bkli6nUz.d.ts} +1 -1
- package/dist/{radio-group-BT-3-R48.d.ts.map → radio-group-Bkli6nUz.d.ts.map} +1 -1
- package/dist/{radio-group-field-BeQEWaTA.d.ts → radio-group-field-z7q-PVyY.d.ts} +2 -2
- package/dist/{radio-group-field-BeQEWaTA.d.ts.map → radio-group-field-z7q-PVyY.d.ts.map} +1 -1
- package/dist/rwa/index.d.ts +2 -2
- package/dist/rwa/index.js +11 -10
- package/dist/rwa/index.js.map +1 -1
- package/dist/{search-autocomplete-BRGCFNv4.d.ts → search-autocomplete-BJJkrZ1i.d.ts} +2 -2
- package/dist/{search-autocomplete-BRGCFNv4.d.ts.map → search-autocomplete-BJJkrZ1i.d.ts.map} +1 -1
- package/dist/{select-field-CxQiIXRy.d.ts → select-field-D27IGJrV.d.ts} +2 -2
- package/dist/{select-field-CxQiIXRy.d.ts.map → select-field-D27IGJrV.d.ts.map} +1 -1
- package/dist/{selected-content-DPH03IS_.d.ts → selected-content-CdIw4hcC.d.ts} +2 -2
- package/dist/{selected-content-DPH03IS_.d.ts.map → selected-content-CdIw4hcC.d.ts.map} +1 -1
- package/dist/{splitted-input-diff-Cvmajf1T.d.ts → splitted-input-diff-Bjrw-jzX.d.ts} +2 -2
- package/dist/{splitted-input-diff-Cvmajf1T.d.ts.map → splitted-input-diff-Bjrw-jzX.d.ts.map} +1 -1
- package/dist/{src-BX8sU0Tq.js → src-8xf1ueaA.js} +3 -3
- package/dist/src-8xf1ueaA.js.map +1 -0
- package/dist/{text-field-D_SU7LsS.d.ts → text-field-Bi7Ze25A.d.ts} +3 -3
- package/dist/{text-field-D_SU7LsS.d.ts.map → text-field-Bi7Ze25A.d.ts.map} +1 -1
- package/dist/{text-input-BHnj0vwk.d.ts → text-input-BAO78Lzx.d.ts} +3 -3
- package/dist/{text-input-BHnj0vwk.d.ts.map → text-input-BAO78Lzx.d.ts.map} +1 -1
- package/dist/{text-input-diff-BX11t5bF.d.ts → text-input-diff-Bx-zFOZd.d.ts} +2 -2
- package/dist/{text-input-diff-BX11t5bF.d.ts.map → text-input-diff-Bx-zFOZd.d.ts.map} +1 -1
- package/dist/{tooltip-CJfsoXUL.d.ts → tooltip-CsucyiCV.d.ts} +1 -1
- package/dist/{tooltip-CJfsoXUL.d.ts.map → tooltip-CsucyiCV.d.ts.map} +1 -1
- package/dist/{types-BWOaVvle.d.ts → types-BTq-St7H.d.ts} +1 -1
- package/dist/{types-BWOaVvle.d.ts.map → types-BTq-St7H.d.ts.map} +1 -1
- package/dist/{types-xiS8yRsl.d.ts → types-Bsn62tJB.d.ts} +1 -1
- package/dist/{types-xiS8yRsl.d.ts.map → types-Bsn62tJB.d.ts.map} +1 -1
- package/dist/{types-DY2V2IQi.d.ts → types-C04Q_Fan.d.ts} +1 -1
- package/dist/{types-DY2V2IQi.d.ts.map → types-C04Q_Fan.d.ts.map} +1 -1
- package/dist/ui/components/button/button.d.ts +1 -1
- package/dist/ui/components/button/button.js +2 -2
- package/dist/ui/components/button/button.js.map +1 -1
- package/dist/ui/components/character-counter/character-counter.d.ts +1 -1
- package/dist/ui/components/character-counter/character-counter.js.map +1 -1
- package/dist/ui/components/checkbox/checkbox-base.d.ts +1 -1
- package/dist/ui/components/checkbox/checkbox-base.js +2 -2
- package/dist/ui/components/checkbox/checkbox-base.js.map +1 -1
- package/dist/ui/components/checkbox/checkbox.d.ts +1 -1
- package/dist/ui/components/checkbox/checkbox.js +2 -2
- package/dist/ui/components/checkbox/checkbox.js.map +1 -1
- package/dist/ui/components/command/command.d.ts +1 -1
- package/dist/ui/components/command/command.js +8 -8
- package/dist/ui/components/command/command.js.map +1 -1
- package/dist/ui/components/enum-field/enum-field.d.ts +1 -1
- package/dist/ui/components/enum-field/enum-field.js +1 -1
- package/dist/ui/components/enum-field/enum-field.js.map +1 -1
- package/dist/ui/components/enum-field/types.d.ts +1 -1
- package/dist/ui/components/form/form.d.ts +1 -1
- package/dist/ui/components/form/form.js +1 -1
- package/dist/ui/components/form/form.js.map +1 -1
- package/dist/ui/components/form/utils.js.map +1 -1
- package/dist/ui/components/form-description/form-description.d.ts +1 -1
- package/dist/ui/components/form-description/form-description.js +1 -1
- package/dist/ui/components/form-description/form-description.js.map +1 -1
- package/dist/ui/components/form-group/form-group.d.ts +1 -1
- package/dist/ui/components/form-group/form-group.js.map +1 -1
- package/dist/ui/components/form-label/form-label.d.ts +1 -1
- package/dist/ui/components/form-label/form-label.js +1 -1
- package/dist/ui/components/form-label/form-label.js.map +1 -1
- package/dist/ui/components/form-message/form-message.d.ts +1 -1
- package/dist/ui/components/form-message/form-message.js +1 -1
- package/dist/ui/components/form-message/form-message.js.map +1 -1
- package/dist/ui/components/form-message/form-server-error-message.d.ts +1 -1
- package/dist/ui/components/form-message/form-server-error-message.js.map +1 -1
- package/dist/ui/components/form-message/message-list.d.ts +1 -1
- package/dist/ui/components/form-message/message-list.js +1 -1
- package/dist/ui/components/form-message/message-list.js.map +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-context.js +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-context.js.map +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-input-container.d.ts +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-input-container.js +2 -2
- package/dist/ui/components/id-autocomplete/id-autocomplete-input-container.js.map +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-list-option.d.ts +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-list-option.js +2 -2
- package/dist/ui/components/id-autocomplete/id-autocomplete-list-option.js.map +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-list.d.ts +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-list.js +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete-list.js.map +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete.d.ts +1 -1
- package/dist/ui/components/id-autocomplete/id-autocomplete.js +2 -2
- package/dist/ui/components/id-autocomplete/id-autocomplete.js.map +1 -1
- package/dist/ui/components/id-autocomplete/types.d.ts +1 -1
- package/dist/ui/components/id-autocomplete/use-id-autocomplete.d.ts +1 -1
- package/dist/ui/components/id-autocomplete/use-id-autocomplete.js.map +1 -1
- package/dist/ui/components/index.d.ts +36 -36
- package/dist/ui/components/input/input.d.ts +1 -1
- package/dist/ui/components/input/input.js +1 -1
- package/dist/ui/components/input/input.js.map +1 -1
- package/dist/ui/components/input/splitted-input-diff.d.ts +1 -1
- package/dist/ui/components/input/splitted-input-diff.js +1 -1
- package/dist/ui/components/input/splitted-input-diff.js.map +1 -1
- package/dist/ui/components/input/subcomponent/input-diff.js +1 -1
- package/dist/ui/components/input/subcomponent/input-diff.js.map +1 -1
- package/dist/ui/components/input/subcomponent/text-diff.d.ts +1 -1
- package/dist/ui/components/input/subcomponent/text-diff.js +1 -1
- package/dist/ui/components/input/subcomponent/text-diff.js.map +1 -1
- package/dist/ui/components/json-viewer/json-viewer.d.ts +1 -1
- package/dist/ui/components/json-viewer/json-viewer.js +1 -1
- package/dist/ui/components/json-viewer/json-viewer.js.map +1 -1
- package/dist/ui/components/popover/popover.d.ts +1 -1
- package/dist/ui/components/popover/popover.js +2 -2
- package/dist/ui/components/popover/popover.js.map +1 -1
- package/dist/ui/components/radio-group-field/radio-group-field.d.ts +1 -1
- package/dist/ui/components/radio-group-field/radio-group-field.js +3 -3
- package/dist/ui/components/radio-group-field/radio-group-field.js.map +1 -1
- package/dist/ui/components/radio-group-field/radio-group.d.ts +1 -1
- package/dist/ui/components/radio-group-field/radio-group.js +1 -1
- package/dist/ui/components/radio-group-field/radio-group.js.map +1 -1
- package/dist/ui/components/radio-group-field/radio.d.ts +1 -1
- package/dist/ui/components/radio-group-field/radio.js +2 -2
- package/dist/ui/components/radio-group-field/radio.js.map +1 -1
- package/dist/ui/components/search-autocomplete/index.d.ts +3 -3
- package/dist/ui/components/search-autocomplete/search-autocomplete.d.ts +1 -1
- package/dist/ui/components/search-autocomplete/search-autocomplete.js +1 -1
- package/dist/ui/components/search-autocomplete/search-autocomplete.js.map +1 -1
- package/dist/ui/components/search-autocomplete/types.d.ts +1 -1
- package/dist/ui/components/search-autocomplete/use-search-autocomplete.d.ts +1 -1
- package/dist/ui/components/search-autocomplete/use-search-autocomplete.js.map +1 -1
- package/dist/ui/components/select-field/content.d.ts +1 -1
- package/dist/ui/components/select-field/content.js +1 -1
- package/dist/ui/components/select-field/content.js.map +1 -1
- package/dist/ui/components/select-field/select-field.d.ts +1 -1
- package/dist/ui/components/select-field/select-field.js +2 -2
- package/dist/ui/components/select-field/select-field.js.map +1 -1
- package/dist/ui/components/select-field/selected-content.d.ts +1 -1
- package/dist/ui/components/select-field/selected-content.js +1 -1
- package/dist/ui/components/select-field/selected-content.js.map +1 -1
- package/dist/ui/components/select-field/subcomponents/CommandItemList.d.ts +1 -1
- package/dist/ui/components/select-field/subcomponents/CommandItemList.js +1 -1
- package/dist/ui/components/select-field/subcomponents/CommandItemList.js.map +1 -1
- package/dist/ui/components/select-field/use-select-field.d.ts +1 -1
- package/dist/ui/components/select-field/use-select-field.js.map +1 -1
- package/dist/ui/components/text-field/text-field.d.ts +1 -1
- package/dist/ui/components/text-field/text-field.js +1 -1
- package/dist/ui/components/text-field/text-field.js.map +1 -1
- package/dist/ui/components/text-input/text-input-diff.d.ts +1 -1
- package/dist/ui/components/text-input/text-input-diff.js.map +1 -1
- package/dist/ui/components/text-input/text-input.d.ts +1 -1
- package/dist/ui/components/text-input/text-input.js +2 -2
- package/dist/ui/components/text-input/text-input.js.map +1 -1
- package/dist/ui/components/text-input/types.d.ts +1 -1
- package/dist/ui/components/tooltip/tooltip.d.ts +1 -1
- package/dist/ui/components/tooltip/tooltip.js +2 -2
- package/dist/ui/components/tooltip/tooltip.js.map +1 -1
- package/dist/ui/components/types.d.ts +1 -1
- package/dist/ui/components/value-transformer/value-transformer.d.ts +1 -1
- package/dist/ui/components/value-transformer/value-transformer.js +1 -1
- package/dist/ui/components/value-transformer/value-transformer.js.map +1 -1
- package/dist/ui/components/with-field-validation/with-field-validation.d.ts +1 -1
- package/dist/ui/components/with-field-validation/with-field-validation.js +1 -1
- package/dist/ui/components/with-field-validation/with-field-validation.js.map +1 -1
- package/dist/ui/index.d.ts +38 -38
- package/dist/ui/lib/date-picker.d.ts +1 -1
- package/dist/ui/lib/date-picker.js.map +1 -1
- package/dist/ui/lib/date-time-picker.js.map +1 -1
- package/dist/ui/lib/deep-equal.js.map +1 -1
- package/dist/ui/lib/is-empty.js.map +1 -1
- package/dist/ui/lib/shared-value-transformers.d.ts +1 -1
- package/dist/ui/lib/shared-value-transformers.js.map +1 -1
- package/dist/ui/lib/types.d.ts +1 -1
- package/dist/ui/lib/value-cast.js.map +1 -1
- package/dist/ui/types.d.ts +2 -2
- package/dist/{use-id-autocomplete-FGV0tDeG.d.ts → use-id-autocomplete-JE8w4UXf.d.ts} +2 -2
- package/dist/{use-id-autocomplete-FGV0tDeG.d.ts.map → use-id-autocomplete-JE8w4UXf.d.ts.map} +1 -1
- package/dist/{use-search-autocomplete-BYRTKJjd.d.ts → use-search-autocomplete-IfcQ_gKh.d.ts} +2 -2
- package/dist/{use-search-autocomplete-BYRTKJjd.d.ts.map → use-search-autocomplete-IfcQ_gKh.d.ts.map} +1 -1
- package/dist/{value-transformer-BDrKuBqy.d.ts → value-transformer-2yvrA5Rp.d.ts} +2 -2
- package/dist/{value-transformer-BDrKuBqy.d.ts.map → value-transformer-2yvrA5Rp.d.ts.map} +1 -1
- package/dist/{with-field-validation-DQwlMTzr.d.ts → with-field-validation-YcGrdIrv.d.ts} +2 -2
- package/dist/{with-field-validation-DQwlMTzr.d.ts.map → with-field-validation-YcGrdIrv.d.ts.map} +1 -1
- package/package.json +13 -5
- package/dist/connect-CrXsa33f.js.map +0 -1
- package/dist/form-group-BDgpr5u8.d.ts.map +0 -1
- package/dist/index-C37KRTG6.d.ts.map +0 -1
- package/dist/src-BX8sU0Tq.js.map +0 -1
- /package/dist/{index-C2geSgue.d.ts → index-E7Wvm5uX.d.ts} +0 -0
- /package/dist/{index-Dw5cCt-A.d.ts → index-J3R2mDFQ.d.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"splitted-input-diff.js","names":["TooltipProvider"],"sources":["../../../../src/ui/components/input/splitted-input-diff.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { useCallback, useState } from \"react\";\nimport { useMediaQuery } from \"usehooks-ts\";\nimport type { WithDifference } from \"../../types.js\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\nimport { InputDiff } from \"./subcomponent/input-diff.js\";\nimport { TextDiff } from \"./subcomponent/text-diff.js\";\ninterface CopyIconProps {\n value: string;\n hasCopied: boolean;\n setHasCopied: (hasCopied: boolean) => void;\n hasHover: boolean;\n}\n\nconst CopyIcon = ({\n value,\n hasCopied,\n setHasCopied,\n hasHover,\n}: CopyIconProps) => {\n const copy = useCallback(() => {\n navigator.clipboard\n .writeText(value)\n .then(() => {\n setHasCopied(true);\n setTimeout(() => setHasCopied(false), 2000);\n })\n .catch((error: unknown) => {\n console.error(\"Failed to copy value: \", error);\n });\n }, [value, setHasCopied]);\n\n return (\n <TooltipProvider>\n <Tooltip content=\"Copied!\" open={hasCopied} triggerAsChild>\n <button\n type=\"button\"\n onClick={copy}\n className={cn(\n \"focus-visible:outline-none [&_svg]:pointer-events-none\",\n hasHover &&\n \"opacity-0 transition-opacity duration-500 group-hover:opacity-100\",\n )}\n >\n <Icon name=\"Copy\" size={16} className={cn(\"text-gray-500\")} />\n </button>\n </Tooltip>\n </TooltipProvider>\n );\n};\n\ninterface SplittedInputDiffProps extends WithDifference<string> {\n value: string;\n showCopyIcon?: boolean;\n}\n\nexport const SplittedInputDiff = ({\n baseValue,\n value,\n viewMode,\n diffMode,\n showCopyIcon = false,\n}: SplittedInputDiffProps) => {\n const [hasCopiedLeft, setHasCopiedLeft] = useState(false);\n const [hasCopiedRight, setHasCopiedRight] = useState(false);\n const hasHover = useMediaQuery(\"(hover: hover) and (pointer: fine)\");\n\n return (\n <InputDiff className={cn(\"group\")}>\n {viewMode === \"mixed\" ? (\n <>\n <div\n className={cn(\n \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n )}\n >\n <TextDiff\n baseValue={baseValue}\n value={value}\n viewMode=\"removal\"\n diffMode={diffMode}\n className={cn(\"flex-1\")}\n />\n {showCopyIcon && baseValue !== undefined && baseValue !== \"\" && (\n <CopyIcon\n value={baseValue}\n hasCopied={hasCopiedLeft}\n setHasCopied={setHasCopiedLeft}\n hasHover={hasHover}\n />\n )}\n </div>\n <div className={cn(\"ml-3 mr-3 h-[34px] w-px bg-gray-300\")} />\n <div\n className={cn(\n \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n )}\n >\n <TextDiff\n baseValue={baseValue}\n value={value}\n viewMode=\"addition\"\n diffMode={diffMode}\n className={cn(\"flex-1\")}\n />\n {showCopyIcon && value !== \"\" && (\n <CopyIcon\n value={value}\n hasCopied={hasCopiedRight}\n setHasCopied={setHasCopiedRight}\n hasHover={hasHover}\n />\n )}\n </div>\n </>\n ) : (\n <div\n className={cn(\n \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n )}\n >\n <TextDiff\n baseValue={baseValue}\n value={value}\n viewMode={viewMode}\n diffMode={diffMode}\n className={cn(\"flex-1\")}\n />\n {showCopyIcon &&\n ((viewMode === \"removal\" &&\n baseValue !== undefined &&\n baseValue !== \"\") ||\n (viewMode === \"addition\" && value !== \"\")) && (\n <CopyIcon\n value={viewMode === \"removal\" ? (baseValue ?? \"\") : value}\n hasCopied={hasCopiedLeft}\n setHasCopied={setHasCopiedLeft}\n hasHover={hasHover}\n />\n )}\n </div>\n )}\n </InputDiff>\n );\n};\n"],"mappings":";;;;;;;;AAcA,
|
|
1
|
+
{"version":3,"file":"splitted-input-diff.js","names":["cn","Icon","useCallback","useState","useMediaQuery","Tooltip","TooltipProvider","InputDiff","TextDiff","CopyIcon","value","hasCopied","setHasCopied","hasHover","copy","navigator","clipboard","writeText","then","setTimeout","catch","error","console","SplittedInputDiff","baseValue","viewMode","diffMode","showCopyIcon","hasCopiedLeft","setHasCopiedLeft","hasCopiedRight","setHasCopiedRight","undefined"],"sources":["../../../../src/ui/components/input/splitted-input-diff.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { useCallback, useState } from \"react\";\nimport { useMediaQuery } from \"usehooks-ts\";\nimport type { WithDifference } from \"../../types.js\";\nimport { Tooltip, TooltipProvider } from \"../tooltip/tooltip.js\";\nimport { InputDiff } from \"./subcomponent/input-diff.js\";\nimport { TextDiff } from \"./subcomponent/text-diff.js\";\ninterface CopyIconProps {\n value: string;\n hasCopied: boolean;\n setHasCopied: (hasCopied: boolean) => void;\n hasHover: boolean;\n}\n\nconst CopyIcon = ({\n value,\n hasCopied,\n setHasCopied,\n hasHover,\n}: CopyIconProps) => {\n const copy = useCallback(() => {\n navigator.clipboard\n .writeText(value)\n .then(() => {\n setHasCopied(true);\n setTimeout(() => setHasCopied(false), 2000);\n })\n .catch((error: unknown) => {\n console.error(\"Failed to copy value: \", error);\n });\n }, [value, setHasCopied]);\n\n return (\n <TooltipProvider>\n <Tooltip content=\"Copied!\" open={hasCopied} triggerAsChild>\n <button\n type=\"button\"\n onClick={copy}\n className={cn(\n \"focus-visible:outline-none [&_svg]:pointer-events-none\",\n hasHover &&\n \"opacity-0 transition-opacity duration-500 group-hover:opacity-100\",\n )}\n >\n <Icon name=\"Copy\" size={16} className={cn(\"text-gray-500\")} />\n </button>\n </Tooltip>\n </TooltipProvider>\n );\n};\n\ninterface SplittedInputDiffProps extends WithDifference<string> {\n value: string;\n showCopyIcon?: boolean;\n}\n\nexport const SplittedInputDiff = ({\n baseValue,\n value,\n viewMode,\n diffMode,\n showCopyIcon = false,\n}: SplittedInputDiffProps) => {\n const [hasCopiedLeft, setHasCopiedLeft] = useState(false);\n const [hasCopiedRight, setHasCopiedRight] = useState(false);\n const hasHover = useMediaQuery(\"(hover: hover) and (pointer: fine)\");\n\n return (\n <InputDiff className={cn(\"group\")}>\n {viewMode === \"mixed\" ? (\n <>\n <div\n className={cn(\n \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n )}\n >\n <TextDiff\n baseValue={baseValue}\n value={value}\n viewMode=\"removal\"\n diffMode={diffMode}\n className={cn(\"flex-1\")}\n />\n {showCopyIcon && baseValue !== undefined && baseValue !== \"\" && (\n <CopyIcon\n value={baseValue}\n hasCopied={hasCopiedLeft}\n setHasCopied={setHasCopiedLeft}\n hasHover={hasHover}\n />\n )}\n </div>\n <div className={cn(\"ml-3 mr-3 h-[34px] w-px bg-gray-300\")} />\n <div\n className={cn(\n \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n )}\n >\n <TextDiff\n baseValue={baseValue}\n value={value}\n viewMode=\"addition\"\n diffMode={diffMode}\n className={cn(\"flex-1\")}\n />\n {showCopyIcon && value !== \"\" && (\n <CopyIcon\n value={value}\n hasCopied={hasCopiedRight}\n setHasCopied={setHasCopiedRight}\n hasHover={hasHover}\n />\n )}\n </div>\n </>\n ) : (\n <div\n className={cn(\n \"flex flex-1 items-center gap-2 truncate [&>span]:truncate\",\n )}\n >\n <TextDiff\n baseValue={baseValue}\n value={value}\n viewMode={viewMode}\n diffMode={diffMode}\n className={cn(\"flex-1\")}\n />\n {showCopyIcon &&\n ((viewMode === \"removal\" &&\n baseValue !== undefined &&\n baseValue !== \"\") ||\n (viewMode === \"addition\" && value !== \"\")) && (\n <CopyIcon\n value={viewMode === \"removal\" ? (baseValue ?? \"\") : value}\n hasCopied={hasCopiedLeft}\n setHasCopied={setHasCopiedLeft}\n hasHover={hasHover}\n />\n )}\n </div>\n )}\n </InputDiff>\n );\n};\n"],"mappings":";;;;;;;;AAcA,MAAMS,YAAY,EAChBC,OACAC,WACAC,cACAC,eACmB;AAanB,QACE,oBAAC,UAAD,EAAA,UACE,oBAAC,SAAD;EAAS,SAAQ;EAAU,MAAMF;EAAW,gBAAA;YAC1C,oBAAC,UAAD;GACE,MAAK;GACL,SAjBKT,kBAAkB;AAC7Ba,cAAUC,UACPC,UAAUP,MAAM,CAChBQ,WAAW;AACVN,kBAAa,KAAK;AAClBO,sBAAiBP,aAAa,MAAM,EAAE,IAAK;MAC3C,CACDQ,OAAOC,UAAmB;AACzBC,aAAQD,MAAM,0BAA0BA,MAAM;MAC9C;MACH,CAACX,OAAOE,aAAa,CAAC;GAQjB,WAAWZ,GACT,0DACAa,YACE,oEACH;aAED,oBAAC,MAAD;IAAM,MAAK;IAAO,MAAM;IAAI,WAAWb,GAAG,gBAAgB;IAAC,CAAA;GACrD,CAAA;EACD,CAAA,EACO,CAAA;;AAStB,MAAauB,qBAAqB,EAChCC,WACAd,OACAe,UACAC,UACAC,eAAe,YACa;CAC5B,MAAM,CAACC,eAAeC,oBAAoB1B,SAAS,MAAM;CACzD,MAAM,CAAC2B,gBAAgBC,qBAAqB5B,SAAS,MAAM;CAC3D,MAAMU,WAAWT,cAAc,qCAAqC;AAEpE,QACE,oBAAC,WAAD;EAAW,WAAWJ,GAAG,QAAQ;YAC9ByB,aAAa,UACZ,qBAAA,YAAA,EAAA,UAAA;GACE,qBAAC,OAAD;IACE,WAAWzB,GACT,4DACD;cAHH,CAKE,oBAAC,UAAD;KACawB;KACJd;KACP,UAAS;KACCgB;KACV,WAAW1B,GAAG,SAAS;KAAC,CAAA,EAEzB2B,gBAAgBH,cAAcQ,KAAAA,KAAaR,cAAc,MACxD,oBAAC,UAAD;KACE,OAAOA;KACP,WAAWI;KACX,cAAcC;KACJhB;KAEb,CAAA,CACE;;GACL,oBAAC,OAAD,EAAK,WAAWb,GAAG,sCAAsC,EAAC,CAAA;GAC1D,qBAAC,OAAD;IACE,WAAWA,GACT,4DACD;cAHH,CAKE,oBAAC,UAAD;KACawB;KACJd;KACP,UAAS;KACCgB;KACV,WAAW1B,GAAG,SAAS;KAAC,CAAA,EAEzB2B,gBAAgBjB,UAAU,MACzB,oBAAC,UAAD;KACSA;KACP,WAAWoB;KACX,cAAcC;KACJlB;KAEb,CAAA,CACE;;GACJ,EAAA,CAAA,GAEH,qBAAC,OAAD;GACE,WAAWb,GACT,4DACD;aAHH,CAKE,oBAAC,UAAD;IACawB;IACJd;IACGe;IACAC;IACV,WAAW1B,GAAG,SAAS;IAAC,CAAA,EAEzB2B,iBACGF,aAAa,aACbD,cAAcQ,KAAAA,KACdR,cAAc,MACbC,aAAa,cAAcf,UAAU,OACtC,oBAAC,UAAD;IACE,OAAOe,aAAa,YAAaD,aAAa,KAAMd;IACpD,WAAWkB;IACX,cAAcC;IACJhB;IAEb,CAAA,CAEN;;EACS,CAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as cn } from "../../../../src-
|
|
1
|
+
import { t as cn } from "../../../../src-8xf1ueaA.js";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
//#region src/ui/components/input/subcomponent/input-diff.tsx
|
|
4
4
|
const InputDiff = ({ children, className, ellipsis = true, multiline = false, rows = 3, hasPadding = false }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-diff.js","names":[],"sources":["../../../../../src/ui/components/input/subcomponent/input-diff.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\n\ninterface InputDiffProps {\n children: React.ReactNode;\n className?: string;\n ellipsis?: boolean;\n multiline?: boolean;\n rows?: number;\n hasPadding?: boolean;\n}\n\nexport const InputDiff = ({\n children,\n className,\n ellipsis = true,\n multiline = false,\n rows = 3,\n hasPadding = false,\n}: InputDiffProps) => {\n return (\n <div\n className={cn(\n \"flex w-full items-center rounded-md font-sans text-sm font-normal leading-5 text-gray-700\",\n \"cursor-not-allowed border border-gray-300 bg-transparent px-3\",\n !multiline && ellipsis && \"truncate [&>span]:truncate\",\n hasPadding && \"items-start py-2\",\n className,\n )}\n style={{\n minHeight: multiline ? `${rows * 1.5}rem` : \"2.25rem\",\n }}\n >\n {children}\n </div>\n );\n};\n"],"mappings":";;;AAWA,
|
|
1
|
+
{"version":3,"file":"input-diff.js","names":["cn","InputDiff","children","className","ellipsis","multiline","rows","hasPadding","minHeight"],"sources":["../../../../../src/ui/components/input/subcomponent/input-diff.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\n\ninterface InputDiffProps {\n children: React.ReactNode;\n className?: string;\n ellipsis?: boolean;\n multiline?: boolean;\n rows?: number;\n hasPadding?: boolean;\n}\n\nexport const InputDiff = ({\n children,\n className,\n ellipsis = true,\n multiline = false,\n rows = 3,\n hasPadding = false,\n}: InputDiffProps) => {\n return (\n <div\n className={cn(\n \"flex w-full items-center rounded-md font-sans text-sm font-normal leading-5 text-gray-700\",\n \"cursor-not-allowed border border-gray-300 bg-transparent px-3\",\n !multiline && ellipsis && \"truncate [&>span]:truncate\",\n hasPadding && \"items-start py-2\",\n className,\n )}\n style={{\n minHeight: multiline ? `${rows * 1.5}rem` : \"2.25rem\",\n }}\n >\n {children}\n </div>\n );\n};\n"],"mappings":";;;AAWA,MAAaC,aAAa,EACxBC,UACAC,WACAC,WAAW,MACXC,YAAY,OACZC,OAAO,GACPC,aAAa,YACO;AACpB,QACE,oBAAC,OAAD;EACE,WAAWP,GACT,6FACA,iEACA,CAACK,aAAaD,YAAY,8BAC1BG,cAAc,oBACdJ,UACD;EACD,OAAO,EACLK,WAAWH,YAAY,GAAGC,OAAO,IAAG,OAAQ,WAC7C;EAEAJ;EACG,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-diff.js","names":[],"sources":["../../../../../src/ui/components/input/subcomponent/text-diff.tsx"],"sourcesContent":["import type { WithDifference } from \"#design-system\";\nimport { cn } from \"#design-system\";\nimport { diffSentences, diffWords } from \"diff\";\nimport { useMemo } from \"react\";\n\ninterface TextDiffProps extends WithDifference<string> {\n value: string;\n className?: string;\n childrenClassName?: string;\n}\n\nexport const TextDiff = ({\n baseValue,\n value,\n viewMode,\n diffMode = \"words\",\n className,\n childrenClassName,\n}: TextDiffProps) => {\n const wordsDiff = useMemo(() => {\n return diffMode === \"words\"\n ? diffWords(baseValue ?? \"\", value)\n : diffSentences(baseValue ?? \"\", value);\n }, [baseValue, value, diffMode]);\n\n const hasChanges = useMemo(() => {\n return wordsDiff.some((word) => word.added || word.removed);\n }, [wordsDiff]);\n\n const bgColor =\n diffMode === \"sentences\" && hasChanges\n ? viewMode === \"addition\"\n ? \"bg-green-600/30\"\n : viewMode === \"removal\"\n ? \"bg-red-600/30\"\n : undefined\n : undefined;\n\n return (\n <span className={cn(\"leading-[18px] text-gray-700\", bgColor, className)}>\n {wordsDiff.map((word, index) => {\n return word.added ? (\n viewMode === \"addition\" || viewMode === \"mixed\" ? (\n <span\n className={cn(\n (diffMode === \"words\" || viewMode === \"mixed\") &&\n \"bg-green-600/30\",\n childrenClassName,\n )}\n key={`${word.value}-${index}`}\n >\n {word.value}\n </span>\n ) : null\n ) : word.removed ? (\n viewMode === \"removal\" || viewMode === \"mixed\" ? (\n <span\n className={cn(\n (diffMode === \"words\" || viewMode === \"mixed\") &&\n \"bg-red-600/30\",\n childrenClassName,\n )}\n key={`${word.value}-${index}`}\n >\n {word.value}\n </span>\n ) : null\n ) : (\n <span\n key={`${word.value}-${index}`}\n className={cn(childrenClassName)}\n >\n {word.value}\n </span>\n );\n })}\n </span>\n );\n};\n"],"mappings":";;;;;AAWA,
|
|
1
|
+
{"version":3,"file":"text-diff.js","names":["cn","diffSentences","diffWords","useMemo","TextDiff","baseValue","value","viewMode","diffMode","className","childrenClassName","wordsDiff","hasChanges","some","word","added","removed","bgColor","undefined","map","index"],"sources":["../../../../../src/ui/components/input/subcomponent/text-diff.tsx"],"sourcesContent":["import type { WithDifference } from \"#design-system\";\nimport { cn } from \"#design-system\";\nimport { diffSentences, diffWords } from \"diff\";\nimport { useMemo } from \"react\";\n\ninterface TextDiffProps extends WithDifference<string> {\n value: string;\n className?: string;\n childrenClassName?: string;\n}\n\nexport const TextDiff = ({\n baseValue,\n value,\n viewMode,\n diffMode = \"words\",\n className,\n childrenClassName,\n}: TextDiffProps) => {\n const wordsDiff = useMemo(() => {\n return diffMode === \"words\"\n ? diffWords(baseValue ?? \"\", value)\n : diffSentences(baseValue ?? \"\", value);\n }, [baseValue, value, diffMode]);\n\n const hasChanges = useMemo(() => {\n return wordsDiff.some((word) => word.added || word.removed);\n }, [wordsDiff]);\n\n const bgColor =\n diffMode === \"sentences\" && hasChanges\n ? viewMode === \"addition\"\n ? \"bg-green-600/30\"\n : viewMode === \"removal\"\n ? \"bg-red-600/30\"\n : undefined\n : undefined;\n\n return (\n <span className={cn(\"leading-[18px] text-gray-700\", bgColor, className)}>\n {wordsDiff.map((word, index) => {\n return word.added ? (\n viewMode === \"addition\" || viewMode === \"mixed\" ? (\n <span\n className={cn(\n (diffMode === \"words\" || viewMode === \"mixed\") &&\n \"bg-green-600/30\",\n childrenClassName,\n )}\n key={`${word.value}-${index}`}\n >\n {word.value}\n </span>\n ) : null\n ) : word.removed ? (\n viewMode === \"removal\" || viewMode === \"mixed\" ? (\n <span\n className={cn(\n (diffMode === \"words\" || viewMode === \"mixed\") &&\n \"bg-red-600/30\",\n childrenClassName,\n )}\n key={`${word.value}-${index}`}\n >\n {word.value}\n </span>\n ) : null\n ) : (\n <span\n key={`${word.value}-${index}`}\n className={cn(childrenClassName)}\n >\n {word.value}\n </span>\n );\n })}\n </span>\n );\n};\n"],"mappings":";;;;;AAWA,MAAaI,YAAY,EACvBC,WACAC,OACAC,UACAC,WAAW,SACXC,WACAC,wBACmB;CACnB,MAAMC,YAAYR,cAAc;AAC9B,SAAOK,aAAa,UAChBN,UAAUG,aAAa,IAAIC,MAAM,GACjCL,cAAcI,aAAa,IAAIC,MAAM;IACxC;EAACD;EAAWC;EAAOE;EAAS,CAAC;CAEhC,MAAMI,aAAaT,cAAc;AAC/B,SAAOQ,UAAUE,MAAMC,SAASA,KAAKC,SAASD,KAAKE,QAAQ;IAC1D,CAACL,UAAU,CAAC;AAWf,QACE,oBAAC,QAAD;EAAM,WAAWX,GAAG,gCATpBQ,aAAa,eAAeI,aACxBL,aAAa,aACX,oBACAA,aAAa,YACX,kBACAW,KAAAA,IACJA,KAAAA,GAGyDT,UAAU;YACpEE,UAAUQ,KAAKL,MAAMM,UAAU;AAC9B,UAAON,KAAKC,QACVR,aAAa,cAAcA,aAAa,UACtC,oBAAC,QAAD;IACE,WAAWP,IACRQ,aAAa,WAAWD,aAAa,YACpC,mBACFG,kBACD;cAGAI,KAAKR;IACD,EAHA,GAAGQ,KAAKR,MAAK,GAAIc,QAGjB,GACL,OACFN,KAAKE,UACPT,aAAa,aAAaA,aAAa,UACrC,oBAAC,QAAD;IACE,WAAWP,IACRQ,aAAa,WAAWD,aAAa,YACpC,iBACFG,kBACD;cAGAI,KAAKR;IACD,EAHA,GAAGQ,KAAKR,MAAK,GAAIc,QAGjB,GACL,OAEJ,oBAAC,QAAD;IAEE,WAAWpB,GAAGU,kBAAkB;cAE/BI,KAAKR;IAET,EALQ,GAAGQ,KAAKR,MAAK,GAAIc,QAKzB;IACD;EACG,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as JsonViewer } from "../../../json-viewer-
|
|
1
|
+
import { t as JsonViewer } from "../../../json-viewer-DaTgmzkS.js";
|
|
2
2
|
export { JsonViewer };
|
|
@@ -71,7 +71,7 @@ const defaultStyles = {
|
|
|
71
71
|
stringValue: `${_defaultStyles.stringValue} !text-gray-600`
|
|
72
72
|
};
|
|
73
73
|
const allExpanded = () => true;
|
|
74
|
-
const JsonView = lazy(() => import("react-json-view-lite").then((m) => ({ default: m.JsonView })));
|
|
74
|
+
const JsonView = /* @__PURE__ */ lazy(() => import("react-json-view-lite").then((m) => ({ default: m.JsonView })));
|
|
75
75
|
function JsonViewer(props) {
|
|
76
76
|
return /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(JsonView, {
|
|
77
77
|
...props,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"json-viewer.js","names":[],"sources":["../../../../src/ui/components/json-viewer/json-viewer.tsx"],"sourcesContent":["import { lazy, Suspense } from \"react\";\nimport type { Props } from \"react-json-view-lite\";\n\n// copied from react-json-view-lite to allow lazy loading the component itself\nconst styles = {\n \"container-base\": \"_GzYRV\",\n \"punctuation-base\": \"_3eOF8\",\n pointer: \"_1MFti\",\n \"expander-base\": \"_f10Tu _1MFti\",\n \"expand-icon\": \"_1UmXx\",\n \"collapse-icon\": \"_1LId0\",\n \"collapsed-content-base\": \"_1pNG9 _1MFti\",\n \"container-light\": \"_2IvMF _GzYRV\",\n \"basic-element-style\": \"_2bkNM\",\n \"child-fields-container\": \"_1BXBN\",\n \"label-light\": \"_1MGIk\",\n \"clickable-label-light\": \"_2YKJg _1MGIk _1MFti\",\n \"punctuation-light\": \"_3uHL6 _3eOF8\",\n \"value-null-light\": \"_2T6PJ\",\n \"value-undefined-light\": \"_1Gho6\",\n \"value-string-light\": \"_vGjyY\",\n \"value-number-light\": \"_1bQdo\",\n \"value-boolean-light\": \"_3zQKs\",\n \"value-other-light\": \"_1xvuR\",\n \"collapse-icon-light\": \"_oLqym _f10Tu _1MFti _1LId0\",\n \"expand-icon-light\": \"_2AXVT _f10Tu _1MFti _1UmXx\",\n \"collapsed-content-light\": \"_2KJWg _1pNG9 _1MFti\",\n \"container-dark\": \"_11RoI _GzYRV\",\n \"expand-icon-dark\": \"_17H2C _f10Tu _1MFti _1UmXx\",\n \"collapse-icon-dark\": \"_3QHg2 _f10Tu _1MFti _1LId0\",\n \"collapsed-content-dark\": \"_3fDAz _1pNG9 _1MFti\",\n \"label-dark\": \"_2bSDX\",\n \"clickable-label-dark\": \"_1RQEj _2bSDX _1MFti\",\n \"punctuation-dark\": \"_gsbQL _3eOF8\",\n \"value-null-dark\": \"_LaAZe\",\n \"value-undefined-dark\": \"_GTKgm\",\n \"value-string-dark\": \"_Chy1W\",\n \"value-number-dark\": \"_2bveF\",\n \"value-boolean-dark\": \"_2vRm-\",\n \"value-other-dark\": \"_1prJR\",\n};\nconst defaultAriaLables = {\n collapseJson: \"collapse JSON\",\n expandJson: \"expand JSON\",\n};\nconst _defaultStyles = {\n container: styles[\"container-light\"],\n basicChildStyle: styles[\"basic-element-style\"],\n childFieldsContainer: styles[\"child-fields-container\"],\n label: styles[\"label-light\"],\n clickableLabel: styles[\"clickable-label-light\"],\n nullValue: styles[\"value-null-light\"],\n undefinedValue: styles[\"value-undefined-light\"],\n stringValue: styles[\"value-string-light\"],\n booleanValue: styles[\"value-boolean-light\"],\n numberValue: styles[\"value-number-light\"],\n otherValue: styles[\"value-other-light\"],\n punctuation: styles[\"punctuation-light\"],\n collapseIcon: styles[\"collapse-icon-light\"],\n expandIcon: styles[\"expand-icon-light\"],\n collapsedContent: styles[\"collapsed-content-light\"],\n noQuotesForStringValues: false,\n quotesForFieldNames: false,\n ariaLables: defaultAriaLables,\n stringifyStringValues: false,\n};\nconst defaultStyles = {\n ..._defaultStyles,\n container: `${_defaultStyles.container} !bg-transparent`,\n label: `${_defaultStyles.label} !text-gray-600`,\n punctuation: `${_defaultStyles.punctuation} !text-gray-700 !font-semibold`,\n collapseIcon: `${_defaultStyles.collapseIcon} !text-gray-600`,\n stringValue: `${_defaultStyles.stringValue} !text-gray-600`,\n};\n\nconst allExpanded = () => true;\n\nconst JsonView = lazy(() =>\n import(\"react-json-view-lite\").then((m) => ({ default: m.JsonView })),\n);\n\nexport function JsonViewer(props: Props) {\n return (\n <Suspense>\n <JsonView\n {...props}\n shouldExpandNode={props.shouldExpandNode ?? allExpanded}\n style={props.style ?? defaultStyles}\n />\n </Suspense>\n );\n}\n"],"mappings":";;;AAIA,
|
|
1
|
+
{"version":3,"file":"json-viewer.js","names":["lazy","Suspense","styles","pointer","defaultAriaLables","collapseJson","expandJson","_defaultStyles","container","basicChildStyle","childFieldsContainer","label","clickableLabel","nullValue","undefinedValue","stringValue","booleanValue","numberValue","otherValue","punctuation","collapseIcon","expandIcon","collapsedContent","noQuotesForStringValues","quotesForFieldNames","ariaLables","stringifyStringValues","defaultStyles","allExpanded","JsonView","then","m","default","JsonViewer","props","shouldExpandNode","style"],"sources":["../../../../src/ui/components/json-viewer/json-viewer.tsx"],"sourcesContent":["import { lazy, Suspense } from \"react\";\nimport type { Props } from \"react-json-view-lite\";\n\n// copied from react-json-view-lite to allow lazy loading the component itself\nconst styles = {\n \"container-base\": \"_GzYRV\",\n \"punctuation-base\": \"_3eOF8\",\n pointer: \"_1MFti\",\n \"expander-base\": \"_f10Tu _1MFti\",\n \"expand-icon\": \"_1UmXx\",\n \"collapse-icon\": \"_1LId0\",\n \"collapsed-content-base\": \"_1pNG9 _1MFti\",\n \"container-light\": \"_2IvMF _GzYRV\",\n \"basic-element-style\": \"_2bkNM\",\n \"child-fields-container\": \"_1BXBN\",\n \"label-light\": \"_1MGIk\",\n \"clickable-label-light\": \"_2YKJg _1MGIk _1MFti\",\n \"punctuation-light\": \"_3uHL6 _3eOF8\",\n \"value-null-light\": \"_2T6PJ\",\n \"value-undefined-light\": \"_1Gho6\",\n \"value-string-light\": \"_vGjyY\",\n \"value-number-light\": \"_1bQdo\",\n \"value-boolean-light\": \"_3zQKs\",\n \"value-other-light\": \"_1xvuR\",\n \"collapse-icon-light\": \"_oLqym _f10Tu _1MFti _1LId0\",\n \"expand-icon-light\": \"_2AXVT _f10Tu _1MFti _1UmXx\",\n \"collapsed-content-light\": \"_2KJWg _1pNG9 _1MFti\",\n \"container-dark\": \"_11RoI _GzYRV\",\n \"expand-icon-dark\": \"_17H2C _f10Tu _1MFti _1UmXx\",\n \"collapse-icon-dark\": \"_3QHg2 _f10Tu _1MFti _1LId0\",\n \"collapsed-content-dark\": \"_3fDAz _1pNG9 _1MFti\",\n \"label-dark\": \"_2bSDX\",\n \"clickable-label-dark\": \"_1RQEj _2bSDX _1MFti\",\n \"punctuation-dark\": \"_gsbQL _3eOF8\",\n \"value-null-dark\": \"_LaAZe\",\n \"value-undefined-dark\": \"_GTKgm\",\n \"value-string-dark\": \"_Chy1W\",\n \"value-number-dark\": \"_2bveF\",\n \"value-boolean-dark\": \"_2vRm-\",\n \"value-other-dark\": \"_1prJR\",\n};\nconst defaultAriaLables = {\n collapseJson: \"collapse JSON\",\n expandJson: \"expand JSON\",\n};\nconst _defaultStyles = {\n container: styles[\"container-light\"],\n basicChildStyle: styles[\"basic-element-style\"],\n childFieldsContainer: styles[\"child-fields-container\"],\n label: styles[\"label-light\"],\n clickableLabel: styles[\"clickable-label-light\"],\n nullValue: styles[\"value-null-light\"],\n undefinedValue: styles[\"value-undefined-light\"],\n stringValue: styles[\"value-string-light\"],\n booleanValue: styles[\"value-boolean-light\"],\n numberValue: styles[\"value-number-light\"],\n otherValue: styles[\"value-other-light\"],\n punctuation: styles[\"punctuation-light\"],\n collapseIcon: styles[\"collapse-icon-light\"],\n expandIcon: styles[\"expand-icon-light\"],\n collapsedContent: styles[\"collapsed-content-light\"],\n noQuotesForStringValues: false,\n quotesForFieldNames: false,\n ariaLables: defaultAriaLables,\n stringifyStringValues: false,\n};\nconst defaultStyles = {\n ..._defaultStyles,\n container: `${_defaultStyles.container} !bg-transparent`,\n label: `${_defaultStyles.label} !text-gray-600`,\n punctuation: `${_defaultStyles.punctuation} !text-gray-700 !font-semibold`,\n collapseIcon: `${_defaultStyles.collapseIcon} !text-gray-600`,\n stringValue: `${_defaultStyles.stringValue} !text-gray-600`,\n};\n\nconst allExpanded = () => true;\n\nconst JsonView = lazy(() =>\n import(\"react-json-view-lite\").then((m) => ({ default: m.JsonView })),\n);\n\nexport function JsonViewer(props: Props) {\n return (\n <Suspense>\n <JsonView\n {...props}\n shouldExpandNode={props.shouldExpandNode ?? allExpanded}\n style={props.style ?? defaultStyles}\n />\n </Suspense>\n );\n}\n"],"mappings":";;;AAIA,MAAME,SAAS;CACb,kBAAkB;CAClB,oBAAoB;CACpBC,SAAS;CACT,iBAAiB;CACjB,eAAe;CACf,iBAAiB;CACjB,0BAA0B;CAC1B,mBAAmB;CACnB,uBAAuB;CACvB,0BAA0B;CAC1B,eAAe;CACf,yBAAyB;CACzB,qBAAqB;CACrB,oBAAoB;CACpB,yBAAyB;CACzB,sBAAsB;CACtB,sBAAsB;CACtB,uBAAuB;CACvB,qBAAqB;CACrB,uBAAuB;CACvB,qBAAqB;CACrB,2BAA2B;CAC3B,kBAAkB;CAClB,oBAAoB;CACpB,sBAAsB;CACtB,0BAA0B;CAC1B,cAAc;CACd,wBAAwB;CACxB,oBAAoB;CACpB,mBAAmB;CACnB,wBAAwB;CACxB,qBAAqB;CACrB,qBAAqB;CACrB,sBAAsB;CACtB,oBAAoB;CACrB;AAKD,MAAMI,iBAAiB;CACrBC,WAAWN,OAAO;CAClBO,iBAAiBP,OAAO;CACxBQ,sBAAsBR,OAAO;CAC7BS,OAAOT,OAAO;CACdU,gBAAgBV,OAAO;CACvBW,WAAWX,OAAO;CAClBY,gBAAgBZ,OAAO;CACvBa,aAAab,OAAO;CACpBc,cAAcd,OAAO;CACrBe,aAAaf,OAAO;CACpBgB,YAAYhB,OAAO;CACnBiB,aAAajB,OAAO;CACpBkB,cAAclB,OAAO;CACrBmB,YAAYnB,OAAO;CACnBoB,kBAAkBpB,OAAO;CACzBqB,yBAAyB;CACzBC,qBAAqB;CACrBC,YAtBwB;EACxBpB,cAAc;EACdC,YAAY;EACb;CAoBCoB,uBAAuB;CACxB;AACD,MAAMC,gBAAgB;CACpB,GAAGpB;CACHC,WAAW,GAAGD,eAAeC,UAAS;CACtCG,OAAO,GAAGJ,eAAeI,MAAK;CAC9BQ,aAAa,GAAGZ,eAAeY,YAAW;CAC1CC,cAAc,GAAGb,eAAea,aAAY;CAC5CL,aAAa,GAAGR,eAAeQ,YAAW;CAC3C;AAED,MAAMa,oBAAoB;AAE1B,MAAMC,WAAW7B,2BACf,OAAO,wBAAwB8B,MAAMC,OAAO,EAAEC,SAASD,EAAEF,UAAU,EACrE,CAAC;AAED,SAAgBI,WAAWC,OAAc;AACvC,QACE,oBAAC,UAAD,EAAA,UACE,oBAAC,UAAD;EACE,GAAIA;EACJ,kBAAkBA,MAAMC,oBAAoBP;EAC5C,OAAOM,MAAME,SAAST;EAAc,CAAA,EAE7B,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { i as PopoverTrigger, n as PopoverAnchor, r as PopoverContent, t as Popover } from "../../../popover-
|
|
1
|
+
import { i as PopoverTrigger, n as PopoverAnchor, r as PopoverContent, t as Popover } from "../../../popover-XSBOuSih.js";
|
|
2
2
|
export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as cn } from "../../../src-
|
|
1
|
+
import { t as cn } from "../../../src-8xf1ueaA.js";
|
|
2
2
|
import React from "react";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
@@ -6,7 +6,7 @@ import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
|
6
6
|
const Popover = PopoverPrimitive.Root;
|
|
7
7
|
const PopoverAnchor = PopoverPrimitive.Anchor;
|
|
8
8
|
const PopoverTrigger = PopoverPrimitive.Trigger;
|
|
9
|
-
const PopoverContent = React.forwardRef(({ align = "center", sideOffset = 4, className, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(PopoverPrimitive.Content, {
|
|
9
|
+
const PopoverContent = /* @__PURE__ */ React.forwardRef(({ align = "center", sideOffset = 4, className, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(PopoverPrimitive.Content, {
|
|
10
10
|
align,
|
|
11
11
|
sideOffset,
|
|
12
12
|
className: cn([
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.js","names":[],"sources":["../../../../src/ui/components/popover/popover.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport React from \"react\";\n\nexport const Popover = PopoverPrimitive.Root;\nexport const PopoverAnchor = PopoverPrimitive.Anchor;\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\n\nexport const PopoverContent = React.forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ align = \"center\", sideOffset = 4, className, ...props }, ref) => (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n align={align}\n sideOffset={sideOffset}\n className={cn(\n [\n \"data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n \"data-[state=closed]:animate-zoom-out data-[state=open]:animate-zoom-in\",\n \"data-[side=bottom]:animate-slide-in-from-top data-[side=left]:animate-slide-in-from-right\",\n \"data-[side=right]:animate-slide-in-from-left data-[side=top]:animate-slide-in-from-bottom\",\n \"w-(--radix-popover-trigger-width) z-50 border p-0 outline-none\",\n \"border-gray-300 bg-white dark:border-slate-500 dark:bg-slate-600\",\n \"rounded-md shadow-[1px_4px_15px_0px_rgba(74,88,115,0.25)] dark:shadow-[1px_4px_15.3px_0px_#141921]\",\n ],\n className,\n )}\n ref={ref}\n {...props}\n />\n </PopoverPrimitive.Portal>\n));\n"],"mappings":";;;;;AAIA,
|
|
1
|
+
{"version":3,"file":"popover.js","names":["cn","PopoverPrimitive","React","Popover","Root","PopoverAnchor","Anchor","PopoverTrigger","Trigger","PopoverContent","forwardRef","align","sideOffset","className","props","ref"],"sources":["../../../../src/ui/components/popover/popover.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport React from \"react\";\n\nexport const Popover = PopoverPrimitive.Root;\nexport const PopoverAnchor = PopoverPrimitive.Anchor;\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\n\nexport const PopoverContent = React.forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ align = \"center\", sideOffset = 4, className, ...props }, ref) => (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n align={align}\n sideOffset={sideOffset}\n className={cn(\n [\n \"data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n \"data-[state=closed]:animate-zoom-out data-[state=open]:animate-zoom-in\",\n \"data-[side=bottom]:animate-slide-in-from-top data-[side=left]:animate-slide-in-from-right\",\n \"data-[side=right]:animate-slide-in-from-left data-[side=top]:animate-slide-in-from-bottom\",\n \"w-(--radix-popover-trigger-width) z-50 border p-0 outline-none\",\n \"border-gray-300 bg-white dark:border-slate-500 dark:bg-slate-600\",\n \"rounded-md shadow-[1px_4px_15px_0px_rgba(74,88,115,0.25)] dark:shadow-[1px_4px_15.3px_0px_#141921]\",\n ],\n className,\n )}\n ref={ref}\n {...props}\n />\n </PopoverPrimitive.Portal>\n));\n"],"mappings":";;;;;AAIA,MAAaG,UAAUF,iBAAiBG;AACxC,MAAaC,gBAAgBJ,iBAAiBK;AAC9C,MAAaC,iBAAiBN,iBAAiBO;AAE/C,MAAaC,iBAAiBP,sBAAMQ,YAGjC,EAAEC,QAAQ,UAAUC,aAAa,GAAGC,WAAW,GAAGC,SAASC,QAC5D,oBAAC,iBAAiB,QAAlB,EAAA,UACE,oBAAC,iBAAiB,SAAlB;CACSJ;CACKC;CACZ,WAAWZ,GACT;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACD,EACDa,UACD;CACIE;CACL,GAAID;CAAM,CAAA,EAGf,CAAA,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as RadioGroupFieldProps, t as RadioGroupField } from "../../../radio-group-field-
|
|
1
|
+
import { n as RadioGroupFieldProps, t as RadioGroupField } from "../../../radio-group-field-z7q-PVyY.js";
|
|
2
2
|
export { RadioGroupField, RadioGroupFieldProps };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as cn } from "../../../src-
|
|
1
|
+
import { t as cn } from "../../../src-8xf1ueaA.js";
|
|
2
2
|
import { FormLabel } from "../form-label/form-label.js";
|
|
3
3
|
import { FormMessageList } from "../form-message/message-list.js";
|
|
4
4
|
import { withFieldValidation } from "../with-field-validation/with-field-validation.js";
|
|
@@ -7,7 +7,7 @@ import { Radio } from "./radio.js";
|
|
|
7
7
|
import { forwardRef, useId } from "react";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
//#region src/ui/components/radio-group-field/radio-group-field.tsx
|
|
10
|
-
const RadioGroupFieldRaw = forwardRef(({ autoFocus, className, defaultValue, description, disabled, warnings = [], errors = [], id: propId, label, name, onChange, options = [], required, value, ...props }, ref) => {
|
|
10
|
+
const RadioGroupFieldRaw = /* @__PURE__ */ forwardRef(({ autoFocus, className, defaultValue, description, disabled, warnings = [], errors = [], id: propId, label, name, onChange, options = [], required, value, ...props }, ref) => {
|
|
11
11
|
const hasLabel = label !== void 0;
|
|
12
12
|
const hasError = errors.length > 0;
|
|
13
13
|
const prefix = useId();
|
|
@@ -60,7 +60,7 @@ const RadioGroupFieldRaw = forwardRef(({ autoFocus, className, defaultValue, des
|
|
|
60
60
|
]
|
|
61
61
|
});
|
|
62
62
|
});
|
|
63
|
-
const RadioGroupField = forwardRef(function RadioGroupField(props, ref) {
|
|
63
|
+
const RadioGroupField = /* @__PURE__ */ forwardRef(function RadioGroupField(props, ref) {
|
|
64
64
|
return /* @__PURE__ */ jsx(withFieldValidation(RadioGroupFieldRaw), {
|
|
65
65
|
...props,
|
|
66
66
|
ref
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio-group-field.js","names":[],"sources":["../../../../src/ui/components/radio-group-field/radio-group-field.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport type { HTMLAttributes, Ref } from \"react\";\nimport { forwardRef, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport type { RadioGroupProps } from \"../enum-field/types.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { RadioGroup } from \"./radio-group.js\";\nimport { Radio } from \"./radio.js\";\ntype RadioGroupFieldBaseProps = Omit<\n HTMLAttributes<HTMLDivElement>,\n | keyof InputBaseProps<string>\n | keyof FieldErrorHandling\n | keyof RadioGroupProps\n | \"dir\"\n> & {\n dir?: \"ltr\" | \"rtl\";\n};\n\nexport type RadioGroupFieldProps = RadioGroupFieldBaseProps &\n InputBaseProps<string> &\n FieldErrorHandling &\n RadioGroupProps;\n\nconst RadioGroupFieldRaw = forwardRef<HTMLDivElement, RadioGroupFieldProps>(\n (\n {\n autoFocus,\n className,\n defaultValue,\n description,\n disabled,\n warnings = [],\n errors = [],\n id: propId,\n label,\n name,\n onChange,\n options = [],\n required,\n value,\n ...props\n },\n ref,\n ) => {\n const hasLabel = label !== undefined;\n const hasError = errors.length > 0;\n const prefix = useId();\n const id = propId ?? `${prefix}-radio-group`;\n\n return (\n <RadioGroup\n aria-invalid={hasError}\n aria-label={!hasLabel ? \"Radio group\" : undefined}\n aria-required={required}\n autoFocus={autoFocus}\n className={cn(\"flex flex-col gap-2\", className)}\n defaultValue={defaultValue}\n id={id}\n name={name}\n onValueChange={(newValue) => {\n onChange?.(newValue);\n }}\n value={value}\n disabled={disabled}\n {...props}\n ref={ref}\n >\n {hasLabel && (\n <FormLabel\n description={description}\n hasError={hasError}\n htmlFor={id}\n required={required}\n disabled={disabled}\n >\n {label}\n </FormLabel>\n )}\n {options.map((option, index) => (\n <div\n key={`${prefix}-radio-${index}-${option.value}`}\n className=\"flex items-center gap-2\"\n role=\"presentation\"\n >\n <Radio\n id={`${prefix}-radio-${index}-${option.value}`}\n label={option.label}\n value={option.value}\n description={option.description}\n disabled={disabled || option.disabled}\n hasError={hasError}\n />\n </div>\n ))}\n {warnings.length > 0 && (\n <FormMessageList messages={warnings} type=\"warning\" />\n )}\n {hasError && <FormMessageList messages={errors} type=\"error\" />}\n </RadioGroup>\n );\n },\n);\n\nexport const RadioGroupField = forwardRef(function RadioGroupField(\n props: RadioGroupFieldProps,\n ref: Ref<HTMLDivElement>,\n) {\n const Component =\n withFieldValidation<RadioGroupFieldProps>(RadioGroupFieldRaw);\n return <Component {...props} ref={ref} />;\n});\n\nRadioGroupField.displayName = \"RadioGroupField\";\n"],"mappings":";;;;;;;;;AAyBA,
|
|
1
|
+
{"version":3,"file":"radio-group-field.js","names":["cn","forwardRef","useId","FormLabel","FormMessageList","withFieldValidation","RadioGroup","Radio","RadioGroupFieldRaw","autoFocus","className","defaultValue","description","disabled","warnings","errors","id","propId","label","name","onChange","options","required","value","props","ref","hasLabel","undefined","hasError","length","prefix","newValue","map","option","index","RadioGroupField","Component","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group-field.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport type { HTMLAttributes, Ref } from \"react\";\nimport { forwardRef, useId } from \"react\";\nimport type { FieldErrorHandling, InputBaseProps } from \"../../types.js\";\nimport type { RadioGroupProps } from \"../enum-field/types.js\";\nimport { FormLabel } from \"../form-label/form-label.js\";\nimport { FormMessageList } from \"../form-message/message-list.js\";\nimport { withFieldValidation } from \"../with-field-validation/with-field-validation.js\";\nimport { RadioGroup } from \"./radio-group.js\";\nimport { Radio } from \"./radio.js\";\ntype RadioGroupFieldBaseProps = Omit<\n HTMLAttributes<HTMLDivElement>,\n | keyof InputBaseProps<string>\n | keyof FieldErrorHandling\n | keyof RadioGroupProps\n | \"dir\"\n> & {\n dir?: \"ltr\" | \"rtl\";\n};\n\nexport type RadioGroupFieldProps = RadioGroupFieldBaseProps &\n InputBaseProps<string> &\n FieldErrorHandling &\n RadioGroupProps;\n\nconst RadioGroupFieldRaw = forwardRef<HTMLDivElement, RadioGroupFieldProps>(\n (\n {\n autoFocus,\n className,\n defaultValue,\n description,\n disabled,\n warnings = [],\n errors = [],\n id: propId,\n label,\n name,\n onChange,\n options = [],\n required,\n value,\n ...props\n },\n ref,\n ) => {\n const hasLabel = label !== undefined;\n const hasError = errors.length > 0;\n const prefix = useId();\n const id = propId ?? `${prefix}-radio-group`;\n\n return (\n <RadioGroup\n aria-invalid={hasError}\n aria-label={!hasLabel ? \"Radio group\" : undefined}\n aria-required={required}\n autoFocus={autoFocus}\n className={cn(\"flex flex-col gap-2\", className)}\n defaultValue={defaultValue}\n id={id}\n name={name}\n onValueChange={(newValue) => {\n onChange?.(newValue);\n }}\n value={value}\n disabled={disabled}\n {...props}\n ref={ref}\n >\n {hasLabel && (\n <FormLabel\n description={description}\n hasError={hasError}\n htmlFor={id}\n required={required}\n disabled={disabled}\n >\n {label}\n </FormLabel>\n )}\n {options.map((option, index) => (\n <div\n key={`${prefix}-radio-${index}-${option.value}`}\n className=\"flex items-center gap-2\"\n role=\"presentation\"\n >\n <Radio\n id={`${prefix}-radio-${index}-${option.value}`}\n label={option.label}\n value={option.value}\n description={option.description}\n disabled={disabled || option.disabled}\n hasError={hasError}\n />\n </div>\n ))}\n {warnings.length > 0 && (\n <FormMessageList messages={warnings} type=\"warning\" />\n )}\n {hasError && <FormMessageList messages={errors} type=\"error\" />}\n </RadioGroup>\n );\n },\n);\n\nexport const RadioGroupField = forwardRef(function RadioGroupField(\n props: RadioGroupFieldProps,\n ref: Ref<HTMLDivElement>,\n) {\n const Component =\n withFieldValidation<RadioGroupFieldProps>(RadioGroupFieldRaw);\n return <Component {...props} ref={ref} />;\n});\n\nRadioGroupField.displayName = \"RadioGroupField\";\n"],"mappings":";;;;;;;;;AAyBA,MAAMQ,qBAAqBP,4BAEvB,EACEQ,WACAC,WACAC,cACAC,aACAC,UACAC,WAAW,EAAE,EACbC,SAAS,EAAE,EACXC,IAAIC,QACJC,OACAC,MACAC,UACAC,UAAU,EAAE,EACZC,UACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,WAAWR,UAAUS,KAAAA;CAC3B,MAAMC,WAAWb,OAAOc,SAAS;CACjC,MAAMC,SAAS5B,OAAO;CACtB,MAAMc,KAAKC,UAAU,GAAGa,OAAM;AAE9B,QACE,qBAAC,YAAD;EACE,gBAAcF;EACd,cAAY,CAACF,WAAW,gBAAgBC,KAAAA;EACxC,iBAAeL;EACJb;EACX,WAAWT,GAAG,uBAAuBU,UAAU;EACjCC;EACVK;EACEG;EACN,gBAAgBY,aAAa;AAC3BX,cAAWW,SAAS;;EAEfR;EACGV;EACV,GAAIW;EACCC;YAfP;GAiBGC,YACC,oBAAC,WAAD;IACed;IACHgB;IACV,SAASZ;IACCM;IACAT;cAETK;IAEJ,CAAA;GACAG,QAAQW,KAAKC,QAAQC,UACpB,oBAAC,OAAD;IAEE,WAAU;IACV,MAAK;cAEL,oBAAC,OAAD;KACE,IAAI,GAAGJ,OAAM,SAAUI,MAAK,GAAID,OAAOV;KACvC,OAAOU,OAAOf;KACd,OAAOe,OAAOV;KACd,aAAaU,OAAOrB;KACpB,UAAUC,YAAYoB,OAAOpB;KACnBe;KAAS,CAAA;IAGxB,EAbQ,GAAGE,OAAM,SAAUI,MAAK,GAAID,OAAOV,QAa3C,CAAC;GACDT,SAASe,SAAS,KACjB,oBAAC,iBAAD;IAAiB,UAAUf;IAAU,MAAK;IAC3C,CAAA;GACAc,YAAY,oBAAC,iBAAD;IAAiB,UAAUb;IAAQ,MAAK;IAAU,CAAA;GACpD;;EAGlB;AAED,MAAaoB,kBAAkBlC,2BAAW,SAASkC,gBACjDX,OACAC,KACA;AAGA,QAAO,oBADLpB,oBAA0CG,mBAAmB,EACxD;EAAW,GAAIgB;EAAYC;EAAO,CAAA;EACzC;AAEFU,gBAAgBE,cAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as RadioGroup, t as CustomizableRadioGroupProps } from "../../../radio-group-
|
|
1
|
+
import { n as RadioGroup, t as CustomizableRadioGroupProps } from "../../../radio-group-Bkli6nUz.js";
|
|
2
2
|
export { CustomizableRadioGroupProps, RadioGroup };
|
|
@@ -2,7 +2,7 @@ import React, { useId } from "react";
|
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
|
|
4
4
|
//#region src/ui/components/radio-group-field/radio-group.tsx
|
|
5
|
-
const RadioGroup = React.forwardRef(({ children, className, id: propId, name, ...props }, ref) => {
|
|
5
|
+
const RadioGroup = /* @__PURE__ */ React.forwardRef(({ children, className, id: propId, name, ...props }, ref) => {
|
|
6
6
|
const prefix = useId();
|
|
7
7
|
const id = propId ?? `${prefix}-radio-group`;
|
|
8
8
|
return /* @__PURE__ */ jsx(RadioGroupPrimitive.Root, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio-group.js","names":[],"sources":["../../../../src/ui/components/radio-group-field/radio-group.tsx"],"sourcesContent":["import React, { useId } from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\n\nexport interface CustomizableRadioGroupProps extends React.ComponentPropsWithoutRef<\n typeof RadioGroupPrimitive.Root\n> {\n children: React.ReactNode;\n className?: string;\n id?: string;\n name?: string;\n}\n\nexport const RadioGroup = React.forwardRef<\n React.ElementRef<typeof RadioGroupPrimitive.Root>,\n CustomizableRadioGroupProps\n>(({ children, className, id: propId, name, ...props }, ref) => {\n const prefix = useId();\n const id = propId ?? `${prefix}-radio-group`;\n\n return (\n <RadioGroupPrimitive.Root\n className={className}\n id={id}\n name={name}\n {...props}\n ref={ref}\n >\n {children}\n </RadioGroupPrimitive.Root>\n );\n});\n\nRadioGroup.displayName = \"RadioGroup\";\n"],"mappings":";;;;AAYA,
|
|
1
|
+
{"version":3,"file":"radio-group.js","names":["React","useId","RadioGroupPrimitive","RadioGroup","forwardRef","children","className","id","propId","name","props","ref","prefix","displayName"],"sources":["../../../../src/ui/components/radio-group-field/radio-group.tsx"],"sourcesContent":["import React, { useId } from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\n\nexport interface CustomizableRadioGroupProps extends React.ComponentPropsWithoutRef<\n typeof RadioGroupPrimitive.Root\n> {\n children: React.ReactNode;\n className?: string;\n id?: string;\n name?: string;\n}\n\nexport const RadioGroup = React.forwardRef<\n React.ElementRef<typeof RadioGroupPrimitive.Root>,\n CustomizableRadioGroupProps\n>(({ children, className, id: propId, name, ...props }, ref) => {\n const prefix = useId();\n const id = propId ?? `${prefix}-radio-group`;\n\n return (\n <RadioGroupPrimitive.Root\n className={className}\n id={id}\n name={name}\n {...props}\n ref={ref}\n >\n {children}\n </RadioGroupPrimitive.Root>\n );\n});\n\nRadioGroup.displayName = \"RadioGroup\";\n"],"mappings":";;;;AAYA,MAAaG,aAAaH,sBAAMI,YAG7B,EAAEC,UAAUC,WAAWC,IAAIC,QAAQC,MAAM,GAAGC,SAASC,QAAQ;CAC9D,MAAMC,SAASX,OAAO;CACtB,MAAMM,KAAKC,UAAU,GAAGI,OAAM;AAE9B,QACE,oBAAC,oBAAoB,MAArB;EACaN;EACPC;EACEE;EACN,GAAIC;EACCC;EAEJN;EACwB,CAAA;EAE7B;AAEFF,WAAWU,cAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as RadioProps, t as Radio } from "../../../radio-
|
|
1
|
+
import { n as RadioProps, t as Radio } from "../../../radio-eL0Oy86J.js";
|
|
2
2
|
export { Radio, RadioProps };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { t as cn } from "../../../src-
|
|
1
|
+
import { t as cn } from "../../../src-8xf1ueaA.js";
|
|
2
2
|
import { FormLabel } from "../form-label/form-label.js";
|
|
3
3
|
import React, { useId } from "react";
|
|
4
4
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
|
|
6
6
|
//#region src/ui/components/radio-group-field/radio.tsx
|
|
7
|
-
const Radio = React.forwardRef(({ className, description, disabled = false, hasError = false, id: propId, label, value, ...props }, ref) => {
|
|
7
|
+
const Radio = /* @__PURE__ */ React.forwardRef(({ className, description, disabled = false, hasError = false, id: propId, label, value, ...props }, ref) => {
|
|
8
8
|
const prefix = useId();
|
|
9
9
|
const id = propId ?? `${prefix}-radio`;
|
|
10
10
|
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(RadioGroupPrimitive.Item, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.js","names":[],"sources":["../../../../src/ui/components/radio-group-field/radio.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport React, { useId } from \"react\";\nimport { FormLabel } from \"../form-label/form-label.js\";\n\nexport interface RadioProps extends React.ComponentPropsWithoutRef<\n typeof RadioGroupPrimitive.Item\n> {\n className?: string;\n description?: string;\n disabled?: boolean;\n hasError?: boolean;\n id?: string;\n label: string;\n value: string;\n}\n\nexport const Radio = React.forwardRef<\n React.ElementRef<typeof RadioGroupPrimitive.Item>,\n RadioProps\n>(\n (\n {\n className,\n description,\n disabled = false,\n hasError = false,\n id: propId,\n label,\n value,\n ...props\n },\n ref,\n ) => {\n const prefix = useId();\n const id = propId ?? `${prefix}-radio`;\n\n return (\n <>\n <RadioGroupPrimitive.Item\n aria-disabled={disabled}\n aria-invalid={hasError}\n className={cn(\n \"group peer\",\n \"aspect-square size-4 rounded-full border border-gray-800 dark:border-gray-400\",\n \"hover:border-gray-900 dark:hover:border-gray-50\",\n disabled && [\n \"cursor-not-allowed border-gray-600 hover:border-gray-600\",\n \"dark:border-gray-600 dark:hover:border-gray-600\",\n ],\n hasError && [\n \"border-red-700 hover:border-red-900\",\n \"dark:border-red-700 dark:hover:border-red-900\",\n ],\n className,\n )}\n disabled={disabled}\n id={id}\n value={value}\n {...props}\n ref={ref}\n >\n <RadioGroupPrimitive.Indicator\n className={cn(\n \"relative flex size-full items-center justify-center\",\n \"after:absolute after:left-1/2 after:top-1/2 after:size-2.5\",\n \"after:-translate-x-1/2 after:-translate-y-1/2\",\n \"after:rounded-full after:bg-gray-800 after:content-['']\",\n \"dark:after:bg-gray-400\",\n !disabled && [\n \"group-hover:after:bg-gray-900\",\n \"dark:group-hover:after:bg-gray-50\",\n ],\n disabled && [\"after:bg-gray-600\", \"dark:after:bg-gray-600\"],\n )}\n />\n </RadioGroupPrimitive.Item>\n <FormLabel\n className={cn(\n !disabled &&\n !hasError && [\n \"cursor-pointer\",\n \"peer-hover:text-gray-900 dark:peer-hover:text-gray-50\",\n ],\n )}\n description={description}\n disabled={disabled}\n hasError={hasError}\n htmlFor={id}\n required={props.required}\n inline\n >\n {label}\n </FormLabel>\n </>\n );\n },\n);\n"],"mappings":";;;;;;AAiBA,
|
|
1
|
+
{"version":3,"file":"radio.js","names":["cn","RadioGroupPrimitive","React","useId","FormLabel","Radio","forwardRef","className","description","disabled","hasError","id","propId","label","value","props","ref","prefix","required"],"sources":["../../../../src/ui/components/radio-group-field/radio.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport React, { useId } from \"react\";\nimport { FormLabel } from \"../form-label/form-label.js\";\n\nexport interface RadioProps extends React.ComponentPropsWithoutRef<\n typeof RadioGroupPrimitive.Item\n> {\n className?: string;\n description?: string;\n disabled?: boolean;\n hasError?: boolean;\n id?: string;\n label: string;\n value: string;\n}\n\nexport const Radio = React.forwardRef<\n React.ElementRef<typeof RadioGroupPrimitive.Item>,\n RadioProps\n>(\n (\n {\n className,\n description,\n disabled = false,\n hasError = false,\n id: propId,\n label,\n value,\n ...props\n },\n ref,\n ) => {\n const prefix = useId();\n const id = propId ?? `${prefix}-radio`;\n\n return (\n <>\n <RadioGroupPrimitive.Item\n aria-disabled={disabled}\n aria-invalid={hasError}\n className={cn(\n \"group peer\",\n \"aspect-square size-4 rounded-full border border-gray-800 dark:border-gray-400\",\n \"hover:border-gray-900 dark:hover:border-gray-50\",\n disabled && [\n \"cursor-not-allowed border-gray-600 hover:border-gray-600\",\n \"dark:border-gray-600 dark:hover:border-gray-600\",\n ],\n hasError && [\n \"border-red-700 hover:border-red-900\",\n \"dark:border-red-700 dark:hover:border-red-900\",\n ],\n className,\n )}\n disabled={disabled}\n id={id}\n value={value}\n {...props}\n ref={ref}\n >\n <RadioGroupPrimitive.Indicator\n className={cn(\n \"relative flex size-full items-center justify-center\",\n \"after:absolute after:left-1/2 after:top-1/2 after:size-2.5\",\n \"after:-translate-x-1/2 after:-translate-y-1/2\",\n \"after:rounded-full after:bg-gray-800 after:content-['']\",\n \"dark:after:bg-gray-400\",\n !disabled && [\n \"group-hover:after:bg-gray-900\",\n \"dark:group-hover:after:bg-gray-50\",\n ],\n disabled && [\"after:bg-gray-600\", \"dark:after:bg-gray-600\"],\n )}\n />\n </RadioGroupPrimitive.Item>\n <FormLabel\n className={cn(\n !disabled &&\n !hasError && [\n \"cursor-pointer\",\n \"peer-hover:text-gray-900 dark:peer-hover:text-gray-50\",\n ],\n )}\n description={description}\n disabled={disabled}\n hasError={hasError}\n htmlFor={id}\n required={props.required}\n inline\n >\n {label}\n </FormLabel>\n </>\n );\n },\n);\n"],"mappings":";;;;;;AAiBA,MAAaK,QAAQH,sBAAMI,YAKvB,EACEC,WACAC,aACAC,WAAW,OACXC,WAAW,OACXC,IAAIC,QACJC,OACAC,OACA,GAAGC,SAELC,QACG;CACH,MAAMC,SAASd,OAAO;CACtB,MAAMQ,KAAKC,UAAU,GAAGK,OAAM;AAE9B,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,oBAAoB,MAArB;EACE,iBAAeR;EACf,gBAAcC;EACd,WAAWV,GACT,cACA,iFACA,mDACAS,YAAY,CACV,4DACA,kDACD,EACDC,YAAY,CACV,uCACA,gDACD,EACDH,UACD;EACSE;EACNE;EACGG;EACP,GAAIC;EACCC;YAEL,oBAAC,oBAAoB,WAArB,EACE,WAAWhB,GACT,uDACA,8DACA,iDACA,2DACA,0BACA,CAACS,YAAY,CACX,iCACA,oCACD,EACDA,YAAY,CAAC,qBAAqB,yBACpC,CAAC,EAAC,CAAA;EAEoB,CAAA,EAC1B,oBAAC,WAAD;EACE,WAAWT,GACT,CAACS,YACC,CAACC,YAAY,CACX,kBACA,wDAEN,CAAC;EACYF;EACHC;EACAC;EACV,SAASC;EACT,UAAUI,MAAMG;EAChB,QAAA;YAECL;EACQ,CAAA,CACV,EAAA,CAAA;EAGR"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-
|
|
2
|
-
import { t as SearchAutocomplete } from "../../../search-autocomplete-
|
|
3
|
-
import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-
|
|
1
|
+
import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-C04Q_Fan.js";
|
|
2
|
+
import { t as SearchAutocomplete } from "../../../search-autocomplete-BJJkrZ1i.js";
|
|
3
|
+
import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-IfcQ_gKh.js";
|
|
4
4
|
export { SearchAutocomplete, SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext, useSearchAutocomplete };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as SearchAutocomplete } from "../../../search-autocomplete-
|
|
1
|
+
import { t as SearchAutocomplete } from "../../../search-autocomplete-BJJkrZ1i.js";
|
|
2
2
|
export { SearchAutocomplete };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as cn } from "../../../src-
|
|
1
|
+
import { t as cn } from "../../../src-8xf1ueaA.js";
|
|
2
2
|
import { Popover, PopoverAnchor, PopoverContent } from "../popover/popover.js";
|
|
3
3
|
import { Input } from "../input/input.js";
|
|
4
4
|
import { useSearchAutocomplete } from "./use-search-autocomplete.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search-autocomplete.js","names":[],"sources":["../../../../src/ui/components/search-autocomplete/search-autocomplete.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport React, { useCallback, useState } from \"react\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport type { SearchAutocompleteProps } from \"./types.js\";\nimport { useSearchAutocomplete } from \"./use-search-autocomplete.js\";\n\nexport const SearchAutocomplete: React.FC<SearchAutocompleteProps> = (\n props,\n) => {\n const {\n fetchOptions,\n onSelect,\n selectLabel = \"Select\",\n selectingContent,\n placeholder = \"Search...\",\n disabled = false,\n loading: externalLoading = false,\n className,\n renderOption,\n renderRow,\n keepOpenSelector,\n debounceMs = 300,\n } = props;\n\n const {\n query,\n setQuery,\n results,\n isLoading,\n error,\n isOpen,\n setIsOpen,\n handleQueryChange,\n } = useSearchAutocomplete({ fetchOptions, debounceMs });\n\n const [selectingValue, setSelectingValue] = useState<string | null>(null);\n\n const handleInputChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n handleQueryChange(e.target.value);\n },\n [handleQueryChange],\n );\n\n const handleSelect = useCallback(\n async (value: string) => {\n setSelectingValue(value);\n try {\n await onSelect(value);\n setQuery(\"\");\n setIsOpen(false);\n } catch {\n // error handled by caller\n } finally {\n setSelectingValue(null);\n }\n },\n [onSelect, setQuery, setIsOpen],\n );\n\n const handleSubmit = useCallback(() => {\n if (query.trim()) {\n void handleSelect(query.trim());\n }\n }, [query, handleSelect]);\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n if (!fetchOptions && query.trim()) {\n handleSubmit();\n }\n }\n },\n [fetchOptions, query, handleSubmit],\n );\n\n const loading = isLoading || externalLoading;\n\n // Fallback: plain text input + submit when no fetchOptions\n if (!fetchOptions) {\n return (\n <div className={cn(\"flex items-center gap-2\", className)}>\n <Input\n value={query}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n disabled={disabled || selectingValue !== null}\n className=\"max-w-xs text-gray-700\"\n />\n <button\n onClick={handleSubmit}\n disabled={disabled || !query.trim() || selectingValue !== null}\n className=\"h-9 rounded-md bg-gray-900 px-4 text-sm font-semibold text-white transition-colors hover:bg-gray-800 disabled:cursor-not-allowed disabled:opacity-50\"\n >\n {selectLabel}\n </button>\n </div>\n );\n }\n\n return (\n <div className={cn(\"relative\", className)}>\n <Popover open={isOpen && results.length > 0} onOpenChange={setIsOpen}>\n <PopoverAnchor asChild>\n <Input\n value={query}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n disabled={disabled}\n className=\"max-w-xs text-gray-700\"\n />\n </PopoverAnchor>\n <PopoverContent\n align=\"start\"\n onOpenAutoFocus={(e) => e.preventDefault()}\n onInteractOutside={(e) => {\n if (keepOpenSelector) {\n const target = e.target as HTMLElement | null;\n if (target?.closest(keepOpenSelector)) {\n e.preventDefault();\n return;\n }\n }\n setIsOpen(false);\n }}\n className=\"max-h-80 overflow-visible p-1\"\n >\n <div className=\"max-h-80 overflow-y-auto\">\n {results.map((option) => {\n if (renderRow) {\n return (\n <div key={option.value} className=\"rounded-md\">\n {renderRow(option, {\n selectingValue,\n selectLabel,\n selectingContent,\n handleSelect: (value) => void handleSelect(value),\n })}\n </div>\n );\n }\n return (\n <div\n key={option.value}\n className=\"flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:bg-gray-100\"\n >\n {renderOption ? (\n <div className=\"min-w-0 flex-1\">{renderOption(option)}</div>\n ) : (\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate text-sm font-medium text-gray-900\">\n {option.label}\n </p>\n {option.version && (\n <p className=\"truncate text-xs text-gray-500\">\n v{option.version}\n </p>\n )}\n {option.description && (\n <p className=\"truncate text-xs text-gray-500\">\n {option.description}\n </p>\n )}\n {option.meta && (\n <p className=\"truncate text-xs text-gray-400\">\n {option.meta}\n </p>\n )}\n </div>\n )}\n {selectingValue === option.value && selectingContent ? (\n <div className=\"flex shrink-0 items-center justify-center\">\n {selectingContent}\n </div>\n ) : option.disabled ? (\n <span className=\"shrink-0 rounded-md bg-gray-100 px-3 py-1 text-xs font-medium text-gray-500\">\n {option.disabledLabel ?? \"Unavailable\"}\n </span>\n ) : (\n <button\n onClick={() => void handleSelect(option.value)}\n disabled={selectingValue === option.value}\n className=\"shrink-0 rounded-md bg-gray-900 px-3 py-1 text-xs font-medium text-white transition-colors hover:bg-gray-800 disabled:opacity-50\"\n >\n {selectingValue === option.value ? \"...\" : selectLabel}\n </button>\n )}\n </div>\n );\n })}\n </div>\n </PopoverContent>\n </Popover>\n {loading && <p className=\"mt-1 text-xs text-gray-500\">Searching...</p>}\n {error && <p className=\"mt-1 text-xs text-red-600\">{error}</p>}\n {!loading &&\n !error &&\n query.trim() &&\n results.length === 0 &&\n !isOpen && (\n <p className=\"mt-1 text-xs text-gray-500\">No results found</p>\n )}\n </div>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"search-autocomplete.js","names":["cn","React","useCallback","useState","Input","Popover","PopoverAnchor","PopoverContent","useSearchAutocomplete","SearchAutocomplete","props","fetchOptions","onSelect","selectLabel","selectingContent","placeholder","disabled","loading","externalLoading","className","renderOption","renderRow","keepOpenSelector","debounceMs","query","setQuery","results","isLoading","error","isOpen","setIsOpen","handleQueryChange","selectingValue","setSelectingValue","handleInputChange","e","target","value","handleSelect","handleSubmit","trim","handleKeyDown","key","preventDefault","length","closest","map","option","label","version","description","meta","disabledLabel"],"sources":["../../../../src/ui/components/search-autocomplete/search-autocomplete.tsx"],"sourcesContent":["import { cn } from \"#design-system\";\nimport React, { useCallback, useState } from \"react\";\nimport { Input } from \"../input/input.js\";\nimport { Popover, PopoverAnchor, PopoverContent } from \"../popover/popover.js\";\nimport type { SearchAutocompleteProps } from \"./types.js\";\nimport { useSearchAutocomplete } from \"./use-search-autocomplete.js\";\n\nexport const SearchAutocomplete: React.FC<SearchAutocompleteProps> = (\n props,\n) => {\n const {\n fetchOptions,\n onSelect,\n selectLabel = \"Select\",\n selectingContent,\n placeholder = \"Search...\",\n disabled = false,\n loading: externalLoading = false,\n className,\n renderOption,\n renderRow,\n keepOpenSelector,\n debounceMs = 300,\n } = props;\n\n const {\n query,\n setQuery,\n results,\n isLoading,\n error,\n isOpen,\n setIsOpen,\n handleQueryChange,\n } = useSearchAutocomplete({ fetchOptions, debounceMs });\n\n const [selectingValue, setSelectingValue] = useState<string | null>(null);\n\n const handleInputChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n handleQueryChange(e.target.value);\n },\n [handleQueryChange],\n );\n\n const handleSelect = useCallback(\n async (value: string) => {\n setSelectingValue(value);\n try {\n await onSelect(value);\n setQuery(\"\");\n setIsOpen(false);\n } catch {\n // error handled by caller\n } finally {\n setSelectingValue(null);\n }\n },\n [onSelect, setQuery, setIsOpen],\n );\n\n const handleSubmit = useCallback(() => {\n if (query.trim()) {\n void handleSelect(query.trim());\n }\n }, [query, handleSelect]);\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n if (!fetchOptions && query.trim()) {\n handleSubmit();\n }\n }\n },\n [fetchOptions, query, handleSubmit],\n );\n\n const loading = isLoading || externalLoading;\n\n // Fallback: plain text input + submit when no fetchOptions\n if (!fetchOptions) {\n return (\n <div className={cn(\"flex items-center gap-2\", className)}>\n <Input\n value={query}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n disabled={disabled || selectingValue !== null}\n className=\"max-w-xs text-gray-700\"\n />\n <button\n onClick={handleSubmit}\n disabled={disabled || !query.trim() || selectingValue !== null}\n className=\"h-9 rounded-md bg-gray-900 px-4 text-sm font-semibold text-white transition-colors hover:bg-gray-800 disabled:cursor-not-allowed disabled:opacity-50\"\n >\n {selectLabel}\n </button>\n </div>\n );\n }\n\n return (\n <div className={cn(\"relative\", className)}>\n <Popover open={isOpen && results.length > 0} onOpenChange={setIsOpen}>\n <PopoverAnchor asChild>\n <Input\n value={query}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n disabled={disabled}\n className=\"max-w-xs text-gray-700\"\n />\n </PopoverAnchor>\n <PopoverContent\n align=\"start\"\n onOpenAutoFocus={(e) => e.preventDefault()}\n onInteractOutside={(e) => {\n if (keepOpenSelector) {\n const target = e.target as HTMLElement | null;\n if (target?.closest(keepOpenSelector)) {\n e.preventDefault();\n return;\n }\n }\n setIsOpen(false);\n }}\n className=\"max-h-80 overflow-visible p-1\"\n >\n <div className=\"max-h-80 overflow-y-auto\">\n {results.map((option) => {\n if (renderRow) {\n return (\n <div key={option.value} className=\"rounded-md\">\n {renderRow(option, {\n selectingValue,\n selectLabel,\n selectingContent,\n handleSelect: (value) => void handleSelect(value),\n })}\n </div>\n );\n }\n return (\n <div\n key={option.value}\n className=\"flex items-center justify-between gap-2 rounded-md px-2 py-1.5 hover:bg-gray-100\"\n >\n {renderOption ? (\n <div className=\"min-w-0 flex-1\">{renderOption(option)}</div>\n ) : (\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate text-sm font-medium text-gray-900\">\n {option.label}\n </p>\n {option.version && (\n <p className=\"truncate text-xs text-gray-500\">\n v{option.version}\n </p>\n )}\n {option.description && (\n <p className=\"truncate text-xs text-gray-500\">\n {option.description}\n </p>\n )}\n {option.meta && (\n <p className=\"truncate text-xs text-gray-400\">\n {option.meta}\n </p>\n )}\n </div>\n )}\n {selectingValue === option.value && selectingContent ? (\n <div className=\"flex shrink-0 items-center justify-center\">\n {selectingContent}\n </div>\n ) : option.disabled ? (\n <span className=\"shrink-0 rounded-md bg-gray-100 px-3 py-1 text-xs font-medium text-gray-500\">\n {option.disabledLabel ?? \"Unavailable\"}\n </span>\n ) : (\n <button\n onClick={() => void handleSelect(option.value)}\n disabled={selectingValue === option.value}\n className=\"shrink-0 rounded-md bg-gray-900 px-3 py-1 text-xs font-medium text-white transition-colors hover:bg-gray-800 disabled:opacity-50\"\n >\n {selectingValue === option.value ? \"...\" : selectLabel}\n </button>\n )}\n </div>\n );\n })}\n </div>\n </PopoverContent>\n </Popover>\n {loading && <p className=\"mt-1 text-xs text-gray-500\">Searching...</p>}\n {error && <p className=\"mt-1 text-xs text-red-600\">{error}</p>}\n {!loading &&\n !error &&\n query.trim() &&\n results.length === 0 &&\n !isOpen && (\n <p className=\"mt-1 text-xs text-gray-500\">No results found</p>\n )}\n </div>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-
|
|
1
|
+
import { n as SearchAutocompleteProps, r as SearchAutocompleteRowContext, t as SearchAutocompleteOption } from "../../../types-C04Q_Fan.js";
|
|
2
2
|
export { SearchAutocompleteOption, SearchAutocompleteProps, SearchAutocompleteRowContext };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-
|
|
1
|
+
import { t as useSearchAutocomplete } from "../../../use-search-autocomplete-IfcQ_gKh.js";
|
|
2
2
|
export { useSearchAutocomplete };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-search-autocomplete.js","names":[],"sources":["../../../../src/ui/components/search-autocomplete/use-search-autocomplete.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { SearchAutocompleteOption } from \"./types.js\";\n\ninterface UseSearchAutocompleteOptions {\n fetchOptions?: (query: string) => Promise<SearchAutocompleteOption[]>;\n debounceMs: number;\n}\n\nexport function useSearchAutocomplete(options: UseSearchAutocompleteOptions) {\n const { fetchOptions, debounceMs } = options;\n\n const [query, setQuery] = useState(\"\");\n const [results, setResults] = useState<SearchAutocompleteOption[]>([]);\n const [isLoading, setIsLoading] = useState(false);\n const [error, setError] = useState<string | undefined>();\n const [isOpen, setIsOpen] = useState(false);\n\n const debounceRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n const abortRef = useRef<AbortController>(undefined);\n\n const fetchResults = useCallback(\n async (searchQuery: string) => {\n if (!fetchOptions) return;\n\n if (!searchQuery.trim()) {\n setResults([]);\n setIsLoading(false);\n return;\n }\n\n abortRef.current?.abort();\n const controller = new AbortController();\n abortRef.current = controller;\n\n setIsLoading(true);\n setError(undefined);\n\n try {\n const data = await fetchOptions(searchQuery);\n if (!controller.signal.aborted) {\n setResults(data);\n setIsOpen(data.length > 0);\n }\n } catch (err) {\n if (!controller.signal.aborted) {\n setError(\n err instanceof Error ? err.message : \"Failed to fetch results\",\n );\n setResults([]);\n }\n } finally {\n if (!controller.signal.aborted) {\n setIsLoading(false);\n }\n }\n },\n [fetchOptions],\n );\n\n const handleQueryChange = useCallback(\n (value: string) => {\n setQuery(value);\n\n if (debounceRef.current) {\n clearTimeout(debounceRef.current);\n }\n\n if (!value.trim()) {\n setResults([]);\n setIsOpen(false);\n setIsLoading(false);\n return;\n }\n\n setIsLoading(true);\n debounceRef.current = setTimeout(() => {\n fetchResults(value);\n }, debounceMs);\n },\n [debounceMs, fetchResults],\n );\n\n useEffect(() => {\n return () => {\n if (debounceRef.current) {\n clearTimeout(debounceRef.current);\n }\n abortRef.current?.abort();\n };\n }, []);\n\n return {\n query,\n setQuery,\n results,\n isLoading,\n error,\n isOpen,\n setIsOpen,\n handleQueryChange,\n };\n}\n"],"mappings":";;AAQA,
|
|
1
|
+
{"version":3,"file":"use-search-autocomplete.js","names":["useCallback","useEffect","useRef","useState","useSearchAutocomplete","options","fetchOptions","debounceMs","query","setQuery","results","setResults","isLoading","setIsLoading","error","setError","isOpen","setIsOpen","debounceRef","undefined","abortRef","fetchResults","searchQuery","trim","current","abort","controller","AbortController","data","signal","aborted","length","err","Error","message","handleQueryChange","value","clearTimeout","setTimeout"],"sources":["../../../../src/ui/components/search-autocomplete/use-search-autocomplete.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { SearchAutocompleteOption } from \"./types.js\";\n\ninterface UseSearchAutocompleteOptions {\n fetchOptions?: (query: string) => Promise<SearchAutocompleteOption[]>;\n debounceMs: number;\n}\n\nexport function useSearchAutocomplete(options: UseSearchAutocompleteOptions) {\n const { fetchOptions, debounceMs } = options;\n\n const [query, setQuery] = useState(\"\");\n const [results, setResults] = useState<SearchAutocompleteOption[]>([]);\n const [isLoading, setIsLoading] = useState(false);\n const [error, setError] = useState<string | undefined>();\n const [isOpen, setIsOpen] = useState(false);\n\n const debounceRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n const abortRef = useRef<AbortController>(undefined);\n\n const fetchResults = useCallback(\n async (searchQuery: string) => {\n if (!fetchOptions) return;\n\n if (!searchQuery.trim()) {\n setResults([]);\n setIsLoading(false);\n return;\n }\n\n abortRef.current?.abort();\n const controller = new AbortController();\n abortRef.current = controller;\n\n setIsLoading(true);\n setError(undefined);\n\n try {\n const data = await fetchOptions(searchQuery);\n if (!controller.signal.aborted) {\n setResults(data);\n setIsOpen(data.length > 0);\n }\n } catch (err) {\n if (!controller.signal.aborted) {\n setError(\n err instanceof Error ? err.message : \"Failed to fetch results\",\n );\n setResults([]);\n }\n } finally {\n if (!controller.signal.aborted) {\n setIsLoading(false);\n }\n }\n },\n [fetchOptions],\n );\n\n const handleQueryChange = useCallback(\n (value: string) => {\n setQuery(value);\n\n if (debounceRef.current) {\n clearTimeout(debounceRef.current);\n }\n\n if (!value.trim()) {\n setResults([]);\n setIsOpen(false);\n setIsLoading(false);\n return;\n }\n\n setIsLoading(true);\n debounceRef.current = setTimeout(() => {\n fetchResults(value);\n }, debounceMs);\n },\n [debounceMs, fetchResults],\n );\n\n useEffect(() => {\n return () => {\n if (debounceRef.current) {\n clearTimeout(debounceRef.current);\n }\n abortRef.current?.abort();\n };\n }, []);\n\n return {\n query,\n setQuery,\n results,\n isLoading,\n error,\n isOpen,\n setIsOpen,\n handleQueryChange,\n };\n}\n"],"mappings":";;AAQA,SAAgBI,sBAAsBC,SAAuC;CAC3E,MAAM,EAAEC,cAAcC,eAAeF;CAErC,MAAM,CAACG,OAAOC,YAAYN,SAAS,GAAG;CACtC,MAAM,CAACO,SAASC,cAAcR,SAAqC,EAAE,CAAC;CACtE,MAAM,CAACS,WAAWC,gBAAgBV,SAAS,MAAM;CACjD,MAAM,CAACW,OAAOC,YAAYZ,UAA8B;CACxD,MAAM,CAACa,QAAQC,aAAad,SAAS,MAAM;CAE3C,MAAMe,cAAchB,OAAsCiB,KAAAA,EAAU;CACpE,MAAMC,WAAWlB,OAAwBiB,KAAAA,EAAU;CAEnD,MAAME,eAAerB,YACnB,OAAOsB,gBAAwB;AAC7B,MAAI,CAAChB,aAAc;AAEnB,MAAI,CAACgB,YAAYC,MAAM,EAAE;AACvBZ,cAAW,EAAE,CAAC;AACdE,gBAAa,MAAM;AACnB;;AAGFO,WAASI,SAASC,OAAO;EACzB,MAAMC,aAAa,IAAIC,iBAAiB;AACxCP,WAASI,UAAUE;AAEnBb,eAAa,KAAK;AAClBE,WAASI,KAAAA,EAAU;AAEnB,MAAI;GACF,MAAMS,OAAO,MAAMtB,aAAagB,YAAY;AAC5C,OAAI,CAACI,WAAWG,OAAOC,SAAS;AAC9BnB,eAAWiB,KAAK;AAChBX,cAAUW,KAAKG,SAAS,EAAE;;WAErBC,KAAK;AACZ,OAAI,CAACN,WAAWG,OAAOC,SAAS;AAC9Bf,aACEiB,eAAeC,QAAQD,IAAIE,UAAU,0BACtC;AACDvB,eAAW,EAAE,CAAC;;YAER;AACR,OAAI,CAACe,WAAWG,OAAOC,QACrBjB,cAAa,MAAM;;IAIzB,CAACP,aACH,CAAC;CAED,MAAM6B,oBAAoBnC,aACvBoC,UAAkB;AACjB3B,WAAS2B,MAAM;AAEf,MAAIlB,YAAYM,QACda,cAAanB,YAAYM,QAAQ;AAGnC,MAAI,CAACY,MAAMb,MAAM,EAAE;AACjBZ,cAAW,EAAE,CAAC;AACdM,aAAU,MAAM;AAChBJ,gBAAa,MAAM;AACnB;;AAGFA,eAAa,KAAK;AAClBK,cAAYM,UAAUc,iBAAiB;AACrCjB,gBAAae,MAAM;KAClB7B,WAAW;IAEhB,CAACA,YAAYc,aACf,CAAC;AAEDpB,iBAAgB;AACd,eAAa;AACX,OAAIiB,YAAYM,QACda,cAAanB,YAAYM,QAAQ;AAEnCJ,YAASI,SAASC,OAAO;;IAE1B,EAAE,CAAC;AAEN,QAAO;EACLjB;EACAC;EACAC;EACAE;EACAE;EACAE;EACAC;EACAkB;EACD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as Content } from "../../../content-
|
|
1
|
+
import { t as Content } from "../../../content-DFFfr1mk.js";
|
|
2
2
|
export { Content };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { h as Icon, t as cn } from "../../../src-
|
|
1
|
+
import { h as Icon, t as cn } from "../../../src-8xf1ueaA.js";
|
|
2
2
|
import { CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "../command/command.js";
|
|
3
3
|
import { CommandItemList } from "./subcomponents/CommandItemList.js";
|
|
4
4
|
import { useEffect } from "react";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"content.js","names":[],"sources":["../../../../src/ui/components/select-field/content.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { useCommandState } from \"cmdk\";\nimport React, { useEffect } from \"react\";\nimport {\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n} from \"../command/command.js\";\nimport type { SelectProps } from \"../enum-field/types.js\";\nimport { CommandItemList } from \"./subcomponents/CommandItemList.js\";\ninterface ContentProps {\n searchable?: boolean;\n commandListRef: React.RefObject<HTMLDivElement | null>;\n multiple?: boolean;\n selectedValues: string[];\n selectionIcon: \"auto\" | \"checkmark\";\n selectionIconPosition: \"left\" | \"right\";\n options: SelectProps[\"options\"];\n favoriteOptions?: SelectProps[\"options\"];\n toggleAll: () => void;\n toggleOption: (value: string) => void;\n}\n\nexport const Content: React.FC<ContentProps> = ({\n searchable,\n commandListRef,\n multiple,\n selectedValues,\n selectionIcon,\n selectionIconPosition,\n options = [],\n toggleAll,\n toggleOption,\n favoriteOptions = [],\n}) => {\n const enabledOptions = options.filter((opt) => !opt.disabled);\n const hasAnyIcon = options.some((opt) => opt.icon);\n\n const cmdkSearch = useCommandState((state) => state.search);\n // scroll to top when search change\n useEffect(() => {\n commandListRef.current?.scrollTo({ top: 0, behavior: \"instant\" });\n }, [commandListRef, cmdkSearch]);\n\n return (\n <>\n {searchable && (\n <CommandInput\n placeholder=\"Search...\"\n onKeyDown={(e) => {\n const isOptionsRelatedKey = [\n \"ArrowUp\",\n \"ArrowDown\",\n \"Enter\",\n ].includes(e.key);\n if (!(isOptionsRelatedKey && enabledOptions.length > 0)) {\n e.stopPropagation();\n }\n }}\n wrapperClassName=\"rounded-t\"\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n <CommandList ref={commandListRef} tabIndex={!searchable ? 0 : undefined}>\n <CommandEmpty className=\"p-4 text-center text-[14px] font-normal leading-5 text-gray-700 dark:text-gray-400\">\n No results found.\n </CommandEmpty>\n {multiple && cmdkSearch === \"\" && (\n <CommandGroup className=\"pb-0\">\n <CommandItem\n value=\"select-all\"\n onSelect={toggleAll}\n disabled={false}\n className={cn(\n \"cursor-pointer\",\n \"data-[selected=true]:bg-gray-100 dark:data-[selected=true]:bg-gray-900\",\n )}\n role=\"option\"\n aria-selected={selectedValues.length === enabledOptions.length}\n >\n <div className=\"flex w-full items-center gap-2\">\n {selectionIcon === \"auto\" && (\n <div\n className={cn(\n \"flex size-4 items-center justify-center rounded-md border\",\n \"border-gray-700 dark:border-gray-400\",\n selectedValues.length === enabledOptions.length &&\n \"bg-gray-900 text-slate-50 dark:bg-gray-400 dark:text-black\",\n )}\n >\n {selectedValues.length === enabledOptions.length && (\n <Icon name=\"Checkmark\" size={16} />\n )}\n </div>\n )}\n {selectionIcon === \"checkmark\" &&\n !(selectionIconPosition === \"right\" && hasAnyIcon) && (\n <div className=\"size-4\">\n {selectionIconPosition === \"left\" &&\n selectedValues.length === enabledOptions.length && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n <span className=\"text-[14px] font-semibold leading-4 text-gray-900 dark:text-gray-50\">\n {selectedValues.length === enabledOptions.length\n ? \"Deselect All\"\n : \"Select All\"}\n </span>\n {selectionIcon === \"checkmark\" &&\n selectionIconPosition === \"right\" && (\n <div className=\"ml-auto size-4\">\n {selectedValues.length === enabledOptions.length && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n </div>\n </CommandItem>\n </CommandGroup>\n )}\n <CommandGroup\n className={multiple && cmdkSearch === \"\" ? \"pt-0\" : undefined}\n >\n <CommandItemList\n options={favoriteOptions}\n selectedValues={selectedValues}\n multiple={multiple}\n selectionIcon={selectionIcon}\n selectionIconPosition={selectionIconPosition}\n hasAnyIcon={hasAnyIcon}\n toggleOption={toggleOption}\n tabIndex={!searchable ? 0 : undefined}\n />\n\n {favoriteOptions.length > 0 && (\n <div className=\"my-1 border-b border-gray-300 dark:border-gray-600\" />\n )}\n <CommandItemList\n options={options}\n selectedValues={selectedValues}\n multiple={multiple}\n selectionIcon={selectionIcon}\n selectionIconPosition={selectionIconPosition}\n hasAnyIcon={hasAnyIcon}\n toggleOption={toggleOption}\n tabIndex={!searchable ? 0 : undefined}\n />\n </CommandGroup>\n </CommandList>\n </>\n );\n};\n"],"mappings":";;;;;;;AAyBA,
|
|
1
|
+
{"version":3,"file":"content.js","names":["cn","Icon","useCommandState","React","useEffect","CommandEmpty","CommandGroup","CommandInput","CommandItem","CommandList","CommandItemList","Content","searchable","commandListRef","multiple","selectedValues","selectionIcon","selectionIconPosition","options","toggleAll","toggleOption","favoriteOptions","enabledOptions","filter","opt","disabled","hasAnyIcon","some","icon","cmdkSearch","state","search","current","scrollTo","top","behavior","e","isOptionsRelatedKey","includes","key","length","stopPropagation","undefined"],"sources":["../../../../src/ui/components/select-field/content.tsx"],"sourcesContent":["import { cn, Icon } from \"#design-system\";\nimport { useCommandState } from \"cmdk\";\nimport React, { useEffect } from \"react\";\nimport {\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n} from \"../command/command.js\";\nimport type { SelectProps } from \"../enum-field/types.js\";\nimport { CommandItemList } from \"./subcomponents/CommandItemList.js\";\ninterface ContentProps {\n searchable?: boolean;\n commandListRef: React.RefObject<HTMLDivElement | null>;\n multiple?: boolean;\n selectedValues: string[];\n selectionIcon: \"auto\" | \"checkmark\";\n selectionIconPosition: \"left\" | \"right\";\n options: SelectProps[\"options\"];\n favoriteOptions?: SelectProps[\"options\"];\n toggleAll: () => void;\n toggleOption: (value: string) => void;\n}\n\nexport const Content: React.FC<ContentProps> = ({\n searchable,\n commandListRef,\n multiple,\n selectedValues,\n selectionIcon,\n selectionIconPosition,\n options = [],\n toggleAll,\n toggleOption,\n favoriteOptions = [],\n}) => {\n const enabledOptions = options.filter((opt) => !opt.disabled);\n const hasAnyIcon = options.some((opt) => opt.icon);\n\n const cmdkSearch = useCommandState((state) => state.search);\n // scroll to top when search change\n useEffect(() => {\n commandListRef.current?.scrollTo({ top: 0, behavior: \"instant\" });\n }, [commandListRef, cmdkSearch]);\n\n return (\n <>\n {searchable && (\n <CommandInput\n placeholder=\"Search...\"\n onKeyDown={(e) => {\n const isOptionsRelatedKey = [\n \"ArrowUp\",\n \"ArrowDown\",\n \"Enter\",\n ].includes(e.key);\n if (!(isOptionsRelatedKey && enabledOptions.length > 0)) {\n e.stopPropagation();\n }\n }}\n wrapperClassName=\"rounded-t\"\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n <CommandList ref={commandListRef} tabIndex={!searchable ? 0 : undefined}>\n <CommandEmpty className=\"p-4 text-center text-[14px] font-normal leading-5 text-gray-700 dark:text-gray-400\">\n No results found.\n </CommandEmpty>\n {multiple && cmdkSearch === \"\" && (\n <CommandGroup className=\"pb-0\">\n <CommandItem\n value=\"select-all\"\n onSelect={toggleAll}\n disabled={false}\n className={cn(\n \"cursor-pointer\",\n \"data-[selected=true]:bg-gray-100 dark:data-[selected=true]:bg-gray-900\",\n )}\n role=\"option\"\n aria-selected={selectedValues.length === enabledOptions.length}\n >\n <div className=\"flex w-full items-center gap-2\">\n {selectionIcon === \"auto\" && (\n <div\n className={cn(\n \"flex size-4 items-center justify-center rounded-md border\",\n \"border-gray-700 dark:border-gray-400\",\n selectedValues.length === enabledOptions.length &&\n \"bg-gray-900 text-slate-50 dark:bg-gray-400 dark:text-black\",\n )}\n >\n {selectedValues.length === enabledOptions.length && (\n <Icon name=\"Checkmark\" size={16} />\n )}\n </div>\n )}\n {selectionIcon === \"checkmark\" &&\n !(selectionIconPosition === \"right\" && hasAnyIcon) && (\n <div className=\"size-4\">\n {selectionIconPosition === \"left\" &&\n selectedValues.length === enabledOptions.length && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n <span className=\"text-[14px] font-semibold leading-4 text-gray-900 dark:text-gray-50\">\n {selectedValues.length === enabledOptions.length\n ? \"Deselect All\"\n : \"Select All\"}\n </span>\n {selectionIcon === \"checkmark\" &&\n selectionIconPosition === \"right\" && (\n <div className=\"ml-auto size-4\">\n {selectedValues.length === enabledOptions.length && (\n <Icon\n name=\"Checkmark\"\n size={16}\n className=\"text-gray-900 dark:text-gray-50\"\n />\n )}\n </div>\n )}\n </div>\n </CommandItem>\n </CommandGroup>\n )}\n <CommandGroup\n className={multiple && cmdkSearch === \"\" ? \"pt-0\" : undefined}\n >\n <CommandItemList\n options={favoriteOptions}\n selectedValues={selectedValues}\n multiple={multiple}\n selectionIcon={selectionIcon}\n selectionIconPosition={selectionIconPosition}\n hasAnyIcon={hasAnyIcon}\n toggleOption={toggleOption}\n tabIndex={!searchable ? 0 : undefined}\n />\n\n {favoriteOptions.length > 0 && (\n <div className=\"my-1 border-b border-gray-300 dark:border-gray-600\" />\n )}\n <CommandItemList\n options={options}\n selectedValues={selectedValues}\n multiple={multiple}\n selectionIcon={selectionIcon}\n selectionIconPosition={selectionIconPosition}\n hasAnyIcon={hasAnyIcon}\n toggleOption={toggleOption}\n tabIndex={!searchable ? 0 : undefined}\n />\n </CommandGroup>\n </CommandList>\n </>\n );\n};\n"],"mappings":";;;;;;;AAyBA,MAAaW,WAAmC,EAC9CC,YACAC,gBACAC,UACAC,gBACAC,eACAC,uBACAC,UAAU,EAAE,EACZC,WACAC,cACAC,kBAAkB,EAAA,OACd;CACJ,MAAMC,iBAAiBJ,QAAQK,QAAQC,QAAQ,CAACA,IAAIC,SAAS;CAC7D,MAAMC,aAAaR,QAAQS,MAAMH,QAAQA,IAAII,KAAK;CAElD,MAAMC,aAAa3B,iBAAiB4B,UAAUA,MAAMC,OAAO;AAE3D3B,iBAAgB;AACdS,iBAAemB,SAASC,SAAS;GAAEC,KAAK;GAAGC,UAAU;GAAW,CAAC;IAChE,CAACtB,gBAAgBgB,WAAW,CAAC;AAEhC,QACE,qBAAA,YAAA,EAAA,UAAA,CACGjB,cACC,oBAAC,cAAD;EACE,aAAY;EACZ,YAAYwB,MAAM;AAMhB,OAAI,EALwB;IAC1B;IACA;IACA;IACD,CAACE,SAASF,EAAEG,IAAI,IACYjB,eAAekB,SAAS,GACnDJ,GAAEK,iBAAiB;;EAGvB,kBAAiB;EACjB,WAAU;EAEb,CAAA,EACD,qBAAC,aAAD;EAAa,KAAK5B;EAAgB,UAAU,CAACD,aAAa,IAAI8B,KAAAA;YAA9D;GACE,oBAAC,cAAD;IAAc,WAAU;cAAoF;IAE9F,CAAA;GACb5B,YAAYe,eAAe,MAC1B,oBAAC,cAAD;IAAc,WAAU;cACtB,oBAAC,aAAD;KACE,OAAM;KACN,UAAUV;KACV,UAAU;KACV,WAAWnB,GACT,kBACA,yEACD;KACD,MAAK;KACL,iBAAee,eAAeyB,WAAWlB,eAAekB;eAExD,qBAAC,OAAD;MAAK,WAAU;gBAAf;OACGxB,kBAAkB,UACjB,oBAAC,OAAD;QACE,WAAWhB,GACT,6DACA,wCACAe,eAAeyB,WAAWlB,eAAekB,UACvC,6DACH;kBAEAzB,eAAeyB,WAAWlB,eAAekB,UACxC,oBAAC,MAAD;SAAM,MAAK;SAAY,MAAM;SAC9B,CAAA;QAEJ,CAAA;OACAxB,kBAAkB,eACjB,EAAEC,0BAA0B,WAAWS,eACrC,oBAAC,OAAD;QAAK,WAAU;kBACZT,0BAA0B,UACzBF,eAAeyB,WAAWlB,eAAekB,UACvC,oBAAC,MAAD;SACE,MAAK;SACL,MAAM;SACN,WAAU;SAEb,CAAA;QAEN,CAAA;OACH,oBAAC,QAAD;QAAM,WAAU;kBACbzB,eAAeyB,WAAWlB,eAAekB,SACtC,iBACA;QACA,CAAA;OACLxB,kBAAkB,eACjBC,0BAA0B,WACxB,oBAAC,OAAD;QAAK,WAAU;kBACZF,eAAeyB,WAAWlB,eAAekB,UACxC,oBAAC,MAAD;SACE,MAAK;SACL,MAAM;SACN,WAAU;SAEb,CAAA;QAEJ,CAAA;OACA;;KACM,CAAA;IAEhB,CAAA;GACD,qBAAC,cAAD;IACE,WAAW1B,YAAYe,eAAe,KAAK,SAASa,KAAAA;cADtD;KAGE,oBAAC,iBAAD;MACE,SAASrB;MACON;MACND;MACKE;MACQC;MACXS;MACEN;MACd,UAAU,CAACR,aAAa,IAAI8B,KAAAA;MAAU,CAAA;KAGvCrB,gBAAgBmB,SAAS,KACxB,oBAAC,OAAD,EAAK,WAAU,sDAChB,CAAA;KACD,oBAAC,iBAAD;MACWtB;MACOH;MACND;MACKE;MACQC;MACXS;MACEN;MACd,UAAU,CAACR,aAAa,IAAI8B,KAAAA;MAAU,CAAA;KAE5B;;GACH;IACZ,EAAA,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as SelectFieldProps, r as SelectFieldRaw, t as SelectField } from "../../../select-field-
|
|
1
|
+
import { n as SelectFieldProps, r as SelectFieldRaw, t as SelectField } from "../../../select-field-D27IGJrV.js";
|
|
2
2
|
export { SelectField, SelectFieldProps, SelectFieldRaw };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as cn } from "../../../src-
|
|
1
|
+
import { t as cn } from "../../../src-8xf1ueaA.js";
|
|
2
2
|
import { Button } from "../button/button.js";
|
|
3
3
|
import { FormLabel } from "../form-label/form-label.js";
|
|
4
4
|
import { FormMessageList } from "../form-message/message-list.js";
|
|
@@ -13,7 +13,7 @@ import { useSelectField } from "./use-select-field.js";
|
|
|
13
13
|
import React, { useCallback, useId } from "react";
|
|
14
14
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
15
15
|
//#region src/ui/components/select-field/select-field.tsx
|
|
16
|
-
const SelectFieldRaw = React.forwardRef(({ options = [], favoriteOptions = [], defaultValue, value, onChange, onBlur, id: propId, name, label, required, disabled, errors = [], warnings = [], multiple, selectionIcon = "auto", selectionIconPosition = "left", searchable, description, placeholder, className, contentClassName, contentAlign = "start", ...props }, ref) => {
|
|
16
|
+
const SelectFieldRaw = /* @__PURE__ */ React.forwardRef(({ options = [], favoriteOptions = [], defaultValue, value, onChange, onBlur, id: propId, name, label, required, disabled, errors = [], warnings = [], multiple, selectionIcon = "auto", selectionIconPosition = "left", searchable, description, placeholder, className, contentClassName, contentAlign = "start", ...props }, ref) => {
|
|
17
17
|
const prefix = useId();
|
|
18
18
|
const id = propId ?? `${prefix}-select`;
|
|
19
19
|
const { selectedValues, isPopoverOpen, commandListRef, toggleOption, handleClear, toggleAll, handleOpenChange } = useSelectField({
|