@webiny/admin-ui 6.4.11 → 6.6.0-alpha.1

package/Checkbox/primitives/CheckboxPrimitive.d.ts

@@ -19,40 +19,45 @@ type CheckboxPrimitiveRendererProps = Omit<CheckboxPrimitiveProps, "onCheckedCha
     changeChecked: (checked: boolean) => void;
     disabled?: boolean;
 };
-declare const CheckboxPrimitiveRenderer: (({ label, id, hasLabel, indeterminate, changeChecked, checked, className, disabled, ...props }: CheckboxPrimitiveRendererProps) => React.JSX.Element) & {
-    original: ({ label, id, hasLabel, indeterminate, changeChecked, checked, className, disabled, ...props }: CheckboxPrimitiveRendererProps) => React.JSX.Element;
+declare const DecoratableCheckboxPrimitiveRenderer: ({ label, id, hasLabel, indeterminate, changeChecked, checked, className, disabled, ...props }: CheckboxPrimitiveRendererProps) => React.JSX.Element;
+declare const CheckboxPrimitiveRenderer: typeof DecoratableCheckboxPrimitiveRenderer & {
+    original: typeof DecoratableCheckboxPrimitiveRenderer;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, id, hasLabel, indeterminate, changeChecked, checked, className, disabled, ...props }: CheckboxPrimitiveRendererProps) => React.JSX.Element) & {
-        original: ({ label, id, hasLabel, indeterminate, changeChecked, checked, className, disabled, ...props }: CheckboxPrimitiveRendererProps) => React.JSX.Element;
+    original: typeof DecoratableCheckboxPrimitiveRenderer & {
+        original: typeof DecoratableCheckboxPrimitiveRenderer;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, id, hasLabel, indeterminate, changeChecked, checked, className, disabled, ...props }: CheckboxPrimitiveRendererProps) => React.JSX.Element) & {
-        original: ({ label, id, hasLabel, indeterminate, changeChecked, checked, className, disabled, ...props }: CheckboxPrimitiveRendererProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableCheckboxPrimitiveRenderer & {
+        original: typeof DecoratableCheckboxPrimitiveRenderer;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 };
-declare const CheckboxPrimitive: ((props: CheckboxPrimitiveProps) => React.JSX.Element | null) & {
-    original: (props: CheckboxPrimitiveProps) => React.JSX.Element | null;
+/**
+ * Checkbox
+ */
+declare const DecoratableCheckboxPrimitive: (props: CheckboxPrimitiveProps) => React.JSX.Element | null;
+declare const CheckboxPrimitive: typeof DecoratableCheckboxPrimitive & {
+    original: typeof DecoratableCheckboxPrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: CheckboxPrimitiveProps) => React.JSX.Element | null) & {
-        original: (props: CheckboxPrimitiveProps) => React.JSX.Element | null;
+    original: typeof DecoratableCheckboxPrimitive & {
+        original: typeof DecoratableCheckboxPrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: CheckboxPrimitiveProps) => React.JSX.Element | null) & {
-        original: (props: CheckboxPrimitiveProps) => React.JSX.Element | null;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableCheckboxPrimitive & {
+        original: typeof DecoratableCheckboxPrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/CheckboxGroup/CheckboxGroup.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 import type { CheckboxGroupPrimitiveProps } from "./primitives/CheckboxGroupPrimitive.js";
 import type { FormComponentProps } from "../FormComponent/index.js";
 type CheckboxGroupProps = CheckboxGroupPrimitiveProps & FormComponentProps;
-declare const CheckboxGroup: (({ label, description, note, required, disabled, hint, validation, ...props }: CheckboxGroupProps) => React.JSX.Element) & {
-    original: ({ label, description, note, required, disabled, hint, validation, ...props }: CheckboxGroupProps) => React.JSX.Element;
+declare const DecoratableCheckboxGroup: ({ label, description, note, required, disabled, hint, validation, ...props }: CheckboxGroupProps) => React.JSX.Element;
+declare const CheckboxGroup: typeof DecoratableCheckboxGroup & {
+    original: typeof DecoratableCheckboxGroup;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, description, note, required, disabled, hint, validation, ...props }: CheckboxGroupProps) => React.JSX.Element) & {
-        original: ({ label, description, note, required, disabled, hint, validation, ...props }: CheckboxGroupProps) => React.JSX.Element;
+    original: typeof DecoratableCheckboxGroup & {
+        original: typeof DecoratableCheckboxGroup;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, description, note, required, disabled, hint, validation, ...props }: CheckboxGroupProps) => React.JSX.Element) & {
-        original: ({ label, description, note, required, disabled, hint, validation, ...props }: CheckboxGroupProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableCheckboxGroup & {
+        original: typeof DecoratableCheckboxGroup;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/CheckboxGroup/primitives/CheckboxGroupPrimitive.d.ts

@@ -25,40 +25,48 @@ type CheckboxGroupPrimitiveRendererProps<TValue = any> = CheckboxGroupPrimitiveV
     changeChecked: (value: TValue) => void;
     disabled?: boolean;
 };
-declare const CheckboxGroupPrimitiveRenderer: (({ items, changeChecked, disabled }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element) & {
-    original: ({ items, changeChecked, disabled }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element;
+/**
+ * Checkbox Group Renderer
+ */
+declare const DecoratableCheckboxGroupPrimitiveRenderer: ({ items, changeChecked, disabled }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element;
+declare const CheckboxGroupPrimitiveRenderer: typeof DecoratableCheckboxGroupPrimitiveRenderer & {
+    original: typeof DecoratableCheckboxGroupPrimitiveRenderer;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ items, changeChecked, disabled }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element) & {
-        original: ({ items, changeChecked, disabled }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element;
+    original: typeof DecoratableCheckboxGroupPrimitiveRenderer & {
+        original: typeof DecoratableCheckboxGroupPrimitiveRenderer;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ items, changeChecked, disabled }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element) & {
-        original: ({ items, changeChecked, disabled }: CheckboxGroupPrimitiveRendererProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableCheckboxGroupPrimitiveRenderer & {
+        original: typeof DecoratableCheckboxGroupPrimitiveRenderer;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 };
-declare const CheckboxGroupPrimitive: ((props: CheckboxGroupPrimitiveProps) => React.JSX.Element) & {
-    original: (props: CheckboxGroupPrimitiveProps) => React.JSX.Element;
+/**
+ * Checkbox Group
+ */
+declare const DecoratableCheckboxGroupPrimitive: (props: CheckboxGroupPrimitiveProps) => React.JSX.Element;
+declare const CheckboxGroupPrimitive: typeof DecoratableCheckboxGroupPrimitive & {
+    original: typeof DecoratableCheckboxGroupPrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: CheckboxGroupPrimitiveProps) => React.JSX.Element) & {
-        original: (props: CheckboxGroupPrimitiveProps) => React.JSX.Element;
+    original: typeof DecoratableCheckboxGroupPrimitive & {
+        original: typeof DecoratableCheckboxGroupPrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: CheckboxGroupPrimitiveProps) => React.JSX.Element) & {
-        original: (props: CheckboxGroupPrimitiveProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableCheckboxGroupPrimitive & {
+        original: typeof DecoratableCheckboxGroupPrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/CodeEditor/CodeEditor.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 import type { CodeEditorPrimitiveProps } from "./CodeEditorPrimitive.js";
 import type { FormComponentProps } from "../FormComponent/index.js";
 type CodeEditorProps = CodeEditorPrimitiveProps & FormComponentProps;
-declare const CodeEditor: (({ label, description, note, hint, required, disabled, validation, ...props }: CodeEditorProps) => React.JSX.Element) & {
-    original: ({ label, description, note, hint, required, disabled, validation, ...props }: CodeEditorProps) => React.JSX.Element;
+declare const DecoratableCodeEditor: ({ label, description, note, hint, required, disabled, validation, ...props }: CodeEditorProps) => React.JSX.Element;
+declare const CodeEditor: typeof DecoratableCodeEditor & {
+    original: typeof DecoratableCodeEditor;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, description, note, hint, required, disabled, validation, ...props }: CodeEditorProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, ...props }: CodeEditorProps) => React.JSX.Element;
+    original: typeof DecoratableCodeEditor & {
+        original: typeof DecoratableCodeEditor;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, description, note, hint, required, disabled, validation, ...props }: CodeEditorProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, ...props }: CodeEditorProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableCodeEditor & {
+        original: typeof DecoratableCodeEditor;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/CodeEditor/CodeEditorPrimitive.d.ts

@@ -3,21 +3,22 @@ import type { EditorProps } from "@monaco-editor/react";
 interface CodeEditorPrimitiveProps extends Partial<EditorProps> {
     disabled?: boolean;
 }
-declare const CodeEditorPrimitive: (({ value, disabled, options: optionsInput, ...rest }: CodeEditorPrimitiveProps) => React.JSX.Element) & {
-    original: ({ value, disabled, options: optionsInput, ...rest }: CodeEditorPrimitiveProps) => React.JSX.Element;
+declare const DecoratableCodeEditorPrimitive: ({ value, disabled, options: optionsInput, ...rest }: CodeEditorPrimitiveProps) => React.JSX.Element;
+declare const CodeEditorPrimitive: typeof DecoratableCodeEditorPrimitive & {
+    original: typeof DecoratableCodeEditorPrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ value, disabled, options: optionsInput, ...rest }: CodeEditorPrimitiveProps) => React.JSX.Element) & {
-        original: ({ value, disabled, options: optionsInput, ...rest }: CodeEditorPrimitiveProps) => React.JSX.Element;
+    original: typeof DecoratableCodeEditorPrimitive & {
+        original: typeof DecoratableCodeEditorPrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<(({ value, disabled, options: optionsInput, ...rest }: CodeEditorPrimitiveProps) => React.JSX.Element) & {
-        original: ({ value, disabled, options: optionsInput, ...rest }: CodeEditorPrimitiveProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof DecoratableCodeEditorPrimitive & {
+        original: typeof DecoratableCodeEditorPrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/CodeEditor/CodeEditorPrimitive.js

@@ -6,7 +6,9 @@ const monacoOptions = {
     readOnly: true,
     minimap: {
         enabled: false
-    }
+    },
+    scrollBeyondLastLine: false,
+    wordWrap: "on"
 };
 const DecoratableCodeEditorPrimitive = ({ value, disabled, options: optionsInput, ...rest })=>{
     const options = useMemo(()=>({

package/CodeEditor/CodeEditorPrimitive.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor/CodeEditorPrimitive.js","sources":["../../src/CodeEditor/CodeEditorPrimitive.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport type { EditorProps } from \"@monaco-editor/react\";\nimport MonacoEditor from \"@monaco-editor/react\";\nimport type { editor } from \"monaco-editor\";\nimport { makeDecoratable } from \"~/utils.js\";\n\ninterface CodeEditorPrimitiveProps extends Partial<EditorProps> {\n    disabled?: boolean;\n}\n\nconst monacoOptions: editor.IEditorConstructionOptions = {\n    domReadOnly: true,\n    readOnly: true,\n    minimap: {\n        enabled: false\n    }\n};\n\nconst DecoratableCodeEditorPrimitive = ({\n    value,\n    disabled,\n    options: optionsInput,\n    ...rest\n}: CodeEditorPrimitiveProps) => {\n    const options = useMemo((): editor.IDiffEditorConstructionOptions => {\n        return {\n            ...monacoOptions,\n            ...optionsInput,\n            domReadOnly: disabled === undefined ? monacoOptions.domReadOnly : disabled,\n            readOnly: disabled === undefined ? monacoOptions.readOnly : disabled\n        };\n    }, [disabled]);\n    return (\n        <MonacoEditor\n            height={\"calc(100vh - 400px)\"}\n            {...rest}\n            language={rest.language ?? \"json\"}\n            defaultValue={value}\n            options={options}\n        />\n    );\n};\n\nconst CodeEditorPrimitive = makeDecoratable(\"CodeEditorPrimitive\", DecoratableCodeEditorPrimitive);\n\nexport { CodeEditorPrimitive, type CodeEditorPrimitiveProps };\n"],"names":["monacoOptions","DecoratableCodeEditorPrimitive","value","disabled","optionsInput","rest","options","useMemo","undefined","MonacoEditor","CodeEditorPrimitive","makeDecoratable"],"mappings":";;;AAUA,MAAMA,gBAAmD;IACrD,aAAa;IACb,UAAU;IACV,SAAS;QACL,SAAS;IACb;AACJ;AAEA,MAAMC,iCAAiC,CAAC,EACpCC,KAAK,EACLC,QAAQ,EACR,SAASC,YAAY,EACrB,GAAGC,MACoB;IACvB,MAAMC,UAAUC,QAAQ,IACb;YACH,GAAGP,aAAa;YAChB,GAAGI,YAAY;YACf,aAAaD,AAAaK,WAAbL,WAAyBH,cAAc,WAAW,GAAGG;YAClE,UAAUA,AAAaK,WAAbL,WAAyBH,cAAc,QAAQ,GAAGG;QAChE,IACD;QAACA;KAAS;IACb,OAAO,WAAP,GACI,oBAACM,sBAAYA;QACT,QAAQ;QACP,GAAGJ,IAAI;QACR,UAAUA,KAAK,QAAQ,IAAI;QAC3B,cAAcH;QACd,SAASI;;AAGrB;AAEA,MAAMI,sBAAsBC,gBAAgB,uBAAuBV"}
+{"version":3,"file":"CodeEditor/CodeEditorPrimitive.js","sources":["../../src/CodeEditor/CodeEditorPrimitive.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport type { EditorProps } from \"@monaco-editor/react\";\nimport MonacoEditor from \"@monaco-editor/react\";\nimport type { editor } from \"monaco-editor\";\nimport { makeDecoratable } from \"~/utils.js\";\n\ninterface CodeEditorPrimitiveProps extends Partial<EditorProps> {\n    disabled?: boolean;\n}\n\nconst monacoOptions: editor.IEditorConstructionOptions = {\n    domReadOnly: true,\n    readOnly: true,\n    minimap: {\n        enabled: false\n    },\n    scrollBeyondLastLine: false,\n    wordWrap: \"on\"\n};\n\nconst DecoratableCodeEditorPrimitive = ({\n    value,\n    disabled,\n    options: optionsInput,\n    ...rest\n}: CodeEditorPrimitiveProps) => {\n    const options = useMemo((): editor.IDiffEditorConstructionOptions => {\n        return {\n            ...monacoOptions,\n            ...optionsInput,\n            domReadOnly: disabled === undefined ? monacoOptions.domReadOnly : disabled,\n            readOnly: disabled === undefined ? monacoOptions.readOnly : disabled\n        };\n    }, [disabled]);\n    return (\n        <MonacoEditor\n            height={\"calc(100vh - 400px)\"}\n            {...rest}\n            language={rest.language ?? \"json\"}\n            defaultValue={value}\n            options={options}\n        />\n    );\n};\n\nconst CodeEditorPrimitive = makeDecoratable(\"CodeEditorPrimitive\", DecoratableCodeEditorPrimitive);\n\nexport { CodeEditorPrimitive, type CodeEditorPrimitiveProps };\n"],"names":["monacoOptions","DecoratableCodeEditorPrimitive","value","disabled","optionsInput","rest","options","useMemo","undefined","MonacoEditor","CodeEditorPrimitive","makeDecoratable"],"mappings":";;;AAUA,MAAMA,gBAAmD;IACrD,aAAa;IACb,UAAU;IACV,SAAS;QACL,SAAS;IACb;IACA,sBAAsB;IACtB,UAAU;AACd;AAEA,MAAMC,iCAAiC,CAAC,EACpCC,KAAK,EACLC,QAAQ,EACR,SAASC,YAAY,EACrB,GAAGC,MACoB;IACvB,MAAMC,UAAUC,QAAQ,IACb;YACH,GAAGP,aAAa;YAChB,GAAGI,YAAY;YACf,aAAaD,AAAaK,WAAbL,WAAyBH,cAAc,WAAW,GAAGG;YAClE,UAAUA,AAAaK,WAAbL,WAAyBH,cAAc,QAAQ,GAAGG;QAChE,IACD;QAACA;KAAS;IACb,OAAO,WAAP,GACI,oBAACM,sBAAYA;QACT,QAAQ;QACP,GAAGJ,IAAI;QACR,UAAUA,KAAK,QAAQ,IAAI;QAC3B,cAAcH;QACd,SAASI;;AAGrB;AAEA,MAAMI,sBAAsBC,gBAAgB,uBAAuBV"}

package/ColorPicker/ColorPicker.d.ts

@@ -2,21 +2,22 @@ import React from "react";
 import type { ColorPickerPrimitiveProps } from "./primitives/index.js";
 import type { FormComponentProps } from "../FormComponent/index.js";
 type ColorPickerProps = ColorPickerPrimitiveProps & FormComponentProps;
-declare const ColorPicker: (({ label, description, note, hint, required, disabled, validation, ...props }: ColorPickerProps) => React.JSX.Element) & {
-    original: ({ label, description, note, hint, required, disabled, validation, ...props }: ColorPickerProps) => React.JSX.Element;
+declare const DecoratableIconPicker: ({ label, description, note, hint, required, disabled, validation, ...props }: ColorPickerProps) => React.JSX.Element;
+declare const ColorPicker: typeof DecoratableIconPicker & {
+    original: typeof DecoratableIconPicker;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ label, description, note, hint, required, disabled, validation, ...props }: ColorPickerProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, ...props }: ColorPickerProps) => React.JSX.Element;
+    original: typeof DecoratableIconPicker & {
+        original: typeof DecoratableIconPicker;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ label, description, note, hint, required, disabled, validation, ...props }: ColorPickerProps) => React.JSX.Element) & {
-        original: ({ label, description, note, hint, required, disabled, validation, ...props }: ColorPickerProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableIconPicker & {
+        original: typeof DecoratableIconPicker;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/ColorPicker/primitives/ColorPickerPrimitive.d.ts

@@ -43,21 +43,22 @@ interface ColorPickerPrimitiveProps extends Omit<React.HTMLAttributes<HTMLDivEle
      */
     invalid?: InputPrimitiveProps["invalid"];
 }
-declare const ColorPickerPrimitive: (({ align, disabled, invalid, size, variant, value, onOpenChange, onChange, onChangeComplete, ...props }: ColorPickerPrimitiveProps) => React.JSX.Element) & {
-    original: ({ align, disabled, invalid, size, variant, value, onOpenChange, onChange, onChangeComplete, ...props }: ColorPickerPrimitiveProps) => React.JSX.Element;
+declare const DecoratableColorPickerPrimitive: ({ align, disabled, invalid, size, variant, value, onOpenChange, onChange, onChangeComplete, ...props }: ColorPickerPrimitiveProps) => React.JSX.Element;
+declare const ColorPickerPrimitive: typeof DecoratableColorPickerPrimitive & {
+    original: typeof DecoratableColorPickerPrimitive;
     originalName: string;
     displayName: string;
 } & {
-    original: (({ align, disabled, invalid, size, variant, value, onOpenChange, onChange, onChangeComplete, ...props }: ColorPickerPrimitiveProps) => React.JSX.Element) & {
-        original: ({ align, disabled, invalid, size, variant, value, onOpenChange, onChange, onChangeComplete, ...props }: ColorPickerPrimitiveProps) => React.JSX.Element;
+    original: typeof DecoratableColorPickerPrimitive & {
+        original: typeof DecoratableColorPickerPrimitive;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(({ align, disabled, invalid, size, variant, value, onOpenChange, onChange, onChangeComplete, ...props }: ColorPickerPrimitiveProps) => React.JSX.Element) & {
-        original: ({ align, disabled, invalid, size, variant, value, onOpenChange, onChange, onChangeComplete, ...props }: ColorPickerPrimitiveProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableColorPickerPrimitive & {
+        original: typeof DecoratableColorPickerPrimitive;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/Command/Command.d.ts

@@ -1,13 +1,15 @@
 import * as React from "react";
 import { Command as CommandPrimitive } from "cmdk";
+import { Empty, Group, Input, Item, List, Loading, Separator } from "./components/index.js";
 type CommandProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive>;
-declare const Command: (({ className, ...props }: React.ComponentPropsWithoutRef<typeof CommandPrimitive>) => React.JSX.Element) & {
-    Empty: (props: import("./components/Empty.js").EmptyProps) => React.JSX.Element;
-    Group: ({ className, ...props }: import("./components/Group.js").GroupProps) => React.JSX.Element;
-    Input: ({ inputElement, size, inputRef, ...props }: import("./components/Input.js").InputProps) => React.JSX.Element;
-    Item: ({ className, children, selected, ...props }: import("./components/Item.js").ItemProps) => React.JSX.Element;
-    List: ({ className, ...props }: import("./components/List.js").ListProps) => React.JSX.Element;
-    Loading: (props: import("./components/Loading.js").LoadingProps) => React.JSX.Element;
-    Separator: (props: import("./components/Separator.js").SeparatorProps) => React.JSX.Element;
+declare const CommandBase: ({ className, ...props }: React.ComponentPropsWithoutRef<typeof CommandPrimitive>) => React.JSX.Element;
+declare const Command: typeof CommandBase & {
+    Empty: typeof Empty;
+    Group: typeof Group;
+    Input: typeof Input;
+    Item: typeof Item;
+    List: typeof List;
+    Loading: typeof Loading;
+    Separator: typeof Separator;
 };
 export { Command, type CommandProps };

package/DataList/DataListModal.d.ts

@@ -2,16 +2,19 @@ import React from "react";
 interface DataListModalContentProps {
     children: React.ReactNode;
 }
+declare const DataListModalContent: ({ children }: DataListModalContentProps) => React.JSX.Element;
 interface DataListModalTriggerProps {
     "data-testid"?: string;
     icon?: React.ReactElement;
 }
+declare const DataListModalTrigger: ({ icon, ...props }: DataListModalTriggerProps) => React.JSX.Element;
 interface DataListModalProps {
     trigger: React.ReactElement;
     content: React.ReactElement;
 }
-declare const DataListModal: ((props: DataListModalProps) => React.JSX.Element | null) & {
-    Trigger: ({ icon, ...props }: DataListModalTriggerProps) => React.JSX.Element;
-    Content: ({ children }: DataListModalContentProps) => React.JSX.Element;
+declare const BaseDataListModal: (props: DataListModalProps) => React.JSX.Element | null;
+declare const DataListModal: typeof BaseDataListModal & {
+    Trigger: typeof DataListModalTrigger;
+    Content: typeof DataListModalContent;
 };
 export { DataListModal, type DataListModalProps, type DataListModalContentProps, type DataListModalTriggerProps };

package/DataTable/DataTable.d.ts

@@ -1,5 +1,15 @@
 import React from "react";
-import type { ColumnSort, OnChangeFn, Row, SortingState, VisibilityState } from "@tanstack/react-table";
+import type { ColumnSort, ColumnVisibilityState, OnChangeFn, Row, RowData, SortingState } from "@tanstack/react-table";
+declare const features: {
+    columnResizingFeature: import("@tanstack/table-core").TableFeature;
+    columnSizingFeature: import("@tanstack/table-core").TableFeature;
+    columnVisibilityFeature: import("@tanstack/table-core").TableFeature;
+    rowSelectionFeature: import("@tanstack/table-core").TableFeature;
+    rowSortingFeature: import("@tanstack/table-core").TableFeature;
+    sortedRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
+    coreRowModel: (table: import("@tanstack/table-core").Table<any, any>) => () => import("@tanstack/table-core").RowModel<any, any>;
+};
+type Features = typeof features;
 interface DataTableColumn<T> {
     header?: string | number | React.JSX.Element;
     cell?: (row: T) => string | number | React.JSX.Element | null;
@@ -18,13 +28,13 @@ type DataTableDefaultData = {
     id: string;
     $selectable?: boolean;
 };
-type DataTableRow<T> = Row<DataTableDefaultData & T>;
+type DataTableRow<T extends RowData> = Row<Features, DataTableDefaultData & T>;
 type DataTableSorting = SortingState;
 type DataTableColumnSort = ColumnSort;
 type OnDataTableSortingChange = OnChangeFn<DataTableSorting>;
-type DataTableColumnVisibility = VisibilityState;
+type DataTableColumnVisibility = ColumnVisibilityState;
 type OnDataTableColumnVisibilityChange = OnChangeFn<DataTableColumnVisibility>;
-interface DataTableProps<TEntry> {
+interface DataTableProps<TEntry extends RowData> {
     /**
      * Show or hide borders.
      */
@@ -52,7 +62,7 @@ interface DataTableProps<TEntry> {
     /**
      * Callback that is called to determine if the row is selectable.
      */
-    isRowSelectable?: (row: Row<TEntry>) => boolean;
+    isRowSelectable?: (row: Row<Features, TEntry>) => boolean;
     /**
      * Render the skeleton state while data are loading.
      */
@@ -86,23 +96,24 @@ interface DataTableProps<TEntry> {
      */
     stickyHeader?: boolean;
 }
-declare const DataTable: (<T extends Record<string, any> & DataTableDefaultData>({ bordered, canSelectAllRows, columnVisibility, columns: initialColumns, data: initialData, initialSorting, isRowSelectable, loading, onColumnVisibilityChange, onSelectRow, onSortingChange, onToggleRow, selectedRows, sorting, stickyHeader }: DataTableProps<T>) => React.JSX.Element) & {
-    original: <T extends Record<string, any> & DataTableDefaultData>({ bordered, canSelectAllRows, columnVisibility, columns: initialColumns, data: initialData, initialSorting, isRowSelectable, loading, onColumnVisibilityChange, onSelectRow, onSortingChange, onToggleRow, selectedRows, sorting, stickyHeader }: DataTableProps<T>) => React.JSX.Element;
+declare const DecoratableDataTable: <T extends Record<string, any> & DataTableDefaultData>({ bordered, canSelectAllRows, columnVisibility, columns: initialColumns, data: initialData, initialSorting, isRowSelectable, loading, onColumnVisibilityChange, onSelectRow, onSortingChange, onToggleRow, selectedRows, sorting, stickyHeader }: DataTableProps<T>) => React.JSX.Element;
+declare const DataTable: typeof DecoratableDataTable & {
+    original: typeof DecoratableDataTable;
     originalName: string;
     displayName: string;
 } & {
-    original: (<T extends Record<string, any> & DataTableDefaultData>({ bordered, canSelectAllRows, columnVisibility, columns: initialColumns, data: initialData, initialSorting, isRowSelectable, loading, onColumnVisibilityChange, onSelectRow, onSortingChange, onToggleRow, selectedRows, sorting, stickyHeader }: DataTableProps<T>) => React.JSX.Element) & {
-        original: <T extends Record<string, any> & DataTableDefaultData>({ bordered, canSelectAllRows, columnVisibility, columns: initialColumns, data: initialData, initialSorting, isRowSelectable, loading, onColumnVisibilityChange, onSelectRow, onSortingChange, onToggleRow, selectedRows, sorting, stickyHeader }: DataTableProps<T>) => React.JSX.Element;
+    original: typeof DecoratableDataTable & {
+        original: typeof DecoratableDataTable;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<(<T extends Record<string, any> & DataTableDefaultData>({ bordered, canSelectAllRows, columnVisibility, columns: initialColumns, data: initialData, initialSorting, isRowSelectable, loading, onColumnVisibilityChange, onSelectRow, onSortingChange, onToggleRow, selectedRows, sorting, stickyHeader }: DataTableProps<T>) => React.JSX.Element) & {
-        original: <T extends Record<string, any> & DataTableDefaultData>({ bordered, canSelectAllRows, columnVisibility, columns: initialColumns, data: initialData, initialSorting, isRowSelectable, loading, onColumnVisibilityChange, onSelectRow, onSortingChange, onToggleRow, selectedRows, sorting, stickyHeader }: DataTableProps<T>) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableDataTable & {
+        original: typeof DecoratableDataTable;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 };
-export { DataTable, type DataTableProps, type DataTableColumn, type DataTableColumns, type DataTableDefaultData, type DataTableRow, type DataTableSorting, type DataTableColumnSort, type OnDataTableSortingChange, type DataTableColumnVisibility, type OnDataTableColumnVisibilityChange };
+export { DataTable, type Features, type DataTableProps, type DataTableColumn, type DataTableColumns, type DataTableDefaultData, type DataTableRow, type DataTableSorting, type DataTableColumnSort, type OnDataTableSortingChange, type DataTableColumnVisibility, type OnDataTableColumnVisibilityChange };

package/DataTable/DataTable.js

@@ -1,10 +1,19 @@
 import react, { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { flexRender, getCoreRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
+import { columnResizingFeature, columnSizingFeature, columnVisibilityFeature, createCoreRowModel, createSortedRowModel, flexRender, rowSelectionFeature, rowSortingFeature, tableFeatures, useTable } from "@tanstack/react-table";
 import { CheckboxPrimitive } from "../Checkbox/index.js";
 import { Skeleton } from "../Skeleton/index.js";
 import { Table } from "../Table/index.js";
 import { ColumnSorter, ColumnsVisibility } from "./components/index.js";
 import { cn, makeDecoratable } from "../utils.js";
+const features = tableFeatures({
+    columnResizingFeature: columnResizingFeature,
+    columnSizingFeature: columnSizingFeature,
+    columnVisibilityFeature: columnVisibilityFeature,
+    rowSelectionFeature: rowSelectionFeature,
+    rowSortingFeature: rowSortingFeature,
+    sortedRowModel: createSortedRowModel(),
+    coreRowModel: createCoreRowModel()
+});
 const defineColumns = (columns, options)=>{
     const { canSelectAllRows, onSelectRow, onToggleRow, loading } = options;
     return useMemo(()=>{
@@ -158,7 +167,8 @@ const DecoratableDataTable = ({ bordered, canSelectAllRows = true, columnVisibil
         onToggleRow,
         loading
     });
-    const table = useReactTable({
+    const table = useTable({
+        features: features,
         columnResizeMode: "onChange",
         columns,
         data,
@@ -167,8 +177,6 @@ const DecoratableDataTable = ({ bordered, canSelectAllRows = true, columnVisibil
         enableRowSelection: isRowSelectable,
         enableSorting: !!onSortingChange,
         enableSortingRemoval: false,
-        getCoreRowModel: getCoreRowModel(),
-        getSortedRowModel: getSortedRowModel(),
         manualSorting: true,
         onColumnVisibilityChange,
         onRowSelectionChange,