@payloadcms/ui 4.0.0-internal.293e026 → 4.0.0-internal.2fddfc0
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/css/colors.css +3 -0
- package/dist/css/design-tokens.css +5 -0
- package/dist/css/elevations.css +4 -0
- package/dist/css/radius.css +1 -3
- package/dist/css/theme.css +4 -0
- package/dist/css/utilities.css +5 -0
- package/dist/elements/APIKeyInput/index.css +92 -0
- package/dist/elements/APIKeyInput/index.d.ts +14 -0
- package/dist/elements/APIKeyInput/index.d.ts.map +1 -0
- package/dist/elements/APIKeyInput/index.js +86 -0
- package/dist/elements/APIKeyInput/index.js.map +1 -0
- package/dist/elements/AddNewRelation/index.d.ts.map +1 -1
- package/dist/elements/AddNewRelation/index.js +85 -103
- package/dist/elements/AddNewRelation/index.js.map +1 -1
- package/dist/elements/AppHeader/index.d.ts +3 -1
- package/dist/elements/AppHeader/index.d.ts.map +1 -1
- package/dist/elements/AppHeader/index.js +7 -27
- package/dist/elements/AppHeader/index.js.map +1 -1
- package/dist/elements/BulkUpload/ActionsBar/index.css +10 -4
- package/dist/elements/BulkUpload/ActionsBar/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/ActionsBar/index.js +43 -40
- package/dist/elements/BulkUpload/ActionsBar/index.js.map +1 -1
- package/dist/elements/BulkUpload/AddFilesView/index.js +1 -1
- package/dist/elements/BulkUpload/AddFilesView/index.js.map +1 -1
- package/dist/elements/BulkUpload/AddingFilesView/index.css +25 -0
- package/dist/elements/BulkUpload/AddingFilesView/index.d.ts +1 -1
- package/dist/elements/BulkUpload/AddingFilesView/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/AddingFilesView/index.js +1 -1
- package/dist/elements/BulkUpload/AddingFilesView/index.js.map +1 -1
- package/dist/elements/BulkUpload/EditForm/index.css +9 -0
- package/dist/elements/BulkUpload/EditForm/index.d.ts +1 -1
- package/dist/elements/BulkUpload/EditForm/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/EditForm/index.js +1 -1
- package/dist/elements/BulkUpload/EditForm/index.js.map +1 -1
- package/dist/elements/BulkUpload/EditMany/DrawerContent.d.ts +1 -1
- package/dist/elements/BulkUpload/EditMany/DrawerContent.d.ts.map +1 -1
- package/dist/elements/BulkUpload/EditMany/DrawerContent.js +59 -55
- package/dist/elements/BulkUpload/EditMany/DrawerContent.js.map +1 -1
- package/dist/elements/BulkUpload/EditMany/index.css +71 -0
- package/dist/elements/BulkUpload/EditMany/index.d.ts +1 -1
- package/dist/elements/BulkUpload/EditMany/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/EditMany/index.js +1 -1
- package/dist/elements/BulkUpload/EditMany/index.js.map +1 -1
- package/dist/elements/BulkUpload/FileSidebar/index.css +54 -75
- package/dist/elements/BulkUpload/FileSidebar/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/FileSidebar/index.js +60 -50
- package/dist/elements/BulkUpload/FileSidebar/index.js.map +1 -1
- package/dist/elements/BulkUpload/FormsManager/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/FormsManager/index.js +13 -0
- package/dist/elements/BulkUpload/FormsManager/index.js.map +1 -1
- package/dist/elements/Button/index.css +8 -0
- package/dist/elements/Card/index.css +1 -1
- package/dist/elements/CodeEditor/CodeEditor.d.ts.map +1 -1
- package/dist/elements/CodeEditor/CodeEditor.js +19 -0
- package/dist/elements/CodeEditor/CodeEditor.js.map +1 -1
- package/dist/elements/ColumnSelection/Popup.d.ts +12 -0
- package/dist/elements/ColumnSelection/Popup.d.ts.map +1 -0
- package/dist/elements/{ColumnSelector/index.js → ColumnSelection/Popup.js} +24 -13
- package/dist/elements/ColumnSelection/Popup.js.map +1 -0
- package/dist/elements/ColumnSelection/index.d.ts +10 -0
- package/dist/elements/ColumnSelection/index.d.ts.map +1 -0
- package/dist/elements/{ColumnsButton → ColumnSelection}/index.js +23 -17
- package/dist/elements/ColumnSelection/index.js.map +1 -0
- package/dist/elements/Combobox/index.css +1 -0
- package/dist/elements/ConfirmationModal/index.css +7 -0
- package/dist/elements/ConfirmationModal/index.d.ts +1 -0
- package/dist/elements/ConfirmationModal/index.d.ts.map +1 -1
- package/dist/elements/ConfirmationModal/index.js +7 -3
- package/dist/elements/ConfirmationModal/index.js.map +1 -1
- package/dist/elements/DeleteMany/index.d.ts +3 -26
- package/dist/elements/DeleteMany/index.d.ts.map +1 -1
- package/dist/elements/DeleteMany/index.js +1 -95
- package/dist/elements/DeleteMany/index.js.map +1 -1
- package/dist/elements/Dialog/DialogModal/index.d.ts +1 -1
- package/dist/elements/Dialog/DialogModal/index.d.ts.map +1 -1
- package/dist/elements/Dialog/DialogModal/index.js.map +1 -1
- package/dist/elements/Dialog/index.css +4 -0
- package/dist/elements/DocumentControls/index.css +17 -1
- package/dist/elements/DocumentControls/index.d.ts +6 -0
- package/dist/elements/DocumentControls/index.d.ts.map +1 -1
- package/dist/elements/DocumentControls/index.js +9 -8
- package/dist/elements/DocumentControls/index.js.map +1 -1
- package/dist/elements/DocumentDrawer/DrawerContent.d.ts.map +1 -1
- package/dist/elements/DocumentDrawer/DrawerContent.js +10 -6
- package/dist/elements/DocumentDrawer/DrawerContent.js.map +1 -1
- package/dist/elements/DocumentDrawer/DrawerHeader/index.css +76 -4
- package/dist/elements/DocumentDrawer/DrawerHeader/index.d.ts +7 -1
- package/dist/elements/DocumentDrawer/DrawerHeader/index.d.ts.map +1 -1
- package/dist/elements/DocumentDrawer/DrawerHeader/index.js +150 -87
- package/dist/elements/DocumentDrawer/DrawerHeader/index.js.map +1 -1
- package/dist/elements/DocumentDrawer/types.d.ts +1 -0
- package/dist/elements/DocumentDrawer/types.d.ts.map +1 -1
- package/dist/elements/DocumentDrawer/types.js.map +1 -1
- package/dist/elements/DocumentFields/index.css +61 -2
- package/dist/elements/DraggableSortable/index.js.map +1 -1
- package/dist/elements/Drawer/index.css +57 -26
- package/dist/elements/Drawer/index.d.ts +25 -0
- package/dist/elements/Drawer/index.d.ts.map +1 -1
- package/dist/elements/Drawer/index.js +133 -54
- package/dist/elements/Drawer/index.js.map +1 -1
- package/dist/elements/Drawer/types.d.ts +1 -0
- package/dist/elements/Drawer/types.d.ts.map +1 -1
- package/dist/elements/Drawer/types.js.map +1 -1
- package/dist/elements/EditMany/DrawerContent.d.ts +1 -1
- package/dist/elements/EditMany/DrawerContent.d.ts.map +1 -1
- package/dist/elements/EditMany/DrawerContent.js +76 -71
- package/dist/elements/EditMany/DrawerContent.js.map +1 -1
- package/dist/elements/EditMany/index.css +71 -0
- package/dist/elements/EditMany/index.d.ts +9 -11
- package/dist/elements/EditMany/index.d.ts.map +1 -1
- package/dist/elements/EditMany/index.js +2 -40
- package/dist/elements/EditMany/index.js.map +1 -1
- package/dist/elements/FieldSelect/index.css +3 -0
- package/dist/elements/FileDetails/DraggableFileDetails/index.css +32 -0
- package/dist/elements/FileDetails/DraggableFileDetails/index.d.ts +1 -1
- package/dist/elements/FileDetails/DraggableFileDetails/index.d.ts.map +1 -1
- package/dist/elements/FileDetails/DraggableFileDetails/index.js +19 -18
- package/dist/elements/FileDetails/DraggableFileDetails/index.js.map +1 -1
- package/dist/elements/GroupBy/Popup.d.ts +21 -0
- package/dist/elements/GroupBy/Popup.d.ts.map +1 -0
- package/dist/elements/GroupBy/Popup.js +269 -0
- package/dist/elements/GroupBy/Popup.js.map +1 -0
- package/dist/elements/GroupBy/index.d.ts +12 -0
- package/dist/elements/GroupBy/index.d.ts.map +1 -0
- package/dist/elements/GroupBy/index.js +91 -0
- package/dist/elements/GroupBy/index.js.map +1 -0
- package/dist/elements/Hierarchy/Drawer/index.css +3 -21
- package/dist/elements/Hierarchy/Drawer/index.d.ts.map +1 -1
- package/dist/elements/Hierarchy/Drawer/index.js +5 -3
- package/dist/elements/Hierarchy/Drawer/index.js.map +1 -1
- package/dist/elements/Hierarchy/Field/SelectedHierarchies.css +36 -0
- package/dist/elements/Hierarchy/Field/SelectedHierarchies.d.ts +1 -1
- package/dist/elements/Hierarchy/Field/SelectedHierarchies.d.ts.map +1 -1
- package/dist/elements/Hierarchy/Field/SelectedHierarchies.js +1 -1
- package/dist/elements/Hierarchy/Field/SelectedHierarchies.js.map +1 -1
- package/dist/elements/Hierarchy/Field/index.client.d.ts +1 -1
- package/dist/elements/Hierarchy/Field/index.client.d.ts.map +1 -1
- package/dist/elements/Hierarchy/Field/index.client.js +5 -2
- package/dist/elements/Hierarchy/Field/index.client.js.map +1 -1
- package/dist/elements/Hierarchy/Field/index.css +37 -0
- package/dist/elements/Hierarchy/MoveMany/index.d.ts +0 -1
- package/dist/elements/Hierarchy/MoveMany/index.d.ts.map +1 -1
- package/dist/elements/Hierarchy/MoveMany/index.js +0 -1
- package/dist/elements/Hierarchy/MoveMany/index.js.map +1 -1
- package/dist/elements/Hierarchy/Tree/LoadMore/index.css +27 -0
- package/dist/elements/Hierarchy/Tree/LoadMore/index.d.ts +1 -1
- package/dist/elements/Hierarchy/Tree/LoadMore/index.d.ts.map +1 -1
- package/dist/elements/Hierarchy/Tree/LoadMore/index.js +1 -1
- package/dist/elements/Hierarchy/Tree/LoadMore/index.js.map +1 -1
- package/dist/elements/Hierarchy/Tree/TreeFocusContext.d.ts.map +1 -1
- package/dist/elements/Hierarchy/Tree/TreeFocusContext.js +36 -16
- package/dist/elements/Hierarchy/Tree/TreeFocusContext.js.map +1 -1
- package/dist/elements/Hierarchy/Tree/TreeNode/index.d.ts.map +1 -1
- package/dist/elements/Hierarchy/Tree/TreeNode/index.js +20 -15
- package/dist/elements/Hierarchy/Tree/TreeNode/index.js.map +1 -1
- package/dist/elements/LeaveWithoutSaving/usePreventLeave.js.map +1 -1
- package/dist/elements/ListColumnSelectionButton/index.d.ts +11 -0
- package/dist/elements/ListColumnSelectionButton/index.d.ts.map +1 -0
- package/dist/elements/ListColumnSelectionButton/index.js +37 -0
- package/dist/elements/ListColumnSelectionButton/index.js.map +1 -0
- package/dist/elements/ListControls/index.css +5 -0
- package/dist/elements/ListControls/index.d.ts.map +1 -1
- package/dist/elements/ListControls/index.js +7 -7
- package/dist/elements/ListControls/index.js.map +1 -1
- package/dist/elements/ListDrawer/DrawerContent.d.ts.map +1 -1
- package/dist/elements/ListDrawer/DrawerContent.js +12 -6
- package/dist/elements/ListDrawer/DrawerContent.js.map +1 -1
- package/dist/elements/ListGroupByButton/index.d.ts +12 -0
- package/dist/elements/ListGroupByButton/index.d.ts.map +1 -0
- package/dist/elements/ListGroupByButton/index.js +55 -0
- package/dist/elements/ListGroupByButton/index.js.map +1 -0
- package/dist/elements/ListWhereBuilder/index.d.ts +16 -0
- package/dist/elements/ListWhereBuilder/index.d.ts.map +1 -0
- package/dist/elements/ListWhereBuilder/index.js +62 -0
- package/dist/elements/ListWhereBuilder/index.js.map +1 -0
- package/dist/elements/LoadMoreRow/index.css +34 -0
- package/dist/elements/LoadMoreRow/index.d.ts +1 -1
- package/dist/elements/LoadMoreRow/index.d.ts.map +1 -1
- package/dist/elements/LoadMoreRow/index.js +4 -8
- package/dist/elements/LoadMoreRow/index.js.map +1 -1
- package/dist/elements/Loading/index.css +28 -74
- package/dist/elements/Loading/index.d.ts.map +1 -1
- package/dist/elements/Loading/index.js +16 -60
- package/dist/elements/Loading/index.js.map +1 -1
- package/dist/elements/Localizer/index.d.ts.map +1 -1
- package/dist/elements/Localizer/index.js +3 -4
- package/dist/elements/Localizer/index.js.map +1 -1
- package/dist/elements/MenuSeparator/index.d.ts +4 -0
- package/dist/elements/MenuSeparator/index.d.ts.map +1 -0
- package/dist/elements/MenuSeparator/index.js +10 -0
- package/dist/elements/MenuSeparator/index.js.map +1 -0
- package/dist/elements/Nav/index.d.ts.map +1 -1
- package/dist/elements/Nav/index.js +4 -23
- package/dist/elements/Nav/index.js.map +1 -1
- package/dist/elements/Popup/PopupButtonList/index.css +48 -4
- package/dist/elements/Popup/PopupButtonList/index.d.ts.map +1 -1
- package/dist/elements/Popup/PopupButtonList/index.js +1 -0
- package/dist/elements/Popup/PopupButtonList/index.js.map +1 -1
- package/dist/elements/Popup/PopupGroupLabel/index.css +19 -4
- package/dist/elements/Popup/index.d.ts +7 -0
- package/dist/elements/Popup/index.d.ts.map +1 -1
- package/dist/elements/Popup/index.js +143 -63
- package/dist/elements/Popup/index.js.map +1 -1
- package/dist/elements/PublishButton/ScheduleDrawer/buildUpcomingScheduleWhere.d.ts +13 -0
- package/dist/elements/PublishButton/ScheduleDrawer/buildUpcomingScheduleWhere.d.ts.map +1 -0
- package/dist/elements/PublishButton/ScheduleDrawer/buildUpcomingScheduleWhere.js +41 -0
- package/dist/elements/PublishButton/ScheduleDrawer/buildUpcomingScheduleWhere.js.map +1 -0
- package/dist/elements/PublishButton/ScheduleDrawer/index.d.ts +1 -0
- package/dist/elements/PublishButton/ScheduleDrawer/index.d.ts.map +1 -1
- package/dist/elements/PublishButton/ScheduleDrawer/index.js +9 -31
- package/dist/elements/PublishButton/ScheduleDrawer/index.js.map +1 -1
- package/dist/elements/PublishButton/index.d.ts.map +1 -1
- package/dist/elements/PublishButton/index.js +4 -5
- package/dist/elements/PublishButton/index.js.map +1 -1
- package/dist/elements/PublishMany/DrawerContent.d.ts +2 -1
- package/dist/elements/PublishMany/DrawerContent.d.ts.map +1 -1
- package/dist/elements/PublishMany/DrawerContent.js.map +1 -1
- package/dist/elements/PublishMany/index.d.ts +2 -6
- package/dist/elements/PublishMany/index.d.ts.map +1 -1
- package/dist/elements/PublishMany/index.js +0 -38
- package/dist/elements/PublishMany/index.js.map +1 -1
- package/dist/elements/QueryPresets/cells/ColumnsCell/{index.scss → index.css} +1 -3
- package/dist/elements/QueryPresets/cells/ColumnsCell/index.d.ts +1 -1
- package/dist/elements/QueryPresets/cells/ColumnsCell/index.d.ts.map +1 -1
- package/dist/elements/QueryPresets/cells/ColumnsCell/index.js +1 -1
- package/dist/elements/QueryPresets/cells/ColumnsCell/index.js.map +1 -1
- package/dist/elements/QueryPresets/fields/ColumnsField/index.d.ts +1 -1
- package/dist/elements/QueryPresets/fields/ColumnsField/index.d.ts.map +1 -1
- package/dist/elements/QueryPresets/fields/ColumnsField/index.js +77 -48
- package/dist/elements/QueryPresets/fields/ColumnsField/index.js.map +1 -1
- package/dist/elements/QueryPresets/fields/GroupByField/index.d.ts +1 -1
- package/dist/elements/QueryPresets/fields/GroupByField/index.d.ts.map +1 -1
- package/dist/elements/QueryPresets/fields/GroupByField/index.js +12 -21
- package/dist/elements/QueryPresets/fields/GroupByField/index.js.map +1 -1
- package/dist/elements/QueryPresets/fields/Heading/index.css +52 -0
- package/dist/elements/QueryPresets/fields/Heading/index.d.ts +7 -0
- package/dist/elements/QueryPresets/fields/Heading/index.d.ts.map +1 -0
- package/dist/elements/QueryPresets/fields/Heading/index.js +31 -0
- package/dist/elements/QueryPresets/fields/Heading/index.js.map +1 -0
- package/dist/elements/QueryPresets/fields/WhereField/index.d.ts +1 -1
- package/dist/elements/QueryPresets/fields/WhereField/index.d.ts.map +1 -1
- package/dist/elements/QueryPresets/fields/WhereField/index.js +24 -23
- package/dist/elements/QueryPresets/fields/WhereField/index.js.map +1 -1
- package/dist/elements/QueryPresets/fields/fields.css +23 -0
- package/dist/elements/ReactSelect/MultiValue/index.css +1 -1
- package/dist/elements/ReactSelect/getCaptureMenuScroll.d.ts +5 -0
- package/dist/elements/ReactSelect/getCaptureMenuScroll.d.ts.map +1 -0
- package/dist/elements/ReactSelect/getCaptureMenuScroll.js +10 -0
- package/dist/elements/ReactSelect/getCaptureMenuScroll.js.map +1 -0
- package/dist/elements/ReactSelect/getMenuListStyles.d.ts +6 -0
- package/dist/elements/ReactSelect/getMenuListStyles.d.ts.map +1 -0
- package/dist/elements/ReactSelect/getMenuListStyles.js +7 -0
- package/dist/elements/ReactSelect/getMenuListStyles.js.map +1 -0
- package/dist/elements/ReactSelect/index.css +0 -1
- package/dist/elements/ReactSelect/index.d.ts.map +1 -1
- package/dist/elements/ReactSelect/index.js +176 -139
- package/dist/elements/ReactSelect/index.js.map +1 -1
- package/dist/elements/ReactSelect/types.d.ts +1 -0
- package/dist/elements/ReactSelect/types.d.ts.map +1 -1
- package/dist/elements/ReactSelect/types.js.map +1 -1
- package/dist/elements/RelationshipTable/index.js +2 -2
- package/dist/elements/RelationshipTable/index.js.map +1 -1
- package/dist/elements/RenderTitle/index.css +10 -0
- package/dist/elements/RenderTitle/index.d.ts +5 -0
- package/dist/elements/RenderTitle/index.d.ts.map +1 -1
- package/dist/elements/RenderTitle/index.js +52 -27
- package/dist/elements/RenderTitle/index.js.map +1 -1
- package/dist/elements/SchedulePublishButton/index.d.ts.map +1 -1
- package/dist/elements/SchedulePublishButton/index.js +6 -1
- package/dist/elements/SchedulePublishButton/index.js.map +1 -1
- package/dist/elements/SelectMany/index.js +1 -1
- package/dist/elements/SelectMany/index.js.map +1 -1
- package/dist/elements/SortColumn/index.css +1 -1
- package/dist/elements/Spinner/index.css +16 -0
- package/dist/elements/Table/DefaultCell/fields/Blocks/index.d.ts.map +1 -1
- package/dist/elements/Table/DefaultCell/fields/Blocks/index.js.map +1 -1
- package/dist/elements/Table/OrderableRow.d.ts.map +1 -1
- package/dist/elements/Table/OrderableRow.js +1 -1
- package/dist/elements/Table/OrderableRow.js.map +1 -1
- package/dist/elements/Table/RelationshipProvider/index.d.ts.map +1 -1
- package/dist/elements/Table/RelationshipProvider/index.js +1 -0
- package/dist/elements/Table/RelationshipProvider/index.js.map +1 -1
- package/dist/elements/Table/index.css +39 -10
- package/dist/elements/Tabs/index.css +100 -0
- package/dist/elements/Tabs/index.d.ts +32 -0
- package/dist/elements/Tabs/index.d.ts.map +1 -0
- package/dist/elements/Tabs/index.js +62 -0
- package/dist/elements/Tabs/index.js.map +1 -0
- package/dist/elements/TimezonePicker/index.css +0 -15
- package/dist/elements/Toasts/fieldErrors.d.ts +1 -0
- package/dist/elements/Toasts/fieldErrors.d.ts.map +1 -1
- package/dist/elements/Toasts/fieldErrors.js +25 -9
- package/dist/elements/Toasts/fieldErrors.js.map +1 -1
- package/dist/elements/Toasts/index.css +5 -0
- package/dist/elements/Tooltip/index.css +20 -4
- package/dist/elements/Tooltip/index.d.ts.map +1 -1
- package/dist/elements/Tooltip/index.js +71 -3
- package/dist/elements/Tooltip/index.js.map +1 -1
- package/dist/elements/UnpublishButton/index.d.ts.map +1 -1
- package/dist/elements/UnpublishButton/index.js +5 -13
- package/dist/elements/UnpublishButton/index.js.map +1 -1
- package/dist/elements/UnpublishMany/DrawerContent.d.ts +2 -1
- package/dist/elements/UnpublishMany/DrawerContent.d.ts.map +1 -1
- package/dist/elements/UnpublishMany/DrawerContent.js.map +1 -1
- package/dist/elements/UnpublishMany/index.d.ts +2 -4
- package/dist/elements/UnpublishMany/index.d.ts.map +1 -1
- package/dist/elements/UnpublishMany/index.js +0 -38
- package/dist/elements/UnpublishMany/index.js.map +1 -1
- package/dist/elements/UserMenu/LanguageMenu/index.d.ts +6 -0
- package/dist/elements/UserMenu/LanguageMenu/index.d.ts.map +1 -0
- package/dist/elements/UserMenu/LanguageMenu/index.js +133 -0
- package/dist/elements/UserMenu/LanguageMenu/index.js.map +1 -0
- package/dist/elements/UserMenu/SettingsMenu/index.d.ts +15 -0
- package/dist/elements/UserMenu/SettingsMenu/index.d.ts.map +1 -0
- package/dist/elements/UserMenu/SettingsMenu/index.js +119 -0
- package/dist/elements/UserMenu/SettingsMenu/index.js.map +1 -0
- package/dist/elements/UserMenu/SubMenuHeader/index.d.ts +6 -0
- package/dist/elements/UserMenu/SubMenuHeader/index.d.ts.map +1 -0
- package/dist/elements/UserMenu/SubMenuHeader/index.js +34 -0
- package/dist/elements/UserMenu/SubMenuHeader/index.js.map +1 -0
- package/dist/elements/UserMenu/ThemeMenu/index.d.ts +6 -0
- package/dist/elements/UserMenu/ThemeMenu/index.d.ts.map +1 -0
- package/dist/elements/UserMenu/ThemeMenu/index.js +145 -0
- package/dist/elements/UserMenu/ThemeMenu/index.js.map +1 -0
- package/dist/elements/UserMenu/index.css +80 -0
- package/dist/elements/UserMenu/index.d.ts +10 -0
- package/dist/elements/UserMenu/index.d.ts.map +1 -0
- package/dist/elements/UserMenu/index.js +204 -0
- package/dist/elements/UserMenu/index.js.map +1 -0
- package/dist/elements/WhereBuilder/Condition/index.d.ts +1 -0
- package/dist/elements/WhereBuilder/Condition/index.d.ts.map +1 -1
- package/dist/elements/WhereBuilder/Condition/index.js +17 -2
- package/dist/elements/WhereBuilder/Condition/index.js.map +1 -1
- package/dist/elements/WhereBuilder/index.d.ts +4 -3
- package/dist/elements/WhereBuilder/index.d.ts.map +1 -1
- package/dist/elements/WhereBuilder/index.js +71 -62
- package/dist/elements/WhereBuilder/index.js.map +1 -1
- package/dist/elements/WhereBuilder/types.d.ts +6 -5
- package/dist/elements/WhereBuilder/types.d.ts.map +1 -1
- package/dist/elements/WhereBuilder/types.js.map +1 -1
- package/dist/exports/client/index.d.ts +13 -0
- package/dist/exports/client/index.d.ts.map +1 -1
- package/dist/exports/client/index.js +2 -2
- package/dist/exports/client/index.js.map +3 -3
- package/dist/exports/shared/index.js +1 -1
- package/dist/exports/shared/index.js.map +1 -1
- package/dist/fields/Blocks/BlockSelector/BlockSearch/index.css +1 -49
- package/dist/fields/Blocks/BlockSelector/BlockSearch/index.d.ts.map +1 -1
- package/dist/fields/Blocks/BlockSelector/BlockSearch/index.js +27 -20
- package/dist/fields/Blocks/BlockSelector/BlockSearch/index.js.map +1 -1
- package/dist/fields/Blocks/BlockSelector/index.css +17 -3
- package/dist/fields/Blocks/BlockSelector/index.js +1 -1
- package/dist/fields/Blocks/BlockSelector/index.js.map +1 -1
- package/dist/fields/RadioGroup/index.css +6 -0
- package/dist/fields/Row/index.d.ts +1 -1
- package/dist/fields/Tabs/Tab/index.d.ts +0 -1
- package/dist/fields/Tabs/Tab/index.d.ts.map +1 -1
- package/dist/fields/Tabs/Tab/index.js +12 -23
- package/dist/fields/Tabs/Tab/index.js.map +1 -1
- package/dist/fields/Tabs/index.d.ts.map +1 -1
- package/dist/fields/Tabs/index.js +37 -37
- package/dist/fields/Tabs/index.js.map +1 -1
- package/dist/fields/Upload/HasMany/index.css +4 -0
- package/dist/forms/RenderFields/RenderField.d.ts +1 -1
- package/dist/forms/RenderFields/RenderField.js +2 -1
- package/dist/forms/RenderFields/RenderField.js.map +1 -1
- package/dist/forms/useField/index.js.map +1 -1
- package/dist/icons/Check/index.css +1 -2
- package/dist/icons/Check/index.js +1 -1
- package/dist/icons/Check/index.js.map +1 -1
- package/dist/icons/Gear/index.d.ts.map +1 -1
- package/dist/icons/Gear/index.js +8 -1
- package/dist/icons/Gear/index.js.map +1 -1
- package/dist/icons/InteractionEnter/index.css +5 -0
- package/dist/icons/InteractionEnter/index.d.ts +11 -0
- package/dist/icons/InteractionEnter/index.d.ts.map +1 -0
- package/dist/icons/InteractionEnter/index.js +25 -0
- package/dist/icons/InteractionEnter/index.js.map +1 -0
- package/dist/icons/{Write → Key}/index.css +1 -1
- package/dist/icons/Key/index.d.ts +7 -0
- package/dist/icons/Key/index.d.ts.map +1 -0
- package/dist/icons/Key/index.js +24 -0
- package/dist/icons/Key/index.js.map +1 -0
- package/dist/icons/LogOut/index.js +2 -2
- package/dist/icons/LogOut/index.js.map +1 -1
- package/dist/icons/Schedule/index.d.ts.map +1 -1
- package/dist/icons/Schedule/index.js +38 -39
- package/dist/icons/Schedule/index.js.map +1 -1
- package/dist/icons/VariableColor/index.css +5 -0
- package/dist/icons/VariableColor/index.d.ts +7 -0
- package/dist/icons/VariableColor/index.d.ts.map +1 -0
- package/dist/icons/VariableColor/index.js +23 -0
- package/dist/icons/VariableColor/index.js.map +1 -0
- package/dist/icons/Warning/index.css +1 -7
- package/dist/icons/Warning/index.d.ts +1 -1
- package/dist/icons/Warning/index.d.ts.map +1 -1
- package/dist/icons/Warning/index.js +11 -16
- package/dist/icons/Warning/index.js.map +1 -1
- package/dist/icons/WarningTriangle/index.css +5 -0
- package/dist/icons/WarningTriangle/index.d.ts +6 -0
- package/dist/icons/WarningTriangle/index.d.ts.map +1 -0
- package/dist/icons/WarningTriangle/index.js +21 -0
- package/dist/icons/WarningTriangle/index.js.map +1 -0
- package/dist/icons/Write/index.d.ts +0 -1
- package/dist/icons/Write/index.d.ts.map +1 -1
- package/dist/icons/Write/index.js +1 -2
- package/dist/icons/Write/index.js.map +1 -1
- package/dist/providers/Auth/index.d.ts +3 -1
- package/dist/providers/Auth/index.d.ts.map +1 -1
- package/dist/providers/Auth/index.js +8 -3
- package/dist/providers/Auth/index.js.map +1 -1
- package/dist/providers/Config/index.js.map +1 -1
- package/dist/providers/DocumentInfo/index.d.ts.map +1 -1
- package/dist/providers/DocumentInfo/index.js +4 -0
- package/dist/providers/DocumentInfo/index.js.map +1 -1
- package/dist/providers/DocumentInfo/types.d.ts +4 -0
- package/dist/providers/DocumentInfo/types.d.ts.map +1 -1
- package/dist/providers/DocumentInfo/types.js.map +1 -1
- package/dist/providers/Root/index.d.ts.map +1 -1
- package/dist/providers/Root/index.js +27 -24
- package/dist/providers/Root/index.js.map +1 -1
- package/dist/providers/TableColumns/RenderDefaultCell/index.css +1 -0
- package/dist/providers/Theme/index.d.ts.map +1 -1
- package/dist/providers/Theme/index.js +16 -14
- package/dist/providers/Theme/index.js.map +1 -1
- package/dist/providers/ToastContainer/index.css +208 -0
- package/dist/providers/ToastContainer/index.d.ts +1 -0
- package/dist/providers/ToastContainer/index.d.ts.map +1 -1
- package/dist/providers/ToastContainer/index.js +19 -6
- package/dist/providers/ToastContainer/index.js.map +1 -1
- package/dist/scss/app.scss +7 -2
- package/dist/styles.css +1361 -1
- package/dist/templates/Default/index.d.ts.map +1 -1
- package/dist/templates/Default/index.js +52 -2
- package/dist/templates/Default/index.js.map +1 -1
- package/dist/utilities/buildClientFieldSchemaMap/traverseFields.js +0 -1
- package/dist/utilities/buildClientFieldSchemaMap/traverseFields.js.map +1 -1
- package/dist/utilities/buildFieldSchemaMap/traverseFields.js +0 -1
- package/dist/utilities/buildFieldSchemaMap/traverseFields.js.map +1 -1
- package/dist/utilities/formatDocTitle/formatDateTitle.d.ts.map +1 -1
- package/dist/utilities/formatDocTitle/formatDateTitle.js +1 -1
- package/dist/utilities/formatDocTitle/formatDateTitle.js.map +1 -1
- package/dist/utilities/getHasScheduledPublish.d.ts +12 -0
- package/dist/utilities/getHasScheduledPublish.d.ts.map +1 -0
- package/dist/utilities/getHasScheduledPublish.js +38 -0
- package/dist/utilities/getHasScheduledPublish.js.map +1 -0
- package/dist/utilities/getVersions.d.ts.map +1 -1
- package/dist/utilities/getVersions.js +1 -21
- package/dist/utilities/getVersions.js.map +1 -1
- package/dist/utilities/reduceFieldsToOptions.js +1 -1
- package/dist/utilities/reduceFieldsToOptions.js.map +1 -1
- package/dist/views/Account/ResetPreferences/index.js +1 -0
- package/dist/views/Account/ResetPreferences/index.js.map +1 -1
- package/dist/views/Account/Settings/index.css +30 -13
- package/dist/views/Account/ToggleTheme/index.d.ts.map +1 -1
- package/dist/views/Account/ToggleTheme/index.js +31 -47
- package/dist/views/Account/ToggleTheme/index.js.map +1 -1
- package/dist/views/Dashboard/Default/ModularDashboard/index.client.js.map +1 -1
- package/dist/views/Document/index.d.ts.map +1 -1
- package/dist/views/Document/index.js +10 -1
- package/dist/views/Document/index.js.map +1 -1
- package/dist/views/Edit/Auth/APIKey.d.ts.map +1 -1
- package/dist/views/Edit/Auth/APIKey.js +10 -32
- package/dist/views/Edit/Auth/APIKey.js.map +1 -1
- package/dist/views/Edit/Auth/index.css +0 -67
- package/dist/views/Edit/index.d.ts.map +1 -1
- package/dist/views/Edit/index.js +62 -48
- package/dist/views/Edit/index.js.map +1 -1
- package/dist/views/HierarchyList/DocumentListSelection/index.js +8 -8
- package/dist/views/HierarchyList/DocumentListSelection/index.js.map +1 -1
- package/dist/views/List/ListHeader/index.css +23 -1
- package/dist/views/List/ListHeader/index.d.ts.map +1 -1
- package/dist/views/List/ListHeader/index.js +0 -1
- package/dist/views/List/ListHeader/index.js.map +1 -1
- package/dist/views/List/ListSelection/index.d.ts.map +1 -1
- package/dist/views/List/ListSelection/index.js +84 -33
- package/dist/views/List/ListSelection/index.js.map +1 -1
- package/dist/views/List/handleGroupBy.d.ts.map +1 -1
- package/dist/views/List/handleGroupBy.js +9 -0
- package/dist/views/List/handleGroupBy.js.map +1 -1
- package/dist/views/List/index.client.d.ts.map +1 -1
- package/dist/views/List/index.client.js +7 -6
- package/dist/views/List/index.client.js.map +1 -1
- package/dist/views/List/index.css +15 -0
- package/dist/views/List/index.d.ts.map +1 -1
- package/dist/views/List/index.js +9 -2
- package/dist/views/List/index.js.map +1 -1
- package/dist/views/List/renderListViewSlots.d.ts.map +1 -1
- package/dist/views/List/renderListViewSlots.js +11 -0
- package/dist/views/List/renderListViewSlots.js.map +1 -1
- package/dist/views/Logout/LogoutClient.d.ts +14 -0
- package/dist/views/Logout/LogoutClient.d.ts.map +1 -1
- package/dist/views/Logout/LogoutClient.js +39 -33
- package/dist/views/Logout/LogoutClient.js.map +1 -1
- package/dist/views/Logout/index.d.ts.map +1 -1
- package/dist/views/Logout/index.js +7 -2
- package/dist/views/Logout/index.js.map +1 -1
- package/dist/views/Version/Default/index.css +3 -5
- package/dist/views/Version/Default/index.d.ts.map +1 -1
- package/dist/views/Version/Default/index.js +7 -28
- package/dist/views/Version/Default/index.js.map +1 -1
- package/dist/views/Version/RenderFieldsToDiff/fields/Checkbox/index.js.map +1 -1
- package/dist/views/Version/Restore/index.css +2 -2
- package/dist/views/Version/SelectComparison/VersionDrawer/index.css +5 -0
- package/dist/views/Version/SelectComparison/VersionDrawer/index.d.ts +1 -1
- package/dist/views/Version/SelectComparison/VersionDrawer/index.d.ts.map +1 -1
- package/dist/views/Version/SelectComparison/VersionDrawer/index.js +1 -2
- package/dist/views/Version/SelectComparison/VersionDrawer/index.js.map +1 -1
- package/dist/views/Version/SelectComparison/index.css +5 -0
- package/dist/views/Version/SelectComparison/index.d.ts +1 -1
- package/dist/views/Version/SelectComparison/index.d.ts.map +1 -1
- package/dist/views/Version/SelectComparison/index.js +1 -1
- package/dist/views/Version/SelectComparison/index.js.map +1 -1
- package/dist/views/Version/SelectLocales/index.d.ts +1 -2
- package/dist/views/Version/SelectLocales/index.d.ts.map +1 -1
- package/dist/views/Version/SelectLocales/index.js +83 -32
- package/dist/views/Version/SelectLocales/index.js.map +1 -1
- package/dist/views/Versions/cells/CreatedAt/index.js.map +1 -1
- package/dist/views/Versions/index.css +19 -16
- package/dist/views/Versions/index.d.ts +1 -1
- package/dist/views/Versions/index.d.ts.map +1 -1
- package/dist/views/Versions/index.js +3 -26
- package/dist/views/Versions/index.js.map +1 -1
- package/package.json +4 -4
- package/dist/elements/BulkUpload/AddingFilesView/index.scss +0 -25
- package/dist/elements/BulkUpload/EditForm/index.scss +0 -11
- package/dist/elements/BulkUpload/EditMany/index.scss +0 -171
- package/dist/elements/ColumnSelector/index.d.ts +0 -9
- package/dist/elements/ColumnSelector/index.d.ts.map +0 -1
- package/dist/elements/ColumnSelector/index.js.map +0 -1
- package/dist/elements/ColumnsButton/index.d.ts +0 -7
- package/dist/elements/ColumnsButton/index.d.ts.map +0 -1
- package/dist/elements/ColumnsButton/index.js.map +0 -1
- package/dist/elements/EditMany/index.scss +0 -182
- package/dist/elements/FileDetails/DraggableFileDetails/index.scss +0 -35
- package/dist/elements/GroupByBuilder/index.d.ts +0 -12
- package/dist/elements/GroupByBuilder/index.d.ts.map +0 -1
- package/dist/elements/GroupByBuilder/index.js +0 -164
- package/dist/elements/GroupByBuilder/index.js.map +0 -1
- package/dist/elements/GroupByBuilder/index.scss +0 -39
- package/dist/elements/GroupByControl/index.d.ts +0 -9
- package/dist/elements/GroupByControl/index.d.ts.map +0 -1
- package/dist/elements/GroupByControl/index.js +0 -258
- package/dist/elements/GroupByControl/index.js.map +0 -1
- package/dist/elements/Hierarchy/Field/SelectedHierarchies.scss +0 -78
- package/dist/elements/Hierarchy/Field/index.scss +0 -41
- package/dist/elements/Hierarchy/MoveMany/index.scss +0 -7
- package/dist/elements/Hierarchy/Tree/LoadMore/index.scss +0 -26
- package/dist/elements/Hierarchy/Tree/TreeConnector.d.ts +0 -7
- package/dist/elements/Hierarchy/Tree/TreeConnector.d.ts.map +0 -1
- package/dist/elements/Hierarchy/Tree/TreeConnector.js +0 -23
- package/dist/elements/Hierarchy/Tree/TreeConnector.js.map +0 -1
- package/dist/elements/LoadMoreRow/index.scss +0 -45
- package/dist/elements/QueryPresets/fields/ColumnsField/index.scss +0 -17
- package/dist/elements/QueryPresets/fields/GroupByField/index.scss +0 -17
- package/dist/elements/QueryPresets/fields/WhereField/index.scss +0 -23
- package/dist/fields/Tabs/Tab/index.css +0 -82
- package/dist/scss/toasts.scss +0 -146
- package/dist/views/Version/SelectComparison/VersionDrawer/index.scss +0 -18
- package/dist/views/Version/SelectComparison/index.scss +0 -9
- /package/dist/elements/{ColumnSelector/index.css → ColumnSelection/Popup.css} +0 -0
- /package/dist/elements/{GroupByControl/index.css → GroupBy/Popup.css} +0 -0
|
@@ -38,23 +38,43 @@
|
|
|
38
38
|
}
|
|
39
39
|
}
|
|
40
40
|
|
|
41
|
-
|
|
42
|
-
.
|
|
41
|
+
.drawer & th:first-child,
|
|
42
|
+
.drawer & td:first-child {
|
|
43
|
+
padding-inline-start: var(--spacer-3);
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.drawer & th:last-child,
|
|
47
|
+
.drawer & td:last-child {
|
|
48
|
+
padding-inline-end: var(--spacer-3);
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
/* Linked cells: move padding to the anchor/button for full-cell clickability */
|
|
52
|
+
td.cell--linked {
|
|
43
53
|
padding: 0;
|
|
44
54
|
|
|
45
|
-
|
|
55
|
+
&:first-child,
|
|
56
|
+
&:last-child {
|
|
57
|
+
padding: 0;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
> :is(a, button) {
|
|
46
61
|
display: flex;
|
|
47
62
|
align-items: center;
|
|
63
|
+
width: 100%;
|
|
48
64
|
padding: var(--spacer-2) var(--spacer-2-5);
|
|
49
65
|
min-height: calc(var(--spacer-4) * 2);
|
|
66
|
+
cursor: pointer;
|
|
50
67
|
}
|
|
51
68
|
|
|
52
|
-
&:first-child > a {
|
|
53
|
-
padding-inline-start: var(--
|
|
54
|
-
padding-inline-end: var(--spacer-2);
|
|
69
|
+
&:first-child > :is(a, button) {
|
|
70
|
+
padding-inline-start: var(--gutter-h);
|
|
55
71
|
}
|
|
56
72
|
}
|
|
57
73
|
|
|
74
|
+
.drawer & td.cell--linked:first-child > :is(a, button) {
|
|
75
|
+
padding-inline-start: var(--spacer-3);
|
|
76
|
+
}
|
|
77
|
+
|
|
58
78
|
#heading-_select,
|
|
59
79
|
.cell-_select {
|
|
60
80
|
width: var(--spacer-5);
|
|
@@ -171,16 +191,25 @@
|
|
|
171
191
|
}
|
|
172
192
|
}
|
|
173
193
|
|
|
174
|
-
/* Linked cells: move padding to the anchor for full-cell clickability */
|
|
175
|
-
.cell--linked {
|
|
194
|
+
/* Linked cells: move padding to the anchor/button for full-cell clickability */
|
|
195
|
+
td.cell--linked {
|
|
176
196
|
padding: 0;
|
|
177
197
|
|
|
178
|
-
|
|
198
|
+
&:first-child,
|
|
199
|
+
&:last-child {
|
|
200
|
+
padding: 0;
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
> :is(a, button) {
|
|
204
|
+
display: flex;
|
|
205
|
+
align-items: center;
|
|
206
|
+
width: 100%;
|
|
179
207
|
padding: 0 var(--spacer-2-5);
|
|
180
208
|
min-height: var(--spacer-5);
|
|
209
|
+
cursor: pointer;
|
|
181
210
|
}
|
|
182
211
|
|
|
183
|
-
&:first-child > a {
|
|
212
|
+
&:first-child > :is(a, button) {
|
|
184
213
|
padding-inline-start: var(--spacer-2-5);
|
|
185
214
|
}
|
|
186
215
|
}
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
@layer payload-default {
|
|
2
|
+
.tabs__tabs-wrap {
|
|
3
|
+
overflow-x: auto;
|
|
4
|
+
overflow-y: hidden;
|
|
5
|
+
margin-bottom: var(--spacer-2);
|
|
6
|
+
position: relative;
|
|
7
|
+
padding-bottom: 2px;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.tabs__tabs {
|
|
11
|
+
display: inline-flex;
|
|
12
|
+
min-width: 100%;
|
|
13
|
+
vertical-align: bottom;
|
|
14
|
+
position: relative;
|
|
15
|
+
z-index: 1;
|
|
16
|
+
box-shadow: inset 0px -1px var(--color-border);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.tabs__tab-button {
|
|
20
|
+
appearance: none;
|
|
21
|
+
background: none;
|
|
22
|
+
border: none;
|
|
23
|
+
display: flex;
|
|
24
|
+
align-items: center;
|
|
25
|
+
justify-content: center;
|
|
26
|
+
gap: var(--spacer-1);
|
|
27
|
+
padding: var(--spacer-1) var(--spacer-2);
|
|
28
|
+
margin: 0;
|
|
29
|
+
margin-bottom: var(--spacer-2);
|
|
30
|
+
cursor: pointer;
|
|
31
|
+
position: relative;
|
|
32
|
+
white-space: nowrap;
|
|
33
|
+
flex-shrink: 0;
|
|
34
|
+
font-family: var(--text-body-medium-font-family);
|
|
35
|
+
font-size: var(--text-body-medium-font-size);
|
|
36
|
+
font-weight: var(--text-body-medium-font-weight);
|
|
37
|
+
line-height: var(--text-body-medium-line-height);
|
|
38
|
+
letter-spacing: var(--text-letter-spacing);
|
|
39
|
+
color: var(--color-text-secondary);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.tabs__tab-button:after {
|
|
43
|
+
content: '';
|
|
44
|
+
position: absolute;
|
|
45
|
+
left: var(--spacer-2);
|
|
46
|
+
right: var(--spacer-2);
|
|
47
|
+
bottom: calc(-1 * var(--spacer-2) - 1px);
|
|
48
|
+
height: 3px;
|
|
49
|
+
background: var(--color-icon-brand);
|
|
50
|
+
border-radius: var(--radius-full);
|
|
51
|
+
opacity: 0;
|
|
52
|
+
z-index: 1;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.tabs__tab-button:hover:after {
|
|
56
|
+
background: var(--color-bg-tertiary);
|
|
57
|
+
opacity: 1;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.tabs__tab-button:focus-visible {
|
|
61
|
+
outline-offset: -1px;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.tabs__tab-button--hidden {
|
|
65
|
+
display: none;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.tabs__tab-button--active {
|
|
69
|
+
font-weight: var(--text-body-medium-strong-font-weight);
|
|
70
|
+
color: var(--color-text);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.tabs__tab-button--active:after {
|
|
74
|
+
background: var(--color-icon-brand);
|
|
75
|
+
opacity: 1;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.tabs__tab-button--active:hover:after {
|
|
79
|
+
background: var(--color-icon-brand);
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.tabs__tab-button--has-error {
|
|
83
|
+
color: var(--color-text-danger);
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.tabs__tab-button--has-error:after {
|
|
87
|
+
background: var(--field-color-border-error);
|
|
88
|
+
opacity: 1;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.tabs__tab-button--has-error:hover:after {
|
|
92
|
+
background: var(--field-color-border-error);
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
@media (max-width: 768px) {
|
|
96
|
+
.tabs__tab-button {
|
|
97
|
+
padding-bottom: var(--spacer-2);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './index.css';
|
|
3
|
+
export type TabsTab<TValue extends string = string> = {
|
|
4
|
+
disabled?: boolean;
|
|
5
|
+
hidden?: boolean;
|
|
6
|
+
label: React.ReactNode;
|
|
7
|
+
value: TValue;
|
|
8
|
+
};
|
|
9
|
+
export type TabsProps<TValue extends string = string> = {
|
|
10
|
+
className?: string;
|
|
11
|
+
onChange: (value: TValue) => void;
|
|
12
|
+
tabs: TabsTab<TValue>[];
|
|
13
|
+
value: TValue;
|
|
14
|
+
};
|
|
15
|
+
export declare const Tabs: <TValue extends string = string>({ className, onChange, tabs, value, }: TabsProps<TValue>) => React.JSX.Element;
|
|
16
|
+
export declare const TabsList: React.FC<{
|
|
17
|
+
children: React.ReactNode;
|
|
18
|
+
className?: string;
|
|
19
|
+
tabsClassName?: string;
|
|
20
|
+
tabsWrapClassName?: string;
|
|
21
|
+
}>;
|
|
22
|
+
export declare const TabButton: React.FC<{
|
|
23
|
+
children: React.ReactNode;
|
|
24
|
+
className?: string;
|
|
25
|
+
disabled?: boolean;
|
|
26
|
+
hasError?: boolean;
|
|
27
|
+
hidden?: boolean;
|
|
28
|
+
isActive?: boolean;
|
|
29
|
+
modifierClassName?: string;
|
|
30
|
+
onClick: () => void;
|
|
31
|
+
}>;
|
|
32
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Tabs/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,aAAa,CAAA;AAIpB,MAAM,MAAM,OAAO,CAAC,MAAM,SAAS,MAAM,GAAG,MAAM,IAAI;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,SAAS,CAAC,MAAM,SAAS,MAAM,GAAG,MAAM,IAAI;IACtD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,IAAI,EAAE,OAAO,CAAC,MAAM,CAAC,EAAE,CAAA;IACvB,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,eAAO,MAAM,IAAI,GAAI,MAAM,SAAS,MAAM,GAAG,MAAM,EAAE,uCAKlD,SAAS,CAAC,MAAM,CAAC,sBAgBnB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B,CAaA,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,CAiCA,CAAA"}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import './index.css';
|
|
6
|
+
const baseClass = 'tabs';
|
|
7
|
+
export const Tabs = ({
|
|
8
|
+
className,
|
|
9
|
+
onChange,
|
|
10
|
+
tabs,
|
|
11
|
+
value
|
|
12
|
+
}) => {
|
|
13
|
+
return /*#__PURE__*/_jsx(TabsList, {
|
|
14
|
+
className: className,
|
|
15
|
+
children: tabs.map(tab => /*#__PURE__*/_jsx(TabButton, {
|
|
16
|
+
disabled: tab.disabled,
|
|
17
|
+
hidden: tab.hidden,
|
|
18
|
+
isActive: tab.value === value,
|
|
19
|
+
onClick: () => onChange(tab.value),
|
|
20
|
+
children: tab.label
|
|
21
|
+
}, tab.value))
|
|
22
|
+
});
|
|
23
|
+
};
|
|
24
|
+
export const TabsList = ({
|
|
25
|
+
children,
|
|
26
|
+
className,
|
|
27
|
+
tabsClassName,
|
|
28
|
+
tabsWrapClassName
|
|
29
|
+
}) => {
|
|
30
|
+
return /*#__PURE__*/_jsx("div", {
|
|
31
|
+
className: [baseClass, className].filter(Boolean).join(' '),
|
|
32
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
33
|
+
className: [`${baseClass}__tabs-wrap`, tabsWrapClassName].filter(Boolean).join(' '),
|
|
34
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
35
|
+
className: [`${baseClass}__tabs`, tabsClassName].filter(Boolean).join(' '),
|
|
36
|
+
role: "tablist",
|
|
37
|
+
children: children
|
|
38
|
+
})
|
|
39
|
+
})
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
export const TabButton = ({
|
|
43
|
+
children,
|
|
44
|
+
className,
|
|
45
|
+
disabled,
|
|
46
|
+
hasError,
|
|
47
|
+
hidden,
|
|
48
|
+
isActive,
|
|
49
|
+
modifierClassName,
|
|
50
|
+
onClick
|
|
51
|
+
}) => {
|
|
52
|
+
return /*#__PURE__*/_jsx("button", {
|
|
53
|
+
"aria-selected": isActive,
|
|
54
|
+
className: [`${baseClass}__tab-button`, className, hasError && `${baseClass}__tab-button--has-error`, hasError && modifierClassName && `${modifierClassName}--has-error`, isActive && `${baseClass}__tab-button--active`, isActive && modifierClassName && `${modifierClassName}--active`, hidden && `${baseClass}__tab-button--hidden`, hidden && modifierClassName && `${modifierClassName}--hidden`].filter(Boolean).join(' '),
|
|
55
|
+
disabled: disabled,
|
|
56
|
+
onClick: onClick,
|
|
57
|
+
role: "tab",
|
|
58
|
+
type: "button",
|
|
59
|
+
children: children
|
|
60
|
+
});
|
|
61
|
+
};
|
|
62
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","baseClass","Tabs","className","onChange","tabs","value","_jsx","TabsList","map","tab","TabButton","disabled","hidden","isActive","onClick","label","children","tabsClassName","tabsWrapClassName","filter","Boolean","join","role","hasError","modifierClassName","type"],"sources":["../../../src/elements/Tabs/index.tsx"],"sourcesContent":["'use client'\n\nimport React from 'react'\n\nimport './index.css'\n\nconst baseClass = 'tabs'\n\nexport type TabsTab<TValue extends string = string> = {\n disabled?: boolean\n hidden?: boolean\n label: React.ReactNode\n value: TValue\n}\n\nexport type TabsProps<TValue extends string = string> = {\n className?: string\n onChange: (value: TValue) => void\n tabs: TabsTab<TValue>[]\n value: TValue\n}\n\nexport const Tabs = <TValue extends string = string>({\n className,\n onChange,\n tabs,\n value,\n}: TabsProps<TValue>) => {\n return (\n <TabsList className={className}>\n {tabs.map((tab) => (\n <TabButton\n disabled={tab.disabled}\n hidden={tab.hidden}\n isActive={tab.value === value}\n key={tab.value}\n onClick={() => onChange(tab.value)}\n >\n {tab.label}\n </TabButton>\n ))}\n </TabsList>\n )\n}\n\nexport const TabsList: React.FC<{\n children: React.ReactNode\n className?: string\n tabsClassName?: string\n tabsWrapClassName?: string\n}> = ({ children, className, tabsClassName, tabsWrapClassName }) => {\n return (\n <div className={[baseClass, className].filter(Boolean).join(' ')}>\n <div className={[`${baseClass}__tabs-wrap`, tabsWrapClassName].filter(Boolean).join(' ')}>\n <div\n className={[`${baseClass}__tabs`, tabsClassName].filter(Boolean).join(' ')}\n role=\"tablist\"\n >\n {children}\n </div>\n </div>\n </div>\n )\n}\n\nexport const TabButton: React.FC<{\n children: React.ReactNode\n className?: string\n disabled?: boolean\n hasError?: boolean\n hidden?: boolean\n isActive?: boolean\n modifierClassName?: string\n onClick: () => void\n}> = ({\n children,\n className,\n disabled,\n hasError,\n hidden,\n isActive,\n modifierClassName,\n onClick,\n}) => {\n return (\n <button\n aria-selected={isActive}\n className={[\n `${baseClass}__tab-button`,\n className,\n hasError && `${baseClass}__tab-button--has-error`,\n hasError && modifierClassName && `${modifierClassName}--has-error`,\n isActive && `${baseClass}__tab-button--active`,\n isActive && modifierClassName && `${modifierClassName}--active`,\n hidden && `${baseClass}__tab-button--hidden`,\n hidden && modifierClassName && `${modifierClassName}--hidden`,\n ]\n .filter(Boolean)\n .join(' ')}\n disabled={disabled}\n onClick={onClick}\n role=\"tab\"\n type=\"button\"\n >\n {children}\n </button>\n )\n}\n"],"mappings":"AAAA;;;AAEA,OAAOA,KAAA,MAAW;AAElB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAgBlB,OAAO,MAAMC,IAAA,GAAOA,CAAiC;EACnDC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC;AAAK,CACa;EAClB,oBACEC,IAAA,CAACC,QAAA;IAASL,SAAA,EAAWA,SAAA;cAClBE,IAAA,CAAKI,GAAG,CAAEC,GAAA,iBACTH,IAAA,CAACI,SAAA;MACCC,QAAA,EAAUF,GAAA,CAAIE,QAAQ;MACtBC,MAAA,EAAQH,GAAA,CAAIG,MAAM;MAClBC,QAAA,EAAUJ,GAAA,CAAIJ,KAAK,KAAKA,KAAA;MAExBS,OAAA,EAASA,CAAA,KAAMX,QAAA,CAASM,GAAA,CAAIJ,KAAK;gBAEhCI,GAAA,CAAIM;OAHAN,GAAA,CAAIJ,KAAK;;AAQxB;AAEA,OAAO,MAAME,QAAA,GAKRA,CAAC;EAAES,QAAQ;EAAEd,SAAS;EAAEe,aAAa;EAAEC;AAAiB,CAAE;EAC7D,oBACEZ,IAAA,CAAC;IAAIJ,SAAA,EAAW,CAACF,SAAA,EAAWE,SAAA,CAAU,CAACiB,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;cAC1D,aAAAf,IAAA,CAAC;MAAIJ,SAAA,EAAW,CAAC,GAAGF,SAAA,aAAsB,EAAEkB,iBAAA,CAAkB,CAACC,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;gBAClF,aAAAf,IAAA,CAAC;QACCJ,SAAA,EAAW,CAAC,GAAGF,SAAA,QAAiB,EAAEiB,aAAA,CAAc,CAACE,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;QACtEC,IAAA,EAAK;kBAEJN;;;;AAKX;AAEA,OAAO,MAAMN,SAAA,GASRA,CAAC;EACJM,QAAQ;EACRd,SAAS;EACTS,QAAQ;EACRY,QAAQ;EACRX,MAAM;EACNC,QAAQ;EACRW,iBAAiB;EACjBV;AAAO,CACR;EACC,oBACER,IAAA,CAAC;IACC,iBAAeO,QAAA;IACfX,SAAA,EAAW,CACT,GAAGF,SAAA,cAAuB,EAC1BE,SAAA,EACAqB,QAAA,IAAY,GAAGvB,SAAA,yBAAkC,EACjDuB,QAAA,IAAYC,iBAAA,IAAqB,GAAGA,iBAAA,aAA8B,EAClEX,QAAA,IAAY,GAAGb,SAAA,sBAA+B,EAC9Ca,QAAA,IAAYW,iBAAA,IAAqB,GAAGA,iBAAA,UAA2B,EAC/DZ,MAAA,IAAU,GAAGZ,SAAA,sBAA+B,EAC5CY,MAAA,IAAUY,iBAAA,IAAqB,GAAGA,iBAAA,UAA2B,CAC9D,CACEL,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;IACRV,QAAA,EAAUA,QAAA;IACVG,OAAA,EAASA,OAAA;IACTQ,IAAA,EAAK;IACLG,IAAA,EAAK;cAEJT;;AAGP","ignoreList":[]}
|
|
@@ -196,20 +196,5 @@
|
|
|
196
196
|
max-height: calc(var(--spacer-6) * 5);
|
|
197
197
|
padding-inline: var(--spacer-2);
|
|
198
198
|
padding-bottom: var(--spacer-2);
|
|
199
|
-
scrollbar-width: thin;
|
|
200
|
-
scrollbar-color: color-mix(in srgb, var(--color-text) 40%, transparent) transparent;
|
|
201
|
-
|
|
202
|
-
&::-webkit-scrollbar {
|
|
203
|
-
width: 4px;
|
|
204
|
-
}
|
|
205
|
-
|
|
206
|
-
&::-webkit-scrollbar-thumb {
|
|
207
|
-
background: color-mix(in srgb, var(--color-text) 40%, transparent);
|
|
208
|
-
border-radius: 2px;
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
&::-webkit-scrollbar-track {
|
|
212
|
-
background: transparent;
|
|
213
|
-
}
|
|
214
199
|
}
|
|
215
200
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fieldErrors.d.ts","sourceRoot":"","sources":["../../../src/elements/Toasts/fieldErrors.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"fieldErrors.d.ts","sourceRoot":"","sources":["../../../src/elements/Toasts/fieldErrors.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,aAAa,CAAA;AA6BpB,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,MAAM,GAAG;IACxD,MAAM,CAAC,EAAE,MAAM,EAAE,CAAA;IACjB,OAAO,EAAE,MAAM,CAAA;CAChB,CAwBA;AAED,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE;;CAAA,qBA4BhD"}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
3
|
import { c as _c } from "react/compiler-runtime";
|
|
4
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
4
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
5
5
|
import React from 'react';
|
|
6
|
+
import { WarningIcon } from '../../icons/Warning/index.js';
|
|
7
|
+
import './index.css';
|
|
6
8
|
function groupSimilarErrors(items) {
|
|
7
9
|
const result = [];
|
|
8
10
|
for (const item of items) {
|
|
@@ -66,14 +68,28 @@ export function FieldErrorsToast(t0) {
|
|
|
66
68
|
} = t2;
|
|
67
69
|
let t3;
|
|
68
70
|
if ($[2] !== errors || $[3] !== message) {
|
|
69
|
-
t3 = _jsxs(
|
|
70
|
-
children: [
|
|
71
|
-
|
|
72
|
-
children:
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
71
|
+
t3 = _jsxs(_Fragment, {
|
|
72
|
+
children: [_jsx("div", {
|
|
73
|
+
className: "toast-icon",
|
|
74
|
+
children: _jsx(WarningIcon, {
|
|
75
|
+
size: 24
|
|
76
|
+
})
|
|
77
|
+
}), _jsx("div", {
|
|
78
|
+
className: "toast-content",
|
|
79
|
+
"data-testid": "field-errors-toast",
|
|
80
|
+
children: _jsxs("div", {
|
|
81
|
+
className: "toast-title",
|
|
82
|
+
children: [message, Array.isArray(errors) && errors.length > 0 ? errors.length === 1 ? _jsx("span", {
|
|
83
|
+
className: "field-error",
|
|
84
|
+
"data-testid": "field-error",
|
|
85
|
+
children: errors[0]
|
|
86
|
+
}) : _jsx("ul", {
|
|
87
|
+
className: "field-errors",
|
|
88
|
+
"data-testid": "field-errors",
|
|
89
|
+
children: errors.map(_temp)
|
|
90
|
+
}) : null]
|
|
91
|
+
})
|
|
92
|
+
})]
|
|
77
93
|
});
|
|
78
94
|
$[2] = errors;
|
|
79
95
|
$[3] = message;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fieldErrors.js","names":["c","_c","React","groupSimilarErrors","items","result","item","parts","split","inserted","i","length","startsWith","splice","push","createErrorsFromMessage","message","colonIndex","indexOf","intro","slice","errorsString","undefined","errors","map","error","replaceAll","trim","FieldErrorsToast","t0","$","errorMessage","t1","t2","useState","t3","_jsxs","children","
|
|
1
|
+
{"version":3,"file":"fieldErrors.js","names":["c","_c","React","WarningIcon","groupSimilarErrors","items","result","item","parts","split","inserted","i","length","startsWith","splice","push","createErrorsFromMessage","message","colonIndex","indexOf","intro","slice","errorsString","undefined","errors","map","error","replaceAll","trim","FieldErrorsToast","t0","$","errorMessage","t1","t2","useState","t3","_jsxs","_Fragment","children","_jsx","className","size","Array","isArray","_temp","index"],"sources":["../../../src/elements/Toasts/fieldErrors.tsx"],"sourcesContent":["'use client'\n\nimport React from 'react'\n\nimport { WarningIcon } from '../../icons/Warning/index.js'\nimport './index.css'\n\nfunction groupSimilarErrors(items: string[]): string[] {\n const result: string[] = []\n\n for (const item of items) {\n if (item) {\n const parts = item.split(' → ')\n let inserted = false\n\n // Find a place where a similar path exists\n for (let i = 0; i < result.length; i++) {\n if (result[i].startsWith(parts[0])) {\n result.splice(i + 1, 0, item)\n inserted = true\n break\n }\n }\n\n // If no similar path was found, add to the end\n if (!inserted) {\n result.push(item)\n }\n }\n }\n\n return result\n}\n\nexport function createErrorsFromMessage(message: string): {\n errors?: string[]\n message: string\n} {\n const colonIndex = message.indexOf(':')\n const intro = colonIndex >= 0 ? message.slice(0, colonIndex) : message\n const errorsString = colonIndex >= 0 ? message.slice(colonIndex + 1) : undefined\n\n if (!errorsString) {\n return {\n message: intro,\n }\n }\n\n const errors = errorsString.split(',').map((error) => error.replaceAll(' > ', ' → ').trim())\n\n if (errors.length === 1) {\n return {\n errors,\n message: `${intro}: `,\n }\n }\n\n return {\n errors: groupSimilarErrors(errors),\n message: `${intro} (${errors.length}):`,\n }\n}\n\nexport function FieldErrorsToast({ errorMessage }) {\n const [{ errors, message }] = React.useState(() => createErrorsFromMessage(errorMessage))\n\n return (\n <>\n <div className=\"toast-icon\">\n <WarningIcon size={24} />\n </div>\n <div className=\"toast-content\" data-testid=\"field-errors-toast\">\n <div className=\"toast-title\">\n {message}\n {Array.isArray(errors) && errors.length > 0 ? (\n errors.length === 1 ? (\n <span className=\"field-error\" data-testid=\"field-error\">\n {errors[0]}\n </span>\n ) : (\n <ul className=\"field-errors\" data-testid=\"field-errors\">\n {errors.map((error, index) => {\n return <li key={index}>{error}</li>\n })}\n </ul>\n )\n ) : null}\n </div>\n </div>\n </>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -5,12 +5,15 @@
|
|
|
5
5
|
--caret-offset: 4px;
|
|
6
6
|
--caret-border-color: var(--color-border);
|
|
7
7
|
--tooltip-x: -50%;
|
|
8
|
+
--tooltip-caret-x: 0px;
|
|
9
|
+
--tooltip-max-width: none;
|
|
8
10
|
|
|
9
11
|
opacity: 0;
|
|
10
12
|
background-color: var(--color-bg-tooltip);
|
|
11
13
|
position: absolute;
|
|
12
14
|
z-index: 3;
|
|
13
15
|
left: 50%;
|
|
16
|
+
max-width: var(--tooltip-max-width);
|
|
14
17
|
padding: var(--spacer-1);
|
|
15
18
|
color: var(--color-text-ontooltip);
|
|
16
19
|
font-family: var(--text-body-medium-font-family);
|
|
@@ -48,6 +51,11 @@
|
|
|
48
51
|
}
|
|
49
52
|
}
|
|
50
53
|
|
|
54
|
+
.tooltip--wrap {
|
|
55
|
+
white-space: normal;
|
|
56
|
+
overflow-wrap: break-word;
|
|
57
|
+
}
|
|
58
|
+
|
|
51
59
|
.tooltip__caret {
|
|
52
60
|
position: absolute;
|
|
53
61
|
pointer-events: none;
|
|
@@ -87,7 +95,11 @@
|
|
|
87
95
|
|
|
88
96
|
.tooltip--position-top {
|
|
89
97
|
top: 0;
|
|
90
|
-
transform: translate3d(
|
|
98
|
+
transform: translate3d(
|
|
99
|
+
var(--tooltip-x),
|
|
100
|
+
calc(-100% - var(--caret-height) - var(--caret-offset) + 1px),
|
|
101
|
+
0
|
|
102
|
+
);
|
|
91
103
|
|
|
92
104
|
.tooltip__caret {
|
|
93
105
|
--color-border: var(--ramp-grey-700);
|
|
@@ -95,13 +107,17 @@
|
|
|
95
107
|
}
|
|
96
108
|
|
|
97
109
|
&.tooltip--caret-center .tooltip__caret {
|
|
98
|
-
transform: translateX(-50%);
|
|
110
|
+
transform: translateX(calc(-50% + var(--tooltip-caret-x)));
|
|
99
111
|
}
|
|
100
112
|
}
|
|
101
113
|
|
|
102
114
|
.tooltip--position-bottom {
|
|
103
115
|
top: 100%;
|
|
104
|
-
transform: translate3d(
|
|
116
|
+
transform: translate3d(
|
|
117
|
+
var(--tooltip-x),
|
|
118
|
+
calc(var(--caret-height) + var(--caret-offset) - 1px),
|
|
119
|
+
0
|
|
120
|
+
);
|
|
105
121
|
|
|
106
122
|
.tooltip__caret {
|
|
107
123
|
bottom: calc(100% - 0.5px);
|
|
@@ -109,7 +125,7 @@
|
|
|
109
125
|
}
|
|
110
126
|
|
|
111
127
|
&.tooltip--caret-center .tooltip__caret {
|
|
112
|
-
transform: translateX(-50%) rotate(180deg);
|
|
128
|
+
transform: translateX(calc(-50% + var(--tooltip-caret-x))) rotate(180deg);
|
|
113
129
|
}
|
|
114
130
|
|
|
115
131
|
&.tooltip--caret-right .tooltip__caret {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Tooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Tooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAGhF,OAAO,aAAa,CAAA;AAwBpB,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IACxC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACjD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAA;IAC9C,IAAI,CAAC,EAAE,OAAO,CAAA;IACd;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B,CAAA;AAsBD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsJnC,CAAA"}
|
|
@@ -2,9 +2,24 @@
|
|
|
2
2
|
|
|
3
3
|
import { c as _c } from "react/compiler-runtime";
|
|
4
4
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
-
import React, { useEffect } from 'react';
|
|
5
|
+
import React, { useCallback, useEffect, useLayoutEffect, useState } from 'react';
|
|
6
6
|
import { useIntersect } from '../../hooks/useIntersect.js';
|
|
7
7
|
import './index.css';
|
|
8
|
+
// Breathing room (px) between a shifted tooltip and its clipping edge. Maps to `--spacer-1`.
|
|
9
|
+
const EDGE_GUTTER = 4;
|
|
10
|
+
const getClipBoundary = el => {
|
|
11
|
+
let current = el?.parentElement || null;
|
|
12
|
+
while (current) {
|
|
13
|
+
const {
|
|
14
|
+
overflowX
|
|
15
|
+
} = window.getComputedStyle(current);
|
|
16
|
+
if (overflowX === 'auto' || overflowX === 'clip' || overflowX === 'hidden' || overflowX === 'scroll') {
|
|
17
|
+
return current.getBoundingClientRect();
|
|
18
|
+
}
|
|
19
|
+
current = current.parentElement;
|
|
20
|
+
}
|
|
21
|
+
return null;
|
|
22
|
+
};
|
|
8
23
|
const TooltipCaret = () => {
|
|
9
24
|
const $ = _c(2);
|
|
10
25
|
const clipId = React.useId();
|
|
@@ -53,7 +68,9 @@ export const Tooltip = props => {
|
|
|
53
68
|
} = props;
|
|
54
69
|
const [show, setShow] = React.useState(showFromProps);
|
|
55
70
|
const [position, setPosition] = React.useState('top');
|
|
56
|
-
const [
|
|
71
|
+
const [shiftX, setShiftX] = useState(0);
|
|
72
|
+
const [maxWidth, setMaxWidth] = useState(null);
|
|
73
|
+
const [ref, intersectionEntry, node] = useIntersect({
|
|
57
74
|
root: boundingRef?.current || null,
|
|
58
75
|
rootMargin: '-145px 0px 0px 100px',
|
|
59
76
|
threshold: 0
|
|
@@ -80,6 +97,48 @@ export const Tooltip = props => {
|
|
|
80
97
|
}
|
|
81
98
|
setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom');
|
|
82
99
|
}, [intersectionEntry, staticPositioning]);
|
|
100
|
+
// Keep a horizontally-centered tooltip (top/bottom) inside its boundary by
|
|
101
|
+
// shifting it inward by exactly the amount it would overflow. The hidden
|
|
102
|
+
// measuring aside (`node`) provides the natural, unshifted geometry.
|
|
103
|
+
const computeShift = useCallback(() => {
|
|
104
|
+
const usesHorizontalCenter = (positionFromProps || position) === 'top' || (positionFromProps || position) === 'bottom';
|
|
105
|
+
if (staticPositioning || !node || !usesHorizontalCenter) {
|
|
106
|
+
setShiftX(0);
|
|
107
|
+
setMaxWidth(null);
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
const rect = node.getBoundingClientRect();
|
|
111
|
+
const boundary = boundingRef?.current?.getBoundingClientRect() ?? getClipBoundary(node) ?? undefined;
|
|
112
|
+
const leftEdge = (boundary?.left ?? 0) + EDGE_GUTTER;
|
|
113
|
+
const rightEdge = (boundary?.right ?? window.innerWidth) - EDGE_GUTTER;
|
|
114
|
+
const available = rightEdge - leftEdge;
|
|
115
|
+
// When the tooltip can't fit even at full boundary width, cap it so it wraps.
|
|
116
|
+
const nextMaxWidth = rect.width > available ? available : null;
|
|
117
|
+
setMaxWidth(nextMaxWidth);
|
|
118
|
+
// Compute the shift against the clamped box, kept centered on the anchor.
|
|
119
|
+
const center = rect.left + rect.width / 2;
|
|
120
|
+
const effectiveWidth = nextMaxWidth ?? rect.width;
|
|
121
|
+
const effectiveLeft = center - effectiveWidth / 2;
|
|
122
|
+
const effectiveRight = center + effectiveWidth / 2;
|
|
123
|
+
let shift = 0;
|
|
124
|
+
if (effectiveRight > rightEdge) {
|
|
125
|
+
shift = rightEdge - effectiveRight;
|
|
126
|
+
}
|
|
127
|
+
if (effectiveLeft + shift < leftEdge) {
|
|
128
|
+
shift = leftEdge - effectiveLeft;
|
|
129
|
+
}
|
|
130
|
+
setShiftX(shift);
|
|
131
|
+
}, [boundingRef, node, position, positionFromProps, staticPositioning]);
|
|
132
|
+
useLayoutEffect(() => {
|
|
133
|
+
if (!show) {
|
|
134
|
+
return;
|
|
135
|
+
}
|
|
136
|
+
computeShift();
|
|
137
|
+
window.addEventListener('resize', computeShift);
|
|
138
|
+
return () => {
|
|
139
|
+
window.removeEventListener('resize', computeShift);
|
|
140
|
+
};
|
|
141
|
+
}, [show, computeShift]);
|
|
83
142
|
// The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.
|
|
84
143
|
return /*#__PURE__*/_jsxs(React.Fragment, {
|
|
85
144
|
children: [!staticPositioning && /*#__PURE__*/_jsxs("aside", {
|
|
@@ -94,7 +153,16 @@ export const Tooltip = props => {
|
|
|
94
153
|
children: children
|
|
95
154
|
})]
|
|
96
155
|
}), /*#__PURE__*/_jsxs("aside", {
|
|
97
|
-
className: ['tooltip', className, show && 'tooltip--show', `tooltip--caret-${alignCaret}`, `tooltip--position-${positionFromProps || position}`].filter(Boolean).join(' '),
|
|
156
|
+
className: ['tooltip', className, show && 'tooltip--show', maxWidth && 'tooltip--wrap', `tooltip--caret-${alignCaret}`, `tooltip--position-${positionFromProps || position}`].filter(Boolean).join(' '),
|
|
157
|
+
style: {
|
|
158
|
+
...(maxWidth ? {
|
|
159
|
+
'--tooltip-max-width': `${maxWidth}px`
|
|
160
|
+
} : {}),
|
|
161
|
+
...(shiftX ? {
|
|
162
|
+
'--tooltip-caret-x': `${-shiftX}px`,
|
|
163
|
+
'--tooltip-x': `calc(-50% + ${shiftX}px)`
|
|
164
|
+
} : {})
|
|
165
|
+
},
|
|
98
166
|
children: [/*#__PURE__*/_jsx(TooltipCaret, {}), /*#__PURE__*/_jsx("div", {
|
|
99
167
|
className: "tooltip-content",
|
|
100
168
|
children: children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","React","useEffect","useIntersect","TooltipCaret","$","clipId","useId","t0","_jsxs","className","height","viewBox","width","children","_jsx","id","x","y","clipPath","d","Tooltip","props","alignCaret","boundingRef","delay","position","positionFromProps","show","showFromProps","staticPositioning","setShow","useState","setPosition","ref","intersectionEntry","root","current","rootMargin","threshold","timerID","setTimeout","clearTimeout","isIntersecting","Fragment","filter","Boolean","join","style","opacity"],"sources":["../../../src/elements/Tooltip/index.tsx"],"sourcesContent":["'use client'\nimport React, { useEffect } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport './index.css'\n\nexport type Props = {\n alignCaret?: 'center' | 'left' | 'right'\n boundingRef?: React.RefObject<HTMLElement | null>\n children: React.ReactNode\n className?: string\n delay?: number\n position?: 'bottom' | 'left' | 'right' | 'top'\n show?: boolean\n /**\n * If the tooltip position should not change depending on if the toolbar is outside the boundingRef. @default false\n */\n staticPositioning?: boolean\n}\n\nconst TooltipCaret: React.FC = () => {\n const clipId = React.useId()\n\n return (\n <svg aria-hidden=\"true\" className=\"tooltip__caret\" height=\"14\" viewBox=\"0 0 14 14\" width=\"15\">\n <clipPath id={clipId}>\n <rect height=\"14\" width=\"15\" x=\"-0.5\" y=\"0.5\" />\n </clipPath>\n {/* Border stroke - clipped to hide top edge */}\n <path\n className=\"tooltip__caret-stroke\"\n clipPath={`url(#${clipId})`}\n d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\"\n />\n {/* Fill path */}\n <path className=\"tooltip__caret-fill\" d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\" />\n </svg>\n )\n}\n\nexport const Tooltip: React.FC<Props> = (props) => {\n const {\n alignCaret = 'center',\n boundingRef,\n children,\n className,\n delay = 500,\n position: positionFromProps,\n show: showFromProps = true,\n staticPositioning = false,\n } = props\n\n const [show, setShow] = React.useState(showFromProps)\n const [position, setPosition] = React.useState<'bottom' | 'left' | 'right' | 'top'>('top')\n\n const [ref, intersectionEntry] = useIntersect(\n {\n root: boundingRef?.current || null,\n rootMargin: '-145px 0px 0px 100px',\n threshold: 0,\n },\n staticPositioning,\n )\n\n useEffect(() => {\n let timerID: NodeJS.Timeout\n\n // do not use the delay on transition-out\n if (delay && showFromProps) {\n timerID = setTimeout(() => {\n setShow(showFromProps)\n }, delay)\n } else {\n setShow(showFromProps)\n }\n\n return () => {\n if (timerID) {\n clearTimeout(timerID)\n }\n }\n }, [showFromProps, delay])\n\n useEffect(() => {\n if (staticPositioning) {\n return\n }\n setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom')\n }, [intersectionEntry, staticPositioning])\n\n // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.\n return (\n <React.Fragment>\n {!staticPositioning && (\n <aside\n aria-hidden=\"true\"\n className={['tooltip', className, `tooltip--caret-${alignCaret}`, 'tooltip--position-top']\n .filter(Boolean)\n .join(' ')}\n ref={ref}\n style={{ opacity: '0' }}\n >\n <TooltipCaret />\n <div className=\"tooltip-content\">{children}</div>\n </aside>\n )}\n <aside\n className={[\n 'tooltip',\n className,\n show && 'tooltip--show',\n `tooltip--caret-${alignCaret}`,\n `tooltip--position-${positionFromProps || position}`,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <TooltipCaret />\n <div className=\"tooltip-content\">{children}</div>\n </aside>\n </React.Fragment>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","useLayoutEffect","useState","useIntersect","EDGE_GUTTER","getClipBoundary","el","current","parentElement","overflowX","window","getComputedStyle","getBoundingClientRect","TooltipCaret","$","clipId","useId","t0","_jsxs","className","height","viewBox","width","children","_jsx","id","x","y","clipPath","d","Tooltip","props","alignCaret","boundingRef","delay","position","positionFromProps","show","showFromProps","staticPositioning","setShow","setPosition","shiftX","setShiftX","maxWidth","setMaxWidth","ref","intersectionEntry","node","root","rootMargin","threshold","timerID","setTimeout","clearTimeout","isIntersecting","computeShift","usesHorizontalCenter","rect","boundary","undefined","leftEdge","left","rightEdge","right","innerWidth","available","nextMaxWidth","center","effectiveWidth","effectiveLeft","effectiveRight","shift","addEventListener","removeEventListener","Fragment","filter","Boolean","join","style","opacity"],"sources":["../../../src/elements/Tooltip/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useEffect, useLayoutEffect, useState } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport './index.css'\n\n// Breathing room (px) between a shifted tooltip and its clipping edge. Maps to `--spacer-1`.\nconst EDGE_GUTTER = 4\n\nconst getClipBoundary = (el: HTMLElement | null): DOMRect | null => {\n let current = el?.parentElement || null\n\n while (current) {\n const { overflowX } = window.getComputedStyle(current)\n if (\n overflowX === 'auto' ||\n overflowX === 'clip' ||\n overflowX === 'hidden' ||\n overflowX === 'scroll'\n ) {\n return current.getBoundingClientRect()\n }\n current = current.parentElement\n }\n\n return null\n}\n\nexport type Props = {\n alignCaret?: 'center' | 'left' | 'right'\n boundingRef?: React.RefObject<HTMLElement | null>\n children: React.ReactNode\n className?: string\n delay?: number\n position?: 'bottom' | 'left' | 'right' | 'top'\n show?: boolean\n /**\n * If the tooltip position should not change depending on if the toolbar is outside the boundingRef. @default false\n */\n staticPositioning?: boolean\n}\n\nconst TooltipCaret: React.FC = () => {\n const clipId = React.useId()\n\n return (\n <svg aria-hidden=\"true\" className=\"tooltip__caret\" height=\"14\" viewBox=\"0 0 14 14\" width=\"15\">\n <clipPath id={clipId}>\n <rect height=\"14\" width=\"15\" x=\"-0.5\" y=\"0.5\" />\n </clipPath>\n {/* Border stroke - clipped to hide top edge */}\n <path\n className=\"tooltip__caret-stroke\"\n clipPath={`url(#${clipId})`}\n d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\"\n />\n {/* Fill path */}\n <path className=\"tooltip__caret-fill\" d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\" />\n </svg>\n )\n}\n\nexport const Tooltip: React.FC<Props> = (props) => {\n const {\n alignCaret = 'center',\n boundingRef,\n children,\n className,\n delay = 500,\n position: positionFromProps,\n show: showFromProps = true,\n staticPositioning = false,\n } = props\n\n const [show, setShow] = React.useState(showFromProps)\n const [position, setPosition] = React.useState<'bottom' | 'left' | 'right' | 'top'>('top')\n const [shiftX, setShiftX] = useState(0)\n const [maxWidth, setMaxWidth] = useState<null | number>(null)\n\n const [ref, intersectionEntry, node] = useIntersect(\n {\n root: boundingRef?.current || null,\n rootMargin: '-145px 0px 0px 100px',\n threshold: 0,\n },\n staticPositioning,\n )\n\n useEffect(() => {\n let timerID: NodeJS.Timeout\n\n // do not use the delay on transition-out\n if (delay && showFromProps) {\n timerID = setTimeout(() => {\n setShow(showFromProps)\n }, delay)\n } else {\n setShow(showFromProps)\n }\n\n return () => {\n if (timerID) {\n clearTimeout(timerID)\n }\n }\n }, [showFromProps, delay])\n\n useEffect(() => {\n if (staticPositioning) {\n return\n }\n setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom')\n }, [intersectionEntry, staticPositioning])\n\n // Keep a horizontally-centered tooltip (top/bottom) inside its boundary by\n // shifting it inward by exactly the amount it would overflow. The hidden\n // measuring aside (`node`) provides the natural, unshifted geometry.\n const computeShift = useCallback(() => {\n const usesHorizontalCenter =\n (positionFromProps || position) === 'top' || (positionFromProps || position) === 'bottom'\n\n if (staticPositioning || !node || !usesHorizontalCenter) {\n setShiftX(0)\n setMaxWidth(null)\n return\n }\n\n const rect = node.getBoundingClientRect()\n const boundary =\n boundingRef?.current?.getBoundingClientRect() ?? getClipBoundary(node) ?? undefined\n const leftEdge = (boundary?.left ?? 0) + EDGE_GUTTER\n const rightEdge = (boundary?.right ?? window.innerWidth) - EDGE_GUTTER\n const available = rightEdge - leftEdge\n\n // When the tooltip can't fit even at full boundary width, cap it so it wraps.\n const nextMaxWidth = rect.width > available ? available : null\n setMaxWidth(nextMaxWidth)\n\n // Compute the shift against the clamped box, kept centered on the anchor.\n const center = rect.left + rect.width / 2\n const effectiveWidth = nextMaxWidth ?? rect.width\n const effectiveLeft = center - effectiveWidth / 2\n const effectiveRight = center + effectiveWidth / 2\n\n let shift = 0\n if (effectiveRight > rightEdge) {\n shift = rightEdge - effectiveRight\n }\n if (effectiveLeft + shift < leftEdge) {\n shift = leftEdge - effectiveLeft\n }\n\n setShiftX(shift)\n }, [boundingRef, node, position, positionFromProps, staticPositioning])\n\n useLayoutEffect(() => {\n if (!show) {\n return\n }\n\n computeShift()\n window.addEventListener('resize', computeShift)\n\n return () => {\n window.removeEventListener('resize', computeShift)\n }\n }, [show, computeShift])\n\n // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.\n return (\n <React.Fragment>\n {!staticPositioning && (\n <aside\n aria-hidden=\"true\"\n className={['tooltip', className, `tooltip--caret-${alignCaret}`, 'tooltip--position-top']\n .filter(Boolean)\n .join(' ')}\n ref={ref}\n style={{ opacity: '0' }}\n >\n <TooltipCaret />\n <div className=\"tooltip-content\">{children}</div>\n </aside>\n )}\n <aside\n className={[\n 'tooltip',\n className,\n show && 'tooltip--show',\n maxWidth && 'tooltip--wrap',\n `tooltip--caret-${alignCaret}`,\n `tooltip--position-${positionFromProps || position}`,\n ]\n .filter(Boolean)\n .join(' ')}\n style={\n {\n ...(maxWidth ? { '--tooltip-max-width': `${maxWidth}px` } : {}),\n ...(shiftX\n ? {\n '--tooltip-caret-x': `${-shiftX}px`,\n '--tooltip-x': `calc(-50% + ${shiftX}px)`,\n }\n : {}),\n } as React.CSSProperties\n }\n >\n <TooltipCaret />\n <div className=\"tooltip-content\">{children}</div>\n </aside>\n </React.Fragment>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/UnpublishButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAA;AAMzD,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/UnpublishButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAA;AAMzD,OAAO,KAAgC,MAAM,OAAO,CAAA;AAWpD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EAAE,SAAS,GACjB,GAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,0BAA+B,qBA8LtD"}
|