@crystallize/design-system 1.24.42 → 1.24.44

package/dist/index.mjs

@@ -17,7 +17,7 @@ import {
   showError,
   showInfo,
   showWarning
-} from "./chunk-3HUBTZND.mjs";
+} from "./chunk-ZT2DX3UW.mjs";
 import "./chunk-NIH5ZMPE.mjs";
 
 // src/card/card.tsx
@@ -488,7 +488,7 @@ function Tag({
 // src/rich-text-editor/index.tsx
 import { lazy, Suspense } from "react";
 import { jsx as jsx15 } from "react/jsx-runtime";
-var LazyRichTextEditor = lazy(() => import("./rich-text-editor-W6DYNBJ6.mjs"));
+var LazyRichTextEditor = lazy(() => import("./rich-text-editor-NIDZLNDY.mjs"));
 var RichTextEditor = (props) => {
   return /* @__PURE__ */ jsx15(Suspense, {
     fallback: null,

package/dist/{rich-text-editor-W6DYNBJ6.mjs → rich-text-editor-NIDZLNDY.mjs}

@@ -6,7 +6,7 @@ import {
   Icon,
   IconButton,
   InputWithLabel
-} from "./chunk-3HUBTZND.mjs";
+} from "./chunk-ZT2DX3UW.mjs";
 import "./chunk-NIH5ZMPE.mjs";
 
 // src/rich-text-editor/rich-text-editor.tsx
@@ -675,11 +675,12 @@ var PRETTIER_PARSER_MODULES = {
 };
 async function loadPrettierParserByLang(lang) {
   const dynamicImport = PRETTIER_PARSER_MODULES[lang];
-  return await dynamicImport();
+  const parser = await dynamicImport();
+  return parser?.default || parser;
 }
 async function loadPrettierFormat() {
-  const { format } = await import("./standalone-AR2ENVE7.mjs");
-  return format;
+  const prettier = await import("./standalone-AR2ENVE7.mjs");
+  return prettier?.default?.format || prettier?.format;
 }
 var PRETTIER_OPTIONS_BY_LANG = {
   css: {
@@ -712,6 +713,19 @@ function PrettierButton({ lang, editor, getCodeDOMNode }) {
   const tr = useTr();
   async function handleClick() {
     const codeDOMNode = getCodeDOMNode();
+    if (!codeDOMNode) {
+      return;
+    }
+    let content = "";
+    editor.update(() => {
+      const codeNode = $getNearestNodeFromDOMNode2(codeDOMNode);
+      if ($isCodeNode3(codeNode)) {
+        content = codeNode.getTextContent();
+      }
+    });
+    if (content === "") {
+      return;
+    }
     try {
       const format = await loadPrettierFormat();
       const options = getPrettierOptions(lang);
@@ -719,16 +733,14 @@ function PrettierButton({ lang, editor, getCodeDOMNode }) {
       if (!codeDOMNode) {
         return;
       }
+      const parsed = await format(content, options);
+      const formattedCode = parsed.replace(/[\r\n]+$/, "");
       editor.update(() => {
         const codeNode = $getNearestNodeFromDOMNode2(codeDOMNode);
         if ($isCodeNode3(codeNode)) {
-          const content = codeNode.getTextContent();
-          let parsed = "";
-          parsed = format(content, options);
-          parsed = parsed.replace(/[\r\n]+$/, "");
-          if (parsed !== "") {
+          if (formattedCode !== "") {
             const selection = codeNode.select(0);
-            selection.insertText(parsed);
+            selection.insertText(formattedCode);
             setSyntaxError("");
             setTipsVisible(false);
           }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crystallize/design-system",
-  "version": "1.24.42",
+  "version": "1.24.44",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/iconography/advance.tsx

@@ -0,0 +1,32 @@
+import { forwardRef, SVGProps } from 'react';
+
+import { fill, stroke } from './variables';
+
+type AdvanceProps = SVGProps<SVGSVGElement>;
+
+type AdvanceRef = SVGSVGElement;
+
+export const Advance = forwardRef<AdvanceRef, AdvanceProps>((delegated, ref) => {
+  return (
+    <svg ref={ref} width="22" height="22" viewBox="0 0 22 22" fill="none" {...delegated}>
+      <path
+        stroke="#F98107"
+        strokeDasharray="1 2"
+        strokeLinecap="round"
+        strokeMiterlimit="16"
+        strokeWidth=".6"
+        d="M3 3.6c0-.331.35-.6.783-.6h4.961c.433 0 .784.269.784.6v14.8c0 .331-.351.6-.784.6h-4.96C3.35 19 3 18.731 3 18.4V3.6Z"
+      />
+      <path
+        fill={fill}
+        d="M12.101 3.6c0-.331.351-.6.784-.6h4.96c.433 0 .784.269.784.6v14.8c0 .331-.35.6-.783.6h-4.961c-.433 0-.784-.269-.784-.6V3.6Z"
+      />
+      <path
+        fill={stroke}
+        d="M18.329 3.6c0-.053-.027-.121-.111-.186a.618.618 0 0 0-.372-.114h-4.962a.616.616 0 0 0-.37.114c-.085.065-.113.133-.113.186v14.8c0 .053.028.121.112.186a.615.615 0 0 0 .371.114h4.962c.156 0 .287-.049.372-.114.084-.065.11-.133.11-.186V3.6Zm.6 14.8c0 .279-.148.51-.347.663-.199.152-.46.237-.736.237h-4.962c-.276 0-.537-.085-.736-.238a.838.838 0 0 1-.346-.662V3.6c0-.279.148-.51.346-.663.199-.152.46-.237.736-.237h4.962c.276 0 .537.085.736.237a.838.838 0 0 1 .346.663v14.8Z"
+      />
+    </svg>
+  );
+});
+
+Advance.displayName = 'AdvanceIcon';

package/src/iconography/check-with-circle.tsx

@@ -1,36 +1,24 @@
 import { forwardRef, SVGProps } from 'react';
 
+import { fill, stroke } from './variables';
+
 type CheckWithCircleProps = SVGProps<SVGSVGElement>;
 type CheckWithCircleRef = SVGSVGElement;
 
 export const CheckWithCircle = forwardRef<CheckWithCircleRef, CheckWithCircleProps>((delegated, ref) => {
   return (
-    <svg
-      ref={ref}
-      xmlns="http://www.w3.org/2000/svg"
-      width="22"
-      height="22"
-      fill="none"
-      viewBox="0 0 22 22"
-      {...delegated}
-    >
-      <path fill="#BFF6F8" d="M19.152 11a8.152 8.152 0 1 1-16.304 0 8.152 8.152 0 0 1 16.304 0Z" />
+    <svg ref={ref} width="22" height="22" fill="none" viewBox="0 0 22 22" {...delegated}>
+      <path fill={fill} d="M19.152 11a8.152 8.152 0 1 1-16.304 0 8.152 8.152 0 0 1 16.304 0Z" />
       <path
-        fill="#528693"
+        fill={stroke}
         fillRule="evenodd"
         d="M11 18.637a7.637 7.637 0 1 0 0-15.274 7.637 7.637 0 0 0 0 15.274Zm0 .515a8.152 8.152 0 1 0 0-16.304 8.152 8.152 0 0 0 0 16.304Z"
         clipRule="evenodd"
       />
       <path
-        fill="#fff"
+        fill={stroke}
         d="m6.536 12.863 2.703 2.34c.183.231.432.382.705.426.064.01.13.014.194.013.353-.009.694-.191.936-.501l4.637-5.925a1.64 1.64 0 0 0 .34-1.048 1.458 1.458 0 0 0-.386-.983 1.107 1.107 0 0 0-.625-.335c-.417-.067-.84.115-1.13.488l-3.772 4.805-1.727-1.273a1.129 1.129 0 0 0-.698-.417c-.369-.059-.745.078-1.031.375-.523.542-.588 1.455-.146 2.035Z"
       />
-      <path
-        fill="#528693"
-        fillRule="evenodd"
-        d="M13.707 7.179c.34-.435.852-.667 1.374-.583.293.047.56.19.77.41.29.303.448.716.458 1.156.01.441-.128.872-.395 1.213l-4.637 5.924c-.284.363-.694.59-1.133.6a1.313 1.313 0 0 1-.24-.016 1.385 1.385 0 0 1-.851-.5L6.348 13.04l-.016-.022c-.524-.686-.442-1.74.164-2.37.338-.35.796-.524 1.258-.45.325.052.618.225.836.483l1.5 1.105 3.617-4.608Zm1.292-.075c-.311-.05-.645.083-.887.392l-3.926 5.002-1.954-1.44-.021-.027a.872.872 0 0 0-.538-.324c-.277-.044-.571.056-.806.3-.432.448-.487 1.204-.141 1.68l2.7 2.337.015.02c.145.183.34.298.544.33a.803.803 0 0 0 .146.01c.267-.006.54-.145.74-.402l4.638-5.925c.19-.243.293-.556.286-.883a1.201 1.201 0 0 0-.316-.811M15 7.104a.85.85 0 0 1 .48.259Z"
-        clipRule="evenodd"
-      />
     </svg>
   );
 });

package/src/iconography/index.ts

@@ -1,5 +1,6 @@
 import { Actions } from './actions';
 import { Add } from './add';
+import { Advance } from './advance';
 import { App } from './app';
 import { Archive } from './archive';
 import { Arrow } from './arrow';
@@ -94,6 +95,7 @@ import { ProductShortcut } from './product-shortcut';
 import { Promotion } from './promotion';
 import { PropertyTable } from './property-table';
 import { Relation } from './relation';
+import { Remove } from './remove';
 import { Renew } from './renew';
 import { RestrictedCatalogue } from './restricted-catalogue';
 import { RichText } from './rich-text';
@@ -129,6 +131,7 @@ import { XForY } from './x-for-y';
 export const Icon = {
   Actions,
   Add,
+  Advance,
   Archive,
   App,
   Battery,
@@ -203,6 +206,7 @@ export const Icon = {
   Promotion,
   PipelineDashed,
   RestrictedCatalogue,
+  Remove,
   Renew,
   Rocket,
   Search,

package/src/iconography/remove.tsx

@@ -0,0 +1,38 @@
+import { forwardRef, SVGProps } from 'react';
+
+import { fill, stroke } from './variables';
+
+type RemoveProps = SVGProps<SVGSVGElement>;
+
+type RemoveRef = SVGSVGElement;
+
+export const Remove = forwardRef<RemoveRef, RemoveProps>((delegated, ref) => {
+  return (
+    <svg ref={ref} width="22" height="22" viewBox="0 0 22 22" fill="none" {...delegated}>
+      <path
+        fill={fill}
+        d="M4.445 19.252A1.445 1.445 0 0 1 3 17.807V4.445C3 3.647 3.647 3 4.445 3h3.178c.798 0 1.444.647 1.444 1.445v13.362c0 .798-.646 1.445-1.444 1.445H4.445Z"
+      />
+      <path
+        fill={stroke}
+        d="M8.85 18.62a.281.281 0 0 1-.152-.367 1.16 1.16 0 0 0 .088-.446v-.556a.281.281 0 1 1 .562 0v.556c0 .234-.046.457-.131.66a.281.281 0 0 1-.367.153Zm-.064-3.597a.28.28 0 0 1 .562 0v1.114a.281.281 0 1 1-.562 0v-1.114Zm0-2.226a.281.281 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0v-1.113Zm0-2.228a.28.28 0 0 1 .562 0v1.113a.281.281 0 1 1-.562 0V10.57Zm0-2.227a.281.281 0 0 1 .562 0v1.114a.28.28 0 1 1-.562 0V8.342Zm0-2.227a.28.28 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0V6.115Zm-.088-2.116a.28.28 0 0 1 .519-.215c.085.204.13.428.13.661v.557a.28.28 0 0 1-.56 0v-.557c0-.158-.032-.31-.089-.446ZM7.623 19.532h-.795a.28.28 0 1 1 0-.56h.795c.158 0 .309-.033.446-.09a.28.28 0 0 1 .214.52 1.72 1.72 0 0 1-.66.13Zm0-16.25h-.795a.28.28 0 0 1 0-.562h.795c.234 0 .457.046.66.13a.28.28 0 0 1-.214.519 1.16 1.16 0 0 0-.446-.088ZM5.24 19.531h-.794a1.72 1.72 0 0 1-.66-.13.28.28 0 1 1 .214-.52c.137.057.287.09.446.09h.794a.28.28 0 1 1 0 .56Zm0-16.25h-.794a1.16 1.16 0 0 0-.446.087.281.281 0 1 1-.215-.519c.204-.084.427-.13.66-.13h.795a.28.28 0 0 1 0 .561ZM2.72 17.25a.28.28 0 1 1 .56 0v.556c0 .159.033.309.09.446a.28.28 0 1 1-.519.215 1.72 1.72 0 0 1-.131-.66v-.557Zm0-12.806c0-.233.046-.457.13-.661a.28.28 0 0 1 .52.215 1.164 1.164 0 0 0-.09.446v.557a.28.28 0 1 1-.56 0v-.557Zm0 10.578a.28.28 0 1 1 .56 0v1.114a.28.28 0 1 1-.56 0v-1.114Zm0-2.226a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0v-1.113Zm0-2.228a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V10.57Zm0-2.227a.28.28 0 0 1 .56 0v1.114a.28.28 0 1 1-.56 0V8.342Zm0-2.227a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V6.115Z"
+      />
+      <path
+        fill={fill}
+        d="M13.104 19.252a1.445 1.445 0 0 1-1.445-1.445V4.445c0-.798.647-1.445 1.445-1.445h3.178c.798 0 1.445.647 1.445 1.445v13.362c0 .798-.647 1.445-1.445 1.445h-3.178Z"
+      />
+      <path
+        fill={stroke}
+        d="M17.509 18.62a.281.281 0 0 1-.151-.367c.056-.137.087-.287.087-.446v-.556a.281.281 0 1 1 .562 0v.556c0 .234-.046.457-.13.66a.281.281 0 0 1-.368.153Zm-.064-3.597a.28.28 0 0 1 .562 0v1.114a.281.281 0 1 1-.562 0v-1.114Zm0-2.226a.281.281 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0v-1.113Zm0-2.228a.28.28 0 0 1 .562 0v1.113a.281.281 0 1 1-.562 0V10.57Zm0-2.227a.281.281 0 0 1 .562 0v1.114a.28.28 0 1 1-.562 0V8.342Zm0-2.227a.28.28 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0V6.115Zm-.087-2.116a.28.28 0 0 1 .518-.215c.085.204.131.428.131.661v.557a.28.28 0 0 1-.562 0v-.557c0-.158-.03-.31-.087-.446Zm-1.076 15.533h-.794a.28.28 0 1 1 0-.56h.794c.159 0 .309-.033.446-.09a.28.28 0 0 1 .214.52 1.72 1.72 0 0 1-.66.13Zm0-16.25h-.794a.28.28 0 0 1 0-.562h.794c.234 0 .457.046.66.13a.28.28 0 0 1-.214.519 1.16 1.16 0 0 0-.446-.088ZM13.9 19.531h-.795a1.72 1.72 0 0 1-.66-.13.28.28 0 1 1 .214-.52c.137.057.287.09.446.09h.795a.28.28 0 1 1 0 .56Zm0-16.25h-.795a1.16 1.16 0 0 0-.446.087.281.281 0 1 1-.214-.519c.203-.084.426-.13.66-.13h.795a.28.28 0 0 1 0 .561Zm-2.52 13.969a.28.28 0 1 1 .56 0v.556c0 .159.033.309.09.446a.28.28 0 1 1-.519.215 1.72 1.72 0 0 1-.13-.66v-.557Zm0-12.806c0-.233.046-.457.13-.661a.28.28 0 0 1 .52.215 1.163 1.163 0 0 0-.09.446v.557a.28.28 0 1 1-.56 0v-.557Zm0 10.578a.28.28 0 1 1 .56 0v1.114a.28.28 0 1 1-.56 0v-1.114Zm0-2.226a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0v-1.113Zm0-2.228a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V10.57Zm0-2.227a.28.28 0 1 1 .56 0v1.114a.28.28 0 1 1-.56 0V8.342Zm0-2.227a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V6.115Z"
+      />
+      <path
+        fill={stroke}
+        fillRule="evenodd"
+        d="m18.813 8.112 2.424 2.424a.381.381 0 0 1 0 .539l-2.424 2.424a.38.38 0 1 1-.539-.539l1.774-1.774h-4.667a.38.38 0 0 1 0-.762h4.667L18.274 8.65a.38.38 0 1 1 .539-.538Z"
+        clipRule="evenodd"
+      />
+    </svg>
+  );
+});
+
+Remove.displayName = 'RemoveIcon';

package/src/iconography/rocket.tsx

@@ -1,5 +1,7 @@
 import { forwardRef, SVGProps } from 'react';
 
+import { fill, stroke } from './variables';
+
 type RocketProps = SVGProps<SVGSVGElement>;
 
 type RocketRef = SVGSVGElement;
@@ -13,11 +15,11 @@ export const Rocket = forwardRef<RocketRef, RocketProps>((delegated, ref) => {
       />
       <path
         d="M10.1129 7.427a1.7704 1.7704 0 0 1-1.1712-.602 1.5881 1.5881 0 0 1-.2493-.3998c-.0047-.0047-.0047-.0094-.0094-.0141a2.0301 2.0301 0 0 1-.1035-.2822c0-.0141-.0047-.0235-.0047-.033a1.3365 1.3365 0 0 1-.047-.268.8705.8705 0 0 1-.0047-.1082c0-.047-.0095-.0941-.0047-.1364 0-.0189.0046-.033.0046-.047.0069-.092.021-.1832.0424-.2729v-.0141c.0541-.2502.167-.484.3292-.682a.197.197 0 0 1 .0753-.0565 1.0763 1.0763 0 0 1 .0988-.1082.7403.7403 0 0 1 .0893-.0705c.0048-.0047.0048-.0141.0095-.0188a.9361.9361 0 0 1 .0893-.0565 1.7606 1.7606 0 0 1 1.3406-.3434c.4418.0721.8383.3134 1.1053.6727a1.7648 1.7648 0 0 1-.1505 2.3048 1.7054 1.7054 0 0 1-.1411.1176.2888.2888 0 0 1-.0329.047c-.0329.0235-.0706.0423-.1035.0658a1.7602 1.7602 0 0 1-1.1618.3058Zm-.809-2.5352a1.2474 1.2474 0 0 0 .1646 1.6933c.1723.1592.3887.2625.6209.2964a.0172.0172 0 0 0 .0141.0047c.0654.0093.1314.014.1975.014h.0565c.0423-.0046.0846-.0093.1317-.0187a.646.646 0 0 0 .1317-.0236.1103.1103 0 0 1 .0376-.0094 1.2248 1.2248 0 0 0 .3951-.207.0539.0539 0 0 1 .0377-.014c.0329-.0283.0705-.0565.1034-.0847.033-.0282.0518-.0611.08-.0894a1.3067 1.3067 0 0 0 .2352-1.0207 1.2592 1.2592 0 0 0-2.0931-.6726 1.2939 1.2939 0 0 0-.1082.127.0047.0047 0 0 1-.0047.0047Z"
-        fill="#528693"
+        fill={stroke}
       />
       <path
         d="M8.8005 12.1025a5.1403 5.1403 0 0 1-.682 1.2794l-.1082.1458c-.0329.033-.0987.1176-.0893.0988-.0094.0047-.0141.0094-.0236.0047-.0094-.0047 0-.0141 0-.0188.0047.0188-.0282-.1787-.0517-.2916a4.5174 4.5174 0 0 0-.4798-1.2982l.0565-.0188c.1317-.0471.2634-.1035.3904-.1553.254-.1128.5033-.2304.7385-.3621.1834-.1035.3621-.2164.5409-.3293a7.3196 7.3196 0 0 1-.2917.9454Zm.4563-7.8457a.9349.9349 0 0 0-.0894.0565c-.0047.0047-.0047.014-.0094.0188a.7411.7411 0 0 0-.0893.0705 1.0777 1.0777 0 0 0-.0988.1082.197.197 0 0 0-.0753.0565 1.6147 1.6147 0 0 0-.3292.682v.0141a1.7343 1.7343 0 0 0-.0424.2728c0 .0141-.0047.0282-.0047.047-.0047.0424.0047.0894.0047.1365a.8667.8667 0 0 0 .0047.1081c.0066.0908.0223.1806.047.2682 0 .0094.0048.0188.0048.0329.0274.0965.062.1908.1035.2822.0047.0047.0047.0094.0094.0141a1.588 1.588 0 0 0 .2493.3998 1.7592 1.7592 0 0 0 2.333.2963c.0329-.0235.0705-.0423.1035-.0658a.2888.2888 0 0 0 .0329-.047 1.7054 1.7054 0 0 0 .1411-.1176 1.765 1.765 0 0 0 .1505-2.3048 1.723 1.723 0 0 0-1.1053-.6726 1.7607 1.7607 0 0 0-1.3406.3433Zm-4.412 5.4516a7.1694 7.1694 0 0 1-.2681-.3904c-.0424-.0659-.08-.1317-.1176-.1929l-.0612-.1082.0282-.094.0612-.1882c.047-.1223.0988-.2446.1505-.3669.1082-.2446.2305-.4845.3575-.7196.265-.4654.562-.9117.889-1.3359a14.419 14.419 0 0 1 2.173-2.3 8.19 8.19 0 0 1 2.6906-1.5288c.0658-.0188.1317-.0329.1975-.0517a5.4617 5.4617 0 0 0 1.1054 1.5428c.4187.448.931.798 1.5005 1.0254-.0142.0564-.0236.1176-.0424.174a8.2196 8.2196 0 0 1-1.5381 2.747 14.7123 14.7123 0 0 1-2.3189 2.206 12.2821 12.2821 0 0 1-1.3311.8796 9.8702 9.8702 0 0 1-.7056.3528c-.1223.047-.2446.0987-.3621.1411l-.1835.0611-.08.0235-.08-.0423-.1692-.1035a12.9658 12.9658 0 0 1-.3246-.2163 1.0463 1.0463 0 0 0-.2916-.1553c.127-.127.254-.254.3857-.381.141-.1411.2822-.2869.428-.4374l1.2888-1.2841a.6352.6352 0 0 0 .0706-.094.522.522 0 0 0 .0329-.1365h-.0047a.3654.3654 0 0 0-.1035-.3434c-.0282-.0282-.0705-.0658-.1176-.1128a.0047.0047 0 0 0-.0047-.0047l-.2493-.2587-.1223-.127a1.1108 1.1108 0 0 0-.2352-.1976.3927.3927 0 0 0-.301-.0047.389.389 0 0 0-.1082.0705.0363.0363 0 0 0-.0141.0094l-.0141.0142a.0103.0103 0 0 0-.0094.0094l-.0423.0423c-.0047 0-.0047 0-.0047.0047-.5645.5645-1.1101 1.1054-1.6652 1.6604l-.3904.3904a.76.76 0 0 0-.0987-.1787Z"
-        fill="#BFF6F8"
+        fill={fill}
       />
       <path
         d="m4.8448 11.5992-.1976.1929c-.0047.0094-.0094.0047-.014 0-.1365-.1411-.2776-.2822-.4234-.428l.5644-.5645c.3998-.3998.795-.7902 1.2042-1.1994.094-.094.1928-.1929.2869-.2916L7.3518 8.222l.0236.0235a.0047.0047 0 0 0 .0046.0047c.1365.1411.2682.2775.3952.4046a.0141.0141 0 0 1 0 .0188 730.2544 730.2544 0 0 0-1.9144 1.9097c-.334.3339-.6727.6679-1.016 1.0159Z"
@@ -25,11 +27,11 @@ export const Rocket = forwardRef<RocketRef, RocketProps>((delegated, ref) => {
       />
       <path
         d="M3.8335 7.2625a6.6494 6.6494 0 0 1 1.0254-.3622c-.0565.0894-.1176.1693-.174.2634a8.6195 8.6195 0 0 0-.447.856c-.0705.1506-.1316.3058-.1928.4704a6.6217 6.6217 0 0 0-.0564.1646 4.2294 4.2294 0 0 0-1.0348-.4186c-.1035-.0282-.2117-.0564-.3152-.0752-.0846-.0189-.1693-.033-.2492-.0518-.0236 0-.0283-.0094-.0142-.0188l.0047-.0047h.0048l.047-.0376c.0564-.047.1317-.094.2022-.1458a7.0379 7.0379 0 0 1 1.1995-.6397Z"
-        fill="#BFF6F8"
+        fill={fill}
       />
       <path
         d="M11.4675 2.2954c.2528.4785.5658.9227.9314 1.3217a4.1843 4.1843 0 0 0 1.2794.8937 6.9501 6.9501 0 0 0 .1223-.8796c.0172-.26.0156-.521-.0047-.7808-.0095-.1317-.0283-.2587-.0471-.3904l-.0282-.16c0-.0093 0-.0187-.0094-.0234l-.1035-.0188a2.7475 2.7475 0 0 0-.1928-.033 3.4826 3.4826 0 0 0-.381-.0376 4.6927 4.6927 0 0 0-.7714 0 6.3397 6.3397 0 0 0-.795.1082Zm-4.1016 9.7272c.2257.4055.3875.8434.4798 1.2982.0235.1129.0565.3104.0518.2916 0 .0047-.0047.0141 0 .0188.0047.0047.014 0 .0235-.0047-.0094.0188.0564-.0658.0893-.0988l.1082-.1458a5.1404 5.1404 0 0 0 .682-1.2794 7.3195 7.3195 0 0 0 .2917-.9454c-.1788.1129-.3575.2258-.541.3293-.2351.1317-.4844.2492-.7384.3621-.127.0518-.2587.1082-.3904.1553l-.0565.0188ZM4.9953 7.6482c-.127.2351-.2493.475-.3575.7196-.0517.1223-.1035.2446-.1505.367l-.0612.188-.0282.0941.0612.1082c.0376.0612.0752.127.1176.1929.0846.1317.174.2634.268.3904a.7599.7599 0 0 1 .0989.1787l.3903-.3904c.555-.555 1.1007-1.096 1.6652-1.6604 0-.0047 0-.0047.0046-.0047l.0424-.0423a.0104.0104 0 0 1 .0094-.0094l.0141-.0141a.0362.0362 0 0 1 .0141-.0095.3888.3888 0 0 1 .1082-.0705.3928.3928 0 0 1 .301.0047 1.111 1.111 0 0 1 .2352.1975l.1223.127.2493.2587a.0046.0046 0 0 1 .0033.0014.0046.0046 0 0 1 .0014.0033c.047.047.0894.0847.1176.113a.3655.3655 0 0 1 .1035.3433h.0047a.5214.5214 0 0 1-.033.1364.636.636 0 0 1-.0705.094L6.938 10.2494c-.1458.1505-.287.2963-.428.4374-.1317.127-.2587.254-.3857.381.1048.036.2032.0884.2916.1552.1082.0753.2164.1459.3246.2164l.1693.1035.08.0423.08-.0235.1833-.0611c.1176-.0424.24-.0941.3622-.1411a9.8702 9.8702 0 0 0 .7056-.3528 12.297 12.297 0 0 0 1.3311-.8796 14.712 14.712 0 0 0 2.3189-2.206 8.2195 8.2195 0 0 0 1.5381-2.747c.0188-.0564.0283-.1176.0424-.174a4.171 4.171 0 0 1-1.5005-1.0254 5.4617 5.4617 0 0 1-1.1054-1.5428c-.0658.0188-.1317.033-.1975.0517a8.1898 8.1898 0 0 0-2.6905 1.5287 14.419 14.419 0 0 0-2.1731 2.3001c-.327.4242-.624.8705-.889 1.3359ZM4.633 11.792c.0047.0047.0094.0094.0141 0l.1976-.1929c.3433-.348.682-.682 1.016-1.016.635-.635 1.2605-1.2605 1.9144-1.9096a.0141.0141 0 0 0 0-.0189c-.127-.127-.2588-.2634-.3952-.4045a.0047.0047 0 0 1-.0047-.0047l-.0235-.0235-1.0865 1.0866c-.0941.0987-.1929.1975-.287.2916-.4092.4092-.8043.7996-1.204 1.1994l-.5645.5645c.1458.1458.2869.2869.4233.428ZM2.954 8.2361c.362.0932.7099.234 1.0348.4186.0188-.0564.0376-.1128.0564-.1646.0612-.1646.1223-.3198.1929-.4703a8.6185 8.6185 0 0 1 .4468-.8561c.0565-.094.1176-.174.174-.2634a6.65 6.65 0 0 0-1.0253.3622 7.0371 7.0371 0 0 0-1.1995.6397c-.0705.0517-.1458.0987-.2022.1458l-.047.0376H2.38l-.0048.0047c-.014.0094-.0094.0188.0141.0188.08.0188.1647.033.2493.0518.1035.0188.2117.047.3152.0752Zm-.6068.3998-.2493-.0423a.589.589 0 0 1-.254-.0894.333.333 0 0 1-.1364-.1693.3712.3712 0 0 1-.014-.2352 2.3128 2.3128 0 0 1 .1222-.2023 3.545 3.545 0 0 1 .5315-.4045 10.695 10.695 0 0 1 1.3688-.7384 4.7461 4.7461 0 0 1 1.5146-.4234c.1599-.2257.3198-.4374.4844-.6444A14.4656 14.4656 0 0 1 8.0103 3.396a8.5346 8.5346 0 0 1 2.7141-1.4252 7.2105 7.2105 0 0 1 1.5428-.2822 5.814 5.814 0 0 1 .809.0047c.1364.0047.2728.0235.4092.0376.0706.0094.1364.0189.207.033l.1129.0235a.6198.6198 0 0 1 .1834.047.4205.4205 0 0 1 .2211.3387l.0423.2446c.0188.1552.047.3057.0517.461.022.3022.0204.6057-.0047.9078a6.9537 6.9537 0 0 1-.3527 1.7215 8.9022 8.9022 0 0 1-1.6839 2.8833 15.0926 15.0926 0 0 1-2.3519 2.2061c-.0846.0611-.174.1176-.2587.1787a5.0622 5.0622 0 0 1-.4139 1.604 6.8242 6.8242 0 0 1-.7055 1.2888l-.1318.174-.0658.0847a4.2152 4.2152 0 0 1-.1129.1364c-.1787.1411-.3292.3245-.5362.2351a.3498.3498 0 0 1-.2023-.1693.2957.2957 0 0 1-.0517-.1458c-.0141-.0611-.0235-.1176-.033-.1693l-.0423-.2399-.0376-.1741a3.8788 3.8788 0 0 0-.508-1.2794.0798.0798 0 0 1-.0047-.0329l-.0658-.0329-.0988-.0611-.1835-.1082a5.7683 5.7683 0 0 1-.348-.2399.8514.8514 0 0 1-.2729-.2916l-.1693.1693a36.5512 36.5512 0 0 1-.428.4233c-.0753.0753-.1505.1458-.2258.2211a.4467.4467 0 0 1-.508.1834.3962.3962 0 0 1-.1693-.1176l-.1176-.1129c-.0518-.0564-.0988-.1081-.1505-.1552-.1176-.1176-.2258-.2257-.3199-.3245a.3934.3934 0 0 1-.0235-.5362l.287-.287c.1551-.1552.301-.3057.4515-.4515l.1975-.1976a.607.607 0 0 1-.207-.174c-.1222-.1646-.2398-.334-.3339-.4845-.047-.0705-.0894-.1411-.127-.1975a1.225 1.225 0 0 0-.0611-.113.0697.0697 0 0 1-.0612 0 3.5599 3.5599 0 0 0-1.0771-.4562l-.2964-.0752-.1505-.033Z"
-        fill="#528693"
+        fill={stroke}
       />
     </svg>
   );

package/src/iconography/warning.tsx

@@ -1,5 +1,9 @@
 import { forwardRef, SVGProps } from 'react';
 
+import { stroke } from './variables';
+
+const fill = 'var(--c-icon-fill, #FFDE99)';
+
 type WarningProps = SVGProps<SVGSVGElement>;
 type WarningRef = SVGSVGElement;
 
@@ -8,34 +12,22 @@ export const Warning = forwardRef<WarningRef, WarningProps>((delegated, ref) =>
     <svg ref={ref} width="22" height="22" fill="none" viewBox="0 0 22 22" {...delegated}>
       <path
         d="M9.67541 3.72993C10.2804 2.68198 11.793 2.68198 12.398 3.72993L19.8853 16.6982C20.4903 17.7462 19.734 19.0561 18.524 19.0561H3.54948C2.33942 19.0561 1.58313 17.7462 2.18816 16.6982L9.67541 3.72993Z"
-        fill="#FFDE99"
+        fill={fill}
         className="c-icon-fill"
       />
       <path
         fillRule="evenodd"
         clipRule="evenodd"
         d="M19.3657 16.9982L11.8784 4.02993C11.5043 3.38198 10.5691 3.38198 10.195 4.02993L2.70778 16.9982C2.33369 17.6462 2.8013 18.4561 3.54948 18.4561H18.524C19.2722 18.4561 19.7398 17.6462 19.3657 16.9982ZM12.398 3.72993C11.793 2.68198 10.2804 2.68198 9.67541 3.72993L2.18816 16.6982C1.58313 17.7462 2.33942 19.0561 3.54948 19.0561H18.524C19.734 19.0561 20.4903 17.7462 19.8853 16.6982L12.398 3.72993Z"
-        fill="#528693"
+        fill={stroke}
       />
       <path
         d="M10.4293 8.73822C10.4293 8.33098 10.7595 8.00085 11.1667 8.00085V8.00085C11.5739 8.00085 11.9041 8.33098 11.9041 8.73822V12.3883C11.9041 12.7956 11.5739 13.1257 11.1667 13.1257V13.1257C10.7595 13.1257 10.4293 12.7956 10.4293 12.3883V8.73822Z"
-        fill="white"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M12.504 8.73824V12.3883C12.504 13.127 11.9053 13.7257 11.1667 13.7257C10.4281 13.7257 9.82932 13.127 9.82932 12.3883V8.73825C9.82932 7.99964 10.4281 7.40088 11.1667 7.40088C11.9053 7.40088 12.504 7.99964 12.504 8.73824ZM11.1667 8.00088C10.7594 8.00088 10.4293 8.33101 10.4293 8.73825V12.3883C10.4293 12.7956 10.7594 13.1257 11.1667 13.1257C11.5739 13.1257 11.904 12.7956 11.904 12.3883V8.73824C11.904 8.33101 11.5739 8.00088 11.1667 8.00088Z"
-        fill="#528693"
+        fill={stroke}
       />
       <path
         d="M11.9041 15.7807C11.9041 16.1879 11.5739 16.5181 11.1667 16.5181C10.7595 16.5181 10.4293 16.1879 10.4293 15.7807C10.4293 15.3735 10.7595 15.0433 11.1667 15.0433C11.5739 15.0433 11.9041 15.3735 11.9041 15.7807Z"
-        fill="white"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M12.504 15.7807C12.504 16.5193 11.9053 17.1181 11.1667 17.1181C10.4281 17.1181 9.82932 16.5193 9.82932 15.7807C9.82932 15.0421 10.4281 14.4434 11.1667 14.4434C11.9053 14.4434 12.504 15.0421 12.504 15.7807ZM11.1667 16.5181C11.5739 16.5181 11.904 16.188 11.904 15.7807C11.904 15.3735 11.5739 15.0434 11.1667 15.0434C10.7594 15.0434 10.4293 15.3735 10.4293 15.7807C10.4293 16.188 10.7594 16.5181 11.1667 16.5181Z"
-        fill="#528693"
+        fill={stroke}
       />
     </svg>
   );

package/src/rich-text-editor/plugins/CodeActionMenuPlugin/components/PrettierButton/index.tsx

@@ -30,12 +30,13 @@ type LanguagesType = keyof typeof PRETTIER_PARSER_MODULES;
 
 async function loadPrettierParserByLang(lang: string) {
   const dynamicImport = PRETTIER_PARSER_MODULES[lang as LanguagesType];
-  return await dynamicImport();
+  const parser = await dynamicImport();
+  return parser?.default || parser;
 }
 
 async function loadPrettierFormat() {
-  const { format } = await import('prettier/standalone');
-  return format;
+  const prettier = await import('prettier/standalone');
+  return prettier?.default?.format || prettier?.format;
 }
 
 const PRETTIER_OPTIONS_BY_LANG: Record<string, Options> = {
@@ -75,6 +76,20 @@ export function PrettierButton({ lang, editor, getCodeDOMNode }: Props) {
 
   async function handleClick(): Promise<void> {
     const codeDOMNode = getCodeDOMNode();
+    if (!codeDOMNode) {
+      return;
+    }
+
+    let content = '';
+    editor.update(() => {
+      const codeNode = $getNearestNodeFromDOMNode(codeDOMNode);
+      if ($isCodeNode(codeNode)) {
+        content = codeNode.getTextContent();
+      }
+    });
+    if (content === '') {
+      return;
+    }
 
     try {
       const format = await loadPrettierFormat();
@@ -85,26 +100,21 @@ export function PrettierButton({ lang, editor, getCodeDOMNode }: Props) {
         return;
       }
 
+      const parsed = await format(content, options);
+      /**
+       * Remove EOF from prettier output. This is useful when
+       * using prettier on files, but becomes weird when the code
+       * is embedded within a larger portion of text (like we do)
+       */
+      const formattedCode = parsed.replace(/[\r\n]+$/, '');
+
       editor.update(() => {
         const codeNode = $getNearestNodeFromDOMNode(codeDOMNode);
 
         if ($isCodeNode(codeNode)) {
-          const content = codeNode.getTextContent();
-
-          let parsed = '';
-
-          parsed = format(content, options);
-
-          /**
-           * Remove EOF from prettier output. This is useful when
-           * using prettier on files, but becomes weird when the code
-           * is embedded within a larger portion of text (like we do)
-           */
-          parsed = parsed.replace(/[\r\n]+$/, '');
-
-          if (parsed !== '') {
+          if (formattedCode !== '') {
             const selection = codeNode.select(0);
-            selection.insertText(parsed);
+            selection.insertText(formattedCode);
             setSyntaxError('');
             setTipsVisible(false);
           }