@intlayer/design-system 7.2.1-canary.1 → 7.2.2
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/esm/components/Accordion/Accordion.mjs +1 -2
- package/dist/esm/components/Accordion/Accordion.mjs.map +1 -1
- package/dist/esm/components/Avatar/index.mjs +1 -1
- package/dist/esm/components/Breadcrumb/index.mjs +1 -2
- package/dist/esm/components/Breadcrumb/index.mjs.map +1 -1
- package/dist/esm/components/Browser/Browser.mjs +1 -2
- package/dist/esm/components/Browser/Browser.mjs.map +1 -1
- package/dist/esm/components/ClickOutsideDiv/index.mjs +0 -1
- package/dist/esm/components/ClickOutsideDiv/index.mjs.map +1 -1
- package/dist/esm/components/CollapsibleTable/CollapsibleTable.mjs +1 -2
- package/dist/esm/components/CollapsibleTable/CollapsibleTable.mjs.map +1 -1
- package/dist/esm/components/Command/index.mjs +0 -1
- package/dist/esm/components/Command/index.mjs.map +1 -1
- package/dist/esm/components/ContentEditor/ContentEditor.mjs +1 -2
- package/dist/esm/components/ContentEditor/ContentEditor.mjs.map +1 -1
- package/dist/esm/components/ContentEditor/ContentEditorInput.mjs +1 -2
- package/dist/esm/components/ContentEditor/ContentEditorInput.mjs.map +1 -1
- package/dist/esm/components/ContentEditor/ContentEditorTextArea.mjs +2 -3
- package/dist/esm/components/ContentEditor/ContentEditorTextArea.mjs.map +1 -1
- package/dist/esm/components/ContentSelector/ContentSelector.mjs +0 -1
- package/dist/esm/components/ContentSelector/ContentSelector.mjs.map +1 -1
- package/dist/esm/components/CopyButton/index.mjs +1 -2
- package/dist/esm/components/CopyButton/index.mjs.map +1 -1
- package/dist/esm/components/CopyToClipboard/index.mjs +1 -2
- package/dist/esm/components/CopyToClipboard/index.mjs.map +1 -1
- package/dist/esm/components/DictionaryEditor/DictionaryEditor.mjs +1 -2
- package/dist/esm/components/DictionaryEditor/DictionaryEditor.mjs.map +1 -1
- package/dist/esm/components/DictionaryEditor/NodeWrapper/FileWrapper.mjs +1 -1
- package/dist/esm/components/DictionaryEditor/NodeWrapper/StringWrapper.mjs +1 -1
- package/dist/esm/components/DictionaryEditor/NodeWrapper/index.mjs +1 -2
- package/dist/esm/components/DictionaryEditor/NodeWrapper/index.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/ContentEditor.mjs +1 -2
- package/dist/esm/components/DictionaryFieldEditor/ContentEditor.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/ContentEditorView/TextEditor.mjs +3 -4
- package/dist/esm/components/DictionaryFieldEditor/ContentEditorView/TextEditor.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.mjs +1 -2
- package/dist/esm/components/DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/DictionaryDetails/DictionaryDetailsForm.mjs +4 -5
- package/dist/esm/components/DictionaryFieldEditor/DictionaryDetails/DictionaryDetailsForm.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/DictionaryFieldEditor.mjs +2 -3
- package/dist/esm/components/DictionaryFieldEditor/DictionaryFieldEditor.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/EnumKeyInput.mjs +0 -1
- package/dist/esm/components/DictionaryFieldEditor/EnumKeyInput.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/JSONEditor.mjs +1 -1
- package/dist/esm/components/DictionaryFieldEditor/NavigationView/NavigationViewNode.mjs +2 -2
- package/dist/esm/components/DictionaryFieldEditor/NodeTypeSelector.mjs +0 -1
- package/dist/esm/components/DictionaryFieldEditor/NodeTypeSelector.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/SaveForm/SaveForm.mjs +4 -5
- package/dist/esm/components/DictionaryFieldEditor/SaveForm/SaveForm.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/StructureEditor.mjs +1 -2
- package/dist/esm/components/DictionaryFieldEditor/StructureEditor.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/StructureView/StructureView.mjs +1 -2
- package/dist/esm/components/DictionaryFieldEditor/StructureView/StructureView.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs +0 -1
- package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs.map +1 -1
- package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.mjs +0 -1
- package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.mjs.map +1 -1
- package/dist/esm/components/EditableField/EditableFieldInput.mjs +0 -1
- package/dist/esm/components/EditableField/EditableFieldInput.mjs.map +1 -1
- package/dist/esm/components/EditableField/EditableFieldLayout.mjs +1 -2
- package/dist/esm/components/EditableField/EditableFieldLayout.mjs.map +1 -1
- package/dist/esm/components/EditableField/EditableFieldTextArea.mjs +0 -1
- package/dist/esm/components/EditableField/EditableFieldTextArea.mjs.map +1 -1
- package/dist/esm/components/ExpandCollapse/ExpandCollapse.mjs +0 -1
- package/dist/esm/components/ExpandCollapse/ExpandCollapse.mjs.map +1 -1
- package/dist/esm/components/Form/FormBase.mjs +0 -1
- package/dist/esm/components/Form/FormBase.mjs.map +1 -1
- package/dist/esm/components/Form/FormControl.mjs +0 -1
- package/dist/esm/components/Form/FormControl.mjs.map +1 -1
- package/dist/esm/components/Form/FormDescription.mjs +0 -1
- package/dist/esm/components/Form/FormDescription.mjs.map +1 -1
- package/dist/esm/components/Form/FormField.mjs +0 -1
- package/dist/esm/components/Form/FormField.mjs.map +1 -1
- package/dist/esm/components/Form/FormItem.mjs +0 -1
- package/dist/esm/components/Form/FormItem.mjs.map +1 -1
- package/dist/esm/components/Form/FormLabel.mjs +0 -1
- package/dist/esm/components/Form/FormLabel.mjs.map +1 -1
- package/dist/esm/components/Form/FormMessage.mjs +0 -1
- package/dist/esm/components/Form/FormMessage.mjs.map +1 -1
- package/dist/esm/components/Form/elements/FormElement.mjs +0 -1
- package/dist/esm/components/Form/elements/FormElement.mjs.map +1 -1
- package/dist/esm/components/Form/elements/FormElementWrapper.mjs +0 -1
- package/dist/esm/components/Form/elements/FormElementWrapper.mjs.map +1 -1
- package/dist/esm/components/Form/elements/MultiselectElement.mjs +0 -1
- package/dist/esm/components/Form/elements/MultiselectElement.mjs.map +1 -1
- package/dist/esm/components/Form/elements/OTPElement.mjs +0 -1
- package/dist/esm/components/Form/elements/OTPElement.mjs.map +1 -1
- package/dist/esm/components/Form/elements/SelectElement.mjs +0 -1
- package/dist/esm/components/Form/elements/SelectElement.mjs.map +1 -1
- package/dist/esm/components/Form/elements/SwitchSelectorElement.mjs +0 -1
- package/dist/esm/components/Form/elements/SwitchSelectorElement.mjs.map +1 -1
- package/dist/esm/components/HeightResizer/index.mjs +0 -1
- package/dist/esm/components/HeightResizer/index.mjs.map +1 -1
- package/dist/esm/components/HideShow/index.mjs +1 -2
- package/dist/esm/components/HideShow/index.mjs.map +1 -1
- package/dist/esm/components/IDE/CodeBlockShiki.mjs +0 -1
- package/dist/esm/components/IDE/CodeBlockShiki.mjs.map +1 -1
- package/dist/esm/components/IDE/CodeConditionalRenderer.mjs +0 -1
- package/dist/esm/components/IDE/CodeConditionalRenderer.mjs.map +1 -1
- package/dist/esm/components/IDE/CodeContext.mjs +0 -1
- package/dist/esm/components/IDE/CodeContext.mjs.map +1 -1
- package/dist/esm/components/IDE/CodeFormatSelector.mjs +0 -1
- package/dist/esm/components/IDE/CodeFormatSelector.mjs.map +1 -1
- package/dist/esm/components/IDE/ContentDeclarationFormatSelector.mjs +0 -1
- package/dist/esm/components/IDE/ContentDeclarationFormatSelector.mjs.map +1 -1
- package/dist/esm/components/IDE/CopyCode.mjs +0 -1
- package/dist/esm/components/IDE/CopyCode.mjs.map +1 -1
- package/dist/esm/components/IDE/FileTree.mjs +1 -2
- package/dist/esm/components/IDE/FileTree.mjs.map +1 -1
- package/dist/esm/components/IDE/IDE.mjs +0 -1
- package/dist/esm/components/IDE/IDE.mjs.map +1 -1
- package/dist/esm/components/IDE/MonacoCode.mjs +0 -1
- package/dist/esm/components/IDE/MonacoCode.mjs.map +1 -1
- package/dist/esm/components/IDE/PackageManagerSelector.mjs +0 -1
- package/dist/esm/components/IDE/PackageManagerSelector.mjs.map +1 -1
- package/dist/esm/components/Input/InputPassword.mjs +1 -2
- package/dist/esm/components/Input/InputPassword.mjs.map +1 -1
- package/dist/esm/components/Input/OTPInput.mjs +1 -2
- package/dist/esm/components/Input/OTPInput.mjs.map +1 -1
- package/dist/esm/components/KeyboardScreenAdapter/index.mjs +1 -2
- package/dist/esm/components/KeyboardScreenAdapter/index.mjs.map +1 -1
- package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs +2 -3
- package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs.map +1 -1
- package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.mjs +0 -1
- package/dist/esm/components/LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.mjs.map +1 -1
- package/dist/esm/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs +1 -2
- package/dist/esm/components/LocaleSwitcherDropDown/LocaleSwitcher.mjs.map +1 -1
- package/dist/esm/components/Modal/Modal.mjs +3 -4
- package/dist/esm/components/Modal/Modal.mjs.map +1 -1
- package/dist/esm/components/Navbar/DesktopNavbar.mjs +0 -1
- package/dist/esm/components/Navbar/DesktopNavbar.mjs.map +1 -1
- package/dist/esm/components/Navbar/MobileNavbar.mjs +2 -3
- package/dist/esm/components/Navbar/MobileNavbar.mjs.map +1 -1
- package/dist/esm/components/Navbar/index.mjs +0 -1
- package/dist/esm/components/Navbar/index.mjs.map +1 -1
- package/dist/esm/components/Navbar/useNavigation.mjs +0 -1
- package/dist/esm/components/Navbar/useNavigation.mjs.map +1 -1
- package/dist/esm/components/Pagination/NumberItemsSelector.mjs +0 -1
- package/dist/esm/components/Pagination/NumberItemsSelector.mjs.map +1 -1
- package/dist/esm/components/Pagination/Pagination.mjs +0 -1
- package/dist/esm/components/Pagination/Pagination.mjs.map +1 -1
- package/dist/esm/components/Pagination/ShowingResultsNumberItems.mjs +0 -1
- package/dist/esm/components/Pagination/ShowingResultsNumberItems.mjs.map +1 -1
- package/dist/esm/components/Popover/dynamic.mjs +0 -1
- package/dist/esm/components/Popover/dynamic.mjs.map +1 -1
- package/dist/esm/components/PressableSpan/PressableSpan.mjs +0 -1
- package/dist/esm/components/PressableSpan/PressableSpan.mjs.map +1 -1
- package/dist/esm/components/RightDrawer/RightDrawer.mjs +3 -4
- package/dist/esm/components/RightDrawer/RightDrawer.mjs.map +1 -1
- package/dist/esm/components/Select/Multiselect.mjs +1 -2
- package/dist/esm/components/Select/Multiselect.mjs.map +1 -1
- package/dist/esm/components/Select/Select.mjs +0 -1
- package/dist/esm/components/Select/Select.mjs.map +1 -1
- package/dist/esm/components/SwitchSelector/index.mjs +1 -2
- package/dist/esm/components/SwitchSelector/index.mjs.map +1 -1
- package/dist/esm/components/Tab/Tab.mjs +1 -2
- package/dist/esm/components/Tab/Tab.mjs.map +1 -1
- package/dist/esm/components/Tab/TabContext.mjs +0 -1
- package/dist/esm/components/Tab/TabContext.mjs.map +1 -1
- package/dist/esm/components/TabSelector/TabSelector.mjs +1 -2
- package/dist/esm/components/TabSelector/TabSelector.mjs.map +1 -1
- package/dist/esm/components/Table/Table.mjs +1 -2
- package/dist/esm/components/Table/Table.mjs.map +1 -1
- package/dist/esm/components/TextArea/AutoSizeTextArea.mjs +0 -1
- package/dist/esm/components/TextArea/AutoSizeTextArea.mjs.map +1 -1
- package/dist/esm/components/TextArea/AutocompleteTextArea.mjs +1 -2
- package/dist/esm/components/TextArea/AutocompleteTextArea.mjs.map +1 -1
- package/dist/esm/components/ThemeSwitcherDropDown/DesktopThemeSwitcher.mjs +1 -2
- package/dist/esm/components/ThemeSwitcherDropDown/DesktopThemeSwitcher.mjs.map +1 -1
- package/dist/esm/components/ThemeSwitcherDropDown/MobileThemeSwitcher.mjs +1 -2
- package/dist/esm/components/ThemeSwitcherDropDown/MobileThemeSwitcher.mjs.map +1 -1
- package/dist/esm/components/Toaster/Toast.mjs +0 -1
- package/dist/esm/components/Toaster/Toast.mjs.map +1 -1
- package/dist/esm/components/Toaster/Toaster.mjs +0 -1
- package/dist/esm/components/Toaster/Toaster.mjs.map +1 -1
- package/dist/esm/components/Toaster/useToast.mjs +0 -1
- package/dist/esm/components/Toaster/useToast.mjs.map +1 -1
- package/dist/esm/components/WithResizer/index.mjs +0 -1
- package/dist/esm/components/WithResizer/index.mjs.map +1 -1
- package/dist/esm/hooks/reactQuery.mjs +0 -1
- package/dist/esm/hooks/reactQuery.mjs.map +1 -1
- package/dist/esm/hooks/useAuth/useAuth.mjs +0 -1
- package/dist/esm/hooks/useAuth/useAuth.mjs.map +1 -1
- package/dist/esm/hooks/useAuth/useOAuth2.mjs +0 -1
- package/dist/esm/hooks/useAuth/useOAuth2.mjs.map +1 -1
- package/dist/esm/hooks/useAuth/useSession.mjs +0 -1
- package/dist/esm/hooks/useAuth/useSession.mjs.map +1 -1
- package/dist/esm/hooks/useDevice.mjs +0 -1
- package/dist/esm/hooks/useDevice.mjs.map +1 -1
- package/dist/esm/hooks/useGetElementOrWindow.mjs +0 -1
- package/dist/esm/hooks/useGetElementOrWindow.mjs.map +1 -1
- package/dist/esm/hooks/useHorizontalSwipe.mjs +0 -1
- package/dist/esm/hooks/useHorizontalSwipe.mjs.map +1 -1
- package/dist/esm/hooks/useIsDarkMode.mjs +0 -1
- package/dist/esm/hooks/useIsDarkMode.mjs.map +1 -1
- package/dist/esm/hooks/useIsMounted.mjs +0 -1
- package/dist/esm/hooks/useIsMounted.mjs.map +1 -1
- package/dist/esm/hooks/useItemSelector.mjs +0 -1
- package/dist/esm/hooks/useItemSelector.mjs.map +1 -1
- package/dist/esm/hooks/useKeyboardDetector.mjs +0 -1
- package/dist/esm/hooks/useKeyboardDetector.mjs.map +1 -1
- package/dist/esm/hooks/usePersistedStore.mjs +0 -1
- package/dist/esm/hooks/usePersistedStore.mjs.map +1 -1
- package/dist/esm/hooks/useScreenWidth.mjs +0 -1
- package/dist/esm/hooks/useScreenWidth.mjs.map +1 -1
- package/dist/esm/hooks/useScrollBlockage/index.mjs +0 -1
- package/dist/esm/hooks/useScrollBlockage/index.mjs.map +1 -1
- package/dist/esm/hooks/useScrollDetection.mjs +0 -1
- package/dist/esm/hooks/useScrollDetection.mjs.map +1 -1
- package/dist/esm/hooks/useScrollY.mjs +0 -1
- package/dist/esm/hooks/useScrollY.mjs.map +1 -1
- package/dist/esm/hooks/useSearch.mjs +0 -1
- package/dist/esm/hooks/useSearch.mjs.map +1 -1
- package/dist/esm/hooks/useUser/index.mjs +0 -1
- package/dist/esm/hooks/useUser/index.mjs.map +1 -1
- package/dist/esm/providers/ReactQueryProvider.mjs +1 -2
- package/dist/esm/providers/ReactQueryProvider.mjs.map +1 -1
- package/dist/types/components/Badge/index.d.ts +2 -2
- package/dist/types/components/Breadcrumb/breadcrumb.content.d.ts +3 -3
- package/dist/types/components/Breadcrumb/breadcrumb.content.d.ts.map +1 -1
- package/dist/types/components/Breadcrumb/index.d.ts +2 -2
- package/dist/types/components/Browser/Browser.content.d.ts +11 -11
- package/dist/types/components/Button/Button.d.ts +6 -6
- package/dist/types/components/CollapsibleTable/CollapsibleTable.d.ts +2 -2
- package/dist/types/components/CollapsibleTable/CollapsibleTable.d.ts.map +1 -1
- package/dist/types/components/Command/index.d.ts +20 -20
- package/dist/types/components/Container/index.d.ts +9 -9
- package/dist/types/components/Container/index.d.ts.map +1 -1
- package/dist/types/components/CopyButton/CopyButton.content.d.ts +3 -3
- package/dist/types/components/CopyButton/CopyButton.content.d.ts.map +1 -1
- package/dist/types/components/DictionaryFieldEditor/DictionaryCreationForm/dictionaryCreationForm.content.d.ts +25 -25
- package/dist/types/components/DictionaryFieldEditor/DictionaryCreationForm/useDictionaryFormSchema.content.d.ts +9 -9
- package/dist/types/components/DictionaryFieldEditor/DictionaryDetails/dictionaryDetails.content.d.ts +33 -33
- package/dist/types/components/DictionaryFieldEditor/DictionaryDetails/useDictionaryDetailsSchema.content.d.ts +25 -25
- package/dist/types/components/DictionaryFieldEditor/NavigationView/navigationViewNode.content.d.ts +25 -25
- package/dist/types/components/DictionaryFieldEditor/NavigationView/navigationViewNode.content.d.ts.map +1 -1
- package/dist/types/components/DictionaryFieldEditor/SaveForm/saveForm.content.d.ts +33 -33
- package/dist/types/components/DictionaryFieldEditor/StructureView/structureView.content.d.ts +9 -9
- package/dist/types/components/DictionaryFieldEditor/VersionSwitcherDropDown/versionSwitcherDropDown.content.d.ts +7 -7
- package/dist/types/components/DictionaryFieldEditor/dictionaryFieldEditor.content.d.ts +5 -5
- package/dist/types/components/DictionaryFieldEditor/nodeTypeSelector.content.d.ts +31 -31
- package/dist/types/components/ExpandCollapse/expandCollapse.content.d.ts +3 -3
- package/dist/types/components/Form/FormBase.d.ts +2 -2
- package/dist/types/components/Form/FormBase.d.ts.map +1 -1
- package/dist/types/components/Form/FormField.d.ts +2 -2
- package/dist/types/components/Form/FormField.d.ts.map +1 -1
- package/dist/types/components/Form/FormItem.d.ts +2 -2
- package/dist/types/components/Form/FormItem.d.ts.map +1 -1
- package/dist/types/components/Form/elements/EditableFieldInputElement.d.ts +2 -2
- package/dist/types/components/Form/elements/EditableFieldTextAreaElement.d.ts +2 -2
- package/dist/types/components/Form/elements/EditableFieldTextAreaElement.d.ts.map +1 -1
- package/dist/types/components/Form/elements/FormElement.d.ts +2 -2
- package/dist/types/components/Form/elements/FormElement.d.ts.map +1 -1
- package/dist/types/components/Form/elements/MultiselectElement.d.ts +2 -2
- package/dist/types/components/Form/elements/MultiselectElement.d.ts.map +1 -1
- package/dist/types/components/Form/elements/OTPElement.d.ts +2 -2
- package/dist/types/components/Form/elements/OTPElement.d.ts.map +1 -1
- package/dist/types/components/Form/elements/SelectElement.d.ts +2 -2
- package/dist/types/components/Form/elements/SelectElement.d.ts.map +1 -1
- package/dist/types/components/Form/elements/SwitchSelectorElement.d.ts +2 -2
- package/dist/types/components/Form/elements/SwitchSelectorElement.d.ts.map +1 -1
- package/dist/types/components/IDE/CodeContext.d.ts +2 -2
- package/dist/types/components/IDE/CodeContext.d.ts.map +1 -1
- package/dist/types/components/IDE/code.content.d.ts +5 -5
- package/dist/types/components/IDE/code.content.d.ts.map +1 -1
- package/dist/types/components/IDE/copyCode.content.d.ts +5 -5
- package/dist/types/components/IDE/copyCode.content.d.ts.map +1 -1
- package/dist/types/components/Input/Checkbox.d.ts +4 -4
- package/dist/types/components/Input/Checkbox.d.ts.map +1 -1
- package/dist/types/components/Input/Input.d.ts +3 -3
- package/dist/types/components/Input/Input.d.ts.map +1 -1
- package/dist/types/components/Input/OTPInput.d.ts +6 -6
- package/dist/types/components/Input/OTPInput.d.ts.map +1 -1
- package/dist/types/components/Input/SearchInput.d.ts +2 -2
- package/dist/types/components/Input/SearchInput.d.ts.map +1 -1
- package/dist/types/components/Link/Link.d.ts +3 -3
- package/dist/types/components/Loader/index.content.d.ts +3 -3
- package/dist/types/components/Loader/index.content.d.ts.map +1 -1
- package/dist/types/components/Loader/spinner.d.ts +2 -2
- package/dist/types/components/LocaleSwitcherContentDropDown/localeSwitcher.content.d.ts +17 -17
- package/dist/types/components/LocaleSwitcherContentDropDown/localeSwitcher.content.d.ts.map +1 -1
- package/dist/types/components/LocaleSwitcherDropDown/localeSwitcher.content.d.ts +13 -13
- package/dist/types/components/LocaleSwitcherDropDown/localeSwitcher.content.d.ts.map +1 -1
- package/dist/types/components/MarkDownRender/processor.d.ts.map +1 -1
- package/dist/types/components/MaxWidthSmoother/index.d.ts +2 -2
- package/dist/types/components/Navbar/Burger.d.ts +2 -2
- package/dist/types/components/Navbar/Burger.d.ts.map +1 -1
- package/dist/types/components/Navbar/DesktopNavbar.d.ts +2 -2
- package/dist/types/components/Navbar/MobileNavbar.d.ts +2 -2
- package/dist/types/components/Navbar/MobileNavbar.d.ts.map +1 -1
- package/dist/types/components/Navbar/index.d.ts +2 -2
- package/dist/types/components/Navbar/index.d.ts.map +1 -1
- package/dist/types/components/Pagination/Pagination.d.ts +4 -4
- package/dist/types/components/Pagination/Pagination.d.ts.map +1 -1
- package/dist/types/components/Pagination/pagination.content.d.ts +11 -11
- package/dist/types/components/Popover/static.d.ts +3 -3
- package/dist/types/components/Select/Select.d.ts +3 -3
- package/dist/types/components/SocialNetworks/index.d.ts +2 -2
- package/dist/types/components/SocialNetworks/index.d.ts.map +1 -1
- package/dist/types/components/SwitchSelector/index.d.ts +7 -7
- package/dist/types/components/SwitchSelector/index.d.ts.map +1 -1
- package/dist/types/components/Tab/Tab.d.ts +6 -6
- package/dist/types/components/Tab/TabContext.d.ts +2 -2
- package/dist/types/components/TabSelector/TabSelector.d.ts +5 -5
- package/dist/types/components/TabSelector/TabSelector.d.ts.map +1 -1
- package/dist/types/components/Table/table.content.d.ts +3 -3
- package/dist/types/components/Table/table.content.d.ts.map +1 -1
- package/dist/types/components/Tag/index.d.ts +5 -5
- package/dist/types/components/Tag/index.d.ts.map +1 -1
- package/dist/types/components/Toaster/Toast.d.ts +2 -2
- package/dist/types/components/Toaster/Toast.d.ts.map +1 -1
- package/dist/types/components/Toaster/Toaster.d.ts +2 -2
- package/package.json +17 -17
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DictionaryFieldEditor.mjs","names":["DictionaryFieldEditor: FC<DictionaryFieldEditorProps>"],"sources":["../../../../src/components/DictionaryFieldEditor/DictionaryFieldEditor.tsx"],"sourcesContent":["'use client';\n\nimport {\n useConfiguration,\n useDictionariesRecordActions,\n useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport type { Dictionary } from '@intlayer/types';\nimport { ArrowLeft } from 'lucide-react';\nimport { type FC, useEffect, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonVariant } from '../Button';\nimport { LocaleSwitcherContentProvider } from '../LocaleSwitcherContentDropDown';\nimport {\n SwitchSelector,\n SwitchSelectorColor,\n SwitchSelectorSize,\n} from '../SwitchSelector';\nimport { ContentEditor } from './ContentEditor';\nimport { DictionaryDetailsForm } from './DictionaryDetails/DictionaryDetailsForm';\nimport { JSONEditor } from './JSONEditor';\nimport { SaveForm } from './SaveForm/SaveForm';\nimport { StructureEditor } from './StructureEditor';\n\ntype DictionaryFieldEditorProps = {\n dictionary: Dictionary;\n onClickDictionaryList?: () => void;\n onDelete?: () => void;\n onSave?: () => void;\n isDarkMode?: boolean;\n mode: ('local' | 'remote')[];\n};\n\nenum EditorViewType {\n DetailsEditor,\n ContentEditor,\n StructureEditor,\n JSONEditor,\n}\n\nexport const DictionaryFieldEditor: FC<DictionaryFieldEditorProps> = ({\n dictionary,\n onClickDictionaryList,\n isDarkMode,\n mode,\n onDelete,\n onSave,\n}) => {\n const config = useConfiguration();\n const [editorView, setEditorView] = useState<EditorViewType>(\n EditorViewType.ContentEditor\n );\n const { returnToDictionaryList } = useIntlayer('dictionary-field-editor');\n const { setFocusedContent } = useFocusUnmergedDictionary();\n const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n useEffect(() => {\n // Focus the dictionary if not focused\n setFocusedContent((prev) => ({\n ...(prev ?? {}),\n dictionaryKey: dictionary.key,\n dictionaryLocalId: dictionary.localId,\n }));\n setLocaleDictionaries((prev) => ({\n ...prev,\n [dictionary.localId!]: dictionary,\n }));\n }, []);\n\n return (\n <LocaleSwitcherContentProvider\n availableLocales={config?.internationalization.locales ?? []}\n >\n <div className=\"flex size-full flex-col gap-6 px-2\">\n <Button\n onClick={onClickDictionaryList}\n variant={ButtonVariant.HOVERABLE}\n className=\"z-10 mr-auto ml-5\"\n color={ButtonColor.TEXT}\n Icon={ArrowLeft}\n label={returnToDictionaryList.label.value}\n >\n {returnToDictionaryList.text}\n </Button>\n\n <SwitchSelector\n defaultValue={editorView}\n onChange={(value) => setEditorView(value)}\n color={SwitchSelectorColor.TEXT}\n size={SwitchSelectorSize.SM}\n className=\"m-auto w-full max-w-xl\"\n choices={[\n {\n content: 'Details',\n value: EditorViewType.DetailsEditor,\n },\n {\n content: 'Structure',\n value: EditorViewType.StructureEditor,\n },\n {\n content: 'Content',\n value: EditorViewType.ContentEditor,\n },\n {\n content: 'JSON',\n value: EditorViewType.JSONEditor,\n },\n ].filter(\n ({ value }) =>\n !(\n !mode.includes('remote') &&\n value === EditorViewType.DetailsEditor\n )\n )}\n />\n\n {editorView === EditorViewType.DetailsEditor && (\n <DictionaryDetailsForm dictionary={dictionary} />\n )}\n {editorView === EditorViewType.StructureEditor && (\n <StructureEditor dictionary={dictionary} />\n )}\n {editorView === EditorViewType.ContentEditor && (\n <ContentEditor dictionary={dictionary} isDarkMode={isDarkMode} />\n )}\n {editorView === EditorViewType.JSONEditor && (\n <JSONEditor dictionary={dictionary} isDarkMode={isDarkMode} />\n )}\n\n <SaveForm\n dictionary={dictionary}\n mode={mode}\n onDelete={() => {\n setFocusedContent(null);\n onDelete?.();\n }}\n onSave={onSave}\n />\n </div>\n </LocaleSwitcherContentProvider>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"DictionaryFieldEditor.mjs","names":["DictionaryFieldEditor: FC<DictionaryFieldEditorProps>"],"sources":["../../../../src/components/DictionaryFieldEditor/DictionaryFieldEditor.tsx"],"sourcesContent":["'use client';\n\nimport {\n useConfiguration,\n useDictionariesRecordActions,\n useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport type { Dictionary } from '@intlayer/types';\nimport { ArrowLeft } from 'lucide-react';\nimport { type FC, useEffect, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonVariant } from '../Button';\nimport { LocaleSwitcherContentProvider } from '../LocaleSwitcherContentDropDown';\nimport {\n SwitchSelector,\n SwitchSelectorColor,\n SwitchSelectorSize,\n} from '../SwitchSelector';\nimport { ContentEditor } from './ContentEditor';\nimport { DictionaryDetailsForm } from './DictionaryDetails/DictionaryDetailsForm';\nimport { JSONEditor } from './JSONEditor';\nimport { SaveForm } from './SaveForm/SaveForm';\nimport { StructureEditor } from './StructureEditor';\n\ntype DictionaryFieldEditorProps = {\n dictionary: Dictionary;\n onClickDictionaryList?: () => void;\n onDelete?: () => void;\n onSave?: () => void;\n isDarkMode?: boolean;\n mode: ('local' | 'remote')[];\n};\n\nenum EditorViewType {\n DetailsEditor,\n ContentEditor,\n StructureEditor,\n JSONEditor,\n}\n\nexport const DictionaryFieldEditor: FC<DictionaryFieldEditorProps> = ({\n dictionary,\n onClickDictionaryList,\n isDarkMode,\n mode,\n onDelete,\n onSave,\n}) => {\n const config = useConfiguration();\n const [editorView, setEditorView] = useState<EditorViewType>(\n EditorViewType.ContentEditor\n );\n const { returnToDictionaryList } = useIntlayer('dictionary-field-editor');\n const { setFocusedContent } = useFocusUnmergedDictionary();\n const { setLocaleDictionaries } = useDictionariesRecordActions();\n\n useEffect(() => {\n // Focus the dictionary if not focused\n setFocusedContent((prev) => ({\n ...(prev ?? {}),\n dictionaryKey: dictionary.key,\n dictionaryLocalId: dictionary.localId,\n }));\n setLocaleDictionaries((prev) => ({\n ...prev,\n [dictionary.localId!]: dictionary,\n }));\n }, []);\n\n return (\n <LocaleSwitcherContentProvider\n availableLocales={config?.internationalization.locales ?? []}\n >\n <div className=\"flex size-full flex-col gap-6 px-2\">\n <Button\n onClick={onClickDictionaryList}\n variant={ButtonVariant.HOVERABLE}\n className=\"z-10 mr-auto ml-5\"\n color={ButtonColor.TEXT}\n Icon={ArrowLeft}\n label={returnToDictionaryList.label.value}\n >\n {returnToDictionaryList.text}\n </Button>\n\n <SwitchSelector\n defaultValue={editorView}\n onChange={(value) => setEditorView(value)}\n color={SwitchSelectorColor.TEXT}\n size={SwitchSelectorSize.SM}\n className=\"m-auto w-full max-w-xl\"\n choices={[\n {\n content: 'Details',\n value: EditorViewType.DetailsEditor,\n },\n {\n content: 'Structure',\n value: EditorViewType.StructureEditor,\n },\n {\n content: 'Content',\n value: EditorViewType.ContentEditor,\n },\n {\n content: 'JSON',\n value: EditorViewType.JSONEditor,\n },\n ].filter(\n ({ value }) =>\n !(\n !mode.includes('remote') &&\n value === EditorViewType.DetailsEditor\n )\n )}\n />\n\n {editorView === EditorViewType.DetailsEditor && (\n <DictionaryDetailsForm dictionary={dictionary} />\n )}\n {editorView === EditorViewType.StructureEditor && (\n <StructureEditor dictionary={dictionary} />\n )}\n {editorView === EditorViewType.ContentEditor && (\n <ContentEditor dictionary={dictionary} isDarkMode={isDarkMode} />\n )}\n {editorView === EditorViewType.JSONEditor && (\n <JSONEditor dictionary={dictionary} isDarkMode={isDarkMode} />\n )}\n\n <SaveForm\n dictionary={dictionary}\n mode={mode}\n onDelete={() => {\n setFocusedContent(null);\n onDelete?.();\n }}\n onSave={onSave}\n />\n </div>\n </LocaleSwitcherContentProvider>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AAiCA,IAAK,4DAAL;AACE;AACA;AACA;AACA;;EAJG;AAOL,MAAaA,yBAAyD,EACpE,YACA,uBACA,YACA,MACA,UACA,aACI;CACJ,MAAM,SAAS,kBAAkB;CACjC,MAAM,CAAC,YAAY,iBAAiB,SAClC,eAAe,cAChB;CACD,MAAM,EAAE,2BAA2B,YAAY,0BAA0B;CACzE,MAAM,EAAE,sBAAsB,4BAA4B;CAC1D,MAAM,EAAE,0BAA0B,8BAA8B;AAEhE,iBAAgB;AAEd,qBAAmB,UAAU;GAC3B,GAAI,QAAQ,EAAE;GACd,eAAe,WAAW;GAC1B,mBAAmB,WAAW;GAC/B,EAAE;AACH,yBAAuB,UAAU;GAC/B,GAAG;IACF,WAAW,UAAW;GACxB,EAAE;IACF,EAAE,CAAC;AAEN,QACE,oBAAC;EACC,kBAAkB,QAAQ,qBAAqB,WAAW,EAAE;YAE5D,qBAAC;GAAI,WAAU;;IACb,oBAAC;KACC,SAAS;KACT,SAAS,cAAc;KACvB,WAAU;KACV,OAAO,YAAY;KACnB,MAAM;KACN,OAAO,uBAAuB,MAAM;eAEnC,uBAAuB;MACjB;IAET,oBAAC;KACC,cAAc;KACd,WAAW,UAAU,cAAc,MAAM;KACzC,OAAO,oBAAoB;KAC3B,MAAM,mBAAmB;KACzB,WAAU;KACV,SAAS;MACP;OACE,SAAS;OACT,OAAO,eAAe;OACvB;MACD;OACE,SAAS;OACT,OAAO,eAAe;OACvB;MACD;OACE,SAAS;OACT,OAAO,eAAe;OACvB;MACD;OACE,SAAS;OACT,OAAO,eAAe;OACvB;MACF,CAAC,QACC,EAAE,YACD,EACE,CAAC,KAAK,SAAS,SAAS,IACxB,UAAU,eAAe,eAE9B;MACD;IAED,eAAe,eAAe,iBAC7B,oBAAC,yBAAkC,aAAc;IAElD,eAAe,eAAe,mBAC7B,oBAAC,mBAA4B,aAAc;IAE5C,eAAe,eAAe,iBAC7B,oBAAC;KAA0B;KAAwB;MAAc;IAElE,eAAe,eAAe,cAC7B,oBAAC;KAAuB;KAAwB;MAAc;IAGhE,oBAAC;KACa;KACN;KACN,gBAAgB;AACd,wBAAkB,KAAK;AACvB,kBAAY;;KAEN;MACR;;IACE;GACwB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EnumKeyInput.mjs","names":["comparator: string | undefined","numberValue: string | undefined","EnumKeyInput: FC<EnumKeyInputProps>"],"sources":["../../../../src/components/DictionaryFieldEditor/EnumKeyInput.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect, useMemo, useState } from 'react';\nimport { Input } from '../Input';\nimport { Select } from '../Select';\n\nconst extractInitialState = (\n value: string | number\n): { comparator: string | undefined; numberValue: string | undefined } => {\n let comparator: string | undefined;\n let numberValue: string | undefined;\n\n if (typeof value === 'number' || !Number.isNaN(Number(value))) {\n // If value is a number or numeric string, set comparator to '=' and numberValue accordingly\n comparator = '=';\n numberValue = value.toString();\n } else if (typeof value === 'string') {\n // Define possible comparators\n const comparators = ['<=', '>=', '<', '>', '='];\n // Find the comparator that matches the start of the string\n const matchedComparator = comparators.find((comp) =>\n value.startsWith(comp)\n );\n if (matchedComparator) {\n comparator = matchedComparator;\n numberValue = value.slice(matchedComparator.length);\n }\n }\n\n return { comparator, numberValue };\n};\n\ntype EnumKeyInputProps = {\n value: string | number;\n onChange: (value: string) => void;\n};\n\n/**\n * Example of values:\n * - `<1`\n * - `>-44.3`\n * - `=999`\n * - `<=1`\n * - `>=1`\n * - 88\n * - `-1`\n *\n */\nexport const EnumKeyInput: FC<EnumKeyInputProps> = ({ value, onChange }) => {\n const { comparator: initialComparator, numberValue: initialNumberValue } =\n useMemo(() => extractInitialState(value), [value]);\n const [comparator, setComparator] = useState<string | null>(\n initialComparator ?? null\n );\n const [numberValue, setNumberValue] = useState<string | null>(\n initialNumberValue ?? null\n );\n\n useEffect(() => {\n if (\n comparator &&\n numberValue &&\n (comparator !== initialComparator || numberValue !== initialNumberValue)\n ) {\n const newValue = `${comparator}${numberValue}`;\n\n onChange(newValue);\n }\n }, [\n comparator,\n initialComparator,\n initialNumberValue,\n numberValue,\n onChange,\n ]);\n\n return (\n <div className=\"flex gap-1\">\n <Select onValueChange={setComparator} defaultValue={initialComparator}>\n <Select.Trigger className=\"w-20\">\n <Select.Value placeholder=\"Select a comparator\" />\n </Select.Trigger>\n <Select.Content>\n <Select.Item value=\"<\">{`<`}</Select.Item>\n <Select.Item value=\"<=\">{`<=`}</Select.Item>\n <Select.Item value=\"=\">{`=`}</Select.Item>\n <Select.Item value=\">=\">{`>=`}</Select.Item>\n <Select.Item value=\">\">{`>`}</Select.Item>\n </Select.Content>\n </Select>\n <Input\n type=\"number\"\n aria-label=\"Quantity\"\n defaultValue={numberValue ?? undefined}\n onChange={(e) => setNumberValue(e.target.value)}\n className=\"min-w-4\"\n />\n </div>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"EnumKeyInput.mjs","names":["comparator: string | undefined","numberValue: string | undefined","EnumKeyInput: FC<EnumKeyInputProps>"],"sources":["../../../../src/components/DictionaryFieldEditor/EnumKeyInput.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect, useMemo, useState } from 'react';\nimport { Input } from '../Input';\nimport { Select } from '../Select';\n\nconst extractInitialState = (\n value: string | number\n): { comparator: string | undefined; numberValue: string | undefined } => {\n let comparator: string | undefined;\n let numberValue: string | undefined;\n\n if (typeof value === 'number' || !Number.isNaN(Number(value))) {\n // If value is a number or numeric string, set comparator to '=' and numberValue accordingly\n comparator = '=';\n numberValue = value.toString();\n } else if (typeof value === 'string') {\n // Define possible comparators\n const comparators = ['<=', '>=', '<', '>', '='];\n // Find the comparator that matches the start of the string\n const matchedComparator = comparators.find((comp) =>\n value.startsWith(comp)\n );\n if (matchedComparator) {\n comparator = matchedComparator;\n numberValue = value.slice(matchedComparator.length);\n }\n }\n\n return { comparator, numberValue };\n};\n\ntype EnumKeyInputProps = {\n value: string | number;\n onChange: (value: string) => void;\n};\n\n/**\n * Example of values:\n * - `<1`\n * - `>-44.3`\n * - `=999`\n * - `<=1`\n * - `>=1`\n * - 88\n * - `-1`\n *\n */\nexport const EnumKeyInput: FC<EnumKeyInputProps> = ({ value, onChange }) => {\n const { comparator: initialComparator, numberValue: initialNumberValue } =\n useMemo(() => extractInitialState(value), [value]);\n const [comparator, setComparator] = useState<string | null>(\n initialComparator ?? null\n );\n const [numberValue, setNumberValue] = useState<string | null>(\n initialNumberValue ?? null\n );\n\n useEffect(() => {\n if (\n comparator &&\n numberValue &&\n (comparator !== initialComparator || numberValue !== initialNumberValue)\n ) {\n const newValue = `${comparator}${numberValue}`;\n\n onChange(newValue);\n }\n }, [\n comparator,\n initialComparator,\n initialNumberValue,\n numberValue,\n onChange,\n ]);\n\n return (\n <div className=\"flex gap-1\">\n <Select onValueChange={setComparator} defaultValue={initialComparator}>\n <Select.Trigger className=\"w-20\">\n <Select.Value placeholder=\"Select a comparator\" />\n </Select.Trigger>\n <Select.Content>\n <Select.Item value=\"<\">{`<`}</Select.Item>\n <Select.Item value=\"<=\">{`<=`}</Select.Item>\n <Select.Item value=\"=\">{`=`}</Select.Item>\n <Select.Item value=\">=\">{`>=`}</Select.Item>\n <Select.Item value=\">\">{`>`}</Select.Item>\n </Select.Content>\n </Select>\n <Input\n type=\"number\"\n aria-label=\"Quantity\"\n defaultValue={numberValue ?? undefined}\n onChange={(e) => setNumberValue(e.target.value)}\n className=\"min-w-4\"\n />\n </div>\n );\n};\n"],"mappings":";;;;;;;;AAMA,MAAM,uBACJ,UACwE;CACxE,IAAIA;CACJ,IAAIC;AAEJ,KAAI,OAAO,UAAU,YAAY,CAAC,OAAO,MAAM,OAAO,MAAM,CAAC,EAAE;AAE7D,eAAa;AACb,gBAAc,MAAM,UAAU;YACrB,OAAO,UAAU,UAAU;EAIpC,MAAM,oBAFc;GAAC;GAAM;GAAM;GAAK;GAAK;GAAI,CAET,MAAM,SAC1C,MAAM,WAAW,KAAK,CACvB;AACD,MAAI,mBAAmB;AACrB,gBAAa;AACb,iBAAc,MAAM,MAAM,kBAAkB,OAAO;;;AAIvD,QAAO;EAAE;EAAY;EAAa;;;;;;;;;;;;;AAmBpC,MAAaC,gBAAuC,EAAE,OAAO,eAAe;CAC1E,MAAM,EAAE,YAAY,mBAAmB,aAAa,uBAClD,cAAc,oBAAoB,MAAM,EAAE,CAAC,MAAM,CAAC;CACpD,MAAM,CAAC,YAAY,iBAAiB,SAClC,qBAAqB,KACtB;CACD,MAAM,CAAC,aAAa,kBAAkB,SACpC,sBAAsB,KACvB;AAED,iBAAgB;AACd,MACE,cACA,gBACC,eAAe,qBAAqB,gBAAgB,oBAIrD,UAFiB,GAAG,aAAa,cAEf;IAEnB;EACD;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,qBAAC;EAAI,WAAU;aACb,qBAAC;GAAO,eAAe;GAAe,cAAc;cAClD,oBAAC,OAAO;IAAQ,WAAU;cACxB,oBAAC,OAAO,SAAM,aAAY,wBAAwB;KACnC,EACjB,qBAAC,OAAO;IACN,oBAAC,OAAO;KAAK,OAAM;eAAK;MAAkB;IAC1C,oBAAC,OAAO;KAAK,OAAM;eAAM;MAAmB;IAC5C,oBAAC,OAAO;KAAK,OAAM;eAAK;MAAkB;IAC1C,oBAAC,OAAO;KAAK,OAAM;eAAM;MAAmB;IAC5C,oBAAC,OAAO;KAAK,OAAM;eAAK;MAAkB;OAC3B;IACV,EACT,oBAAC;GACC,MAAK;GACL,cAAW;GACX,cAAc,eAAe;GAC7B,WAAW,MAAM,eAAe,EAAE,OAAO,MAAM;GAC/C,WAAU;IACV;GACE"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Container } from "../Container/index.mjs";
|
|
2
2
|
import { MonacoCode } from "../IDE/MonacoCode.mjs";
|
|
3
|
-
import { useEditedContent } from "@intlayer/editor-react";
|
|
4
3
|
import { useMemo } from "react";
|
|
5
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { useEditedContent } from "@intlayer/editor-react";
|
|
6
6
|
|
|
7
7
|
//#region src/components/DictionaryFieldEditor/JSONEditor.tsx
|
|
8
8
|
const JSONEditor = ({ dictionary, isDarkMode }) => {
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { Button, ButtonColor, ButtonTextAlign, ButtonVariant } from "../../Button/Button.mjs";
|
|
2
2
|
import { Accordion } from "../../Accordion/Accordion.mjs";
|
|
3
3
|
import { getIsEditableSection } from "../getIsEditableSection.mjs";
|
|
4
|
-
import { useEditedContentActions, useEditorLocale, useFocusUnmergedDictionary } from "@intlayer/editor-react";
|
|
5
|
-
import configuration from "@intlayer/config/built";
|
|
6
4
|
import { ChevronRight, Plus } from "lucide-react";
|
|
7
5
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
8
6
|
import { getContentNodeByKeyPath, getEmptyNode, getNodeType, isSameKeyPath } from "@intlayer/core";
|
|
9
7
|
import { useIntlayer } from "react-intlayer";
|
|
8
|
+
import { useEditedContentActions, useEditorLocale, useFocusUnmergedDictionary } from "@intlayer/editor-react";
|
|
9
|
+
import configuration from "@intlayer/config/built";
|
|
10
10
|
import { NodeType } from "@intlayer/types";
|
|
11
11
|
import { camelCaseToSentence } from "@intlayer/config/client";
|
|
12
12
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NodeTypeSelector.mjs","names":["NodeTypeSelector: FC<NodeTypeSelectorProps>","keyType"],"sources":["../../../../src/components/DictionaryFieldEditor/NodeTypeSelector.tsx"],"sourcesContent":["'use client';\n\nimport { getNodeType } from '@intlayer/core';\nimport { type ContentNode, NodeType } from '@intlayer/types';\nimport { type FC, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\n\ntype NodeTypeSelectorProps = {\n section: ContentNode;\n onValueChange: (keyType: NodeType) => void;\n};\n\nexport const NodeTypeSelector: FC<NodeTypeSelectorProps> = ({\n section,\n onValueChange: onValueChangeProp,\n}) => {\n const {\n multilingual,\n text,\n number,\n boolean,\n node,\n array,\n enumeration,\n triggerPlaceHolder,\n nest,\n gender,\n condition,\n markdown,\n insertion,\n reactNode,\n file,\n } = useIntlayer('node-type-selector');\n const nodeType = getNodeType(section);\n const [keyType, setKeyType] = useState<NodeType>(nodeType);\n\n const onValueChange = (keyType: NodeType) => {\n setKeyType(keyType);\n onValueChangeProp(keyType);\n };\n\n return (\n <Select value={keyType} onValueChange={onValueChange}>\n <Select.Trigger>\n <Select.Value placeholder={triggerPlaceHolder} />\n </Select.Trigger>\n <Select.Content>\n <Select.Item value={NodeType.Translation}>{multilingual}</Select.Item>\n <Select.Item value={NodeType.Text}>{text}</Select.Item>\n <Select.Item value={NodeType.Number}>{number}</Select.Item>\n <Select.Item value={NodeType.Boolean}>{boolean}</Select.Item>\n <Select.Item value={NodeType.Object}>{node}</Select.Item>\n <Select.Item value={NodeType.Array}>{array}</Select.Item>\n <Select.Item value={NodeType.Enumeration}>{enumeration}</Select.Item>\n <Select.Item value={NodeType.Gender}>{gender}</Select.Item>\n <Select.Item value={NodeType.Insertion}>{insertion}</Select.Item>\n <Select.Item value={NodeType.Markdown}>{markdown}</Select.Item>\n <Select.Item value={NodeType.Nested}>{nest}</Select.Item>\n <Select.Item value={NodeType.Condition}>{condition}</Select.Item>\n <Select.Item value={NodeType.ReactNode} disabled>\n {reactNode}\n </Select.Item>\n <Select.Item value={NodeType.File}>{file}</Select.Item>\n </Select.Content>\n </Select>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"NodeTypeSelector.mjs","names":["NodeTypeSelector: FC<NodeTypeSelectorProps>","keyType"],"sources":["../../../../src/components/DictionaryFieldEditor/NodeTypeSelector.tsx"],"sourcesContent":["'use client';\n\nimport { getNodeType } from '@intlayer/core';\nimport { type ContentNode, NodeType } from '@intlayer/types';\nimport { type FC, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\n\ntype NodeTypeSelectorProps = {\n section: ContentNode;\n onValueChange: (keyType: NodeType) => void;\n};\n\nexport const NodeTypeSelector: FC<NodeTypeSelectorProps> = ({\n section,\n onValueChange: onValueChangeProp,\n}) => {\n const {\n multilingual,\n text,\n number,\n boolean,\n node,\n array,\n enumeration,\n triggerPlaceHolder,\n nest,\n gender,\n condition,\n markdown,\n insertion,\n reactNode,\n file,\n } = useIntlayer('node-type-selector');\n const nodeType = getNodeType(section);\n const [keyType, setKeyType] = useState<NodeType>(nodeType);\n\n const onValueChange = (keyType: NodeType) => {\n setKeyType(keyType);\n onValueChangeProp(keyType);\n };\n\n return (\n <Select value={keyType} onValueChange={onValueChange}>\n <Select.Trigger>\n <Select.Value placeholder={triggerPlaceHolder} />\n </Select.Trigger>\n <Select.Content>\n <Select.Item value={NodeType.Translation}>{multilingual}</Select.Item>\n <Select.Item value={NodeType.Text}>{text}</Select.Item>\n <Select.Item value={NodeType.Number}>{number}</Select.Item>\n <Select.Item value={NodeType.Boolean}>{boolean}</Select.Item>\n <Select.Item value={NodeType.Object}>{node}</Select.Item>\n <Select.Item value={NodeType.Array}>{array}</Select.Item>\n <Select.Item value={NodeType.Enumeration}>{enumeration}</Select.Item>\n <Select.Item value={NodeType.Gender}>{gender}</Select.Item>\n <Select.Item value={NodeType.Insertion}>{insertion}</Select.Item>\n <Select.Item value={NodeType.Markdown}>{markdown}</Select.Item>\n <Select.Item value={NodeType.Nested}>{nest}</Select.Item>\n <Select.Item value={NodeType.Condition}>{condition}</Select.Item>\n <Select.Item value={NodeType.ReactNode} disabled>\n {reactNode}\n </Select.Item>\n <Select.Item value={NodeType.File}>{file}</Select.Item>\n </Select.Content>\n </Select>\n );\n};\n"],"mappings":";;;;;;;;;;AAaA,MAAaA,oBAA+C,EAC1D,SACA,eAAe,wBACX;CACJ,MAAM,EACJ,cACA,MACA,QACA,SACA,MACA,OACA,aACA,oBACA,MACA,QACA,WACA,UACA,WACA,WACA,SACE,YAAY,qBAAqB;CAErC,MAAM,CAAC,SAAS,cAAc,SADb,YAAY,QAAQ,CACqB;CAE1D,MAAM,iBAAiB,cAAsB;AAC3C,aAAWC,UAAQ;AACnB,oBAAkBA,UAAQ;;AAG5B,QACE,qBAAC;EAAO,OAAO;EAAwB;aACrC,oBAAC,OAAO,qBACN,oBAAC,OAAO,SAAM,aAAa,qBAAsB,GAClC,EACjB,qBAAC,OAAO;GACN,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAc;KAA2B;GACtE,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAO;KAAmB;GACvD,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAS;KAAqB;GAC3D,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAU;KAAsB;GAC7D,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAS;KAAmB;GACzD,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAQ;KAAoB;GACzD,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAc;KAA0B;GACrE,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAS;KAAqB;GAC3D,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAY;KAAwB;GACjE,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAW;KAAuB;GAC/D,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAS;KAAmB;GACzD,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAY;KAAwB;GACjE,oBAAC,OAAO;IAAK,OAAO,SAAS;IAAW;cACrC;KACW;GACd,oBAAC,OAAO;IAAK,OAAO,SAAS;cAAO;KAAmB;MACxC;GACV"}
|
|
@@ -1,17 +1,16 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
import { useAuth } from "../../../hooks/useAuth/useAuth.mjs";
|
|
5
|
-
import { useDeleteDictionary, usePushDictionaries, useWriteDictionary } from "../../../hooks/reactQuery.mjs";
|
|
6
3
|
import { cn } from "../../../utils/cn.mjs";
|
|
7
4
|
import { ButtonColor, ButtonVariant } from "../../Button/Button.mjs";
|
|
5
|
+
import { useAuth } from "../../../hooks/useAuth/useAuth.mjs";
|
|
6
|
+
import { useDeleteDictionary, usePushDictionaries, useWriteDictionary } from "../../../hooks/reactQuery.mjs";
|
|
8
7
|
import { Modal, ModalSize } from "../../Modal/Modal.mjs";
|
|
9
8
|
import { Form } from "../../Form/Form.mjs";
|
|
10
|
-
import { useDictionariesRecordActions, useEditedContent } from "@intlayer/editor-react";
|
|
11
|
-
import { useState } from "react";
|
|
12
9
|
import { ArrowUpFromLine, Download, RotateCcw, Save, Trash } from "lucide-react";
|
|
10
|
+
import { useState } from "react";
|
|
13
11
|
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
14
12
|
import { useIntlayer } from "react-intlayer";
|
|
13
|
+
import { useDictionariesRecordActions, useEditedContent } from "@intlayer/editor-react";
|
|
15
14
|
|
|
16
15
|
//#region src/components/DictionaryFieldEditor/SaveForm/SaveForm.tsx
|
|
17
16
|
const SaveForm = ({ dictionary, mode, className, onDelete, onSave, ...props }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SaveForm.mjs","names":["SaveForm: FC<DictionaryDetailsProps>"],"sources":["../../../../../src/components/DictionaryFieldEditor/SaveForm/SaveForm.tsx"],"sourcesContent":["'use client';\n\nimport type { Dictionary as DistantDictionary } from '@intlayer/backend';\nimport {\n useDictionariesRecordActions,\n useEditedContent,\n} from '@intlayer/editor-react';\nimport type { Dictionary } from '@intlayer/types';\nimport {\n ArrowUpFromLine,\n Download,\n RotateCcw,\n Save,\n Trash,\n} from 'lucide-react';\nimport {\n type DetailedHTMLProps,\n type FC,\n type FormHTMLAttributes,\n useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Modal, ModalSize } from '../../../components/Modal';\nimport {\n useAuth,\n useDeleteDictionary,\n usePushDictionaries,\n useWriteDictionary,\n} from '../../../hooks';\nimport { cn } from '../../../utils/cn';\nimport { ButtonColor, ButtonVariant } from '../../Button';\nimport { Form } from '../../Form';\n\ntype DictionaryDetailsProps = {\n dictionary: Dictionary;\n mode: ('local' | 'remote')[];\n onDelete?: () => void;\n onSave?: () => void;\n} & DetailedHTMLProps<FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>;\n\nexport const SaveForm: FC<DictionaryDetailsProps> = ({\n dictionary,\n mode,\n className,\n onDelete,\n onSave,\n ...props\n}) => {\n const [isFormatAlertModalOpen, setIsFormatAlertModalOpen] = useState(false);\n const { setLocaleDictionary } = useDictionariesRecordActions();\n const { mutate: deleteDictionary, isPending: isDeleting } =\n useDeleteDictionary();\n const { mutate: writeDictionary, isPending: isWriting } =\n useWriteDictionary();\n const { mutate: pushDictionaries, isPending: isPushing } =\n usePushDictionaries();\n const isLoading = isWriting || isPushing;\n\n const { editedContent, restoreEditedContent } = useEditedContent();\n const {\n deleteButton,\n resetButton,\n saveButton,\n publishButton,\n downloadButton,\n confirmation,\n } = useIntlayer('save-dictionary-details');\n const { isAuthenticated } = useAuth();\n\n const editedDictionary = editedContent?.[dictionary.localId!];\n\n const isEdited =\n editedDictionary &&\n JSON.stringify(editedDictionary) !== JSON.stringify(dictionary);\n\n const isDistantDictionary =\n typeof (dictionary as unknown as DistantDictionary)?.id !== 'undefined';\n\n const handleSaveDictionaryConfirmation = async () => {\n if (!editedContent?.[dictionary.localId!]) return;\n\n const updatedDictionary = {\n ...dictionary,\n ...editedContent?.[dictionary.localId!],\n };\n\n writeDictionary(\n {\n dictionary: updatedDictionary,\n },\n {\n onSuccess: () => {\n setLocaleDictionary(editedContent?.[dictionary.localId!]);\n restoreEditedContent(dictionary.localId!);\n onSave?.();\n },\n }\n );\n };\n\n const handlePushDictionary = () => {\n const updatedDictionary = {\n ...dictionary,\n ...editedContent?.[dictionary.localId!],\n };\n\n pushDictionaries(\n { dictionaries: [updatedDictionary] },\n {\n onSuccess: (res) => {\n if (res) {\n setLocaleDictionary(updatedDictionary);\n restoreEditedContent(dictionary.localId!);\n onSave?.();\n }\n },\n }\n );\n };\n\n const handleDeleteDictionary = () => {\n if (!dictionary.id) return;\n\n deleteDictionary(\n {\n dictionaryId: dictionary.id,\n },\n {\n onSuccess: (res) => {\n if (res) {\n onDelete?.();\n }\n },\n }\n );\n };\n\n return (\n <>\n <Modal\n isOpen={isFormatAlertModalOpen}\n title={confirmation.title.value}\n size={ModalSize.MD}\n >\n <form className=\"size-full px-3\">\n <p className=\"py-4 text-neutral text-sm\">{confirmation.message}</p>\n\n <div className=\"mt-12 flex justify-end gap-2 max-md:flex-col\">\n <Form.Button\n label={confirmation.cancelButton.label.value}\n disabled={!isEdited || isLoading}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n variant={ButtonVariant.OUTLINE}\n onClick={() => setIsFormatAlertModalOpen(false)}\n >\n {confirmation.cancelButton.text}\n </Form.Button>\n <Form.Button\n label={confirmation.confirmButton.label.value}\n disabled={!isEdited || isLoading}\n Icon={Save}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n isLoading={isPushing}\n onClick={handleSaveDictionaryConfirmation}\n >\n {confirmation.confirmButton.text}\n </Form.Button>\n </div>\n </form>\n </Modal>\n <form\n className={cn('flex justify-end gap-2 max-md:flex-col', className)}\n {...props}\n >\n {mode.includes('remote') &&\n isDistantDictionary &&\n onDelete &&\n isAuthenticated && (\n <Form.Button\n label={deleteButton.label.value}\n Icon={Trash}\n color={ButtonColor.ERROR}\n variant={ButtonVariant.OUTLINE}\n className=\"max-md:w-full\"\n isLoading={isDeleting}\n onClick={handleDeleteDictionary}\n >\n {deleteButton.text}\n </Form.Button>\n )}\n {isEdited && (\n <Form.Button\n label={resetButton.label.value}\n disabled={!isEdited}\n Icon={RotateCcw}\n variant={ButtonVariant.OUTLINE}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n onClick={() => restoreEditedContent(dictionary.localId!)}\n >\n {resetButton.text}\n </Form.Button>\n )}\n {mode.includes('local') && (\n <Form.Button\n label={downloadButton.label.value}\n disabled={!isEdited || isLoading}\n Icon={Download}\n color={ButtonColor.TEXT}\n variant={\n isAuthenticated ? ButtonVariant.OUTLINE : ButtonVariant.DEFAULT\n }\n className=\"max-md:w-full\"\n isLoading={isWriting}\n onClick={() => setIsFormatAlertModalOpen(true)}\n >\n {downloadButton.text}\n </Form.Button>\n )}\n {mode.includes('remote') && isAuthenticated && !isDistantDictionary && (\n <Form.Button\n label={publishButton.label.value}\n disabled={isLoading}\n Icon={ArrowUpFromLine}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n isLoading={isPushing}\n onClick={handlePushDictionary}\n >\n {publishButton.text}\n </Form.Button>\n )}\n {mode.includes('remote') &&\n isAuthenticated &&\n isDistantDictionary &&\n isEdited && (\n <Form.Button\n label={saveButton.label.value}\n disabled={!isEdited || isLoading}\n Icon={Save}\n color=\"text\"\n className=\"max-md:w-full\"\n isLoading={isPushing}\n onClick={handlePushDictionary}\n >\n {saveButton.text}\n </Form.Button>\n )}\n </form>\n </>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SaveForm.mjs","names":["SaveForm: FC<DictionaryDetailsProps>"],"sources":["../../../../../src/components/DictionaryFieldEditor/SaveForm/SaveForm.tsx"],"sourcesContent":["'use client';\n\nimport type { Dictionary as DistantDictionary } from '@intlayer/backend';\nimport {\n useDictionariesRecordActions,\n useEditedContent,\n} from '@intlayer/editor-react';\nimport type { Dictionary } from '@intlayer/types';\nimport {\n ArrowUpFromLine,\n Download,\n RotateCcw,\n Save,\n Trash,\n} from 'lucide-react';\nimport {\n type DetailedHTMLProps,\n type FC,\n type FormHTMLAttributes,\n useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Modal, ModalSize } from '../../../components/Modal';\nimport {\n useAuth,\n useDeleteDictionary,\n usePushDictionaries,\n useWriteDictionary,\n} from '../../../hooks';\nimport { cn } from '../../../utils/cn';\nimport { ButtonColor, ButtonVariant } from '../../Button';\nimport { Form } from '../../Form';\n\ntype DictionaryDetailsProps = {\n dictionary: Dictionary;\n mode: ('local' | 'remote')[];\n onDelete?: () => void;\n onSave?: () => void;\n} & DetailedHTMLProps<FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>;\n\nexport const SaveForm: FC<DictionaryDetailsProps> = ({\n dictionary,\n mode,\n className,\n onDelete,\n onSave,\n ...props\n}) => {\n const [isFormatAlertModalOpen, setIsFormatAlertModalOpen] = useState(false);\n const { setLocaleDictionary } = useDictionariesRecordActions();\n const { mutate: deleteDictionary, isPending: isDeleting } =\n useDeleteDictionary();\n const { mutate: writeDictionary, isPending: isWriting } =\n useWriteDictionary();\n const { mutate: pushDictionaries, isPending: isPushing } =\n usePushDictionaries();\n const isLoading = isWriting || isPushing;\n\n const { editedContent, restoreEditedContent } = useEditedContent();\n const {\n deleteButton,\n resetButton,\n saveButton,\n publishButton,\n downloadButton,\n confirmation,\n } = useIntlayer('save-dictionary-details');\n const { isAuthenticated } = useAuth();\n\n const editedDictionary = editedContent?.[dictionary.localId!];\n\n const isEdited =\n editedDictionary &&\n JSON.stringify(editedDictionary) !== JSON.stringify(dictionary);\n\n const isDistantDictionary =\n typeof (dictionary as unknown as DistantDictionary)?.id !== 'undefined';\n\n const handleSaveDictionaryConfirmation = async () => {\n if (!editedContent?.[dictionary.localId!]) return;\n\n const updatedDictionary = {\n ...dictionary,\n ...editedContent?.[dictionary.localId!],\n };\n\n writeDictionary(\n {\n dictionary: updatedDictionary,\n },\n {\n onSuccess: () => {\n setLocaleDictionary(editedContent?.[dictionary.localId!]);\n restoreEditedContent(dictionary.localId!);\n onSave?.();\n },\n }\n );\n };\n\n const handlePushDictionary = () => {\n const updatedDictionary = {\n ...dictionary,\n ...editedContent?.[dictionary.localId!],\n };\n\n pushDictionaries(\n { dictionaries: [updatedDictionary] },\n {\n onSuccess: (res) => {\n if (res) {\n setLocaleDictionary(updatedDictionary);\n restoreEditedContent(dictionary.localId!);\n onSave?.();\n }\n },\n }\n );\n };\n\n const handleDeleteDictionary = () => {\n if (!dictionary.id) return;\n\n deleteDictionary(\n {\n dictionaryId: dictionary.id,\n },\n {\n onSuccess: (res) => {\n if (res) {\n onDelete?.();\n }\n },\n }\n );\n };\n\n return (\n <>\n <Modal\n isOpen={isFormatAlertModalOpen}\n title={confirmation.title.value}\n size={ModalSize.MD}\n >\n <form className=\"size-full px-3\">\n <p className=\"py-4 text-neutral text-sm\">{confirmation.message}</p>\n\n <div className=\"mt-12 flex justify-end gap-2 max-md:flex-col\">\n <Form.Button\n label={confirmation.cancelButton.label.value}\n disabled={!isEdited || isLoading}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n variant={ButtonVariant.OUTLINE}\n onClick={() => setIsFormatAlertModalOpen(false)}\n >\n {confirmation.cancelButton.text}\n </Form.Button>\n <Form.Button\n label={confirmation.confirmButton.label.value}\n disabled={!isEdited || isLoading}\n Icon={Save}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n isLoading={isPushing}\n onClick={handleSaveDictionaryConfirmation}\n >\n {confirmation.confirmButton.text}\n </Form.Button>\n </div>\n </form>\n </Modal>\n <form\n className={cn('flex justify-end gap-2 max-md:flex-col', className)}\n {...props}\n >\n {mode.includes('remote') &&\n isDistantDictionary &&\n onDelete &&\n isAuthenticated && (\n <Form.Button\n label={deleteButton.label.value}\n Icon={Trash}\n color={ButtonColor.ERROR}\n variant={ButtonVariant.OUTLINE}\n className=\"max-md:w-full\"\n isLoading={isDeleting}\n onClick={handleDeleteDictionary}\n >\n {deleteButton.text}\n </Form.Button>\n )}\n {isEdited && (\n <Form.Button\n label={resetButton.label.value}\n disabled={!isEdited}\n Icon={RotateCcw}\n variant={ButtonVariant.OUTLINE}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n onClick={() => restoreEditedContent(dictionary.localId!)}\n >\n {resetButton.text}\n </Form.Button>\n )}\n {mode.includes('local') && (\n <Form.Button\n label={downloadButton.label.value}\n disabled={!isEdited || isLoading}\n Icon={Download}\n color={ButtonColor.TEXT}\n variant={\n isAuthenticated ? ButtonVariant.OUTLINE : ButtonVariant.DEFAULT\n }\n className=\"max-md:w-full\"\n isLoading={isWriting}\n onClick={() => setIsFormatAlertModalOpen(true)}\n >\n {downloadButton.text}\n </Form.Button>\n )}\n {mode.includes('remote') && isAuthenticated && !isDistantDictionary && (\n <Form.Button\n label={publishButton.label.value}\n disabled={isLoading}\n Icon={ArrowUpFromLine}\n color={ButtonColor.TEXT}\n className=\"max-md:w-full\"\n isLoading={isPushing}\n onClick={handlePushDictionary}\n >\n {publishButton.text}\n </Form.Button>\n )}\n {mode.includes('remote') &&\n isAuthenticated &&\n isDistantDictionary &&\n isEdited && (\n <Form.Button\n label={saveButton.label.value}\n disabled={!isEdited || isLoading}\n Icon={Save}\n color=\"text\"\n className=\"max-md:w-full\"\n isLoading={isPushing}\n onClick={handlePushDictionary}\n >\n {saveButton.text}\n </Form.Button>\n )}\n </form>\n </>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
-
|
|
4
3
|
import { NodeView } from "./StructureView/StructureView.mjs";
|
|
5
|
-
import { useEditedContent } from "@intlayer/editor-react";
|
|
6
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { useEditedContent } from "@intlayer/editor-react";
|
|
7
6
|
|
|
8
7
|
//#region src/components/DictionaryFieldEditor/StructureEditor.tsx
|
|
9
8
|
const StructureEditor = ({ dictionary }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StructureEditor.mjs","names":["StructureEditor: FC<NodeEditorProps>"],"sources":["../../../../src/components/DictionaryFieldEditor/StructureEditor.tsx"],"sourcesContent":["'use client';\n\nimport { useEditedContent } from '@intlayer/editor-react';\nimport type { Dictionary } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeView } from './StructureView/StructureView';\n\ntype NodeEditorProps = {\n dictionary: Dictionary;\n};\n\nexport const StructureEditor: FC<NodeEditorProps> = ({ dictionary }) => {\n const { content, localId } = dictionary;\n\n const { editedContent } = useEditedContent();\n const initialSection =\n typeof editedContent?.[localId!]?.content === 'undefined'\n ? content\n : editedContent?.[localId!]?.content;\n\n return (\n <NodeView\n section={initialSection}\n keyPath={[]}\n dictionaryLocalId={localId!}\n />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"StructureEditor.mjs","names":["StructureEditor: FC<NodeEditorProps>"],"sources":["../../../../src/components/DictionaryFieldEditor/StructureEditor.tsx"],"sourcesContent":["'use client';\n\nimport { useEditedContent } from '@intlayer/editor-react';\nimport type { Dictionary } from '@intlayer/types';\nimport type { FC } from 'react';\nimport { NodeView } from './StructureView/StructureView';\n\ntype NodeEditorProps = {\n dictionary: Dictionary;\n};\n\nexport const StructureEditor: FC<NodeEditorProps> = ({ dictionary }) => {\n const { content, localId } = dictionary;\n\n const { editedContent } = useEditedContent();\n const initialSection =\n typeof editedContent?.[localId!]?.content === 'undefined'\n ? content\n : editedContent?.[localId!]?.content;\n\n return (\n <NodeView\n section={initialSection}\n keyPath={[]}\n dictionaryLocalId={localId!}\n />\n );\n};\n"],"mappings":";;;;;;;AAWA,MAAaA,mBAAwC,EAAE,iBAAiB;CACtE,MAAM,EAAE,SAAS,YAAY;CAE7B,MAAM,EAAE,kBAAkB,kBAAkB;AAM5C,QACE,oBAAC;EACC,SANF,OAAO,gBAAgB,UAAW,YAAY,cAC1C,UACA,gBAAgB,UAAW;EAK7B,SAAS,EAAE;EACX,mBAAmB;GACnB"}
|
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
-
|
|
4
3
|
import { Container } from "../../Container/index.mjs";
|
|
5
4
|
import { Button, ButtonColor, ButtonSize, ButtonVariant } from "../../Button/Button.mjs";
|
|
6
5
|
import { InputVariant } from "../../Input/Input.mjs";
|
|
7
6
|
import { EditableFieldInput } from "../../EditableField/EditableFieldInput.mjs";
|
|
8
7
|
import { NodeTypeSelector } from "../NodeTypeSelector.mjs";
|
|
9
|
-
import { useConfiguration, useEditedContentActions, useFocusUnmergedDictionary } from "@intlayer/editor-react";
|
|
10
8
|
import { Plus, Trash } from "lucide-react";
|
|
11
9
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
12
10
|
import { getDefaultNode, getNodeChildren, getNodeType, isSameKeyPath } from "@intlayer/core";
|
|
13
11
|
import { useIntlayer } from "react-intlayer";
|
|
12
|
+
import { useConfiguration, useEditedContentActions, useFocusUnmergedDictionary } from "@intlayer/editor-react";
|
|
14
13
|
import { NodeType } from "@intlayer/types";
|
|
15
14
|
import { camelCaseToSentence } from "@intlayer/config/client";
|
|
16
15
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StructureView.mjs","names":["NodeTypeView: FC<NodeTypeViewProps>","nodeType","NodeView: FC<NodeWrapperProps>","prevKeyPath: KeyPath[]","lastKeyPath: KeyPath","ObjectView: FC<ObjectViewProps>","StructureView: FC<StructureViewProps>"],"sources":["../../../../../src/components/DictionaryFieldEditor/StructureView/StructureView.tsx"],"sourcesContent":["'use client';\n\nimport { camelCaseToSentence } from '@intlayer/config/client';\nimport {\n getDefaultNode,\n getNodeChildren,\n getNodeType,\n isSameKeyPath,\n} from '@intlayer/core';\nimport {\n useConfiguration,\n useEditedContentActions,\n useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport {\n type KeyPath,\n type LocalDictionaryId,\n NodeType,\n type TypedNode,\n} from '@intlayer/types';\nimport type { ContentNode } from 'intlayer';\nimport { Plus, Trash } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../../Button';\nimport { Container } from '../../Container';\nimport { EditableFieldInput } from '../../EditableField';\nimport { InputVariant } from '../../Input';\nimport { NodeTypeSelector } from '../NodeTypeSelector';\n\ntype NodeTypeViewProps = {\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n onNodeTypeChange: (content?: ContentNode) => void;\n};\n\nconst NodeTypeView: FC<NodeTypeViewProps> = ({\n section,\n dictionaryLocalId,\n keyPath,\n onNodeTypeChange: onNodeTypeChangeProp,\n}) => {\n const locales = useConfiguration()?.internationalization.locales ?? [];\n const nodeType = getNodeType(section);\n const children = getNodeChildren(section);\n\n const onNodeTypeChange = (content?: ContentNode) => {\n const transformedContent = getDefaultNode(\n nodeType,\n locales,\n content\n ) as ContentNode;\n\n onNodeTypeChangeProp(transformedContent);\n };\n\n if (\n nodeType === NodeType.Translation ||\n nodeType === NodeType.Condition ||\n nodeType === NodeType.Gender ||\n nodeType === NodeType.Enumeration\n ) {\n const firstKey = Object.keys(\n (section as unknown as TypedNode)[nodeType as keyof typeof section]\n )[0];\n const childrenKeyPath = [\n ...keyPath,\n { type: nodeType, key: firstKey },\n ] as KeyPath[];\n\n return (\n <div className=\"flex w-full flex-col gap-1\">\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(\n getDefaultNode(nodeType, locales) as ContentNode\n )\n }\n />\n\n <NodeTypeView\n section={children}\n keyPath={childrenKeyPath}\n dictionaryLocalId={dictionaryLocalId}\n onNodeTypeChange={onNodeTypeChange}\n />\n </div>\n );\n }\n\n if (nodeType === NodeType.Array) {\n const childrenKeyPath = [...keyPath, { type: nodeType, key: 0 } as KeyPath];\n return (\n <div className=\"flex w-full flex-col gap-1\">\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(\n getDefaultNode(nodeType, locales) as ContentNode\n )\n }\n />\n\n <NodeTypeView\n section={children}\n keyPath={childrenKeyPath}\n dictionaryLocalId={dictionaryLocalId}\n onNodeTypeChange={onNodeTypeChange}\n />\n </div>\n );\n }\n\n if (nodeType === NodeType.Object) {\n return (\n <>\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(\n getDefaultNode(nodeType, locales) as ContentNode\n )\n }\n />\n <div className=\"mt-6 ml-10\">\n <StructureView\n keyPath={keyPath}\n section={section}\n dictionaryLocalId={dictionaryLocalId}\n />\n </div>\n </>\n );\n }\n\n return (\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(getDefaultNode(nodeType, locales) as ContentNode)\n }\n />\n );\n};\n\ntype NodeWrapperProps = {\n sectionKey?: string;\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n};\n\nexport const NodeView: FC<NodeWrapperProps> = ({\n sectionKey,\n section,\n keyPath,\n dictionaryLocalId,\n}) => {\n const { focusedContent, setFocusedContentKeyPath } =\n useFocusUnmergedDictionary();\n const { renameEditedContent, addEditedContent } = useEditedContentActions();\n\n const { titleInput, deleteButton } = useIntlayer('structure-view');\n\n const handleRenameNodeKey = (keyName: string) => {\n renameEditedContent(dictionaryLocalId, keyName, keyPath);\n const prevKeyPath: KeyPath[] = keyPath.slice(0, -1);\n const lastKeyPath: KeyPath = keyPath[keyPath.length - 1];\n const newKeyPath: KeyPath[] = [\n ...prevKeyPath,\n { ...lastKeyPath, key: keyName } as KeyPath,\n ];\n setFocusedContentKeyPath(newKeyPath);\n };\n\n return (\n <Container\n transparency=\"xl\"\n roundedSize=\"xl\"\n className=\"w-full min-w-80 gap-2 overflow-auto px-5 py-2\"\n border\n borderColor=\"text\"\n background=\"none\"\n aria-selected={isSameKeyPath(keyPath, focusedContent?.keyPath ?? [])}\n onClick={() => setFocusedContentKeyPath(keyPath)}\n >\n <div className=\"flex w-full flex-col items-start justify-between gap-3\">\n {typeof sectionKey === 'string' && (\n <div className=\"w-full\">\n <div className=\"flex w-full items-center justify-between gap-10\">\n <EditableFieldInput\n name=\"key\"\n aria-label=\"Key\"\n placeholder={titleInput.placeholder.value}\n defaultValue={sectionKey}\n onSave={(value) => handleRenameNodeKey(value)}\n variant={InputVariant.INVISIBLE}\n />\n <Button\n label={deleteButton.label.value}\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.ICON_SM}\n color={ButtonColor.TEXT}\n className=\"translate-x-2\"\n Icon={Trash}\n onClick={() => {\n addEditedContent(dictionaryLocalId, undefined, keyPath);\n\n const parentKeyPath: KeyPath[] = keyPath.slice(0, -1);\n setFocusedContentKeyPath(parentKeyPath);\n }}\n />\n </div>\n\n <span className=\"ml-3 text-neutral text-sm\">\n ( {camelCaseToSentence(sectionKey)} )\n </span>\n </div>\n )}\n <NodeTypeView\n keyPath={keyPath}\n dictionaryLocalId={dictionaryLocalId}\n section={section}\n onNodeTypeChange={(content) => {\n addEditedContent(dictionaryLocalId, content, keyPath);\n }}\n />\n </div>\n </Container>\n );\n};\n\ntype ObjectViewProps = {\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n};\n\nexport const ObjectView: FC<ObjectViewProps> = ({\n section,\n keyPath,\n dictionaryLocalId,\n}) => {\n const { addNodeButton } = useIntlayer('structure-view');\n const { setFocusedContentKeyPath } = useFocusUnmergedDictionary();\n const { addEditedContent } = useEditedContentActions();\n\n if (!section || typeof section !== 'object') {\n return <div>Not an object</div>;\n }\n\n return (\n <div className=\"flex flex-col gap-2 overflow-y-auto\">\n <ul className=\"mr-auto flex flex-col gap-4\">\n {Object.keys(section).map((key) => (\n <li key={key} className=\"flex w-full\">\n <NodeView\n sectionKey={key}\n section={section?.[key as keyof typeof section]}\n keyPath={[...keyPath, { type: NodeType.Object, key }]}\n dictionaryLocalId={dictionaryLocalId}\n />\n </li>\n ))}\n </ul>\n <Button\n label={addNodeButton.label.value}\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.MD}\n color={ButtonColor.TEXT}\n Icon={Plus}\n className=\"flex-1\"\n onClick={() => {\n const newKey = 'newKey';\n const newKeyPath = [\n ...keyPath,\n { type: NodeType.Object, key: newKey },\n ] as KeyPath[];\n addEditedContent(dictionaryLocalId, '', newKeyPath);\n setFocusedContentKeyPath(newKeyPath);\n }}\n >\n {addNodeButton.text}\n </Button>\n </div>\n );\n};\n\ntype StructureViewProps = {\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n};\n\nexport const StructureView: FC<StructureViewProps> = ({\n section,\n keyPath,\n dictionaryLocalId,\n}) => {\n if (\n !section ||\n typeof section !== 'object' ||\n typeof section.nodeType === 'string'\n ) {\n return (\n <NodeView\n sectionKey={'content'}\n section={section}\n keyPath={keyPath}\n dictionaryLocalId={dictionaryLocalId}\n />\n );\n }\n\n return (\n <ObjectView\n section={section}\n keyPath={keyPath}\n dictionaryLocalId={dictionaryLocalId}\n />\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"StructureView.mjs","names":["NodeTypeView: FC<NodeTypeViewProps>","nodeType","NodeView: FC<NodeWrapperProps>","prevKeyPath: KeyPath[]","lastKeyPath: KeyPath","ObjectView: FC<ObjectViewProps>","StructureView: FC<StructureViewProps>"],"sources":["../../../../../src/components/DictionaryFieldEditor/StructureView/StructureView.tsx"],"sourcesContent":["'use client';\n\nimport { camelCaseToSentence } from '@intlayer/config/client';\nimport {\n getDefaultNode,\n getNodeChildren,\n getNodeType,\n isSameKeyPath,\n} from '@intlayer/core';\nimport {\n useConfiguration,\n useEditedContentActions,\n useFocusUnmergedDictionary,\n} from '@intlayer/editor-react';\nimport {\n type KeyPath,\n type LocalDictionaryId,\n NodeType,\n type TypedNode,\n} from '@intlayer/types';\nimport type { ContentNode } from 'intlayer';\nimport { Plus, Trash } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../../Button';\nimport { Container } from '../../Container';\nimport { EditableFieldInput } from '../../EditableField';\nimport { InputVariant } from '../../Input';\nimport { NodeTypeSelector } from '../NodeTypeSelector';\n\ntype NodeTypeViewProps = {\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n onNodeTypeChange: (content?: ContentNode) => void;\n};\n\nconst NodeTypeView: FC<NodeTypeViewProps> = ({\n section,\n dictionaryLocalId,\n keyPath,\n onNodeTypeChange: onNodeTypeChangeProp,\n}) => {\n const locales = useConfiguration()?.internationalization.locales ?? [];\n const nodeType = getNodeType(section);\n const children = getNodeChildren(section);\n\n const onNodeTypeChange = (content?: ContentNode) => {\n const transformedContent = getDefaultNode(\n nodeType,\n locales,\n content\n ) as ContentNode;\n\n onNodeTypeChangeProp(transformedContent);\n };\n\n if (\n nodeType === NodeType.Translation ||\n nodeType === NodeType.Condition ||\n nodeType === NodeType.Gender ||\n nodeType === NodeType.Enumeration\n ) {\n const firstKey = Object.keys(\n (section as unknown as TypedNode)[nodeType as keyof typeof section]\n )[0];\n const childrenKeyPath = [\n ...keyPath,\n { type: nodeType, key: firstKey },\n ] as KeyPath[];\n\n return (\n <div className=\"flex w-full flex-col gap-1\">\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(\n getDefaultNode(nodeType, locales) as ContentNode\n )\n }\n />\n\n <NodeTypeView\n section={children}\n keyPath={childrenKeyPath}\n dictionaryLocalId={dictionaryLocalId}\n onNodeTypeChange={onNodeTypeChange}\n />\n </div>\n );\n }\n\n if (nodeType === NodeType.Array) {\n const childrenKeyPath = [...keyPath, { type: nodeType, key: 0 } as KeyPath];\n return (\n <div className=\"flex w-full flex-col gap-1\">\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(\n getDefaultNode(nodeType, locales) as ContentNode\n )\n }\n />\n\n <NodeTypeView\n section={children}\n keyPath={childrenKeyPath}\n dictionaryLocalId={dictionaryLocalId}\n onNodeTypeChange={onNodeTypeChange}\n />\n </div>\n );\n }\n\n if (nodeType === NodeType.Object) {\n return (\n <>\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(\n getDefaultNode(nodeType, locales) as ContentNode\n )\n }\n />\n <div className=\"mt-6 ml-10\">\n <StructureView\n keyPath={keyPath}\n section={section}\n dictionaryLocalId={dictionaryLocalId}\n />\n </div>\n </>\n );\n }\n\n return (\n <NodeTypeSelector\n section={section}\n onValueChange={(nodeType) =>\n onNodeTypeChangeProp(getDefaultNode(nodeType, locales) as ContentNode)\n }\n />\n );\n};\n\ntype NodeWrapperProps = {\n sectionKey?: string;\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n};\n\nexport const NodeView: FC<NodeWrapperProps> = ({\n sectionKey,\n section,\n keyPath,\n dictionaryLocalId,\n}) => {\n const { focusedContent, setFocusedContentKeyPath } =\n useFocusUnmergedDictionary();\n const { renameEditedContent, addEditedContent } = useEditedContentActions();\n\n const { titleInput, deleteButton } = useIntlayer('structure-view');\n\n const handleRenameNodeKey = (keyName: string) => {\n renameEditedContent(dictionaryLocalId, keyName, keyPath);\n const prevKeyPath: KeyPath[] = keyPath.slice(0, -1);\n const lastKeyPath: KeyPath = keyPath[keyPath.length - 1];\n const newKeyPath: KeyPath[] = [\n ...prevKeyPath,\n { ...lastKeyPath, key: keyName } as KeyPath,\n ];\n setFocusedContentKeyPath(newKeyPath);\n };\n\n return (\n <Container\n transparency=\"xl\"\n roundedSize=\"xl\"\n className=\"w-full min-w-80 gap-2 overflow-auto px-5 py-2\"\n border\n borderColor=\"text\"\n background=\"none\"\n aria-selected={isSameKeyPath(keyPath, focusedContent?.keyPath ?? [])}\n onClick={() => setFocusedContentKeyPath(keyPath)}\n >\n <div className=\"flex w-full flex-col items-start justify-between gap-3\">\n {typeof sectionKey === 'string' && (\n <div className=\"w-full\">\n <div className=\"flex w-full items-center justify-between gap-10\">\n <EditableFieldInput\n name=\"key\"\n aria-label=\"Key\"\n placeholder={titleInput.placeholder.value}\n defaultValue={sectionKey}\n onSave={(value) => handleRenameNodeKey(value)}\n variant={InputVariant.INVISIBLE}\n />\n <Button\n label={deleteButton.label.value}\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.ICON_SM}\n color={ButtonColor.TEXT}\n className=\"translate-x-2\"\n Icon={Trash}\n onClick={() => {\n addEditedContent(dictionaryLocalId, undefined, keyPath);\n\n const parentKeyPath: KeyPath[] = keyPath.slice(0, -1);\n setFocusedContentKeyPath(parentKeyPath);\n }}\n />\n </div>\n\n <span className=\"ml-3 text-neutral text-sm\">\n ( {camelCaseToSentence(sectionKey)} )\n </span>\n </div>\n )}\n <NodeTypeView\n keyPath={keyPath}\n dictionaryLocalId={dictionaryLocalId}\n section={section}\n onNodeTypeChange={(content) => {\n addEditedContent(dictionaryLocalId, content, keyPath);\n }}\n />\n </div>\n </Container>\n );\n};\n\ntype ObjectViewProps = {\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n};\n\nexport const ObjectView: FC<ObjectViewProps> = ({\n section,\n keyPath,\n dictionaryLocalId,\n}) => {\n const { addNodeButton } = useIntlayer('structure-view');\n const { setFocusedContentKeyPath } = useFocusUnmergedDictionary();\n const { addEditedContent } = useEditedContentActions();\n\n if (!section || typeof section !== 'object') {\n return <div>Not an object</div>;\n }\n\n return (\n <div className=\"flex flex-col gap-2 overflow-y-auto\">\n <ul className=\"mr-auto flex flex-col gap-4\">\n {Object.keys(section).map((key) => (\n <li key={key} className=\"flex w-full\">\n <NodeView\n sectionKey={key}\n section={section?.[key as keyof typeof section]}\n keyPath={[...keyPath, { type: NodeType.Object, key }]}\n dictionaryLocalId={dictionaryLocalId}\n />\n </li>\n ))}\n </ul>\n <Button\n label={addNodeButton.label.value}\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.MD}\n color={ButtonColor.TEXT}\n Icon={Plus}\n className=\"flex-1\"\n onClick={() => {\n const newKey = 'newKey';\n const newKeyPath = [\n ...keyPath,\n { type: NodeType.Object, key: newKey },\n ] as KeyPath[];\n addEditedContent(dictionaryLocalId, '', newKeyPath);\n setFocusedContentKeyPath(newKeyPath);\n }}\n >\n {addNodeButton.text}\n </Button>\n </div>\n );\n};\n\ntype StructureViewProps = {\n dictionaryLocalId: LocalDictionaryId;\n keyPath: KeyPath[];\n section: ContentNode;\n};\n\nexport const StructureView: FC<StructureViewProps> = ({\n section,\n keyPath,\n dictionaryLocalId,\n}) => {\n if (\n !section ||\n typeof section !== 'object' ||\n typeof section.nodeType === 'string'\n ) {\n return (\n <NodeView\n sectionKey={'content'}\n section={section}\n keyPath={keyPath}\n dictionaryLocalId={dictionaryLocalId}\n />\n );\n }\n\n return (\n <ObjectView\n section={section}\n keyPath={keyPath}\n dictionaryLocalId={dictionaryLocalId}\n />\n );\n};\n"],"mappings":"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"}
|
package/dist/esm/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VersionSwitcher.mjs","names":["VersionSwitcher: FC<VersionSwitcherProps>"],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport { MoveVertical } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport {\n Button,\n ButtonColor,\n ButtonSize,\n ButtonTextAlign,\n ButtonVariant,\n} from '../../Button';\nimport { Container } from '../../Container';\nimport { DropDown, type PanelProps } from '../../DropDown';\nimport { useVersionSwitcher } from './VersionSwitcherContext';\n\nexport type VersionSwitcherProps = {\n panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'version-switcher';\n\nexport const VersionSwitcher: FC<VersionSwitcherProps> = ({ panelProps }) => {\n const { switchTo, versionSwitcherLabel, versionListLabel } =\n useIntlayer('version-switcher');\n const { selectedVersion, versions, setSelectedVersion } =\n useVersionSwitcher();\n\n if (versions.length === 0) {\n return <></>;\n }\n\n return (\n <div\n className=\"rounded-xl border border-text text-text transition-colors\"\n aria-label={versionListLabel.value}\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2\">{selectedVersion ?? 'LTS'}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel\n identifier={DROPDOWN_IDENTIFIER}\n isOverable\n isFocusable\n className=\"right-0 left-auto\"\n {...panelProps}\n >\n <Container\n className=\"max-h-[80vh] min-w-28\"\n separator=\"y\"\n role=\"listbox\"\n transparency=\"sm\"\n border\n roundedSize=\"2xl\"\n borderColor=\"text\"\n aria-label={versionSwitcherLabel.value}\n >\n <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n {versions.reverse().map((version) => (\n <li className=\"px-1.5 py-1\" key={version}>\n <Button\n onClick={() => setSelectedVersion(version)}\n label={`${switchTo} v${version}`}\n isActive={selectedVersion === version}\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n isFullWidth\n textAlign={ButtonTextAlign.LEFT}\n size={ButtonSize.SM}\n >\n <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1 text-neutral text-sm\">\n {version}\n </div>\n </Button>\n </li>\n ))}\n </ol>\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"VersionSwitcher.mjs","names":["VersionSwitcher: FC<VersionSwitcherProps>"],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.tsx"],"sourcesContent":["'use client';\n\nimport { MoveVertical } from 'lucide-react';\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport {\n Button,\n ButtonColor,\n ButtonSize,\n ButtonTextAlign,\n ButtonVariant,\n} from '../../Button';\nimport { Container } from '../../Container';\nimport { DropDown, type PanelProps } from '../../DropDown';\nimport { useVersionSwitcher } from './VersionSwitcherContext';\n\nexport type VersionSwitcherProps = {\n panelProps?: Omit<PanelProps, 'identifier'>;\n};\n\nconst DROPDOWN_IDENTIFIER = 'version-switcher';\n\nexport const VersionSwitcher: FC<VersionSwitcherProps> = ({ panelProps }) => {\n const { switchTo, versionSwitcherLabel, versionListLabel } =\n useIntlayer('version-switcher');\n const { selectedVersion, versions, setSelectedVersion } =\n useVersionSwitcher();\n\n if (versions.length === 0) {\n return <></>;\n }\n\n return (\n <div\n className=\"rounded-xl border border-text text-text transition-colors\"\n aria-label={versionListLabel.value}\n >\n <DropDown identifier={DROPDOWN_IDENTIFIER}>\n <DropDown.Trigger identifier={DROPDOWN_IDENTIFIER}>\n <div className=\"flex w-full items-center justify-between\">\n <div className=\"px-2\">{selectedVersion ?? 'LTS'}</div>\n <MoveVertical className=\"w-5 self-center\" />\n </div>\n </DropDown.Trigger>\n\n <DropDown.Panel\n identifier={DROPDOWN_IDENTIFIER}\n isOverable\n isFocusable\n className=\"right-0 left-auto\"\n {...panelProps}\n >\n <Container\n className=\"max-h-[80vh] min-w-28\"\n separator=\"y\"\n role=\"listbox\"\n transparency=\"sm\"\n border\n roundedSize=\"2xl\"\n borderColor=\"text\"\n aria-label={versionSwitcherLabel.value}\n >\n <ol className=\"divide-y divide-dashed divide-text/20 overflow-y-auto p-1\">\n {versions.reverse().map((version) => (\n <li className=\"px-1.5 py-1\" key={version}>\n <Button\n onClick={() => setSelectedVersion(version)}\n label={`${switchTo} v${version}`}\n isActive={selectedVersion === version}\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n isFullWidth\n textAlign={ButtonTextAlign.LEFT}\n size={ButtonSize.SM}\n >\n <div className=\"flex flex-1 flex-row items-center justify-between gap-3 px-2 py-1 text-neutral text-sm\">\n {version}\n </div>\n </Button>\n </li>\n ))}\n </ol>\n </Container>\n </DropDown.Panel>\n </DropDown>\n </div>\n );\n};\n"],"mappings":";;;;;;;;;;;AAoBA,MAAM,sBAAsB;AAE5B,MAAaA,mBAA6C,EAAE,iBAAiB;CAC3E,MAAM,EAAE,UAAU,sBAAsB,qBACtC,YAAY,mBAAmB;CACjC,MAAM,EAAE,iBAAiB,UAAU,uBACjC,oBAAoB;AAEtB,KAAI,SAAS,WAAW,EACtB,QAAO,iCAAK;AAGd,QACE,oBAAC;EACC,WAAU;EACV,cAAY,iBAAiB;YAE7B,qBAAC;GAAS,YAAY;cACpB,oBAAC,SAAS;IAAQ,YAAY;cAC5B,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAI,WAAU;gBAAQ,mBAAmB;OAAY,EACtD,oBAAC,gBAAa,WAAU,oBAAoB;MACxC;KACW,EAEnB,oBAAC,SAAS;IACR,YAAY;IACZ;IACA;IACA,WAAU;IACV,GAAI;cAEJ,oBAAC;KACC,WAAU;KACV,WAAU;KACV,MAAK;KACL,cAAa;KACb;KACA,aAAY;KACZ,aAAY;KACZ,cAAY,qBAAqB;eAEjC,oBAAC;MAAG,WAAU;gBACX,SAAS,SAAS,CAAC,KAAK,YACvB,oBAAC;OAAG,WAAU;iBACZ,oBAAC;QACC,eAAe,mBAAmB,QAAQ;QAC1C,OAAO,GAAG,SAAS,IAAI;QACvB,UAAU,oBAAoB;QAC9B,SAAS,cAAc;QACvB,OAAO,YAAY;QACnB;QACA,WAAW,gBAAgB;QAC3B,MAAM,WAAW;kBAEjB,oBAAC;SAAI,WAAU;mBACZ;UACG;SACC;SAdsB,QAe5B,CACL;OACC;MACK;KACG;IACR;GACP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VersionSwitcherContext.mjs","names":["VersionSwitcherProvider: FC<\n PropsWithChildren<VersionSwitcherProviderProps>\n>"],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type Dispatch,\n type FC,\n type PropsWithChildren,\n type SetStateAction,\n useContext,\n} from 'react';\nimport { usePersistedStore } from '../../../hooks';\n\ntype VersionSwitcherContextProps = {\n versions: string[];\n selectedVersion: string | null;\n setSelectedVersion: Dispatch<SetStateAction<string | null>>;\n};\n\nconst VersionSwitcherContext = createContext<VersionSwitcherContextProps>({\n versions: [],\n selectedVersion: null,\n setSelectedVersion: () => {},\n});\n\nexport const useVersionSwitcher = () => useContext(VersionSwitcherContext);\n\ntype VersionSwitcherProviderProps = {\n versions: string[];\n defaultSelectedVersion?: string;\n};\n\nexport const VersionSwitcherProvider: FC<\n PropsWithChildren<VersionSwitcherProviderProps>\n> = ({ versions, defaultSelectedVersion, children }) => {\n const [selectedVersion, setSelectedVersion] = usePersistedStore<\n string | null\n >('version-selector', defaultSelectedVersion);\n\n return (\n <VersionSwitcherContext\n value={{\n versions,\n selectedVersion,\n setSelectedVersion,\n }}\n >\n {children}\n </VersionSwitcherContext>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"VersionSwitcherContext.mjs","names":["VersionSwitcherProvider: FC<\n PropsWithChildren<VersionSwitcherProviderProps>\n>"],"sources":["../../../../../src/components/DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type Dispatch,\n type FC,\n type PropsWithChildren,\n type SetStateAction,\n useContext,\n} from 'react';\nimport { usePersistedStore } from '../../../hooks';\n\ntype VersionSwitcherContextProps = {\n versions: string[];\n selectedVersion: string | null;\n setSelectedVersion: Dispatch<SetStateAction<string | null>>;\n};\n\nconst VersionSwitcherContext = createContext<VersionSwitcherContextProps>({\n versions: [],\n selectedVersion: null,\n setSelectedVersion: () => {},\n});\n\nexport const useVersionSwitcher = () => useContext(VersionSwitcherContext);\n\ntype VersionSwitcherProviderProps = {\n versions: string[];\n defaultSelectedVersion?: string;\n};\n\nexport const VersionSwitcherProvider: FC<\n PropsWithChildren<VersionSwitcherProviderProps>\n> = ({ versions, defaultSelectedVersion, children }) => {\n const [selectedVersion, setSelectedVersion] = usePersistedStore<\n string | null\n >('version-selector', defaultSelectedVersion);\n\n return (\n <VersionSwitcherContext\n value={{\n versions,\n selectedVersion,\n setSelectedVersion,\n }}\n >\n {children}\n </VersionSwitcherContext>\n );\n};\n"],"mappings":";;;;;;;AAkBA,MAAM,yBAAyB,cAA2C;CACxE,UAAU,EAAE;CACZ,iBAAiB;CACjB,0BAA0B;CAC3B,CAAC;AAEF,MAAa,2BAA2B,WAAW,uBAAuB;AAO1E,MAAaA,2BAER,EAAE,UAAU,wBAAwB,eAAe;CACtD,MAAM,CAAC,iBAAiB,sBAAsB,kBAE5C,oBAAoB,uBAAuB;AAE7C,QACE,oBAAC;EACC,OAAO;GACL;GACA;GACA;GACD;EAEA;GACsB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableFieldInput.mjs","names":["EditableFieldInput: FC<EditableFieldInputProps>"],"sources":["../../../../src/components/EditableField/EditableFieldInput.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, type Ref, useImperativeHandle, useMemo, useRef } from 'react';\nimport { Input, type InputProps } from '../Input';\nimport { EditableFieldLayout } from './EditableFieldLayout';\n\n/**\n * Props for the EditableFieldInput component, extending standard Input props\n */\ntype EditableFieldInputProps = InputProps & {\n /** Callback function called when the user saves the edited value */\n onSave?: (value: string) => void;\n /** Callback function called when the user cancels the edit operation */\n onCancel?: () => void;\n};\n\n/**\n * EditableFieldInput Component\n *\n * An inline editable input field that displays as read-only text until clicked.\n * When activated, it shows an input field with save and cancel buttons.\n *\n * @example\n * ```tsx\n * <EditableFieldInput\n * defaultValue=\"Edit me\"\n * placeholder=\"Click to edit...\"\n * onSave={(value) => console.log('Saved:', value)}\n * onCancel={() => console.log('Cancelled')}\n * />\n * ```\n *\n * ## Features\n * - **Inline Editing**: Click to edit, displays as text when not editing\n * - **Save/Cancel Actions**: Built-in save and cancel buttons with callbacks\n * - **Keyboard Support**: Accessible keyboard navigation\n * - **Input Variants**: Supports all Input component variants and sizes\n * - **Auto-save on Click Away**: Saves automatically when clicking outside\n * - **Ref Forwarding**: Exposes the underlying input element reference\n *\n * ## Accessibility\n * - Uses semantic HTML with proper ARIA attributes\n * - Keyboard accessible with tab navigation\n * - Screen reader friendly with descriptive labels\n * - Focus management for edit mode transitions\n *\n * @param props - EditableFieldInputProps extending InputProps\n * @returns React functional component\n */\nexport const EditableFieldInput: FC<EditableFieldInputProps> = ({\n onSave,\n onCancel,\n ref,\n ...props\n}) => {\n const inputRef = useRef<HTMLInputElement>(null);\n\n const handleSave = () => {\n // Your save logic here\n onSave?.(inputRef.current?.value ?? '');\n };\n\n const handleCancel = () => {\n if (inputRef.current) {\n inputRef.current.value = inputRef.current.defaultValue ?? '';\n }\n onCancel?.();\n };\n\n // Expose the input ref to parent components\n useImperativeHandle(ref as Ref<HTMLElement>, () => inputRef.current!);\n\n const value = useMemo(\n () =>\n (props.value as string) ??\n inputRef.current?.value ??\n (props.defaultValue as string),\n\n [props.value, props.defaultValue, inputRef.current?.value]\n );\n\n return (\n <EditableFieldLayout\n value={value}\n onCancel={handleCancel}\n onSave={handleSave}\n >\n <Input ref={inputRef} {...props} />\n </EditableFieldLayout>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"EditableFieldInput.mjs","names":["EditableFieldInput: FC<EditableFieldInputProps>"],"sources":["../../../../src/components/EditableField/EditableFieldInput.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, type Ref, useImperativeHandle, useMemo, useRef } from 'react';\nimport { Input, type InputProps } from '../Input';\nimport { EditableFieldLayout } from './EditableFieldLayout';\n\n/**\n * Props for the EditableFieldInput component, extending standard Input props\n */\ntype EditableFieldInputProps = InputProps & {\n /** Callback function called when the user saves the edited value */\n onSave?: (value: string) => void;\n /** Callback function called when the user cancels the edit operation */\n onCancel?: () => void;\n};\n\n/**\n * EditableFieldInput Component\n *\n * An inline editable input field that displays as read-only text until clicked.\n * When activated, it shows an input field with save and cancel buttons.\n *\n * @example\n * ```tsx\n * <EditableFieldInput\n * defaultValue=\"Edit me\"\n * placeholder=\"Click to edit...\"\n * onSave={(value) => console.log('Saved:', value)}\n * onCancel={() => console.log('Cancelled')}\n * />\n * ```\n *\n * ## Features\n * - **Inline Editing**: Click to edit, displays as text when not editing\n * - **Save/Cancel Actions**: Built-in save and cancel buttons with callbacks\n * - **Keyboard Support**: Accessible keyboard navigation\n * - **Input Variants**: Supports all Input component variants and sizes\n * - **Auto-save on Click Away**: Saves automatically when clicking outside\n * - **Ref Forwarding**: Exposes the underlying input element reference\n *\n * ## Accessibility\n * - Uses semantic HTML with proper ARIA attributes\n * - Keyboard accessible with tab navigation\n * - Screen reader friendly with descriptive labels\n * - Focus management for edit mode transitions\n *\n * @param props - EditableFieldInputProps extending InputProps\n * @returns React functional component\n */\nexport const EditableFieldInput: FC<EditableFieldInputProps> = ({\n onSave,\n onCancel,\n ref,\n ...props\n}) => {\n const inputRef = useRef<HTMLInputElement>(null);\n\n const handleSave = () => {\n // Your save logic here\n onSave?.(inputRef.current?.value ?? '');\n };\n\n const handleCancel = () => {\n if (inputRef.current) {\n inputRef.current.value = inputRef.current.defaultValue ?? '';\n }\n onCancel?.();\n };\n\n // Expose the input ref to parent components\n useImperativeHandle(ref as Ref<HTMLElement>, () => inputRef.current!);\n\n const value = useMemo(\n () =>\n (props.value as string) ??\n inputRef.current?.value ??\n (props.defaultValue as string),\n\n [props.value, props.defaultValue, inputRef.current?.value]\n );\n\n return (\n <EditableFieldLayout\n value={value}\n onCancel={handleCancel}\n onSave={handleSave}\n >\n <Input ref={inputRef} {...props} />\n </EditableFieldLayout>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,MAAaA,sBAAmD,EAC9D,QACA,UACA,KACA,GAAG,YACC;CACJ,MAAM,WAAW,OAAyB,KAAK;CAE/C,MAAM,mBAAmB;AAEvB,WAAS,SAAS,SAAS,SAAS,GAAG;;CAGzC,MAAM,qBAAqB;AACzB,MAAI,SAAS,QACX,UAAS,QAAQ,QAAQ,SAAS,QAAQ,gBAAgB;AAE5D,cAAY;;AAId,qBAAoB,WAA+B,SAAS,QAAS;AAWrE,QACE,oBAAC;EACC,OAXU,cAET,MAAM,SACP,SAAS,SAAS,SACjB,MAAM,cAET;GAAC,MAAM;GAAO,MAAM;GAAc,SAAS,SAAS;GAAM,CAC3D;EAKG,UAAU;EACV,QAAQ;YAER,oBAAC;GAAM,KAAK;GAAU,GAAI;IAAS;GACf"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
-
|
|
4
3
|
import { cn } from "../../utils/cn.mjs";
|
|
5
4
|
import { Button, ButtonColor, ButtonSize, ButtonVariant } from "../Button/Button.mjs";
|
|
6
|
-
import { useCallback, useEffect, useRef, useState } from "react";
|
|
7
5
|
import { Check, Pencil, X } from "lucide-react";
|
|
6
|
+
import { useCallback, useEffect, useRef, useState } from "react";
|
|
8
7
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
8
|
|
|
10
9
|
//#region src/components/EditableField/EditableFieldLayout.tsx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableFieldLayout.mjs","names":["EditableFieldLayout: FC<EditableFieldLayoutProps>"],"sources":["../../../../src/components/EditableField/EditableFieldLayout.tsx"],"sourcesContent":["'use client';\n\nimport { Check, Pencil, X } from 'lucide-react';\nimport {\n type FC,\n type HTMLAttributes,\n type ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\n\ntype EditableFieldLayoutProps = {\n value?: string | null | undefined;\n onCancel: () => void;\n onSave: () => void;\n children: ReactNode;\n isDisabled?: boolean;\n} & HTMLAttributes<HTMLSpanElement>;\n\nexport const EditableFieldLayout: FC<EditableFieldLayoutProps> = ({\n value = '',\n onCancel,\n onSave,\n onClick,\n children,\n isDisabled,\n ...props\n}) => {\n const [isEditing, setIsEditing] = useState(false);\n const editableFieldRef = useRef<HTMLSpanElement>(null);\n\n const handleSave = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n setIsEditing(false);\n onSave();\n };\n\n const handleCancel = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n setIsEditing(false);\n onCancel();\n };\n\n const result = !value || value === '' ? '-' : value;\n\n const handleClickOutside = useCallback(\n (e: MouseEvent) => {\n // Check if there's any text selected\n const selection = window.getSelection();\n if (selection && selection.toString().trim() !== '') {\n // If there is a selection, do not trigger the save and exit early.\n return;\n }\n\n // Proceed if the click is truly outside the component.\n if (\n editableFieldRef.current &&\n !editableFieldRef.current.contains(e.target as Node)\n ) {\n setIsEditing(false);\n onSave();\n }\n },\n [onSave]\n );\n\n useEffect(() => {\n if (isEditing) {\n document.addEventListener('click', handleClickOutside);\n } else {\n document.removeEventListener('click', handleClickOutside);\n }\n\n return () => document.removeEventListener('click', handleClickOutside);\n }, [handleClickOutside, isEditing]);\n\n return (\n <span\n className=\"group/editable-field flex gap-2\"\n role=\"button\"\n tabIndex={0}\n onClick={(e) => {\n setIsEditing(true);\n onClick?.(e);\n }}\n ref={editableFieldRef}\n {...props}\n >\n <div\n className={cn('flex flex-1 gap-2', isEditing ? 'display' : 'hidden')}\n key={String(isEditing)}\n >\n {children}\n <Button\n label=\"Save\"\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.ICON_SM}\n color={ButtonColor.TEXT}\n Icon={Check}\n onClick={handleSave}\n disabled={isDisabled}\n className=\"!text-current\"\n role=\"button\"\n tabIndex={0}\n aria-label=\"Save changes\"\n data-testid=\"editable-field-save-button\"\n />\n <Button\n label=\"Cancel\"\n color={ButtonColor.TEXT}\n variant={ButtonVariant.HOVERABLE}\n className=\"!text-current\"\n size={ButtonSize.ICON_SM}\n Icon={X}\n onClick={handleCancel}\n disabled={isDisabled}\n role=\"button\"\n tabIndex={0}\n aria-label=\"Cancel changes\"\n data-testid=\"editable-field-cancel-button\"\n />\n </div>\n\n <div\n className={cn('flex flex-1 gap-2', isEditing ? 'hidden' : 'display')}\n >\n <span className=\"ml-2 flex w-full whitespace-pre-wrap p-1 text-sm leading-6\">\n {result}\n </span>\n <Button\n label=\"Edit\"\n Icon={Pencil}\n color={ButtonColor.TEXT}\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.ICON_SM}\n className=\"!text-current invisible group-hover/editable-field:visible\"\n disabled={isDisabled}\n onClick={(e) => {\n e.stopPropagation();\n setIsEditing(true);\n }}\n />\n </div>\n </span>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"EditableFieldLayout.mjs","names":["EditableFieldLayout: FC<EditableFieldLayoutProps>"],"sources":["../../../../src/components/EditableField/EditableFieldLayout.tsx"],"sourcesContent":["'use client';\n\nimport { Check, Pencil, X } from 'lucide-react';\nimport {\n type FC,\n type HTMLAttributes,\n type ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport { cn } from '../../utils/cn';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\n\ntype EditableFieldLayoutProps = {\n value?: string | null | undefined;\n onCancel: () => void;\n onSave: () => void;\n children: ReactNode;\n isDisabled?: boolean;\n} & HTMLAttributes<HTMLSpanElement>;\n\nexport const EditableFieldLayout: FC<EditableFieldLayoutProps> = ({\n value = '',\n onCancel,\n onSave,\n onClick,\n children,\n isDisabled,\n ...props\n}) => {\n const [isEditing, setIsEditing] = useState(false);\n const editableFieldRef = useRef<HTMLSpanElement>(null);\n\n const handleSave = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n setIsEditing(false);\n onSave();\n };\n\n const handleCancel = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n setIsEditing(false);\n onCancel();\n };\n\n const result = !value || value === '' ? '-' : value;\n\n const handleClickOutside = useCallback(\n (e: MouseEvent) => {\n // Check if there's any text selected\n const selection = window.getSelection();\n if (selection && selection.toString().trim() !== '') {\n // If there is a selection, do not trigger the save and exit early.\n return;\n }\n\n // Proceed if the click is truly outside the component.\n if (\n editableFieldRef.current &&\n !editableFieldRef.current.contains(e.target as Node)\n ) {\n setIsEditing(false);\n onSave();\n }\n },\n [onSave]\n );\n\n useEffect(() => {\n if (isEditing) {\n document.addEventListener('click', handleClickOutside);\n } else {\n document.removeEventListener('click', handleClickOutside);\n }\n\n return () => document.removeEventListener('click', handleClickOutside);\n }, [handleClickOutside, isEditing]);\n\n return (\n <span\n className=\"group/editable-field flex gap-2\"\n role=\"button\"\n tabIndex={0}\n onClick={(e) => {\n setIsEditing(true);\n onClick?.(e);\n }}\n ref={editableFieldRef}\n {...props}\n >\n <div\n className={cn('flex flex-1 gap-2', isEditing ? 'display' : 'hidden')}\n key={String(isEditing)}\n >\n {children}\n <Button\n label=\"Save\"\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.ICON_SM}\n color={ButtonColor.TEXT}\n Icon={Check}\n onClick={handleSave}\n disabled={isDisabled}\n className=\"!text-current\"\n role=\"button\"\n tabIndex={0}\n aria-label=\"Save changes\"\n data-testid=\"editable-field-save-button\"\n />\n <Button\n label=\"Cancel\"\n color={ButtonColor.TEXT}\n variant={ButtonVariant.HOVERABLE}\n className=\"!text-current\"\n size={ButtonSize.ICON_SM}\n Icon={X}\n onClick={handleCancel}\n disabled={isDisabled}\n role=\"button\"\n tabIndex={0}\n aria-label=\"Cancel changes\"\n data-testid=\"editable-field-cancel-button\"\n />\n </div>\n\n <div\n className={cn('flex flex-1 gap-2', isEditing ? 'hidden' : 'display')}\n >\n <span className=\"ml-2 flex w-full whitespace-pre-wrap p-1 text-sm leading-6\">\n {result}\n </span>\n <Button\n label=\"Edit\"\n Icon={Pencil}\n color={ButtonColor.TEXT}\n variant={ButtonVariant.HOVERABLE}\n size={ButtonSize.ICON_SM}\n className=\"!text-current invisible group-hover/editable-field:visible\"\n disabled={isDisabled}\n onClick={(e) => {\n e.stopPropagation();\n setIsEditing(true);\n }}\n />\n </div>\n </span>\n );\n};\n"],"mappings":";;;;;;;;;AAuBA,MAAaA,uBAAqD,EAChE,QAAQ,IACR,UACA,QACA,SACA,UACA,YACA,GAAG,YACC;CACJ,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CACjD,MAAM,mBAAmB,OAAwB,KAAK;CAEtD,MAAM,cAAc,MAA2C;AAC7D,IAAE,iBAAiB;AACnB,eAAa,MAAM;AACnB,UAAQ;;CAGV,MAAM,gBAAgB,MAA2C;AAC/D,IAAE,iBAAiB;AACnB,eAAa,MAAM;AACnB,YAAU;;CAGZ,MAAM,SAAS,CAAC,SAAS,UAAU,KAAK,MAAM;CAE9C,MAAM,qBAAqB,aACxB,MAAkB;EAEjB,MAAM,YAAY,OAAO,cAAc;AACvC,MAAI,aAAa,UAAU,UAAU,CAAC,MAAM,KAAK,GAE/C;AAIF,MACE,iBAAiB,WACjB,CAAC,iBAAiB,QAAQ,SAAS,EAAE,OAAe,EACpD;AACA,gBAAa,MAAM;AACnB,WAAQ;;IAGZ,CAAC,OAAO,CACT;AAED,iBAAgB;AACd,MAAI,UACF,UAAS,iBAAiB,SAAS,mBAAmB;MAEtD,UAAS,oBAAoB,SAAS,mBAAmB;AAG3D,eAAa,SAAS,oBAAoB,SAAS,mBAAmB;IACrE,CAAC,oBAAoB,UAAU,CAAC;AAEnC,QACE,qBAAC;EACC,WAAU;EACV,MAAK;EACL,UAAU;EACV,UAAU,MAAM;AACd,gBAAa,KAAK;AAClB,aAAU,EAAE;;EAEd,KAAK;EACL,GAAI;aAEJ,qBAAC;GACC,WAAW,GAAG,qBAAqB,YAAY,YAAY,SAAS;;IAGnE;IACD,oBAAC;KACC,OAAM;KACN,SAAS,cAAc;KACvB,MAAM,WAAW;KACjB,OAAO,YAAY;KACnB,MAAM;KACN,SAAS;KACT,UAAU;KACV,WAAU;KACV,MAAK;KACL,UAAU;KACV,cAAW;KACX,eAAY;MACZ;IACF,oBAAC;KACC,OAAM;KACN,OAAO,YAAY;KACnB,SAAS,cAAc;KACvB,WAAU;KACV,MAAM,WAAW;KACjB,MAAM;KACN,SAAS;KACT,UAAU;KACV,MAAK;KACL,UAAU;KACV,cAAW;KACX,eAAY;MACZ;;KA9BG,OAAO,UAAU,CA+BlB,EAEN,qBAAC;GACC,WAAW,GAAG,qBAAqB,YAAY,WAAW,UAAU;cAEpE,oBAAC;IAAK,WAAU;cACb;KACI,EACP,oBAAC;IACC,OAAM;IACN,MAAM;IACN,OAAO,YAAY;IACnB,SAAS,cAAc;IACvB,MAAM,WAAW;IACjB,WAAU;IACV,UAAU;IACV,UAAU,MAAM;AACd,OAAE,iBAAiB;AACnB,kBAAa,KAAK;;KAEpB;IACE;GACD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableFieldTextArea.mjs","names":["EditableFieldTextArea: FC<EditableFieldTextAreaProps>"],"sources":["../../../../src/components/EditableField/EditableFieldTextArea.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, type Ref, useImperativeHandle, useRef } from 'react';\nimport { AutoSizedTextArea, type AutoSizedTextAreaProps } from '../TextArea';\nimport { EditableFieldLayout } from './EditableFieldLayout';\n\n/**\n * Props for the EditableFieldTextArea component, extending AutoSizedTextAreaProps\n */\ntype EditableFieldTextAreaProps = AutoSizedTextAreaProps & {\n /** Callback function called when the user saves the edited value */\n onSave?: (value: string) => void;\n /** Callback function called when the user cancels the edit operation */\n onCancel?: () => void;\n};\n\n/**\n * EditableFieldTextArea Component\n *\n * An inline editable textarea field that displays as read-only text until clicked.\n * When activated, it shows an auto-sized textarea with save and cancel buttons.\n * Perfect for multiline text editing with automatic height adjustment.\n *\n * @example\n * ```tsx\n * <EditableFieldTextArea\n * defaultValue=\"Multiline text content\"\n * placeholder=\"Click to edit...\"\n * maxRows={10}\n * onSave={(value) => console.log('Saved:', value)}\n * onCancel={() => console.log('Cancelled')}\n * />\n * ```\n *\n * ## Features\n * - **Inline Editing**: Click to edit, displays as formatted text when not editing\n * - **Auto-Sizing**: Automatically adjusts height to fit content\n * - **Save/Cancel Actions**: Built-in save and cancel buttons with callbacks\n * - **Multiline Support**: Preserves line breaks and formatting\n * - **Max Rows Control**: Configurable maximum height with scroll\n * - **Auto-save on Click Away**: Saves automatically when clicking outside\n * - **Ref Forwarding**: Exposes the underlying textarea element reference\n *\n * ## Accessibility\n * - Uses semantic HTML with proper ARIA attributes\n * - Keyboard accessible with tab navigation\n * - Screen reader friendly with descriptive labels\n * - Focus management for edit mode transitions\n * - Preserves whitespace and formatting for screen readers\n *\n * @param props - EditableFieldTextAreaProps extending AutoSizedTextAreaProps\n * @returns React functional component\n */\nexport const EditableFieldTextArea: FC<EditableFieldTextAreaProps> = ({\n onSave,\n onCancel,\n ref,\n ...props\n}) => {\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n // Expose the text area ref to parent components\n useImperativeHandle(ref as Ref<HTMLElement>, () => textAreaRef.current!);\n\n const handleSave = () => {\n // Your save logic here\n onSave?.(textAreaRef.current?.value ?? '');\n };\n\n const handleCancel = () => {\n if (textAreaRef.current) {\n textAreaRef.current.value = textAreaRef.current.defaultValue ?? '';\n }\n onCancel?.();\n };\n\n const memoValue =\n (props.value as string) ??\n textAreaRef.current?.value ??\n (props.defaultValue as string) ??\n '';\n\n return (\n <EditableFieldLayout\n value={memoValue}\n onCancel={handleCancel}\n onSave={handleSave}\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n }}\n >\n <AutoSizedTextArea\n className=\"leading-6\"\n ref={textAreaRef}\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n }}\n {...props}\n />\n </EditableFieldLayout>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"EditableFieldTextArea.mjs","names":["EditableFieldTextArea: FC<EditableFieldTextAreaProps>"],"sources":["../../../../src/components/EditableField/EditableFieldTextArea.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, type Ref, useImperativeHandle, useRef } from 'react';\nimport { AutoSizedTextArea, type AutoSizedTextAreaProps } from '../TextArea';\nimport { EditableFieldLayout } from './EditableFieldLayout';\n\n/**\n * Props for the EditableFieldTextArea component, extending AutoSizedTextAreaProps\n */\ntype EditableFieldTextAreaProps = AutoSizedTextAreaProps & {\n /** Callback function called when the user saves the edited value */\n onSave?: (value: string) => void;\n /** Callback function called when the user cancels the edit operation */\n onCancel?: () => void;\n};\n\n/**\n * EditableFieldTextArea Component\n *\n * An inline editable textarea field that displays as read-only text until clicked.\n * When activated, it shows an auto-sized textarea with save and cancel buttons.\n * Perfect for multiline text editing with automatic height adjustment.\n *\n * @example\n * ```tsx\n * <EditableFieldTextArea\n * defaultValue=\"Multiline text content\"\n * placeholder=\"Click to edit...\"\n * maxRows={10}\n * onSave={(value) => console.log('Saved:', value)}\n * onCancel={() => console.log('Cancelled')}\n * />\n * ```\n *\n * ## Features\n * - **Inline Editing**: Click to edit, displays as formatted text when not editing\n * - **Auto-Sizing**: Automatically adjusts height to fit content\n * - **Save/Cancel Actions**: Built-in save and cancel buttons with callbacks\n * - **Multiline Support**: Preserves line breaks and formatting\n * - **Max Rows Control**: Configurable maximum height with scroll\n * - **Auto-save on Click Away**: Saves automatically when clicking outside\n * - **Ref Forwarding**: Exposes the underlying textarea element reference\n *\n * ## Accessibility\n * - Uses semantic HTML with proper ARIA attributes\n * - Keyboard accessible with tab navigation\n * - Screen reader friendly with descriptive labels\n * - Focus management for edit mode transitions\n * - Preserves whitespace and formatting for screen readers\n *\n * @param props - EditableFieldTextAreaProps extending AutoSizedTextAreaProps\n * @returns React functional component\n */\nexport const EditableFieldTextArea: FC<EditableFieldTextAreaProps> = ({\n onSave,\n onCancel,\n ref,\n ...props\n}) => {\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n // Expose the text area ref to parent components\n useImperativeHandle(ref as Ref<HTMLElement>, () => textAreaRef.current!);\n\n const handleSave = () => {\n // Your save logic here\n onSave?.(textAreaRef.current?.value ?? '');\n };\n\n const handleCancel = () => {\n if (textAreaRef.current) {\n textAreaRef.current.value = textAreaRef.current.defaultValue ?? '';\n }\n onCancel?.();\n };\n\n const memoValue =\n (props.value as string) ??\n textAreaRef.current?.value ??\n (props.defaultValue as string) ??\n '';\n\n return (\n <EditableFieldLayout\n value={memoValue}\n onCancel={handleCancel}\n onSave={handleSave}\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n }}\n >\n <AutoSizedTextArea\n className=\"leading-6\"\n ref={textAreaRef}\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n }}\n {...props}\n />\n </EditableFieldLayout>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA,MAAaA,yBAAyD,EACpE,QACA,UACA,KACA,GAAG,YACC;CACJ,MAAM,cAAc,OAA4B,KAAK;AAGrD,qBAAoB,WAA+B,YAAY,QAAS;CAExE,MAAM,mBAAmB;AAEvB,WAAS,YAAY,SAAS,SAAS,GAAG;;CAG5C,MAAM,qBAAqB;AACzB,MAAI,YAAY,QACd,aAAY,QAAQ,QAAQ,YAAY,QAAQ,gBAAgB;AAElE,cAAY;;AASd,QACE,oBAAC;EACC,OAPD,MAAM,SACP,YAAY,SAAS,SACpB,MAAM,gBACP;EAKE,UAAU;EACV,QAAQ;EACR,UAAU,MAAM;AACd,KAAE,gBAAgB;AAClB,KAAE,iBAAiB;;YAGrB,oBAAC;GACC,WAAU;GACV,KAAK;GACL,UAAU,MAAM;AACd,MAAE,gBAAgB;AAClB,MAAE,iBAAiB;;GAErB,GAAI;IACJ;GACkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpandCollapse.mjs","names":["ExpandCollapse: FC<ExpandCollapseProps>"],"sources":["../../../../src/components/ExpandCollapse/ExpandCollapse.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, type ReactNode, useEffect, useRef, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\n/**\n * Props for the ExpandCollapse component\n */\nexport type ExpandCollapseProps = {\n /** Whether the component should provide expand/collapse functionality. If false, renders children directly */\n isRollable?: boolean;\n /** Minimum height in pixels before showing the expand/collapse toggle */\n minHeight?: number;\n /** Content that may overflow and trigger the expand/collapse behavior */\n children: ReactNode;\n /** Additional CSS classes for styling customization */\n className?: string;\n};\n\n/** Default minimum height threshold for triggering expand/collapse behavior */\nconst DEFAULT_MIN_HEIGHT = 700;\n\n/**\n * ExpandCollapse Component\n *\n * A smart content container that automatically provides expand/collapse functionality\n * when content exceeds a specified height threshold. Features smooth animations,\n * internationalized toggle text, and intelligent height detection.\n *\n * @example\n * ```tsx\n * <ExpandCollapse minHeight={300}>\n * <div>Very long content that will be collapsed...</div>\n * </ExpandCollapse>\n * ```\n *\n * ## Key Features\n * - **Smart Detection**: Automatically detects when content exceeds height threshold\n * - **Smooth Animations**: Uses CSS transitions for smooth expand/collapse effects\n * - **Internationalization**: Toggle text supports multiple languages via Intlayer\n * - **Customizable Height**: Configurable minimum height threshold\n * - **Performance Optimized**: Only applies collapse behavior when necessary\n * - **Accessibility**: Proper ARIA attributes and keyboard support\n *\n * ## Behavior Logic\n * 1. **Measurement Phase**: Measures actual content height on mount\n * 2. **Comparison**: Compares content height against minHeight threshold\n * 3. **Conditional Rendering**:\n * - If content ≤ minHeight: Renders normally without collapse functionality\n * - If content > minHeight: Enables expand/collapse with toggle button\n * 4. **State Management**: Manages collapsed/expanded state with smooth transitions\n *\n * ## When to Use\n * - Long-form content (articles, documentation, code blocks)\n * - Lists or tables that may grow beyond comfortable viewing height\n * - User-generated content with unpredictable length\n * - FAQ sections or expandable content cards\n * - Code examples or JSON data display\n *\n * ## Accessibility Features\n * - **Keyboard Navigation**: Toggle button is focusable and keyboard accessible\n * - **Screen Reader Support**: Proper ARIA labels and state announcements\n * - **Visual Indicators**: Clear visual cues for collapsed/expanded states\n * - **Smooth Animations**: Respects user preferences for reduced motion\n *\n * ## Internationalization\n * - Supports multiple languages through Intlayer integration\n * - Toggle text automatically adapts to current locale\n * - Includes translations for \"Show all\" and \"Show less\" states\n *\n * @param props - ExpandCollapseProps\n * @returns React functional component\n */\nexport const ExpandCollapse: FC<ExpandCollapseProps> = ({\n isRollable = true,\n minHeight = DEFAULT_MIN_HEIGHT,\n children,\n className,\n}) => {\n const [codeContainerHeight, setCodeContainerHeight] = useState(0);\n const [isCollapsed, setIsCollapsed] = useState(true);\n const codeContainerRef = useRef<HTMLDivElement>(null);\n const { expandCollapseContent } = useIntlayer('expand-collapse');\n\n const isTooBig = codeContainerHeight > minHeight;\n\n useEffect(() => {\n if (codeContainerRef.current) {\n setCodeContainerHeight(codeContainerRef.current.clientHeight);\n }\n }, []);\n\n if (!isRollable) {\n return children;\n }\n\n if (!isTooBig) {\n return (\n <div className={cn('grid w-full', className)} ref={codeContainerRef}>\n {children}\n </div>\n );\n }\n\n return (\n <MaxHeightSmoother\n isHidden={isCollapsed}\n minHeight={minHeight}\n className=\"w-full overflow-x-auto overflow-y-hidden\"\n >\n <div className={cn('grid w-full', className)} ref={codeContainerRef}>\n {children}\n </div>\n <button\n className={cn(\n 'absolute right-0 bottom-0 flex w-full cursor-pointer items-center justify-center rounded-t-2xl bg-gradient-to-t from-card/80 to-transparent px-3 py-0.5 text-md text-neutral-700 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur transition-all duration-300 hover:py-1 dark:text-neutral-400',\n isCollapsed ? 'w-full' : 'w-32'\n )}\n type=\"button\"\n onClick={() => setIsCollapsed((prev) => !prev)}\n >\n {expandCollapseContent(isCollapsed)}\n </button>\n </MaxHeightSmoother>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ExpandCollapse.mjs","names":["ExpandCollapse: FC<ExpandCollapseProps>"],"sources":["../../../../src/components/ExpandCollapse/ExpandCollapse.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, type ReactNode, useEffect, useRef, useState } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\n\n/**\n * Props for the ExpandCollapse component\n */\nexport type ExpandCollapseProps = {\n /** Whether the component should provide expand/collapse functionality. If false, renders children directly */\n isRollable?: boolean;\n /** Minimum height in pixels before showing the expand/collapse toggle */\n minHeight?: number;\n /** Content that may overflow and trigger the expand/collapse behavior */\n children: ReactNode;\n /** Additional CSS classes for styling customization */\n className?: string;\n};\n\n/** Default minimum height threshold for triggering expand/collapse behavior */\nconst DEFAULT_MIN_HEIGHT = 700;\n\n/**\n * ExpandCollapse Component\n *\n * A smart content container that automatically provides expand/collapse functionality\n * when content exceeds a specified height threshold. Features smooth animations,\n * internationalized toggle text, and intelligent height detection.\n *\n * @example\n * ```tsx\n * <ExpandCollapse minHeight={300}>\n * <div>Very long content that will be collapsed...</div>\n * </ExpandCollapse>\n * ```\n *\n * ## Key Features\n * - **Smart Detection**: Automatically detects when content exceeds height threshold\n * - **Smooth Animations**: Uses CSS transitions for smooth expand/collapse effects\n * - **Internationalization**: Toggle text supports multiple languages via Intlayer\n * - **Customizable Height**: Configurable minimum height threshold\n * - **Performance Optimized**: Only applies collapse behavior when necessary\n * - **Accessibility**: Proper ARIA attributes and keyboard support\n *\n * ## Behavior Logic\n * 1. **Measurement Phase**: Measures actual content height on mount\n * 2. **Comparison**: Compares content height against minHeight threshold\n * 3. **Conditional Rendering**:\n * - If content ≤ minHeight: Renders normally without collapse functionality\n * - If content > minHeight: Enables expand/collapse with toggle button\n * 4. **State Management**: Manages collapsed/expanded state with smooth transitions\n *\n * ## When to Use\n * - Long-form content (articles, documentation, code blocks)\n * - Lists or tables that may grow beyond comfortable viewing height\n * - User-generated content with unpredictable length\n * - FAQ sections or expandable content cards\n * - Code examples or JSON data display\n *\n * ## Accessibility Features\n * - **Keyboard Navigation**: Toggle button is focusable and keyboard accessible\n * - **Screen Reader Support**: Proper ARIA labels and state announcements\n * - **Visual Indicators**: Clear visual cues for collapsed/expanded states\n * - **Smooth Animations**: Respects user preferences for reduced motion\n *\n * ## Internationalization\n * - Supports multiple languages through Intlayer integration\n * - Toggle text automatically adapts to current locale\n * - Includes translations for \"Show all\" and \"Show less\" states\n *\n * @param props - ExpandCollapseProps\n * @returns React functional component\n */\nexport const ExpandCollapse: FC<ExpandCollapseProps> = ({\n isRollable = true,\n minHeight = DEFAULT_MIN_HEIGHT,\n children,\n className,\n}) => {\n const [codeContainerHeight, setCodeContainerHeight] = useState(0);\n const [isCollapsed, setIsCollapsed] = useState(true);\n const codeContainerRef = useRef<HTMLDivElement>(null);\n const { expandCollapseContent } = useIntlayer('expand-collapse');\n\n const isTooBig = codeContainerHeight > minHeight;\n\n useEffect(() => {\n if (codeContainerRef.current) {\n setCodeContainerHeight(codeContainerRef.current.clientHeight);\n }\n }, []);\n\n if (!isRollable) {\n return children;\n }\n\n if (!isTooBig) {\n return (\n <div className={cn('grid w-full', className)} ref={codeContainerRef}>\n {children}\n </div>\n );\n }\n\n return (\n <MaxHeightSmoother\n isHidden={isCollapsed}\n minHeight={minHeight}\n className=\"w-full overflow-x-auto overflow-y-hidden\"\n >\n <div className={cn('grid w-full', className)} ref={codeContainerRef}>\n {children}\n </div>\n <button\n className={cn(\n 'absolute right-0 bottom-0 flex w-full cursor-pointer items-center justify-center rounded-t-2xl bg-gradient-to-t from-card/80 to-transparent px-3 py-0.5 text-md text-neutral-700 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur transition-all duration-300 hover:py-1 dark:text-neutral-400',\n isCollapsed ? 'w-full' : 'w-32'\n )}\n type=\"button\"\n onClick={() => setIsCollapsed((prev) => !prev)}\n >\n {expandCollapseContent(isCollapsed)}\n </button>\n </MaxHeightSmoother>\n );\n};\n"],"mappings":";;;;;;;;;;AAsBA,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqD3B,MAAaA,kBAA2C,EACtD,aAAa,MACb,YAAY,oBACZ,UACA,gBACI;CACJ,MAAM,CAAC,qBAAqB,0BAA0B,SAAS,EAAE;CACjE,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CACpD,MAAM,mBAAmB,OAAuB,KAAK;CACrD,MAAM,EAAE,0BAA0B,YAAY,kBAAkB;CAEhE,MAAM,WAAW,sBAAsB;AAEvC,iBAAgB;AACd,MAAI,iBAAiB,QACnB,wBAAuB,iBAAiB,QAAQ,aAAa;IAE9D,EAAE,CAAC;AAEN,KAAI,CAAC,WACH,QAAO;AAGT,KAAI,CAAC,SACH,QACE,oBAAC;EAAI,WAAW,GAAG,eAAe,UAAU;EAAE,KAAK;EAChD;GACG;AAIV,QACE,qBAAC;EACC,UAAU;EACC;EACX,WAAU;aAEV,oBAAC;GAAI,WAAW,GAAG,eAAe,UAAU;GAAE,KAAK;GAChD;IACG,EACN,oBAAC;GACC,WAAW,GACT,uSACA,cAAc,WAAW,OAC1B;GACD,MAAK;GACL,eAAe,gBAAgB,SAAS,CAAC,KAAK;aAE7C,sBAAsB,YAAY;IAC5B;GACS"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormBase.mjs","names":["useFormReactHookForm"],"sources":["../../../../src/components/Form/FormBase.tsx"],"sourcesContent":["'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport type { HTMLAttributes } from 'react';\nimport {\n FormProvider,\n type FormProviderProps,\n type UseFormProps,\n useForm as useFormReactHookForm,\n useFormState,\n} from 'react-hook-form';\nimport type { ZodObject, z } from 'zod/v4';\nimport { cn } from '../../utils/cn';\n\ntype FormProps<T extends ZodObject> = HTMLAttributes<HTMLFormElement> &\n FormProviderProps<z.infer<T>> & {\n schema?: T;\n onSubmit?: (data: z.infer<T>) => void | Promise<void>;\n onSubmitSuccess?: (data: z.infer<T>) => void | Promise<void>;\n onSubmitError?: (error: Error) => void | Promise<void>;\n autoComplete?: boolean;\n };\n\nconst awaitFunction = async (fn: any) => {\n // Check if result is a Promise (Thenable)\n\n if (fn && typeof fn.then === 'function') {\n // It's a Promise, so wait for it to resolve\n return await fn;\n }\n // If not a Promise, it will just execute without awaiting\n return fn;\n};\n\nexport const Form = <T extends ZodObject>({\n schema,\n onSubmit: onSubmitProp,\n onSubmitSuccess: onSubmitSuccessProp,\n onSubmitError: onSubmitErrorProp,\n className,\n children,\n autoComplete,\n ...props\n}: FormProps<T>) => {\n const onSubmit = async (values: z.infer<T>) => {\n const parsedValues = schema?.safeParse(values) ?? {\n success: true,\n data: undefined,\n };\n\n // onSubmitProp?.(values);\n await awaitFunction(onSubmitProp?.(values));\n\n if (parsedValues.success) {\n await awaitFunction(onSubmitSuccessProp?.(parsedValues.data!));\n } else {\n await awaitFunction(\n onSubmitErrorProp?.(\n new Error(\n parsedValues.error.issues.map((error) => error.message).join(', ')\n )\n )\n );\n }\n };\n\n return (\n <FormProvider {...props}>\n <form\n className={cn('flex size-full flex-col gap-y-6', className)}\n onSubmit={props.handleSubmit(onSubmit)}\n autoComplete={autoComplete ? 'on' : 'off'}\n noValidate\n >\n {children}\n </form>\n </FormProvider>\n );\n};\n\nexport const useForm = <T extends ZodObject>(\n schema: T,\n props?: UseFormProps<z.infer<T>>\n) => {\n const form = useFormReactHookForm<z.infer<T>>({\n resolver: zodResolver(schema as any),\n ...props,\n });\n\n const { isSubmitting, isSubmitted, isLoading, isValid } = useFormState({\n control: form.control,\n });\n\n return {\n form,\n isSubmitting,\n isSubmitted,\n isLoading,\n isValid,\n };\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormBase.mjs","names":["useFormReactHookForm"],"sources":["../../../../src/components/Form/FormBase.tsx"],"sourcesContent":["'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport type { HTMLAttributes } from 'react';\nimport {\n FormProvider,\n type FormProviderProps,\n type UseFormProps,\n useForm as useFormReactHookForm,\n useFormState,\n} from 'react-hook-form';\nimport type { ZodObject, z } from 'zod/v4';\nimport { cn } from '../../utils/cn';\n\ntype FormProps<T extends ZodObject> = HTMLAttributes<HTMLFormElement> &\n FormProviderProps<z.infer<T>> & {\n schema?: T;\n onSubmit?: (data: z.infer<T>) => void | Promise<void>;\n onSubmitSuccess?: (data: z.infer<T>) => void | Promise<void>;\n onSubmitError?: (error: Error) => void | Promise<void>;\n autoComplete?: boolean;\n };\n\nconst awaitFunction = async (fn: any) => {\n // Check if result is a Promise (Thenable)\n\n if (fn && typeof fn.then === 'function') {\n // It's a Promise, so wait for it to resolve\n return await fn;\n }\n // If not a Promise, it will just execute without awaiting\n return fn;\n};\n\nexport const Form = <T extends ZodObject>({\n schema,\n onSubmit: onSubmitProp,\n onSubmitSuccess: onSubmitSuccessProp,\n onSubmitError: onSubmitErrorProp,\n className,\n children,\n autoComplete,\n ...props\n}: FormProps<T>) => {\n const onSubmit = async (values: z.infer<T>) => {\n const parsedValues = schema?.safeParse(values) ?? {\n success: true,\n data: undefined,\n };\n\n // onSubmitProp?.(values);\n await awaitFunction(onSubmitProp?.(values));\n\n if (parsedValues.success) {\n await awaitFunction(onSubmitSuccessProp?.(parsedValues.data!));\n } else {\n await awaitFunction(\n onSubmitErrorProp?.(\n new Error(\n parsedValues.error.issues.map((error) => error.message).join(', ')\n )\n )\n );\n }\n };\n\n return (\n <FormProvider {...props}>\n <form\n className={cn('flex size-full flex-col gap-y-6', className)}\n onSubmit={props.handleSubmit(onSubmit)}\n autoComplete={autoComplete ? 'on' : 'off'}\n noValidate\n >\n {children}\n </form>\n </FormProvider>\n );\n};\n\nexport const useForm = <T extends ZodObject>(\n schema: T,\n props?: UseFormProps<z.infer<T>>\n) => {\n const form = useFormReactHookForm<z.infer<T>>({\n resolver: zodResolver(schema as any),\n ...props,\n });\n\n const { isSubmitting, isSubmitted, isLoading, isValid } = useFormState({\n control: form.control,\n });\n\n return {\n form,\n isSubmitting,\n isSubmitted,\n isLoading,\n isValid,\n };\n};\n"],"mappings":";;;;;;;;AAuBA,MAAM,gBAAgB,OAAO,OAAY;AAGvC,KAAI,MAAM,OAAO,GAAG,SAAS,WAE3B,QAAO,MAAM;AAGf,QAAO;;AAGT,MAAa,QAA6B,EACxC,QACA,UAAU,cACV,iBAAiB,qBACjB,eAAe,mBACf,WACA,UACA,cACA,GAAG,YACe;CAClB,MAAM,WAAW,OAAO,WAAuB;EAC7C,MAAM,eAAe,QAAQ,UAAU,OAAO,IAAI;GAChD,SAAS;GACT,MAAM;GACP;AAGD,QAAM,cAAc,eAAe,OAAO,CAAC;AAE3C,MAAI,aAAa,QACf,OAAM,cAAc,sBAAsB,aAAa,KAAM,CAAC;MAE9D,OAAM,cACJ,oBACE,IAAI,MACF,aAAa,MAAM,OAAO,KAAK,UAAU,MAAM,QAAQ,CAAC,KAAK,KAAK,CACnE,CACF,CACF;;AAIL,QACE,oBAAC;EAAa,GAAI;YAChB,oBAAC;GACC,WAAW,GAAG,mCAAmC,UAAU;GAC3D,UAAU,MAAM,aAAa,SAAS;GACtC,cAAc,eAAe,OAAO;GACpC;GAEC;IACI;GACM;;AAInB,MAAa,WACX,QACA,UACG;CACH,MAAM,OAAOA,UAAiC;EAC5C,UAAU,YAAY,OAAc;EACpC,GAAG;EACJ,CAAC;CAEF,MAAM,EAAE,cAAc,aAAa,WAAW,YAAY,aAAa,EACrE,SAAS,KAAK,SACf,CAAC;AAEF,QAAO;EACL;EACA;EACA;EACA;EACA;EACD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormControl.mjs","names":["FormControl: FC<ComponentProps<typeof Slot>>"],"sources":["../../../../src/components/Form/FormControl.tsx"],"sourcesContent":["'use client';\n\nimport { Slot } from '@radix-ui/react-slot';\nimport type { ComponentProps, FC } from 'react';\nimport { useFormField } from './FormField';\n\nexport const FormControl: FC<ComponentProps<typeof Slot>> = (props) => {\n const { error, formItemId, formDescriptionId, formMessageId } =\n useFormField();\n\n return (\n <Slot\n id={formItemId}\n aria-describedby={\n !error\n ? `${formDescriptionId}`\n : `${formDescriptionId} ${formMessageId}`\n }\n aria-invalid={!!error}\n {...props}\n />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormControl.mjs","names":["FormControl: FC<ComponentProps<typeof Slot>>"],"sources":["../../../../src/components/Form/FormControl.tsx"],"sourcesContent":["'use client';\n\nimport { Slot } from '@radix-ui/react-slot';\nimport type { ComponentProps, FC } from 'react';\nimport { useFormField } from './FormField';\n\nexport const FormControl: FC<ComponentProps<typeof Slot>> = (props) => {\n const { error, formItemId, formDescriptionId, formMessageId } =\n useFormField();\n\n return (\n <Slot\n id={formItemId}\n aria-describedby={\n !error\n ? `${formDescriptionId}`\n : `${formDescriptionId} ${formMessageId}`\n }\n aria-invalid={!!error}\n {...props}\n />\n );\n};\n"],"mappings":";;;;;;;AAMA,MAAaA,eAAgD,UAAU;CACrE,MAAM,EAAE,OAAO,YAAY,mBAAmB,kBAC5C,cAAc;AAEhB,QACE,oBAAC;EACC,IAAI;EACJ,oBACE,CAAC,QACG,GAAG,sBACH,GAAG,kBAAkB,GAAG;EAE9B,gBAAc,CAAC,CAAC;EAChB,GAAI;GACJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormDescription.mjs","names":["FormDescription: FC<HTMLAttributes<HTMLParagraphElement>>"],"sources":["../../../../src/components/Form/FormDescription.tsx"],"sourcesContent":["'use client';\n\nimport type { FC, HTMLAttributes } from 'react';\nimport { useFormField } from './FormField';\n\nexport const FormDescription: FC<HTMLAttributes<HTMLParagraphElement>> = (\n props\n) => {\n const { formDescriptionId } = useFormField();\n\n return (\n <p className=\"text-neutral text-sm\" id={formDescriptionId} {...props} />\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FormDescription.mjs","names":["FormDescription: FC<HTMLAttributes<HTMLParagraphElement>>"],"sources":["../../../../src/components/Form/FormDescription.tsx"],"sourcesContent":["'use client';\n\nimport type { FC, HTMLAttributes } from 'react';\nimport { useFormField } from './FormField';\n\nexport const FormDescription: FC<HTMLAttributes<HTMLParagraphElement>> = (\n props\n) => {\n const { formDescriptionId } = useFormField();\n\n return (\n <p className=\"text-neutral text-sm\" id={formDescriptionId} {...props} />\n );\n};\n"],"mappings":";;;;;;AAKA,MAAaA,mBACX,UACG;CACH,MAAM,EAAE,sBAAsB,cAAc;AAE5C,QACE,oBAAC;EAAE,WAAU;EAAuB,IAAI;EAAmB,GAAI;GAAS"}
|