@namroodinc/liquid-editorial 0.0.0-stage → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +128 -2
- package/dist/chunks/EntryEditor-BF808OZR.js +181 -0
- package/dist/chunks/EntryEditor-BF808OZR.js.map +1 -0
- package/dist/chunks/EntryEditor-cjDk4vdH.cjs +2 -0
- package/dist/chunks/EntryEditor-cjDk4vdH.cjs.map +1 -0
- package/dist/chunks/Icon-CGY1FNXT.js +77 -0
- package/dist/chunks/Icon-CGY1FNXT.js.map +1 -0
- package/dist/chunks/Icon-CWsA1W83.cjs +2 -0
- package/dist/chunks/Icon-CWsA1W83.cjs.map +1 -0
- package/dist/chunks/RichTextEditor-DRt-kibg.js +248 -0
- package/dist/chunks/RichTextEditor-DRt-kibg.js.map +1 -0
- package/dist/chunks/RichTextEditor-tFkISOvq.cjs +2 -0
- package/dist/chunks/RichTextEditor-tFkISOvq.cjs.map +1 -0
- package/dist/components/AssetGrid/index.cjs +2 -0
- package/dist/components/AssetGrid/index.cjs.map +1 -0
- package/dist/components/AssetGrid/index.d.cts +54 -0
- package/dist/components/AssetGrid/index.d.cts.map +1 -0
- package/dist/components/AssetGrid/index.d.ts +54 -0
- package/dist/components/AssetGrid/index.d.ts.map +1 -0
- package/dist/components/AssetGrid/index.js +137 -0
- package/dist/components/AssetGrid/index.js.map +1 -0
- package/dist/components/AssetGrid/style.css +196 -0
- package/dist/components/Avatar/index.cjs +2 -0
- package/dist/components/Avatar/index.cjs.map +1 -0
- package/dist/components/Avatar/index.d.cts +24 -0
- package/dist/components/Avatar/index.d.cts.map +1 -0
- package/dist/components/Avatar/index.d.ts +24 -0
- package/dist/components/Avatar/index.d.ts.map +1 -0
- package/dist/components/Avatar/index.js +43 -0
- package/dist/components/Avatar/index.js.map +1 -0
- package/dist/components/Avatar/style.css +70 -0
- package/dist/components/Badge/index.cjs +2 -0
- package/dist/components/Badge/index.cjs.map +1 -0
- package/dist/components/Badge/index.d.cts +25 -0
- package/dist/components/Badge/index.d.cts.map +1 -0
- package/dist/components/Badge/index.d.ts +25 -0
- package/dist/components/Badge/index.d.ts.map +1 -0
- package/dist/components/Badge/index.js +28 -0
- package/dist/components/Badge/index.js.map +1 -0
- package/dist/components/Badge/style.css +103 -0
- package/dist/components/Board/index.cjs +2 -0
- package/dist/components/Board/index.cjs.map +1 -0
- package/dist/components/Board/index.d.cts +62 -0
- package/dist/components/Board/index.d.cts.map +1 -0
- package/dist/components/Board/index.d.ts +62 -0
- package/dist/components/Board/index.d.ts.map +1 -0
- package/dist/components/Board/index.js +227 -0
- package/dist/components/Board/index.js.map +1 -0
- package/dist/components/Board/style.css +145 -0
- package/dist/components/Button/index.cjs +2 -0
- package/dist/components/Button/index.cjs.map +1 -0
- package/dist/components/Button/index.d.cts +22 -0
- package/dist/components/Button/index.d.cts.map +1 -0
- package/dist/components/Button/index.d.ts +22 -0
- package/dist/components/Button/index.d.ts.map +1 -0
- package/dist/components/Button/index.js +37 -0
- package/dist/components/Button/index.js.map +1 -0
- package/dist/components/Button/style.css +139 -0
- package/dist/components/ButtonGroup/index.cjs +2 -0
- package/dist/components/ButtonGroup/index.cjs.map +1 -0
- package/dist/components/ButtonGroup/index.d.cts +17 -0
- package/dist/components/ButtonGroup/index.d.cts.map +1 -0
- package/dist/components/ButtonGroup/index.d.ts +17 -0
- package/dist/components/ButtonGroup/index.d.ts.map +1 -0
- package/dist/components/ButtonGroup/index.js +18 -0
- package/dist/components/ButtonGroup/index.js.map +1 -0
- package/dist/components/ButtonGroup/style.css +66 -0
- package/dist/components/Choice/index.cjs +2 -0
- package/dist/components/Choice/index.cjs.map +1 -0
- package/dist/components/Choice/index.d.cts +25 -0
- package/dist/components/Choice/index.d.cts.map +1 -0
- package/dist/components/Choice/index.d.ts +25 -0
- package/dist/components/Choice/index.d.ts.map +1 -0
- package/dist/components/Choice/index.js +58 -0
- package/dist/components/Choice/index.js.map +1 -0
- package/dist/components/Choice/style.css +96 -0
- package/dist/components/Container/index.cjs +2 -0
- package/dist/components/Container/index.cjs.map +1 -0
- package/dist/components/Container/index.d.cts +19 -0
- package/dist/components/Container/index.d.cts.map +1 -0
- package/dist/components/Container/index.d.ts +19 -0
- package/dist/components/Container/index.d.ts.map +1 -0
- package/dist/components/Container/index.js +20 -0
- package/dist/components/Container/index.js.map +1 -0
- package/dist/components/Container/style.css +41 -0
- package/dist/components/DatePicker/index.cjs +2 -0
- package/dist/components/DatePicker/index.cjs.map +1 -0
- package/dist/components/DatePicker/index.d.cts +57 -0
- package/dist/components/DatePicker/index.d.cts.map +1 -0
- package/dist/components/DatePicker/index.d.ts +57 -0
- package/dist/components/DatePicker/index.d.ts.map +1 -0
- package/dist/components/DatePicker/index.js +248 -0
- package/dist/components/DatePicker/index.js.map +1 -0
- package/dist/components/DatePicker/style.css +149 -0
- package/dist/components/Drawer/index.cjs +2 -0
- package/dist/components/Drawer/index.cjs.map +1 -0
- package/dist/components/Drawer/index.d.cts +23 -0
- package/dist/components/Drawer/index.d.cts.map +1 -0
- package/dist/components/Drawer/index.d.ts +23 -0
- package/dist/components/Drawer/index.d.ts.map +1 -0
- package/dist/components/Drawer/index.js +85 -0
- package/dist/components/Drawer/index.js.map +1 -0
- package/dist/components/Drawer/style.css +147 -0
- package/dist/components/EntryEditor/index.cjs +1 -0
- package/dist/components/EntryEditor/index.d.cts +21 -0
- package/dist/components/EntryEditor/index.d.cts.map +1 -0
- package/dist/components/EntryEditor/index.d.ts +21 -0
- package/dist/components/EntryEditor/index.d.ts.map +1 -0
- package/dist/components/EntryEditor/index.js +6 -0
- package/dist/components/EntryEditor/model.d.cts +33 -0
- package/dist/components/EntryEditor/model.d.cts.map +1 -0
- package/dist/components/EntryEditor/model.d.ts +33 -0
- package/dist/components/EntryEditor/model.d.ts.map +1 -0
- package/dist/components/EntryEditor/style.css +8 -0
- package/dist/components/EntryPicker/index.cjs +2 -0
- package/dist/components/EntryPicker/index.cjs.map +1 -0
- package/dist/components/EntryPicker/index.d.cts +36 -0
- package/dist/components/EntryPicker/index.d.cts.map +1 -0
- package/dist/components/EntryPicker/index.d.ts +36 -0
- package/dist/components/EntryPicker/index.d.ts.map +1 -0
- package/dist/components/EntryPicker/index.js +181 -0
- package/dist/components/EntryPicker/index.js.map +1 -0
- package/dist/components/EntryPicker/style.css +162 -0
- package/dist/components/Field/index.cjs +2 -0
- package/dist/components/Field/index.cjs.map +1 -0
- package/dist/components/Field/index.d.cts +22 -0
- package/dist/components/Field/index.d.cts.map +1 -0
- package/dist/components/Field/index.d.ts +22 -0
- package/dist/components/Field/index.d.ts.map +1 -0
- package/dist/components/Field/index.js +47 -0
- package/dist/components/Field/index.js.map +1 -0
- package/dist/components/Field/style.css +112 -0
- package/dist/components/FieldAffix/index.cjs +2 -0
- package/dist/components/FieldAffix/index.cjs.map +1 -0
- package/dist/components/FieldAffix/index.d.cts +19 -0
- package/dist/components/FieldAffix/index.d.cts.map +1 -0
- package/dist/components/FieldAffix/index.d.ts +19 -0
- package/dist/components/FieldAffix/index.d.ts.map +1 -0
- package/dist/components/FieldAffix/index.js +45 -0
- package/dist/components/FieldAffix/index.js.map +1 -0
- package/dist/components/FieldAffix/style.css +54 -0
- package/dist/components/Grid/index.cjs +2 -0
- package/dist/components/Grid/index.cjs.map +1 -0
- package/dist/components/Grid/index.d.cts +44 -0
- package/dist/components/Grid/index.d.cts.map +1 -0
- package/dist/components/Grid/index.d.ts +44 -0
- package/dist/components/Grid/index.d.ts.map +1 -0
- package/dist/components/Grid/index.js +49 -0
- package/dist/components/Grid/index.js.map +1 -0
- package/dist/components/Grid/style.css +226 -0
- package/dist/components/Icon/icons.d.cts +64 -0
- package/dist/components/Icon/icons.d.cts.map +1 -0
- package/dist/components/Icon/icons.d.ts +64 -0
- package/dist/components/Icon/icons.d.ts.map +1 -0
- package/dist/components/Icon/index.cjs +1 -0
- package/dist/components/Icon/index.d.cts +15 -0
- package/dist/components/Icon/index.d.cts.map +1 -0
- package/dist/components/Icon/index.d.ts +15 -0
- package/dist/components/Icon/index.d.ts.map +1 -0
- package/dist/components/Icon/index.js +1 -0
- package/dist/components/Icon/style.css +10 -0
- package/dist/components/ImageCropper/index.cjs +2 -0
- package/dist/components/ImageCropper/index.cjs.map +1 -0
- package/dist/components/ImageCropper/index.d.cts +66 -0
- package/dist/components/ImageCropper/index.d.cts.map +1 -0
- package/dist/components/ImageCropper/index.d.ts +66 -0
- package/dist/components/ImageCropper/index.d.ts.map +1 -0
- package/dist/components/ImageCropper/index.js +263 -0
- package/dist/components/ImageCropper/index.js.map +1 -0
- package/dist/components/ImageCropper/style.css +160 -0
- package/dist/components/Menu/index.cjs +2 -0
- package/dist/components/Menu/index.cjs.map +1 -0
- package/dist/components/Menu/index.d.cts +35 -0
- package/dist/components/Menu/index.d.cts.map +1 -0
- package/dist/components/Menu/index.d.ts +35 -0
- package/dist/components/Menu/index.d.ts.map +1 -0
- package/dist/components/Menu/index.js +110 -0
- package/dist/components/Menu/index.js.map +1 -0
- package/dist/components/Menu/style.css +87 -0
- package/dist/components/Modal/index.cjs +2 -0
- package/dist/components/Modal/index.cjs.map +1 -0
- package/dist/components/Modal/index.d.cts +19 -0
- package/dist/components/Modal/index.d.cts.map +1 -0
- package/dist/components/Modal/index.d.ts +19 -0
- package/dist/components/Modal/index.d.ts.map +1 -0
- package/dist/components/Modal/index.js +84 -0
- package/dist/components/Modal/index.js.map +1 -0
- package/dist/components/Modal/style.css +106 -0
- package/dist/components/NumberField/index.cjs +2 -0
- package/dist/components/NumberField/index.cjs.map +1 -0
- package/dist/components/NumberField/index.d.cts +50 -0
- package/dist/components/NumberField/index.d.cts.map +1 -0
- package/dist/components/NumberField/index.d.ts +50 -0
- package/dist/components/NumberField/index.d.ts.map +1 -0
- package/dist/components/NumberField/index.js +124 -0
- package/dist/components/NumberField/index.js.map +1 -0
- package/dist/components/NumberField/style.css +85 -0
- package/dist/components/Popover/index.cjs +2 -0
- package/dist/components/Popover/index.cjs.map +1 -0
- package/dist/components/Popover/index.d.cts +28 -0
- package/dist/components/Popover/index.d.cts.map +1 -0
- package/dist/components/Popover/index.d.ts +28 -0
- package/dist/components/Popover/index.d.ts.map +1 -0
- package/dist/components/Popover/index.js +52 -0
- package/dist/components/Popover/index.js.map +1 -0
- package/dist/components/Popover/style.css +23 -0
- package/dist/components/RichTextEditor/document.d.cts +10 -0
- package/dist/components/RichTextEditor/document.d.cts.map +1 -0
- package/dist/components/RichTextEditor/document.d.ts +10 -0
- package/dist/components/RichTextEditor/document.d.ts.map +1 -0
- package/dist/components/RichTextEditor/index.cjs +1 -0
- package/dist/components/RichTextEditor/index.d.cts +38 -0
- package/dist/components/RichTextEditor/index.d.cts.map +1 -0
- package/dist/components/RichTextEditor/index.d.ts +38 -0
- package/dist/components/RichTextEditor/index.d.ts.map +1 -0
- package/dist/components/RichTextEditor/index.js +1 -0
- package/dist/components/RichTextEditor/style.css +136 -0
- package/dist/components/SearchField/index.cjs +2 -0
- package/dist/components/SearchField/index.cjs.map +1 -0
- package/dist/components/SearchField/index.d.cts +11 -0
- package/dist/components/SearchField/index.d.cts.map +1 -0
- package/dist/components/SearchField/index.d.ts +11 -0
- package/dist/components/SearchField/index.d.ts.map +1 -0
- package/dist/components/SearchField/index.js +49 -0
- package/dist/components/SearchField/index.js.map +1 -0
- package/dist/components/SearchField/style.css +27 -0
- package/dist/components/Select/index.cjs +2 -0
- package/dist/components/Select/index.cjs.map +1 -0
- package/dist/components/Select/index.d.cts +26 -0
- package/dist/components/Select/index.d.cts.map +1 -0
- package/dist/components/Select/index.d.ts +26 -0
- package/dist/components/Select/index.d.ts.map +1 -0
- package/dist/components/Select/index.js +129 -0
- package/dist/components/Select/index.js.map +1 -0
- package/dist/components/Select/style.css +88 -0
- package/dist/components/SelectionCard/index.cjs +2 -0
- package/dist/components/SelectionCard/index.cjs.map +1 -0
- package/dist/components/SelectionCard/index.d.cts +32 -0
- package/dist/components/SelectionCard/index.d.cts.map +1 -0
- package/dist/components/SelectionCard/index.d.ts +32 -0
- package/dist/components/SelectionCard/index.d.ts.map +1 -0
- package/dist/components/SelectionCard/index.js +71 -0
- package/dist/components/SelectionCard/index.js.map +1 -0
- package/dist/components/SelectionCard/style.css +133 -0
- package/dist/components/SideNav/index.cjs +2 -0
- package/dist/components/SideNav/index.cjs.map +1 -0
- package/dist/components/SideNav/index.d.cts +58 -0
- package/dist/components/SideNav/index.d.cts.map +1 -0
- package/dist/components/SideNav/index.d.ts +58 -0
- package/dist/components/SideNav/index.d.ts.map +1 -0
- package/dist/components/SideNav/index.js +113 -0
- package/dist/components/SideNav/index.js.map +1 -0
- package/dist/components/SideNav/style.css +184 -0
- package/dist/components/Skeleton/index.cjs +2 -0
- package/dist/components/Skeleton/index.cjs.map +1 -0
- package/dist/components/Skeleton/index.d.cts +21 -0
- package/dist/components/Skeleton/index.d.cts.map +1 -0
- package/dist/components/Skeleton/index.d.ts +21 -0
- package/dist/components/Skeleton/index.d.ts.map +1 -0
- package/dist/components/Skeleton/index.js +31 -0
- package/dist/components/Skeleton/index.js.map +1 -0
- package/dist/components/Skeleton/style.css +55 -0
- package/dist/components/Slider/index.cjs +2 -0
- package/dist/components/Slider/index.cjs.map +1 -0
- package/dist/components/Slider/index.d.cts +40 -0
- package/dist/components/Slider/index.d.cts.map +1 -0
- package/dist/components/Slider/index.d.ts +40 -0
- package/dist/components/Slider/index.d.ts.map +1 -0
- package/dist/components/Slider/index.js +117 -0
- package/dist/components/Slider/index.js.map +1 -0
- package/dist/components/Slider/style.css +156 -0
- package/dist/components/SortableList/index.cjs +2 -0
- package/dist/components/SortableList/index.cjs.map +1 -0
- package/dist/components/SortableList/index.d.cts +27 -0
- package/dist/components/SortableList/index.d.cts.map +1 -0
- package/dist/components/SortableList/index.d.ts +27 -0
- package/dist/components/SortableList/index.d.ts.map +1 -0
- package/dist/components/SortableList/index.js +85 -0
- package/dist/components/SortableList/index.js.map +1 -0
- package/dist/components/SortableList/style.css +71 -0
- package/dist/components/Stepper/index.cjs +2 -0
- package/dist/components/Stepper/index.cjs.map +1 -0
- package/dist/components/Stepper/index.d.cts +32 -0
- package/dist/components/Stepper/index.d.cts.map +1 -0
- package/dist/components/Stepper/index.d.ts +32 -0
- package/dist/components/Stepper/index.d.ts.map +1 -0
- package/dist/components/Stepper/index.js +69 -0
- package/dist/components/Stepper/index.js.map +1 -0
- package/dist/components/Stepper/style.css +154 -0
- package/dist/components/SubNav/index.cjs +2 -0
- package/dist/components/SubNav/index.cjs.map +1 -0
- package/dist/components/SubNav/index.d.cts +31 -0
- package/dist/components/SubNav/index.d.cts.map +1 -0
- package/dist/components/SubNav/index.d.ts +31 -0
- package/dist/components/SubNav/index.d.ts.map +1 -0
- package/dist/components/SubNav/index.js +62 -0
- package/dist/components/SubNav/index.js.map +1 -0
- package/dist/components/SubNav/style.css +86 -0
- package/dist/components/Switch/index.cjs +2 -0
- package/dist/components/Switch/index.cjs.map +1 -0
- package/dist/components/Switch/index.d.cts +12 -0
- package/dist/components/Switch/index.d.cts.map +1 -0
- package/dist/components/Switch/index.d.ts +12 -0
- package/dist/components/Switch/index.d.ts.map +1 -0
- package/dist/components/Switch/index.js +37 -0
- package/dist/components/Switch/index.js.map +1 -0
- package/dist/components/Switch/style.css +65 -0
- package/dist/components/Table/index.cjs +2 -0
- package/dist/components/Table/index.cjs.map +1 -0
- package/dist/components/Table/index.d.cts +54 -0
- package/dist/components/Table/index.d.cts.map +1 -0
- package/dist/components/Table/index.d.ts +54 -0
- package/dist/components/Table/index.d.ts.map +1 -0
- package/dist/components/Table/index.js +102 -0
- package/dist/components/Table/index.js.map +1 -0
- package/dist/components/Table/style.css +122 -0
- package/dist/components/TagsInput/index.cjs +2 -0
- package/dist/components/TagsInput/index.cjs.map +1 -0
- package/dist/components/TagsInput/index.d.cts +22 -0
- package/dist/components/TagsInput/index.d.cts.map +1 -0
- package/dist/components/TagsInput/index.d.ts +22 -0
- package/dist/components/TagsInput/index.d.ts.map +1 -0
- package/dist/components/TagsInput/index.js +60 -0
- package/dist/components/TagsInput/index.js.map +1 -0
- package/dist/components/TagsInput/style.css +83 -0
- package/dist/components/TextField/index.cjs +2 -0
- package/dist/components/TextField/index.cjs.map +1 -0
- package/dist/components/TextField/index.d.cts +11 -0
- package/dist/components/TextField/index.d.cts.map +1 -0
- package/dist/components/TextField/index.d.ts +11 -0
- package/dist/components/TextField/index.d.ts.map +1 -0
- package/dist/components/TextField/index.js +29 -0
- package/dist/components/TextField/index.js.map +1 -0
- package/dist/components/TextField/style.css +1 -0
- package/dist/components/Time/index.cjs +2 -0
- package/dist/components/Time/index.cjs.map +1 -0
- package/dist/components/Time/index.d.cts +35 -0
- package/dist/components/Time/index.d.cts.map +1 -0
- package/dist/components/Time/index.d.ts +35 -0
- package/dist/components/Time/index.d.ts.map +1 -0
- package/dist/components/Time/index.js +98 -0
- package/dist/components/Time/index.js.map +1 -0
- package/dist/components/Time/style.css +30 -0
- package/dist/components/Toast/index.cjs +2 -0
- package/dist/components/Toast/index.cjs.map +1 -0
- package/dist/components/Toast/index.d.cts +30 -0
- package/dist/components/Toast/index.d.cts.map +1 -0
- package/dist/components/Toast/index.d.ts +30 -0
- package/dist/components/Toast/index.d.ts.map +1 -0
- package/dist/components/Toast/index.js +96 -0
- package/dist/components/Toast/index.js.map +1 -0
- package/dist/components/Toast/style.css +80 -0
- package/dist/components/TopNav/index.cjs +2 -0
- package/dist/components/TopNav/index.cjs.map +1 -0
- package/dist/components/TopNav/index.d.cts +28 -0
- package/dist/components/TopNav/index.d.cts.map +1 -0
- package/dist/components/TopNav/index.d.ts +28 -0
- package/dist/components/TopNav/index.d.ts.map +1 -0
- package/dist/components/TopNav/index.js +45 -0
- package/dist/components/TopNav/index.js.map +1 -0
- package/dist/components/TopNav/style.css +80 -0
- package/dist/index.cjs +1 -0
- package/dist/index.d.cts +79 -0
- package/dist/index.d.cts.map +1 -0
- package/dist/index.d.ts +79 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +39 -0
- package/dist/reset.css +15 -0
- package/dist/reset.css.d.ts +2 -0
- package/dist/styles.css +40 -0
- package/dist/styles.css.d.ts +2 -0
- package/dist/tokens.css +457 -0
- package/dist/tokens.css.d.ts +2 -0
- package/package.json +156 -4
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { type InputHTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
import type { FieldSize } from "../Field/index.cjs";
|
|
3
|
+
export interface NumberFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "value" | "defaultValue" | "onChange" | "prefix"> {
|
|
4
|
+
size?: FieldSize;
|
|
5
|
+
value?: number | "";
|
|
6
|
+
defaultValue?: number | "";
|
|
7
|
+
onValueChange?: (value: number | "") => void;
|
|
8
|
+
min?: number;
|
|
9
|
+
max?: number;
|
|
10
|
+
step?: number | "any";
|
|
11
|
+
/** Rendered inside the field, before the number — "£", "$", a glyph. */
|
|
12
|
+
prefix?: ReactNode;
|
|
13
|
+
/** Rendered inside the field, after the number — "kg", "%", "px". */
|
|
14
|
+
suffix?: ReactNode;
|
|
15
|
+
isDisabled?: boolean;
|
|
16
|
+
isInvalid?: boolean;
|
|
17
|
+
/** Hide the − / + steppers and keep typing only. */
|
|
18
|
+
hasSteppers?: boolean;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* A quantity, bounded by `min` and `max`. Steppers move by `step` and stop at
|
|
22
|
+
* the bounds; typing is never blocked, an out-of-range value reads invalid.
|
|
23
|
+
*/
|
|
24
|
+
export declare const NumberField: import("react").ForwardRefExoticComponent<NumberFieldProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
25
|
+
export interface NumberRangeValue {
|
|
26
|
+
min: number | "";
|
|
27
|
+
max: number | "";
|
|
28
|
+
}
|
|
29
|
+
export interface NumberRangeFieldProps {
|
|
30
|
+
value?: NumberRangeValue;
|
|
31
|
+
defaultValue?: NumberRangeValue;
|
|
32
|
+
onValueChange?: (value: NumberRangeValue) => void;
|
|
33
|
+
size?: FieldSize;
|
|
34
|
+
/** Hard bounds both ends are clamped to. */
|
|
35
|
+
min?: number;
|
|
36
|
+
max?: number;
|
|
37
|
+
step?: number;
|
|
38
|
+
/** Rendered inside both fields, before the number. */
|
|
39
|
+
prefix?: ReactNode;
|
|
40
|
+
suffix?: ReactNode;
|
|
41
|
+
isDisabled?: boolean;
|
|
42
|
+
minLabel?: string;
|
|
43
|
+
maxLabel?: string;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* A lower and an upper bound, typed. The pair reads invalid when the minimum
|
|
47
|
+
* passes the maximum — neither field is rewritten behind the user.
|
|
48
|
+
*/
|
|
49
|
+
export declare function NumberRangeField({ value, defaultValue, onValueChange, size, min, max, step, prefix, suffix, isDisabled, minLabel, maxLabel, }: NumberRangeFieldProps): import("react").JSX.Element;
|
|
50
|
+
//# sourceMappingURL=index.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/NumberField/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,oBAAoB,CAAC;AAC5B,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,cAAc,GAAG,UAAU,GAAG,QAAQ,CAAC;IACvH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,EAAE,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,EAAE,KAAK,IAAI,CAAC;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IACtB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,qEAAqE;IACrE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oDAAoD;IACpD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAGD;;;GAGG;AACH,eAAO,MAAM,WAAW,+GAmGtB,CAAC;AAEH,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,GAAG,EAAE,CAAC;IACjB,GAAG,EAAE,MAAM,GAAG,EAAE,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAClD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sDAAsD;IACtD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,YAAmC,EACnC,aAAa,EACb,IAAW,EACX,GAAG,EACH,GAAG,EACH,IAAQ,EACR,MAAM,EACN,MAAM,EACN,UAAkB,EAClB,QAAoB,EACpB,QAAoB,GACrB,EAAE,qBAAqB,+BA4CvB"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { type InputHTMLAttributes, type ReactNode } from "react";
|
|
2
|
+
import type { FieldSize } from "../Field/index.js";
|
|
3
|
+
export interface NumberFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type" | "value" | "defaultValue" | "onChange" | "prefix"> {
|
|
4
|
+
size?: FieldSize;
|
|
5
|
+
value?: number | "";
|
|
6
|
+
defaultValue?: number | "";
|
|
7
|
+
onValueChange?: (value: number | "") => void;
|
|
8
|
+
min?: number;
|
|
9
|
+
max?: number;
|
|
10
|
+
step?: number | "any";
|
|
11
|
+
/** Rendered inside the field, before the number — "£", "$", a glyph. */
|
|
12
|
+
prefix?: ReactNode;
|
|
13
|
+
/** Rendered inside the field, after the number — "kg", "%", "px". */
|
|
14
|
+
suffix?: ReactNode;
|
|
15
|
+
isDisabled?: boolean;
|
|
16
|
+
isInvalid?: boolean;
|
|
17
|
+
/** Hide the − / + steppers and keep typing only. */
|
|
18
|
+
hasSteppers?: boolean;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* A quantity, bounded by `min` and `max`. Steppers move by `step` and stop at
|
|
22
|
+
* the bounds; typing is never blocked, an out-of-range value reads invalid.
|
|
23
|
+
*/
|
|
24
|
+
export declare const NumberField: import("react").ForwardRefExoticComponent<NumberFieldProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
25
|
+
export interface NumberRangeValue {
|
|
26
|
+
min: number | "";
|
|
27
|
+
max: number | "";
|
|
28
|
+
}
|
|
29
|
+
export interface NumberRangeFieldProps {
|
|
30
|
+
value?: NumberRangeValue;
|
|
31
|
+
defaultValue?: NumberRangeValue;
|
|
32
|
+
onValueChange?: (value: NumberRangeValue) => void;
|
|
33
|
+
size?: FieldSize;
|
|
34
|
+
/** Hard bounds both ends are clamped to. */
|
|
35
|
+
min?: number;
|
|
36
|
+
max?: number;
|
|
37
|
+
step?: number;
|
|
38
|
+
/** Rendered inside both fields, before the number. */
|
|
39
|
+
prefix?: ReactNode;
|
|
40
|
+
suffix?: ReactNode;
|
|
41
|
+
isDisabled?: boolean;
|
|
42
|
+
minLabel?: string;
|
|
43
|
+
maxLabel?: string;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* A lower and an upper bound, typed. The pair reads invalid when the minimum
|
|
47
|
+
* passes the maximum — neither field is rewritten behind the user.
|
|
48
|
+
*/
|
|
49
|
+
export declare function NumberRangeField({ value, defaultValue, onValueChange, size, min, max, step, prefix, suffix, isDisabled, minLabel, maxLabel, }: NumberRangeFieldProps): import("react").JSX.Element;
|
|
50
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/NumberField/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,oBAAoB,CAAC;AAC5B,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,cAAc,GAAG,UAAU,GAAG,QAAQ,CAAC;IACvH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,EAAE,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,EAAE,KAAK,IAAI,CAAC;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IACtB,wEAAwE;IACxE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,qEAAqE;IACrE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oDAAoD;IACpD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAGD;;;GAGG;AACH,eAAO,MAAM,WAAW,+GAmGtB,CAAC;AAEH,MAAM,WAAW,gBAAgB;IAC/B,GAAG,EAAE,MAAM,GAAG,EAAE,CAAC;IACjB,GAAG,EAAE,MAAM,GAAG,EAAE,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAClD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sDAAsD;IACtD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,YAAmC,EACnC,aAAa,EACb,IAAW,EACX,GAAG,EACH,GAAG,EACH,IAAQ,EACR,MAAM,EACN,MAAM,EACN,UAAkB,EAClB,QAAoB,EACpB,QAAoB,GACrB,EAAE,qBAAqB,+BA4CvB"}
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
import { t as e } from "../../chunks/Icon-CGY1FNXT.js";
|
|
2
|
+
/* empty css */
|
|
3
|
+
import { FieldAffix as t } from "../FieldAffix/index.js";
|
|
4
|
+
import { forwardRef as n, useCallback as r, useRef as i, useState as a } from "react";
|
|
5
|
+
import { jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
6
|
+
//#region src/components/NumberField/index.tsx
|
|
7
|
+
function c(...e) {
|
|
8
|
+
return e.filter(Boolean).join(" ");
|
|
9
|
+
}
|
|
10
|
+
var l = n(function({ size: n = "md", value: l, defaultValue: u = "", onValueChange: d, min: f, max: p, step: m = 1, prefix: h, suffix: g, isDisabled: _ = !1, isInvalid: v = !1, hasSteppers: y = !0, className: b, disabled: x, "aria-invalid": S, ...C }, w) {
|
|
11
|
+
let [T, E] = a(u), D = l ?? T, O = i(null), k = r((e) => {
|
|
12
|
+
l === void 0 && E(e), d?.(e);
|
|
13
|
+
}, [d, l]), A = (e) => {
|
|
14
|
+
let t = (D === "" ? f ?? 0 : D) + e * (m === "any" ? 1 : m);
|
|
15
|
+
f !== void 0 && (t = Math.max(f, t)), p !== void 0 && (t = Math.min(p, t)), t = Number(t.toFixed(10)), k(t), O.current?.focus();
|
|
16
|
+
}, j = D !== "" && (f !== void 0 && D < f || p !== void 0 && D > p);
|
|
17
|
+
return /* @__PURE__ */ s("div", {
|
|
18
|
+
className: c("ds-number", b),
|
|
19
|
+
"data-size": n,
|
|
20
|
+
children: [
|
|
21
|
+
y && /* @__PURE__ */ o("button", {
|
|
22
|
+
type: "button",
|
|
23
|
+
className: "ds-number__step",
|
|
24
|
+
"aria-label": "Decrease",
|
|
25
|
+
disabled: _ || x || f !== void 0 && D !== "" && D <= f,
|
|
26
|
+
onClick: () => A(-1),
|
|
27
|
+
children: /* @__PURE__ */ o(e, {
|
|
28
|
+
name: "minus",
|
|
29
|
+
size: 16
|
|
30
|
+
})
|
|
31
|
+
}),
|
|
32
|
+
/* @__PURE__ */ o(t, {
|
|
33
|
+
className: "ds-number__body",
|
|
34
|
+
lead: h,
|
|
35
|
+
trail: g,
|
|
36
|
+
children: /* @__PURE__ */ o("input", {
|
|
37
|
+
ref: (e) => {
|
|
38
|
+
O.current = e, typeof w == "function" ? w(e) : w && (w.current = e);
|
|
39
|
+
},
|
|
40
|
+
type: "number",
|
|
41
|
+
inputMode: "decimal",
|
|
42
|
+
value: D,
|
|
43
|
+
min: f,
|
|
44
|
+
max: p,
|
|
45
|
+
step: m,
|
|
46
|
+
disabled: _ || x,
|
|
47
|
+
"aria-invalid": v || j || S || void 0,
|
|
48
|
+
"data-size": n,
|
|
49
|
+
className: "ds-field-skin ds-number__input",
|
|
50
|
+
onChange: (e) => {
|
|
51
|
+
let t = e.target.value;
|
|
52
|
+
k(t === "" ? "" : Number(t));
|
|
53
|
+
},
|
|
54
|
+
...C
|
|
55
|
+
})
|
|
56
|
+
}),
|
|
57
|
+
y && /* @__PURE__ */ o("button", {
|
|
58
|
+
type: "button",
|
|
59
|
+
className: "ds-number__step",
|
|
60
|
+
"aria-label": "Increase",
|
|
61
|
+
disabled: _ || x || p !== void 0 && D !== "" && D >= p,
|
|
62
|
+
onClick: () => A(1),
|
|
63
|
+
children: /* @__PURE__ */ o(e, {
|
|
64
|
+
name: "plus",
|
|
65
|
+
size: 16
|
|
66
|
+
})
|
|
67
|
+
})
|
|
68
|
+
]
|
|
69
|
+
});
|
|
70
|
+
});
|
|
71
|
+
function u({ value: e, defaultValue: t = {
|
|
72
|
+
min: "",
|
|
73
|
+
max: ""
|
|
74
|
+
}, onValueChange: n, size: r = "md", min: i, max: c, step: u = 1, prefix: d, suffix: f, isDisabled: p = !1, minLabel: m = "Minimum", maxLabel: h = "Maximum" }) {
|
|
75
|
+
let [g, _] = a(t), v = e ?? g, y = (t) => {
|
|
76
|
+
e === void 0 && _(t), n?.(t);
|
|
77
|
+
}, b = v.min !== "" && v.max !== "" && v.min > v.max;
|
|
78
|
+
return /* @__PURE__ */ s("div", {
|
|
79
|
+
className: "ds-number-range",
|
|
80
|
+
children: [
|
|
81
|
+
/* @__PURE__ */ o(l, {
|
|
82
|
+
"aria-label": m,
|
|
83
|
+
size: r,
|
|
84
|
+
value: v.min,
|
|
85
|
+
min: i,
|
|
86
|
+
max: c,
|
|
87
|
+
step: u,
|
|
88
|
+
prefix: d,
|
|
89
|
+
suffix: f,
|
|
90
|
+
isDisabled: p,
|
|
91
|
+
isInvalid: b,
|
|
92
|
+
onValueChange: (e) => y({
|
|
93
|
+
...v,
|
|
94
|
+
min: e
|
|
95
|
+
})
|
|
96
|
+
}),
|
|
97
|
+
/* @__PURE__ */ o("span", {
|
|
98
|
+
className: "ds-number-range__dash",
|
|
99
|
+
"aria-hidden": "true",
|
|
100
|
+
children: "–"
|
|
101
|
+
}),
|
|
102
|
+
/* @__PURE__ */ o(l, {
|
|
103
|
+
"aria-label": h,
|
|
104
|
+
size: r,
|
|
105
|
+
value: v.max,
|
|
106
|
+
min: i,
|
|
107
|
+
max: c,
|
|
108
|
+
step: u,
|
|
109
|
+
prefix: d,
|
|
110
|
+
suffix: f,
|
|
111
|
+
isDisabled: p,
|
|
112
|
+
isInvalid: b,
|
|
113
|
+
onValueChange: (e) => y({
|
|
114
|
+
...v,
|
|
115
|
+
max: e
|
|
116
|
+
})
|
|
117
|
+
})
|
|
118
|
+
]
|
|
119
|
+
});
|
|
120
|
+
}
|
|
121
|
+
//#endregion
|
|
122
|
+
export { l as NumberField, u as NumberRangeField };
|
|
123
|
+
|
|
124
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["Icon","cx","parts","NumberField","forwardRef","ariaInvalid","rest","internal","setInternal","useState","defaultValue","current","value","inputRef","useRef","commit","useCallback","next","onValueChange","nudge","min","direction","step","max","outOfRange","className","size","hasSteppers","isDisabled","disabled","FieldAffix","prefix","suffix","node","ref","isInvalid","raw","event","NumberRangeField","crossed","minLabel","maxLabel"],"sources":["../../../src/components/NumberField/index.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useRef,\n useState,\n type InputHTMLAttributes,\n type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { FieldAffix } from \"../FieldAffix\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nexport interface NumberFieldProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, \"size\" | \"type\" | \"value\" | \"defaultValue\" | \"onChange\" | \"prefix\"> {\n size?: FieldSize;\n value?: number | \"\";\n defaultValue?: number | \"\";\n onValueChange?: (value: number | \"\") => void;\n min?: number;\n max?: number;\n step?: number | \"any\";\n /** Rendered inside the field, before the number — \"£\", \"$\", a glyph. */\n prefix?: ReactNode;\n /** Rendered inside the field, after the number — \"kg\", \"%\", \"px\". */\n suffix?: ReactNode;\n isDisabled?: boolean;\n isInvalid?: boolean;\n /** Hide the − / + steppers and keep typing only. */\n hasSteppers?: boolean;\n}\n\n\n/**\n * A quantity, bounded by `min` and `max`. Steppers move by `step` and stop at\n * the bounds; typing is never blocked, an out-of-range value reads invalid.\n */\nexport const NumberField = forwardRef<HTMLInputElement, NumberFieldProps>(function NumberField(\n {\n size = \"md\",\n value,\n defaultValue = \"\",\n onValueChange,\n min,\n max,\n step = 1,\n prefix,\n suffix,\n\n isDisabled = false,\n isInvalid = false,\n hasSteppers = true,\n className,\n disabled,\n \"aria-invalid\": ariaInvalid,\n ...rest\n },\n ref,\n) {\n const [internal, setInternal] = useState<number | \"\">(defaultValue);\n const current = value ?? internal;\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const commit = useCallback(\n (next: number | \"\") => {\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n },\n [onValueChange, value],\n );\n\n const nudge = (direction: 1 | -1) => {\n const base = current === \"\" ? (min ?? 0) : current;\n let next = base + direction * (step === \"any\" ? 1 : step);\n if (min !== undefined) next = Math.max(min, next);\n if (max !== undefined) next = Math.min(max, next);\n next = Number(next.toFixed(10));\n commit(next);\n inputRef.current?.focus();\n };\n\n const outOfRange =\n current !== \"\" &&\n ((min !== undefined && current < min) || (max !== undefined && current > max));\n\n return (\n <div className={cx(\"ds-number\", className)} data-size={size}>\n {hasSteppers && (\n <button\n type=\"button\"\n className=\"ds-number__step\"\n aria-label=\"Decrease\"\n disabled={isDisabled || disabled || (min !== undefined && current !== \"\" && current <= min)}\n onClick={() => nudge(-1)}\n >\n <Icon name=\"minus\" size={16} />\n </button>\n )}\n <FieldAffix className=\"ds-number__body\" lead={prefix} trail={suffix}>\n <input\n ref={(node) => {\n inputRef.current = node;\n if (typeof ref === \"function\") ref(node);\n else if (ref) ref.current = node;\n }}\n type=\"number\"\n inputMode=\"decimal\"\n value={current}\n min={min}\n max={max}\n step={step}\n disabled={isDisabled || disabled}\n aria-invalid={isInvalid || outOfRange || ariaInvalid || undefined}\n data-size={size}\n className=\"ds-field-skin ds-number__input\"\n onChange={(event) => {\n const raw = event.target.value;\n commit(raw === \"\" ? \"\" : Number(raw));\n }}\n {...rest}\n />\n </FieldAffix>\n\n {hasSteppers && (\n <button\n type=\"button\"\n className=\"ds-number__step\"\n aria-label=\"Increase\"\n disabled={isDisabled || disabled || (max !== undefined && current !== \"\" && current >= max)}\n onClick={() => nudge(1)}\n >\n <Icon name=\"plus\" size={16} />\n </button>\n )}\n </div>\n );\n});\n\nexport interface NumberRangeValue {\n min: number | \"\";\n max: number | \"\";\n}\n\nexport interface NumberRangeFieldProps {\n value?: NumberRangeValue;\n defaultValue?: NumberRangeValue;\n onValueChange?: (value: NumberRangeValue) => void;\n size?: FieldSize;\n /** Hard bounds both ends are clamped to. */\n min?: number;\n max?: number;\n step?: number;\n /** Rendered inside both fields, before the number. */\n prefix?: ReactNode;\n suffix?: ReactNode;\n isDisabled?: boolean;\n minLabel?: string;\n maxLabel?: string;\n}\n\n/**\n * A lower and an upper bound, typed. The pair reads invalid when the minimum\n * passes the maximum — neither field is rewritten behind the user.\n */\nexport function NumberRangeField({\n value,\n defaultValue = { min: \"\", max: \"\" },\n onValueChange,\n size = \"md\",\n min,\n max,\n step = 1,\n prefix,\n suffix,\n isDisabled = false,\n minLabel = \"Minimum\",\n maxLabel = \"Maximum\",\n}: NumberRangeFieldProps) {\n const [internal, setInternal] = useState<NumberRangeValue>(defaultValue);\n const current = value ?? internal;\n\n const commit = (next: NumberRangeValue) => {\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n };\n\n const crossed = current.min !== \"\" && current.max !== \"\" && current.min > current.max;\n\n return (\n <div className=\"ds-number-range\">\n <NumberField\n aria-label={minLabel}\n size={size}\n value={current.min}\n min={min}\n max={max}\n step={step}\n prefix={prefix}\n suffix={suffix}\n isDisabled={isDisabled}\n isInvalid={crossed}\n onValueChange={(next) => commit({ ...current, min: next })}\n />\n <span className=\"ds-number-range__dash\" aria-hidden=\"true\">\n –\n </span>\n <NumberField\n aria-label={maxLabel}\n size={size}\n value={current.max}\n min={min}\n max={max}\n step={step}\n prefix={prefix}\n suffix={suffix}\n isDisabled={isDisabled}\n isInvalid={crossed}\n onValueChange={(next) => commit({ ...current, max: next })}\n />\n </div>\n );\n}\n"],"mappings":";;;;;;AAcA,SAASC,EAAG,GAAGC,GAAuC;CACpD,OAAOA,EAAM,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACvC;AA0BA,IAAaC,IAAcC,EAA+C,SACxE,EACE,UAAO,MACP,UACA,kBAAe,IACf,kBACA,QACA,QACA,UAAO,GACP,WACA,WAEA,gBAAa,IACb,eAAY,IACZ,iBAAc,IACd,cACA,aACA,gBAAgBC,GAChB,GAAGC,KAEL,GACA;CACA,IAAM,CAACC,GAAUC,KAAeC,EAAsBC,CAAY,GAC5DC,IAAUC,KAASL,GACnBM,IAAWC,EAAgC,IAAI,GAE/CC,IAASC,GACZ,MAAsB;EAErB,AADIJ,MAAU,KAAA,KAAWJ,EAAYS,CAAI,GACzCC,IAAgBD,CAAI;CACtB,GACA,CAACC,GAAeN,CAAK,CACvB,GAEMO,KAAS,MAAsB;EAEnC,IAAIF,KADSN,MAAY,KAAMS,KAAO,IAAKT,KACzBU,KAAaC,MAAS,QAAQ,IAAIA;EAKpD,AAJIF,MAAQ,KAAA,MAAW,IAAO,KAAK,IAAIA,GAAKH,CAAI,IAC5CM,MAAQ,KAAA,MAAW,IAAO,KAAK,IAAIA,GAAKN,CAAI,IAChD,IAAO,OAAOA,EAAK,QAAQ,EAAE,CAAC,GAC9BF,EAAOE,CAAI,GACXJ,EAAS,SAAS,MAAM;CAC1B,GAEMW,IACJb,MAAY,OACVS,MAAQ,KAAA,KAAaT,IAAUS,KAASG,MAAQ,KAAA,KAAaZ,IAAUY;CAE3E,OACE,kBAAC,OAAD;EAAK,WAAWtB,EAAG,aAAawB,CAAS;EAAG,aAAWC;EAAvD,UAAA;GACGC,KACC,kBAAC,UAAD;IACE,MAAK;IACL,WAAU;IACV,cAAW;IACX,UAAUC,KAAcC,KAAaT,MAAQ,KAAA,KAAaT,MAAY,MAAMA,KAAWS;IACvF,eAAeD,EAAM,EAAE;IAEvB,UAAA,kBAACnB,GAAD;KAAM,MAAK;KAAQ,MAAM;IAAK,CAAA;GACxB,CAAA;GAEV,kBAAC8B,GAAD;IAAY,WAAU;IAAkB,MAAMC;IAAQ,OAAOC;IAC3D,UAAA,kBAAC,SAAD;KACE,MAAM,MAAS;MAEb,AADA,EAAS,UAAUC,GACf,OAAOC,KAAQ,aAAYA,EAAID,CAAI,IAC9BC,MAAK,EAAI,UAAUD;KAC9B;KACA,MAAK;KACL,WAAU;KACV,OAAOtB;KACF;KACA;KACC;KACN,UAAUiB,KAAcC;KACxB,gBAAcM,KAAaX,KAAcnB,KAAe,KAAA;KACxD,aAAWqB;KACX,WAAU;KACV,WAAW,MAAU;MACnB,IAAMU,IAAMC,EAAM,OAAO;MACzB,EAAOD,MAAQ,KAAK,KAAK,OAAOA,CAAG,CAAC;KACtC;KACA,GAAI9B;IACL,CAAA;GACS,CAAA;GAEXqB,KACC,kBAAC,UAAD;IACE,MAAK;IACL,WAAU;IACV,cAAW;IACX,UAAUC,KAAcC,KAAaN,MAAQ,KAAA,KAAaZ,MAAY,MAAMA,KAAWY;IACvF,eAAeJ,EAAM,CAAC;IAEtB,UAAA,kBAACnB,GAAD;KAAM,MAAK;KAAO,MAAM;IAAK,CAAA;GACvB,CAAA;EAEP;;AAET,CAAC;AA4BD,SAAgBsC,EAAiB,EAC/B,UACA,kBAAe;CAAE,KAAK;CAAI,KAAK;AAAG,GAClC,kBACA,UAAO,MACP,QACA,QACA,UAAO,GACP,WACA,WACA,gBAAa,IACb,cAAW,WACX,cAAW,aACa;CACxB,IAAM,CAAC/B,GAAUC,KAAeC,EAA2BC,CAAY,GACjEC,IAAUC,KAASL,GAEnBQ,KAAU,MAA2B;EAEzC,AADIH,MAAU,KAAA,KAAWJ,EAAYS,CAAI,GACzCC,IAAgBD,CAAI;CACtB,GAEMsB,IAAU5B,EAAQ,QAAQ,MAAMA,EAAQ,QAAQ,MAAMA,EAAQ,MAAMA,EAAQ;CAElF,OACE,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACE,kBAACR,GAAD;IACE,cAAYqC;IACN;IACN,OAAO7B,EAAQ;IACV;IACA;IACC;IACE;IACA;IACI;IACZ,WAAW4B;IACX,gBAAgB,MAASxB,EAAO;KAAE,GAAGJ;KAAS,KAAKM;IAAK,CAAC;GAC1D,CAAA;GACD,kBAAC,QAAD;IAAM,WAAU;IAAwB,eAAY;IAAO,UAAA;GAErD,CAAA;GACN,kBAACd,GAAD;IACE,cAAYsC;IACN;IACN,OAAO9B,EAAQ;IACV;IACA;IACC;IACE;IACA;IACI;IACZ,WAAW4B;IACX,gBAAgB,MAASxB,EAAO;KAAE,GAAGJ;KAAS,KAAKM;IAAK,CAAC;GAC1D,CAAA;EACE;;AAET"}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
@layer components {
|
|
2
|
+
.ds-number {
|
|
3
|
+
display: flex;
|
|
4
|
+
align-items: center;
|
|
5
|
+
gap: var(--space-2);
|
|
6
|
+
inline-size: 100%;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.ds-number__body {
|
|
10
|
+
flex: 1;
|
|
11
|
+
min-inline-size: 0;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.ds-number__input {
|
|
15
|
+
text-align: start;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.ds-number__input::-webkit-outer-spin-button,
|
|
19
|
+
.ds-number__input::-webkit-inner-spin-button {
|
|
20
|
+
appearance: none;
|
|
21
|
+
margin: 0;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.ds-number__input {
|
|
25
|
+
appearance: textfield;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.ds-number__body .ds-field-affix__lead,
|
|
29
|
+
.ds-number__body .ds-field-affix__trail {
|
|
30
|
+
font-family: var(--font-mono);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
.ds-number__step {
|
|
35
|
+
display: grid;
|
|
36
|
+
place-items: center;
|
|
37
|
+
flex: none;
|
|
38
|
+
inline-size: var(--field-height-md);
|
|
39
|
+
block-size: var(--field-height-md);
|
|
40
|
+
border: var(--control-border-width) solid var(--control-border-color);
|
|
41
|
+
border-radius: var(--field-radius);
|
|
42
|
+
background: var(--field-rest);
|
|
43
|
+
color: var(--color-text);
|
|
44
|
+
cursor: pointer;
|
|
45
|
+
transition: background-color var(--duration-fast) var(--ease-standard);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.ds-number[data-size="sm"] .ds-number__step {
|
|
49
|
+
inline-size: var(--field-height-sm);
|
|
50
|
+
block-size: var(--field-height-sm);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.ds-number[data-size="lg"] .ds-number__step {
|
|
54
|
+
inline-size: var(--field-height-lg);
|
|
55
|
+
block-size: var(--field-height-lg);
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.ds-number__step:hover:not(:disabled) {
|
|
59
|
+
background: var(--field-hover);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.ds-number__step:active:not(:disabled) {
|
|
63
|
+
background: var(--field-pressed);
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
.ds-number__step:focus-visible {
|
|
67
|
+
outline: var(--control-border-width) solid var(--color-focus);
|
|
68
|
+
outline-offset: 2px;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.ds-number__step:disabled {
|
|
72
|
+
opacity: 45%;
|
|
73
|
+
cursor: not-allowed;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.ds-number-range {
|
|
77
|
+
display: flex;
|
|
78
|
+
align-items: center;
|
|
79
|
+
gap: var(--space-3);
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.ds-number-range__dash {
|
|
83
|
+
color: var(--color-text-muted);
|
|
84
|
+
}
|
|
85
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("react/jsx-runtime"),n=require("react-dom");function r(...e){return e.filter(Boolean).join(` `)}var i=8;function a({anchorRef:a,anchorId:o,isOpen:s,align:c=`start`,matchAnchorWidth:l=!1,offset:u=4,className:d,children:f,role:p,id:m,panelRef:h,...g}){let _=(0,e.useRef)(null),v=(0,e.useId)(),y=m??v,b=(0,e.useCallback)(()=>{let e=a.current??(o?document.getElementById(o):null),t=_.current;if(!e||!t)return;let n=e.getBoundingClientRect();l&&(t.style.width=`${n.width}px`);let r=t.getBoundingClientRect(),s=document.documentElement.clientWidth,d=document.documentElement.clientHeight,f=d-n.bottom-u-i,p=n.top-u-i,m=f<r.height&&p>f,h=Math.max(120,m?p:f),g=m?Math.max(i,n.top-u-Math.min(r.height,h)):Math.min(n.bottom+u,d-i),v=c===`end`?n.right-r.width:n.left,y=Math.max(i,Math.min(v,s-r.width-i));t.style.left=`${Math.round(y)}px`,t.style.top=`${Math.round(g)}px`,t.style.setProperty(`--popover-max-block-size`,`${Math.round(h)}px`),t.style.visibility=`visible`},[c,o,a,l,u]);if((0,e.useEffect)(()=>{if(!s)return;let e=document.querySelector(`[data-popover-instance="${CSS.escape(v)}"]`);_.current=e,h&&(h.current=e),b();let t=()=>b();return window.addEventListener(`resize`,t),window.addEventListener(`scroll`,t,!0),()=>{window.removeEventListener(`resize`,t),window.removeEventListener(`scroll`,t,!0),_.current=null,h&&(h.current=null)}},[v,s,y,h,b]),!s||typeof document>`u`)return null;let x=(0,t.jsx)(`div`,{id:y,"data-popover-instance":v,role:p,className:r(`ds-popover`,d),...g,children:f});return(0,n.createPortal)(x,document.body)}exports.Popover=a;
|
|
2
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","names":["useRef","useId","useCallback","createPortal","react","react_jsx_runtime","react_dom","cx","parts","VIEWPORT_MARGIN","Popover","rest","floatingRef","generatedId","panelId","id","place","reference","anchorRef","anchorId","floating","anchor","matchAnchorWidth","panel","viewportWidth","viewportHeight","roomBelow","offset","roomAbove","placeAbove","availableHeight","top","preferredLeft","align","left","isOpen","panelRef","update","className"],"sources":["../../../src/components/Popover/index.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useRef, type ReactNode, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nconst VIEWPORT_MARGIN = 8;\n\nexport type PopoverAlign = \"start\" | \"end\";\n\nexport interface PopoverProps {\n /** The control the panel hangs off. */\n anchorRef: RefObject<HTMLElement | null>;\n /** Optional DOM id fallback for composed controls whose refs are consumed by a field wrapper. */\n anchorId?: string;\n isOpen: boolean;\n /** Which edge of the anchor the panel lines up with. Flips when it must. */\n align?: PopoverAlign;\n /** Match the anchor's width — for listboxes that read as one field. */\n matchAnchorWidth?: boolean;\n /** Gap between anchor and panel. */\n offset?: number;\n className?: string;\n children: ReactNode;\n role?: string;\n id?: string;\n \"aria-label\"?: string;\n panelRef?: RefObject<HTMLDivElement | null>;\n}\n\n/**\n * A panel anchored to a control. It is positioned against the viewport, so it\n * flips above the anchor when the space below runs out and slides inward\n * rather than being cut off at any edge.\n */\nexport function Popover({\n anchorRef,\n anchorId,\n isOpen,\n align = \"start\",\n matchAnchorWidth = false,\n offset = 4,\n className,\n children,\n role,\n id,\n panelRef,\n ...rest\n}: PopoverProps) {\n const floatingRef = useRef<HTMLDivElement | null>(null);\n const generatedId = useId();\n const panelId = id ?? generatedId;\n\n const place = useCallback(() => {\n const reference = anchorRef.current ?? (anchorId ? document.getElementById(anchorId) : null);\n const floating = floatingRef.current;\n if (!reference || !floating) return;\n\n const anchor = reference.getBoundingClientRect();\n if (matchAnchorWidth) floating.style.width = `${anchor.width}px`;\n const panel = floating.getBoundingClientRect();\n const viewportWidth = document.documentElement.clientWidth;\n const viewportHeight = document.documentElement.clientHeight;\n const roomBelow = viewportHeight - anchor.bottom - offset - VIEWPORT_MARGIN;\n const roomAbove = anchor.top - offset - VIEWPORT_MARGIN;\n const placeAbove = roomBelow < panel.height && roomAbove > roomBelow;\n const availableHeight = Math.max(120, placeAbove ? roomAbove : roomBelow);\n const top = placeAbove\n ? Math.max(VIEWPORT_MARGIN, anchor.top - offset - Math.min(panel.height, availableHeight))\n : Math.min(anchor.bottom + offset, viewportHeight - VIEWPORT_MARGIN);\n const preferredLeft = align === \"end\" ? anchor.right - panel.width : anchor.left;\n const left = Math.max(\n VIEWPORT_MARGIN,\n Math.min(preferredLeft, viewportWidth - panel.width - VIEWPORT_MARGIN),\n );\n\n floating.style.left = `${Math.round(left)}px`;\n floating.style.top = `${Math.round(top)}px`;\n floating.style.setProperty(\"--popover-max-block-size\", `${Math.round(availableHeight)}px`);\n floating.style.visibility = \"visible\";\n }, [align, anchorId, anchorRef, matchAnchorWidth, offset]);\n\n useEffect(() => {\n if (!isOpen) return;\n const floating = document.querySelector<HTMLDivElement>(\n `[data-popover-instance=\"${CSS.escape(generatedId)}\"]`,\n );\n floatingRef.current = floating;\n if (panelRef) panelRef.current = floating;\n place();\n const update = () => place();\n window.addEventListener(\"resize\", update);\n window.addEventListener(\"scroll\", update, true);\n return () => {\n window.removeEventListener(\"resize\", update);\n window.removeEventListener(\"scroll\", update, true);\n floatingRef.current = null;\n if (panelRef) panelRef.current = null;\n };\n }, [generatedId, isOpen, panelId, panelRef, place]);\n\n if (!isOpen || typeof document === \"undefined\") return null;\n\n const panel = (\n <div\n id={panelId}\n data-popover-instance={generatedId}\n role={role}\n className={cx(\"ds-popover\", className)}\n {...rest}\n >\n {children}\n </div>\n );\n\n return createPortal(panel, document.body);\n}\n"],"mappings":"A,gJAIA,SAASO,EAAG,GAAGC,EAAuC,CACpD,OAAOA,EAAM,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,CACvC,CAEA,IAAMC,EAAkB,EA6BxB,SAAgBC,EAAQ,CACtB,YACA,WACA,SACA,QAAQ,QACR,mBAAmB,GACnB,SAAS,EACT,YACA,WACA,OACA,KACA,WACA,GAAGC,GACY,CACf,IAAMC,GAAA,EAAcZ,EAAAA,OAAAA,CAA8B,IAAI,EAChDa,GAAA,EAAcZ,EAAAA,MAAAA,CAAM,EACpBa,EAAUC,GAAMF,EAEhBG,GAAA,EAAQd,EAAAA,YAAAA,KAAkB,CAC9B,IAAMe,EAAYC,EAAU,UAAYC,EAAW,SAAS,eAAeA,CAAQ,EAAI,MACjFC,EAAWR,EAAY,QAC7B,GAAI,CAACK,GAAa,CAACG,EAAU,OAE7B,IAAMC,EAASJ,EAAU,sBAAsB,EAC3CK,IAAkB,EAAS,MAAM,MAAQ,GAAGD,EAAO,MAAM,KAC7D,IAAME,EAAQH,EAAS,sBAAsB,EACvCI,EAAgB,SAAS,gBAAgB,YACzCC,EAAiB,SAAS,gBAAgB,aAC1CC,EAAYD,EAAiBJ,EAAO,OAASM,EAASlB,EACtDmB,EAAYP,EAAO,IAAMM,EAASlB,EAClCoB,EAAaH,EAAYH,EAAM,QAAUK,EAAYF,EACrDI,EAAkB,KAAK,IAAI,IAAKD,EAAaD,EAAYF,CAAS,EAClEK,EAAMF,EACR,KAAK,IAAIpB,EAAiBY,EAAO,IAAMM,EAAS,KAAK,IAAIJ,EAAM,OAAQO,CAAe,CAAC,EACvF,KAAK,IAAIT,EAAO,OAASM,EAAQF,EAAiBhB,CAAe,EAC/DuB,EAAgBC,IAAU,MAAQZ,EAAO,MAAQE,EAAM,MAAQF,EAAO,KACtEa,EAAO,KAAK,IAChBzB,EACA,KAAK,IAAIuB,EAAeR,EAAgBD,EAAM,MAAQd,CAAe,CACvE,EAEA,EAAS,MAAM,KAAO,GAAG,KAAK,MAAMyB,CAAI,EAAE,IAC1C,EAAS,MAAM,IAAM,GAAG,KAAK,MAAMH,CAAG,EAAE,IACxCX,EAAS,MAAM,YAAY,2BAA4B,GAAG,KAAK,MAAMU,CAAe,EAAE,GAAG,EACzF,EAAS,MAAM,WAAa,SAC9B,EAAG,CAACG,EAAOd,EAAUD,EAAWI,EAAkBK,CAAM,CAAC,EAqBzD,IAnBA,EAAAvB,EAAA,UAAA,KAAgB,CACd,GAAI,CAAC+B,EAAQ,OACb,IAAMf,EAAW,SAAS,cACxB,2BAA2B,IAAI,OAAOP,CAAW,EAAE,GACrD,EACA,EAAY,QAAUO,EAClBgB,IAAU,EAAS,QAAUhB,GACjCJ,EAAM,EACN,IAAMqB,MAAerB,EAAM,EAG3B,OAFA,OAAO,iBAAiB,SAAUqB,CAAM,EACxC,OAAO,iBAAiB,SAAUA,EAAQ,EAAI,MACjC,CACX,OAAO,oBAAoB,SAAUA,CAAM,EAC3C,OAAO,oBAAoB,SAAUA,EAAQ,EAAI,EACjD,EAAY,QAAU,KAClBD,IAAU,EAAS,QAAU,KACnC,CACF,EAAG,CAACvB,EAAasB,EAAQrB,EAASsB,EAAUpB,CAAK,CAAC,EAE9C,CAACmB,GAAU,OAAO,SAAa,IAAa,OAAO,KAEvD,IAAMZ,GACJ,EAAAlB,EAAA,IAAA,CAAC,MAAD,CACE,GAAIS,EACJ,wBAAuBD,EACjB,OACN,UAAWN,EAAG,aAAc+B,CAAS,EACrC,GAAI3B,EAEH,UACE,CAAA,EAGP,OAAA,EAAOR,EAAAA,aAAAA,CAAaoB,EAAO,SAAS,IAAI,CAC1C,C"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { type ReactNode, type RefObject } from "react";
|
|
2
|
+
export type PopoverAlign = "start" | "end";
|
|
3
|
+
export interface PopoverProps {
|
|
4
|
+
/** The control the panel hangs off. */
|
|
5
|
+
anchorRef: RefObject<HTMLElement | null>;
|
|
6
|
+
/** Optional DOM id fallback for composed controls whose refs are consumed by a field wrapper. */
|
|
7
|
+
anchorId?: string;
|
|
8
|
+
isOpen: boolean;
|
|
9
|
+
/** Which edge of the anchor the panel lines up with. Flips when it must. */
|
|
10
|
+
align?: PopoverAlign;
|
|
11
|
+
/** Match the anchor's width — for listboxes that read as one field. */
|
|
12
|
+
matchAnchorWidth?: boolean;
|
|
13
|
+
/** Gap between anchor and panel. */
|
|
14
|
+
offset?: number;
|
|
15
|
+
className?: string;
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
role?: string;
|
|
18
|
+
id?: string;
|
|
19
|
+
"aria-label"?: string;
|
|
20
|
+
panelRef?: RefObject<HTMLDivElement | null>;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* A panel anchored to a control. It is positioned against the viewport, so it
|
|
24
|
+
* flips above the anchor when the space below runs out and slides inward
|
|
25
|
+
* rather than being cut off at any edge.
|
|
26
|
+
*/
|
|
27
|
+
export declare function Popover({ anchorRef, anchorId, isOpen, align, matchAnchorWidth, offset, className, children, role, id, panelRef, ...rest }: PopoverProps): import("react").ReactPortal | null;
|
|
28
|
+
//# sourceMappingURL=index.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyC,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9F,OAAO,aAAa,CAAC;AAQrB,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,KAAK,CAAC;AAE3C,MAAM,WAAW,YAAY;IAC3B,uCAAuC;IACvC,SAAS,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACzC,iGAAiG;IACjG,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,uEAAuE;IACvE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CAC7C;AAED;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EACtB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,KAAe,EACf,gBAAwB,EACxB,MAAU,EACV,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,EAAE,EACF,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,YAAY,sCAoEd"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { type ReactNode, type RefObject } from "react";
|
|
2
|
+
export type PopoverAlign = "start" | "end";
|
|
3
|
+
export interface PopoverProps {
|
|
4
|
+
/** The control the panel hangs off. */
|
|
5
|
+
anchorRef: RefObject<HTMLElement | null>;
|
|
6
|
+
/** Optional DOM id fallback for composed controls whose refs are consumed by a field wrapper. */
|
|
7
|
+
anchorId?: string;
|
|
8
|
+
isOpen: boolean;
|
|
9
|
+
/** Which edge of the anchor the panel lines up with. Flips when it must. */
|
|
10
|
+
align?: PopoverAlign;
|
|
11
|
+
/** Match the anchor's width — for listboxes that read as one field. */
|
|
12
|
+
matchAnchorWidth?: boolean;
|
|
13
|
+
/** Gap between anchor and panel. */
|
|
14
|
+
offset?: number;
|
|
15
|
+
className?: string;
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
role?: string;
|
|
18
|
+
id?: string;
|
|
19
|
+
"aria-label"?: string;
|
|
20
|
+
panelRef?: RefObject<HTMLDivElement | null>;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* A panel anchored to a control. It is positioned against the viewport, so it
|
|
24
|
+
* flips above the anchor when the space below runs out and slides inward
|
|
25
|
+
* rather than being cut off at any edge.
|
|
26
|
+
*/
|
|
27
|
+
export declare function Popover({ anchorRef, anchorId, isOpen, align, matchAnchorWidth, offset, className, children, role, id, panelRef, ...rest }: PopoverProps): import("react").ReactPortal | null;
|
|
28
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyC,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9F,OAAO,aAAa,CAAC;AAQrB,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,KAAK,CAAC;AAE3C,MAAM,WAAW,YAAY;IAC3B,uCAAuC;IACvC,SAAS,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACzC,iGAAiG;IACjG,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,uEAAuE;IACvE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,oCAAoC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CAC7C;AAED;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EACtB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,KAAe,EACf,gBAAwB,EACxB,MAAU,EACV,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,EAAE,EACF,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,YAAY,sCAoEd"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { useCallback as e, useEffect as t, useId as n, useRef as r } from "react";
|
|
2
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
3
|
+
import { createPortal as a } from "react-dom";
|
|
4
|
+
//#region src/components/Popover/index.tsx
|
|
5
|
+
function o(...e) {
|
|
6
|
+
return e.filter(Boolean).join(" ");
|
|
7
|
+
}
|
|
8
|
+
var s = 8;
|
|
9
|
+
function c({ anchorRef: c, anchorId: l, isOpen: u, align: d = "start", matchAnchorWidth: f = !1, offset: p = 4, className: m, children: h, role: g, id: _, panelRef: v, ...y }) {
|
|
10
|
+
let b = r(null), x = n(), S = _ ?? x, C = e(() => {
|
|
11
|
+
let e = c.current ?? (l ? document.getElementById(l) : null), t = b.current;
|
|
12
|
+
if (!e || !t) return;
|
|
13
|
+
let n = e.getBoundingClientRect();
|
|
14
|
+
f && (t.style.width = `${n.width}px`);
|
|
15
|
+
let r = t.getBoundingClientRect(), i = document.documentElement.clientWidth, a = document.documentElement.clientHeight, o = a - n.bottom - p - s, u = n.top - p - s, m = o < r.height && u > o, h = Math.max(120, m ? u : o), g = m ? Math.max(s, n.top - p - Math.min(r.height, h)) : Math.min(n.bottom + p, a - s), _ = d === "end" ? n.right - r.width : n.left, v = Math.max(s, Math.min(_, i - r.width - s));
|
|
16
|
+
t.style.left = `${Math.round(v)}px`, t.style.top = `${Math.round(g)}px`, t.style.setProperty("--popover-max-block-size", `${Math.round(h)}px`), t.style.visibility = "visible";
|
|
17
|
+
}, [
|
|
18
|
+
d,
|
|
19
|
+
l,
|
|
20
|
+
c,
|
|
21
|
+
f,
|
|
22
|
+
p
|
|
23
|
+
]);
|
|
24
|
+
if (t(() => {
|
|
25
|
+
if (!u) return;
|
|
26
|
+
let e = document.querySelector(`[data-popover-instance="${CSS.escape(x)}"]`);
|
|
27
|
+
b.current = e, v && (v.current = e), C();
|
|
28
|
+
let t = () => C();
|
|
29
|
+
return window.addEventListener("resize", t), window.addEventListener("scroll", t, !0), () => {
|
|
30
|
+
window.removeEventListener("resize", t), window.removeEventListener("scroll", t, !0), b.current = null, v && (v.current = null);
|
|
31
|
+
};
|
|
32
|
+
}, [
|
|
33
|
+
x,
|
|
34
|
+
u,
|
|
35
|
+
S,
|
|
36
|
+
v,
|
|
37
|
+
C
|
|
38
|
+
]), !u || typeof document > "u") return null;
|
|
39
|
+
let w = /* @__PURE__ */ i("div", {
|
|
40
|
+
id: S,
|
|
41
|
+
"data-popover-instance": x,
|
|
42
|
+
role: g,
|
|
43
|
+
className: o("ds-popover", m),
|
|
44
|
+
...y,
|
|
45
|
+
children: h
|
|
46
|
+
});
|
|
47
|
+
return a(w, document.body);
|
|
48
|
+
}
|
|
49
|
+
//#endregion
|
|
50
|
+
export { c as Popover };
|
|
51
|
+
|
|
52
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["cx","parts","VIEWPORT_MARGIN","Popover","rest","floatingRef","useRef","generatedId","useId","panelId","id","place","useCallback","reference","anchorRef","anchorId","floating","anchor","matchAnchorWidth","panel","viewportWidth","viewportHeight","roomBelow","offset","roomAbove","placeAbove","availableHeight","top","preferredLeft","align","left","useEffect","isOpen","panelRef","update","className","createPortal"],"sources":["../../../src/components/Popover/index.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useRef, type ReactNode, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nconst VIEWPORT_MARGIN = 8;\n\nexport type PopoverAlign = \"start\" | \"end\";\n\nexport interface PopoverProps {\n /** The control the panel hangs off. */\n anchorRef: RefObject<HTMLElement | null>;\n /** Optional DOM id fallback for composed controls whose refs are consumed by a field wrapper. */\n anchorId?: string;\n isOpen: boolean;\n /** Which edge of the anchor the panel lines up with. Flips when it must. */\n align?: PopoverAlign;\n /** Match the anchor's width — for listboxes that read as one field. */\n matchAnchorWidth?: boolean;\n /** Gap between anchor and panel. */\n offset?: number;\n className?: string;\n children: ReactNode;\n role?: string;\n id?: string;\n \"aria-label\"?: string;\n panelRef?: RefObject<HTMLDivElement | null>;\n}\n\n/**\n * A panel anchored to a control. It is positioned against the viewport, so it\n * flips above the anchor when the space below runs out and slides inward\n * rather than being cut off at any edge.\n */\nexport function Popover({\n anchorRef,\n anchorId,\n isOpen,\n align = \"start\",\n matchAnchorWidth = false,\n offset = 4,\n className,\n children,\n role,\n id,\n panelRef,\n ...rest\n}: PopoverProps) {\n const floatingRef = useRef<HTMLDivElement | null>(null);\n const generatedId = useId();\n const panelId = id ?? generatedId;\n\n const place = useCallback(() => {\n const reference = anchorRef.current ?? (anchorId ? document.getElementById(anchorId) : null);\n const floating = floatingRef.current;\n if (!reference || !floating) return;\n\n const anchor = reference.getBoundingClientRect();\n if (matchAnchorWidth) floating.style.width = `${anchor.width}px`;\n const panel = floating.getBoundingClientRect();\n const viewportWidth = document.documentElement.clientWidth;\n const viewportHeight = document.documentElement.clientHeight;\n const roomBelow = viewportHeight - anchor.bottom - offset - VIEWPORT_MARGIN;\n const roomAbove = anchor.top - offset - VIEWPORT_MARGIN;\n const placeAbove = roomBelow < panel.height && roomAbove > roomBelow;\n const availableHeight = Math.max(120, placeAbove ? roomAbove : roomBelow);\n const top = placeAbove\n ? Math.max(VIEWPORT_MARGIN, anchor.top - offset - Math.min(panel.height, availableHeight))\n : Math.min(anchor.bottom + offset, viewportHeight - VIEWPORT_MARGIN);\n const preferredLeft = align === \"end\" ? anchor.right - panel.width : anchor.left;\n const left = Math.max(\n VIEWPORT_MARGIN,\n Math.min(preferredLeft, viewportWidth - panel.width - VIEWPORT_MARGIN),\n );\n\n floating.style.left = `${Math.round(left)}px`;\n floating.style.top = `${Math.round(top)}px`;\n floating.style.setProperty(\"--popover-max-block-size\", `${Math.round(availableHeight)}px`);\n floating.style.visibility = \"visible\";\n }, [align, anchorId, anchorRef, matchAnchorWidth, offset]);\n\n useEffect(() => {\n if (!isOpen) return;\n const floating = document.querySelector<HTMLDivElement>(\n `[data-popover-instance=\"${CSS.escape(generatedId)}\"]`,\n );\n floatingRef.current = floating;\n if (panelRef) panelRef.current = floating;\n place();\n const update = () => place();\n window.addEventListener(\"resize\", update);\n window.addEventListener(\"scroll\", update, true);\n return () => {\n window.removeEventListener(\"resize\", update);\n window.removeEventListener(\"scroll\", update, true);\n floatingRef.current = null;\n if (panelRef) panelRef.current = null;\n };\n }, [generatedId, isOpen, panelId, panelRef, place]);\n\n if (!isOpen || typeof document === \"undefined\") return null;\n\n const panel = (\n <div\n id={panelId}\n data-popover-instance={generatedId}\n role={role}\n className={cx(\"ds-popover\", className)}\n {...rest}\n >\n {children}\n </div>\n );\n\n return createPortal(panel, document.body);\n}\n"],"mappings":";;;;AAIA,SAASA,EAAG,GAAGC,GAAuC;CACpD,OAAOA,EAAM,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;AACvC;AAEA,IAAMC,IAAkB;AA6BxB,SAAgBC,EAAQ,EACtB,cACA,aACA,WACA,WAAQ,SACR,sBAAmB,IACnB,YAAS,GACT,cACA,aACA,SACA,OACA,aACA,GAAGC,KACY;CACf,IAAMC,IAAcC,EAA8B,IAAI,GAChDC,IAAcC,EAAM,GACpBC,IAAUC,KAAMH,GAEhBI,IAAQC,QAAkB;EAC9B,IAAMC,IAAYC,EAAU,YAAYC,IAAW,SAAS,eAAeA,CAAQ,IAAI,OACjFC,IAAWX,EAAY;EAC7B,IAAI,CAACQ,KAAa,CAACG,GAAU;EAE7B,IAAMC,IAASJ,EAAU,sBAAsB;EAC/C,AAAIK,MAAkB,EAAS,MAAM,QAAQ,GAAGD,EAAO,MAAM;EAC7D,IAAME,IAAQH,EAAS,sBAAsB,GACvCI,IAAgB,SAAS,gBAAgB,aACzCC,IAAiB,SAAS,gBAAgB,cAC1CC,IAAYD,IAAiBJ,EAAO,SAASM,IAASrB,GACtDsB,IAAYP,EAAO,MAAMM,IAASrB,GAClCuB,IAAaH,IAAYH,EAAM,UAAUK,IAAYF,GACrDI,IAAkB,KAAK,IAAI,KAAKD,IAAaD,IAAYF,CAAS,GAClEK,IAAMF,IACR,KAAK,IAAIvB,GAAiBe,EAAO,MAAMM,IAAS,KAAK,IAAIJ,EAAM,QAAQO,CAAe,CAAC,IACvF,KAAK,IAAIT,EAAO,SAASM,GAAQF,IAAiBnB,CAAe,GAC/D0B,IAAgBC,MAAU,QAAQZ,EAAO,QAAQE,EAAM,QAAQF,EAAO,MACtEa,IAAO,KAAK,IAChB5B,GACA,KAAK,IAAI0B,GAAeR,IAAgBD,EAAM,QAAQjB,CAAe,CACvE;EAKA,AAHA,EAAS,MAAM,OAAO,GAAG,KAAK,MAAM4B,CAAI,EAAE,KAC1C,EAAS,MAAM,MAAM,GAAG,KAAK,MAAMH,CAAG,EAAE,KACxCX,EAAS,MAAM,YAAY,4BAA4B,GAAG,KAAK,MAAMU,CAAe,EAAE,GAAG,GACzF,EAAS,MAAM,aAAa;CAC9B,GAAG;EAACG;EAAOd;EAAUD;EAAWI;EAAkBK;CAAM,CAAC;CAqBzD,IAnBAQ,QAAgB;EACd,IAAI,CAACC,GAAQ;EACb,IAAMhB,IAAW,SAAS,cACxB,2BAA2B,IAAI,OAAOT,CAAW,EAAE,GACrD;EAGA,AAFA,EAAY,UAAUS,GAClBiB,MAAU,EAAS,UAAUjB,IACjCL,EAAM;EACN,IAAMuB,UAAevB,EAAM;EAG3B,OAFA,OAAO,iBAAiB,UAAUuB,CAAM,GACxC,OAAO,iBAAiB,UAAUA,GAAQ,EAAI,SACjC;GAIX,AAHA,OAAO,oBAAoB,UAAUA,CAAM,GAC3C,OAAO,oBAAoB,UAAUA,GAAQ,EAAI,GACjD,EAAY,UAAU,MAClBD,MAAU,EAAS,UAAU;EACnC;CACF,GAAG;EAAC1B;EAAayB;EAAQvB;EAASwB;EAAUtB;CAAK,CAAC,GAE9C,CAACqB,KAAU,OAAO,WAAa,KAAa,OAAO;CAEvD,IAAMb,IACJ,kBAAC,OAAD;EACE,IAAIV;EACJ,yBAAuBF;EACjB;EACN,WAAWP,EAAG,cAAcmC,CAAS;EACrC,GAAI/B;EAEH;CACE,CAAA;CAGP,OAAOgC,EAAajB,GAAO,SAAS,IAAI;AAC1C"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
@layer components {
|
|
2
|
+
/* The one raised surface. Menus, listboxes and calendars all wear it, so a
|
|
3
|
+
* floating panel reads the same wherever it opens from. */
|
|
4
|
+
.ds-surface-raised {
|
|
5
|
+
--field-bg: var(--color-surface-raised);
|
|
6
|
+
|
|
7
|
+
background: var(--color-surface-raised);
|
|
8
|
+
border: var(--control-border-width) solid var(--control-border-color);
|
|
9
|
+
border-radius: var(--radius-md);
|
|
10
|
+
box-shadow: var(--shadow-lg);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.ds-popover {
|
|
14
|
+
position: fixed;
|
|
15
|
+
visibility: hidden;
|
|
16
|
+
z-index: 60;
|
|
17
|
+
inline-size: max-content;
|
|
18
|
+
max-inline-size: calc(100vw - var(--space-4));
|
|
19
|
+
max-block-size: var(--popover-max-block-size, none);
|
|
20
|
+
overflow: auto;
|
|
21
|
+
overscroll-behavior: contain;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type JSONContent } from "@tiptap/react";
|
|
2
|
+
export type RichTextDocument = JSONContent & {
|
|
3
|
+
type: "doc";
|
|
4
|
+
};
|
|
5
|
+
export declare const emptyDocument: RichTextDocument;
|
|
6
|
+
export declare function richTextExtensions(): (import("@tiptap/core").Extension<import("@tiptap/starter-kit").StarterKitOptions, any> | import("@tiptap/core").Mark<import("@tiptap/extension-link").LinkOptions, any>)[];
|
|
7
|
+
/** ProseMirror represents an empty writing surface with one empty paragraph. */
|
|
8
|
+
export declare function normalizeDocument(document: RichTextDocument): RichTextDocument;
|
|
9
|
+
export declare function documentError(value: unknown): string | undefined;
|
|
10
|
+
//# sourceMappingURL=document.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"document.d.cts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/document.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5D,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG;IAAE,IAAI,EAAE,KAAK,CAAA;CAAE,CAAC;AAE7D,eAAO,MAAM,aAAa,EAAE,gBAAoE,CAAC;AAEjG,wBAAgB,kBAAkB,gLAEjC;AAID,gFAAgF;AAChF,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,gBAAgB,GAAG,gBAAgB,CAE9E;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAyBhE"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type JSONContent } from "@tiptap/react";
|
|
2
|
+
export type RichTextDocument = JSONContent & {
|
|
3
|
+
type: "doc";
|
|
4
|
+
};
|
|
5
|
+
export declare const emptyDocument: RichTextDocument;
|
|
6
|
+
export declare function richTextExtensions(): (import("@tiptap/core").Extension<import("@tiptap/starter-kit").StarterKitOptions, any> | import("@tiptap/core").Mark<import("@tiptap/extension-link").LinkOptions, any>)[];
|
|
7
|
+
/** ProseMirror represents an empty writing surface with one empty paragraph. */
|
|
8
|
+
export declare function normalizeDocument(document: RichTextDocument): RichTextDocument;
|
|
9
|
+
export declare function documentError(value: unknown): string | undefined;
|
|
10
|
+
//# sourceMappingURL=document.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"document.d.ts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/document.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5D,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG;IAAE,IAAI,EAAE,KAAK,CAAA;CAAE,CAAC;AAE7D,eAAO,MAAM,aAAa,EAAE,gBAAoE,CAAC;AAEjG,wBAAgB,kBAAkB,gLAEjC;AAID,gFAAgF;AAChF,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,gBAAgB,GAAG,gBAAgB,CAE9E;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAyBhE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/RichTextEditor-tFkISOvq.cjs");exports.RichTextEditor=e.t;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { type AriaAttributes, type ReactNode } from "react";
|
|
2
|
+
import { type RichTextDocument } from "./document.cjs";
|
|
3
|
+
export type RichTextEditorSize = "sm" | "md" | "lg";
|
|
4
|
+
export type { RichTextDocument } from "./document.cjs";
|
|
5
|
+
interface RichTextEditorCommonProps {
|
|
6
|
+
placeholder?: string;
|
|
7
|
+
size?: RichTextEditorSize;
|
|
8
|
+
isDisabled?: boolean;
|
|
9
|
+
isInvalid?: boolean;
|
|
10
|
+
/** Accessible name for the editing surface. */
|
|
11
|
+
label?: string;
|
|
12
|
+
className?: string;
|
|
13
|
+
/** Extra controls appended to the toolbar, e.g. a word count. */
|
|
14
|
+
toolbarExtra?: ReactNode;
|
|
15
|
+
/** Applied to the editable surface. */
|
|
16
|
+
id?: string;
|
|
17
|
+
isRequired?: boolean;
|
|
18
|
+
"aria-labelledby"?: string;
|
|
19
|
+
"aria-describedby"?: string;
|
|
20
|
+
"aria-invalid"?: AriaAttributes["aria-invalid"];
|
|
21
|
+
}
|
|
22
|
+
export type RichTextEditorProps = RichTextEditorCommonProps & ({
|
|
23
|
+
format?: "html";
|
|
24
|
+
value?: string;
|
|
25
|
+
defaultValue?: string;
|
|
26
|
+
onChange?: (html: string) => void;
|
|
27
|
+
} | {
|
|
28
|
+
format: "json";
|
|
29
|
+
value?: RichTextDocument;
|
|
30
|
+
defaultValue?: RichTextDocument;
|
|
31
|
+
onChange?: (document: RichTextDocument) => void;
|
|
32
|
+
});
|
|
33
|
+
/**
|
|
34
|
+
* The editorial writing surface. Rich text plus links — the same field skin,
|
|
35
|
+
* radius and states as `TextField`, with the toolbar inside the frame.
|
|
36
|
+
*/
|
|
37
|
+
export declare const RichTextEditor: import("react").ForwardRefExoticComponent<RichTextEditorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
38
|
+
//# sourceMappingURL=index.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAM1H,OAAO,EAAuE,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AACxH,OAAO,oBAAoB,CAAC;AAC5B,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,YAAY,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAEnD,UAAU,yBAAyB;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iEAAiE;IACjE,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,uCAAuC;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,MAAM,MAAM,mBAAmB,GAAG,yBAAyB,GAAG,CAC1D;IAAE,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;CAAE,GAC7F;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,gBAAgB,CAAC;IAAC,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,KAAK,IAAI,CAAA;CAAE,CACjI,CAAC;AAgGF;;;GAGG;AACH,eAAO,MAAM,cAAc,gHAkJ1B,CAAC"}
|