@uniformdev/design-system 20.34.1 → 20.34.3-alpha.70

package/dist/esm/index.js

@@ -96,11 +96,12 @@ var Theme = ({ disableReset = false, disableGlobalReset = false }) => {
           --typography-inverted: var(--white);
 
           /* chart colours */
-          --charting-chart-1: #ffa600;
-          --charting-chart-2: #c444b2;
-          --charting-chart-3: #ff5368;
-          --charting-chart-4: #f53d90;
-          --charting-chart-5: #ff7b3d;
+          --charting-chart-1: #0072B2;
+          --charting-chart-2: #D55E00;
+          --charting-chart-3: #009E73;
+          --charting-chart-4: #E41A1C;
+          --charting-chart-5: #F0E442;
+          --charting-chart-6: #56B4E9;
 
           /* utility colours */
           --utility-success: #4ade80;
@@ -6518,9 +6519,12 @@ var ChipContainer = css45`
   }
 `;
 var ChipText = css45`
+  display: flex;
+  align-items: center;
+  justify-content: left;
   align-self: center;
   line-height: 1.2;
-  text-wrap: nowrap;
+  white-space: nowrap;
 `;
 var ChipIcon = css45`
   align-self: center;
@@ -14901,23 +14905,8 @@ var ParameterRichText = ({
   errorTestId,
   captionTestId,
   menuItems,
-  value,
-  onChange,
-  onConnectLink,
-  config,
-  onRichTextInit,
-  readOnly,
-  editorWrapperClassName,
-  editorInputClassName,
-  editorInputWrapperClassName,
-  editorFooter,
-  customNodes,
   children,
-  variables,
-  customControls,
-  onInsertTable,
-  onInsertAsset,
-  minimalInteractivity
+  ...innerProps
 }) => {
   return /* @__PURE__ */ jsxs88(
     ParameterShell,
@@ -14933,28 +14922,7 @@ var ParameterRichText = ({
       captionTestId,
       menuItems,
       children: [
-        /* @__PURE__ */ jsx130(
-          ParameterRichTextInner,
-          {
-            value,
-            onChange,
-            onConnectLink,
-            config,
-            onRichTextInit,
-            readOnly,
-            editorWrapperClassName,
-            editorInputClassName,
-            editorInputWrapperClassName,
-            editorFooter,
-            customNodes,
-            variables,
-            customControls,
-            onInsertTable,
-            onInsertAsset,
-            minimalInteractivity,
-            children
-          }
-        ),
+        /* @__PURE__ */ jsx130(ParameterRichTextInner, { ...innerProps, children }),
         menuItems ? /* @__PURE__ */ jsx130(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx130(Fragment18, { children: menuItems }) }) : null
       ]
     }
@@ -15043,22 +15011,11 @@ var editorInput = css98`
 `;
 var ParameterRichTextInner = ({
   value,
-  onChange,
-  onConnectLink,
-  config,
-  onRichTextInit,
-  readOnly,
-  editorWrapperClassName,
-  editorInputClassName,
-  editorInputWrapperClassName,
   editorFooter,
   children,
   customNodes,
-  variables,
-  customControls,
-  onInsertTable,
-  onInsertAsset,
-  minimalInteractivity
+  editorWrapperClassName,
+  ...richTextProps
 }) => {
   const lexicalConfig = {
     namespace: "uniform",
@@ -15114,27 +15071,10 @@ var ParameterRichTextInner = ({
       tableCell: tableCellElement,
       tableCellHeader: tableHeaderElement
     },
-    editable: !readOnly
+    editable: !richTextProps.readOnly
   };
   return /* @__PURE__ */ jsxs88(Fragment18, { children: [
-    /* @__PURE__ */ jsx130("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx130(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx130(
-      RichText,
-      {
-        onChange,
-        onConnectLink,
-        config,
-        onRichTextInit,
-        readOnly,
-        editorInputClassName,
-        editorInputWrapperClassName,
-        variables,
-        customControls,
-        onInsertTable,
-        onInsertAsset,
-        minimalInteractivity,
-        children
-      }
-    ) }) }),
+    /* @__PURE__ */ jsx130("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx130(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx130(RichText, { ...richTextProps, children }) }) }),
     editorFooter ? editorFooter : null
   ] });
 };
@@ -15160,7 +15100,8 @@ var RichText = ({
   customControls,
   onInsertTable,
   onInsertAsset,
-  minimalInteractivity
+  minimalInteractivity,
+  placeholder
 }) => {
   const [editor] = useLexicalComposerContext9();
   useEffect23(() => {
@@ -15223,7 +15164,7 @@ var RichText = ({
               RichTextPlugin,
               {
                 contentEditable: /* @__PURE__ */ jsx130(ContentEditable, { css: editorInput, className: editorInputClassName }),
-                placeholder: /* @__PURE__ */ jsx130("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
+                placeholder: /* @__PURE__ */ jsx130("div", { css: editorPlaceholder, "data-placeholder": true, children: placeholder != null ? placeholder : readOnly ? "empty" : "start editing..." }),
                 ErrorBoundary: LexicalErrorBoundary
               }
             ),

package/dist/index.d.mts

@@ -3475,16 +3475,17 @@ type RichTextProps = {
     } | null>;
     /** Assets */
     onInsertAsset?: () => void;
+    placeholder?: string;
 };
 type RichTextParamValue = SerializedEditorState | undefined | null;
-type ParameterRichTextInnerProps = RichTextProps & {
+type ParameterRichTextInnerProps = Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> & RichTextProps & {
     value: RichTextParamValue | ((editor: LexicalEditor) => void);
     editorWrapperClassName?: string;
     editorFooter?: React.ReactNode;
 };
 type ParameterRichTextProps = CommonParameterInputProps & ParameterRichTextInnerProps;
-declare const ParameterRichText: ({ label, labelLeadingIcon, hiddenLabel, id, errorMessage, caption, errorTestId, captionTestId, menuItems, value, onChange, onConnectLink, config, onRichTextInit, readOnly, editorWrapperClassName, editorInputClassName, editorInputWrapperClassName, editorFooter, customNodes, children, variables, customControls, onInsertTable, onInsertAsset, minimalInteractivity, }: ParameterRichTextProps) => _emotion_react_jsx_runtime.JSX.Element;
-declare const ParameterRichTextInner: ({ value, onChange, onConnectLink, config, onRichTextInit, readOnly, editorWrapperClassName, editorInputClassName, editorInputWrapperClassName, editorFooter, children, customNodes, variables, customControls, onInsertTable, onInsertAsset, minimalInteractivity, }: ParameterRichTextInnerProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ParameterRichText: ({ label, labelLeadingIcon, hiddenLabel, id, errorMessage, caption, errorTestId, captionTestId, menuItems, children, ...innerProps }: ParameterRichTextProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ParameterRichTextInner: ({ value, editorFooter, children, customNodes, editorWrapperClassName, ...richTextProps }: ParameterRichTextInnerProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type ParameterSelectProps = CommonParameterInputProps & CommonParameterSelectProps & React.InputHTMLAttributes<HTMLSelectElement>;
 /** @example <ParameterSelect label="my label" id="my-id" options={[{ label: 'option label', value: 0}]} */

package/dist/index.d.ts

@@ -3475,16 +3475,17 @@ type RichTextProps = {
     } | null>;
     /** Assets */
     onInsertAsset?: () => void;
+    placeholder?: string;
 };
 type RichTextParamValue = SerializedEditorState | undefined | null;
-type ParameterRichTextInnerProps = RichTextProps & {
+type ParameterRichTextInnerProps = Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> & RichTextProps & {
     value: RichTextParamValue | ((editor: LexicalEditor) => void);
     editorWrapperClassName?: string;
     editorFooter?: React.ReactNode;
 };
 type ParameterRichTextProps = CommonParameterInputProps & ParameterRichTextInnerProps;
-declare const ParameterRichText: ({ label, labelLeadingIcon, hiddenLabel, id, errorMessage, caption, errorTestId, captionTestId, menuItems, value, onChange, onConnectLink, config, onRichTextInit, readOnly, editorWrapperClassName, editorInputClassName, editorInputWrapperClassName, editorFooter, customNodes, children, variables, customControls, onInsertTable, onInsertAsset, minimalInteractivity, }: ParameterRichTextProps) => _emotion_react_jsx_runtime.JSX.Element;
-declare const ParameterRichTextInner: ({ value, onChange, onConnectLink, config, onRichTextInit, readOnly, editorWrapperClassName, editorInputClassName, editorInputWrapperClassName, editorFooter, children, customNodes, variables, customControls, onInsertTable, onInsertAsset, minimalInteractivity, }: ParameterRichTextInnerProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ParameterRichText: ({ label, labelLeadingIcon, hiddenLabel, id, errorMessage, caption, errorTestId, captionTestId, menuItems, children, ...innerProps }: ParameterRichTextProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ParameterRichTextInner: ({ value, editorFooter, children, customNodes, editorWrapperClassName, ...richTextProps }: ParameterRichTextInnerProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type ParameterSelectProps = CommonParameterInputProps & CommonParameterSelectProps & React.InputHTMLAttributes<HTMLSelectElement>;
 /** @example <ParameterSelect label="my label" id="my-id" options={[{ label: 'option label', value: 0}]} */

package/dist/index.js

@@ -1745,11 +1745,12 @@ var Theme = ({ disableReset = false, disableGlobalReset = false }) => {
           --typography-inverted: var(--white);
 
           /* chart colours */
-          --charting-chart-1: #ffa600;
-          --charting-chart-2: #c444b2;
-          --charting-chart-3: #ff5368;
-          --charting-chart-4: #f53d90;
-          --charting-chart-5: #ff7b3d;
+          --charting-chart-1: #0072B2;
+          --charting-chart-2: #D55E00;
+          --charting-chart-3: #009E73;
+          --charting-chart-4: #E41A1C;
+          --charting-chart-5: #F0E442;
+          --charting-chart-6: #56B4E9;
 
           /* utility colours */
           --utility-success: #4ade80;
@@ -8297,9 +8298,12 @@ var ChipContainer = import_react67.css`
   }
 `;
 var ChipText = import_react67.css`
+  display: flex;
+  align-items: center;
+  justify-content: left;
   align-self: center;
   line-height: 1.2;
-  text-wrap: nowrap;
+  white-space: nowrap;
 `;
 var ChipIcon = import_react67.css`
   align-self: center;
@@ -16751,23 +16755,8 @@ var ParameterRichText = ({
   errorTestId,
   captionTestId,
   menuItems,
-  value,
-  onChange,
-  onConnectLink,
-  config,
-  onRichTextInit,
-  readOnly,
-  editorWrapperClassName,
-  editorInputClassName,
-  editorInputWrapperClassName,
-  editorFooter,
-  customNodes,
   children,
-  variables,
-  customControls,
-  onInsertTable,
-  onInsertAsset,
-  minimalInteractivity
+  ...innerProps
 }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
     ParameterShell,
@@ -16783,28 +16772,7 @@ var ParameterRichText = ({
       captionTestId,
       menuItems,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
-          ParameterRichTextInner,
-          {
-            value,
-            onChange,
-            onConnectLink,
-            config,
-            onRichTextInit,
-            readOnly,
-            editorWrapperClassName,
-            editorInputClassName,
-            editorInputWrapperClassName,
-            editorFooter,
-            customNodes,
-            variables,
-            customControls,
-            onInsertTable,
-            onInsertAsset,
-            minimalInteractivity,
-            children
-          }
-        ),
+        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(ParameterRichTextInner, { ...innerProps, children }),
         menuItems ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_jsx_runtime130.Fragment, { children: menuItems }) }) : null
       ]
     }
@@ -16893,22 +16861,11 @@ var editorInput = import_react157.css`
 `;
 var ParameterRichTextInner = ({
   value,
-  onChange,
-  onConnectLink,
-  config,
-  onRichTextInit,
-  readOnly,
-  editorWrapperClassName,
-  editorInputClassName,
-  editorInputWrapperClassName,
   editorFooter,
   children,
   customNodes,
-  variables,
-  customControls,
-  onInsertTable,
-  onInsertAsset,
-  minimalInteractivity
+  editorWrapperClassName,
+  ...richTextProps
 }) => {
   const lexicalConfig = {
     namespace: "uniform",
@@ -16964,27 +16921,10 @@ var ParameterRichTextInner = ({
       tableCell: tableCellElement,
       tableCellHeader: tableHeaderElement
     },
-    editable: !readOnly
+    editable: !richTextProps.readOnly
   };
   return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(import_jsx_runtime130.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalComposer.LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
-      RichText,
-      {
-        onChange,
-        onConnectLink,
-        config,
-        onRichTextInit,
-        readOnly,
-        editorInputClassName,
-        editorInputWrapperClassName,
-        variables,
-        customControls,
-        onInsertTable,
-        onInsertAsset,
-        minimalInteractivity,
-        children
-      }
-    ) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalComposer.LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(RichText, { ...richTextProps, children }) }) }),
     editorFooter ? editorFooter : null
   ] });
 };
@@ -17010,7 +16950,8 @@ var RichText = ({
   customControls,
   onInsertTable,
   onInsertAsset,
-  minimalInteractivity
+  minimalInteractivity,
+  placeholder
 }) => {
   const [editor] = (0, import_LexicalComposerContext9.useLexicalComposerContext)();
   (0, import_react158.useEffect)(() => {
@@ -17073,7 +17014,7 @@ var RichText = ({
               import_LexicalRichTextPlugin.RichTextPlugin,
               {
                 contentEditable: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(import_LexicalContentEditable.ContentEditable, { css: editorInput, className: editorInputClassName }),
-                placeholder: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
+                placeholder: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { css: editorPlaceholder, "data-placeholder": true, children: placeholder != null ? placeholder : readOnly ? "empty" : "start editing..." }),
                 ErrorBoundary: import_LexicalErrorBoundary.default
               }
             ),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "20.34.1",
+  "version": "20.34.3-alpha.70+bc3f8ba0f4",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "exports": {
@@ -23,7 +23,7 @@
     "build": "tsup",
     "dev": "tsup --watch",
     "clean": "rimraf dist",
-    "test": "vitest",
+    "test": "vitest run",
     "test:coverage": "vitest run --coverage",
     "lint": "eslint \"src/**/*.{js,ts,tsx}\"",
     "format": "prettier --write \"src/**/*.{js,ts,tsx}\"",
@@ -36,11 +36,11 @@
     "@storybook/preview-api": "^8.3.3",
     "@storybook/react": "8.3.3",
     "@storybook/theming": "^8.3.3",
-    "@types/react": "18.3.11",
-    "@types/react-dom": "18.3.1",
-    "@uniformdev/canvas": "^20.34.1",
-    "@uniformdev/richtext": "^20.34.1",
-    "@vitest/coverage-v8": "^3.1.2",
+    "@types/react": "18.3.24",
+    "@types/react-dom": "18.3.7",
+    "@uniformdev/canvas": "^20.34.3-alpha.70+bc3f8ba0f4",
+    "@uniformdev/richtext": "^20.34.3-alpha.70+bc3f8ba0f4",
+    "@vitest/coverage-v8": "3.2.4",
     "autoprefixer": "10.4.21",
     "hygen": "6.2.11",
     "postcss": "8.5.3",
@@ -48,7 +48,7 @@
     "react-dom": "18.3.1",
     "react-select-event": "^5.5.1",
     "tsup": "8.3.0",
-    "vitest": "^3.1.2"
+    "vitest": "3.2.4"
   },
   "dependencies": {
     "@ariakit/react": "^0.4.15",
@@ -91,5 +91,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "e118be221d19f1e59da7c5845bc3e784e0b42cf3"
+  "gitHead": "bc3f8ba0f4719673f92d9e8c48c3818dc439c364"
 }