@useinsider/guido 1.0.0-beta.df613dd → 1.0.0-beta.e096204

package/dist/composables/useExport.js

@@ -1,30 +1,45 @@
 import { useActionsApi as l } from "./useActionsApi.js";
-import { useToaster as m } from "./useToaster.js";
-const u = () => {
-  const a = (r, t, e) => {
-    const n = new Blob([r], { type: e }), s = URL.createObjectURL(n), o = document.createElement("a");
-    o.href = s, o.download = t, document.body.appendChild(o), o.click(), document.body.removeChild(o), URL.revokeObjectURL(s);
-  }, c = (r) => {
-    const t = /* @__PURE__ */ new Date(), e = String(t.getDate()).padStart(2, "0"), n = String(t.getMonth() + 1).padStart(2, "0"), s = t.getFullYear(), o = String(t.getHours()).padStart(2, "0"), i = String(t.getMinutes()).padStart(2, "0");
-    return `${r}_${e}-${n}-${s}_${o}-${i}.html`;
+import { useHtmlCompiler as m } from "./useHtmlCompiler.js";
+import { useToaster as d } from "./useToaster.js";
+const h = () => {
+  const a = (s, o, r) => {
+    const i = new Blob([s], { type: r }), t = URL.createObjectURL(i), e = document.createElement("a");
+    e.href = t, e.download = o, document.body.appendChild(e), e.click(), document.body.removeChild(e), URL.revokeObjectURL(t);
+  }, c = (s) => {
+    const o = /* @__PURE__ */ new Date(), r = String(o.getDate()).padStart(2, "0"), i = String(o.getMonth() + 1).padStart(2, "0"), t = o.getFullYear(), e = String(o.getHours()).padStart(2, "0"), n = String(o.getMinutes()).padStart(2, "0");
+    return `${s}_${r}-${i}-${t}_${e}-${n}.html`;
   };
-  return { exportHtml: async () => {
-    const { getCompiledEmail: r } = l(), { showToaster: t } = m();
+  return { exportHtml: async (s = !0) => {
+    const { getCompiledEmail: o } = l(), { showToaster: r } = d(), { compileHtml: i } = m();
     try {
-      const { html: e } = await r();
-      e ? a(e, c("HTML"), "text/html") : t({
+      const { html: t } = await o();
+      if (t) {
+        let e = t;
+        if (s) {
+          const n = i(t);
+          e = n.compiledHtml, console.debug("HTML Compilation Stats:", {
+            originalSize: n.stats.originalSize,
+            compiledSize: n.stats.compiledSize,
+            reduction: `${n.stats.reductionPercentage.toFixed(2)}%`,
+            appliedRules: n.appliedRules,
+            executionTime: `${n.stats.executionTime.toFixed(2)}ms`
+          });
+        }
+        a(e, c("HTML"), "text/html");
+      } else
+        r({
+          type: "error",
+          message: "No HTML content to download"
+        });
+    } catch (t) {
+      const e = t instanceof Error ? t.message : String(t);
+      r({
         type: "error",
-        message: "No HTML content to download"
-      });
-    } catch (e) {
-      const n = e instanceof Error ? e.message : String(e);
-      t({
-        type: "error",
-        message: `Error compiling email: ${n}`
+        message: `Error compiling email: ${e}`
       });
     }
   } };
 };
 export {
-  u as useExport
+  h as useExport
 };

package/dist/composables/useHtmlCompiler.d.ts

@@ -0,0 +1,4 @@
+import type { CompilationResult } from '@@/Types/html-compiler';
+export declare const useHtmlCompiler: () => {
+    compileHtml: (html: string) => CompilationResult;
+};

package/dist/composables/useHtmlCompiler.js

@@ -0,0 +1,16 @@
+import { defaultHtmlCompilerRules as r } from "../config/compiler/htmlCompilerRules.js";
+import { createHtmlCompiler as p } from "../utils/htmlCompiler.js";
+const a = () => {
+  const e = typeof window < "u" ? window.GuidoConfig : void 0, l = (e == null ? void 0 : e.htmlCompilerRules) || [], t = [
+    ...!!(e != null && e.ignoreDefaultHtmlCompilerRules) ? [] : r,
+    ...l.map((o, m) => ({
+      ...o,
+      priority: o.priority + 1e3 + m
+      // Ensure additional rules run after default rules
+    }))
+  ], i = p(t);
+  return { compileHtml: (o) => i.compile(o) };
+};
+export {
+  a as useHtmlCompiler
+};

package/dist/composables/useStripo.js

@@ -1,10 +1,11 @@
 import { useCustomInterfaceAppearance as m } from "./useCustomInterfaceAppearance.js";
 import { useToaster as g } from "./useToaster.js";
-import { useStripoApi as E } from "../services/stripoApi.js";
-import { useEditorStore as S } from "../stores/editor.js";
-const _ = (c) => {
-  const { handleError: d } = g(), { getToken: u, getCustomFonts: a } = E(), l = (e, i = []) => {
-    const r = S(), { html: t, css: n } = e;
+import { displayConditions as E } from "../enums/displayConditions.js";
+import { useStripoApi as S } from "../services/stripoApi.js";
+import { useEditorStore as w } from "../stores/editor.js";
+const F = (c) => {
+  const { handleError: d } = g(), { getToken: a, getCustomFonts: u } = S(), l = (e, i = []) => {
+    const r = w(), { html: t, css: n } = e;
     window.UIEditor.initEditor(
       document.querySelector("#guido-editor"),
       {
@@ -17,6 +18,10 @@ const _ = (c) => {
         mobileViewButtonSelector: ".guido__view-option-selection-mobile",
         desktopViewButtonSelector: ".guido__view-option-selection-desktop",
         codeEditorButtonSelector: "#guido__code-button",
+        conditionsEnabled: !0,
+        customConditionsEnabled: !0,
+        conditionCategories: E,
+        messageSettingsEnabled: !1,
         editorFonts: {
           showDefaultStandardFonts: !0,
           showDefaultNotStandardFonts: !0,
@@ -24,7 +29,7 @@ const _ = (c) => {
         },
         async onTokenRefreshRequest(o) {
           try {
-            const s = await u();
+            const s = await a();
             o(s);
           } catch (s) {
             d(s, "Failed to refresh token");
@@ -64,11 +69,11 @@ const _ = (c) => {
   });
   return { initPlugin: async (e) => {
     await p(async () => {
-      const i = await a();
+      const i = await u();
       l(e, i);
     });
   } };
 };
 export {
-  _ as useStripo
+  F as useStripo
 };

package/dist/config/compiler/htmlCompilerRules.d.ts

@@ -0,0 +1,2 @@
+import type { CompilerRule } from '@@/Types/html-compiler';
+export declare const defaultHtmlCompilerRules: CompilerRule[];

package/dist/config/compiler/htmlCompilerRules.js

@@ -0,0 +1,145 @@
+const a = [
+  {
+    id: "fix-url-encoding-start",
+    description: "Replace {%22 with %7B%22 to fix URL encoding",
+    type: "replace",
+    search: "{%22",
+    replacement: "%7B%22",
+    replaceAll: !0,
+    priority: 10
+  },
+  {
+    id: "fix-url-encoding-end",
+    description: "Replace %22} with %22%7D to fix URL encoding",
+    type: "replace",
+    search: "%22}",
+    replacement: "%22%7D",
+    replaceAll: !0,
+    priority: 10
+  },
+  {
+    id: "fix-tags-start",
+    description: "Replace %7B%7B with {{ to fix URL encoding",
+    type: "replace",
+    search: "%7B%7B",
+    replacement: "{{",
+    replaceAll: !0,
+    priority: 11
+  },
+  {
+    id: "fix-tags-end",
+    description: "Replace %7D%7D with }} to fix URL encoding",
+    type: "replace",
+    search: "%7D%7D",
+    replacement: "}}",
+    replaceAll: !0,
+    priority: 12
+  },
+  {
+    id: "unescape-inequality-operators-start",
+    description: "Replace &lt; with < to fix URL encoding",
+    type: "replace",
+    search: "&lt;",
+    replacement: "<",
+    replaceAll: !0,
+    priority: 13
+  },
+  {
+    id: "unescape-inequality-operators-end",
+    description: "Replace &gt; with > to fix URL encoding",
+    type: "replace",
+    search: "&gt;",
+    replacement: ">",
+    replaceAll: !0,
+    priority: 14
+  },
+  {
+    id: "remove-apty-iframe",
+    description: "Cleanup Apty Iframe Code",
+    type: "remove",
+    targets: [
+      '<iframe src="about:blank" id="letznav-iframe-script" allowtransparency="true" style="width:1px;height:1px"></iframe>',
+      'src="about:blank" id="letznav-iframe-script" allowtransparency="true" style="width:1px;height:1px"></iframe>'
+    ],
+    priority: 20
+  },
+  {
+    id: "remove-apty-styles",
+    description: "Removing Apty Styles",
+    type: "regex",
+    pattern: '<styles*data-styles="apty_styles"s* type="text/css"s*>((s|.)*?)</style>',
+    replacement: "",
+    flags: "g",
+    priority: 21
+  },
+  {
+    id: "remove-mso-conditions",
+    description: "Removing MSO Conditions",
+    type: "remove",
+    targets: [
+      /<!--\[if\s\(mso 16\)\]>\s*<style\s*\S*>\s*a\s*\{\s*text-decoration\s*:\s*none\s*;*\s*\}\s*<\/style>\s*<!\[endif\]-->/g,
+      /<!--\[if\sgte mso 9\]>\s*<style\s*\S*>\s*sup\s*\{\s*font-size\s*:\s*100%\s*!important\s*;*\s*\}\s*<\/style>\s*<!\[endif\]-->/g,
+      /<!--\[if\sgte mso 9\]>\s*<noscript>\s*<xml>\s*<o:OfficeDocumentSettings>\s*<o:AllowPNG>\s*<\/o:AllowPNG>\s*<o:PixelsPerInch>\d+<\/o:PixelsPerInch>\s*<\/o:OfficeDocumentSettings>\s*<\/xml>\s*<\/noscript>\s*<!\[endif\]-->/g,
+      /<!--\[if mso\]>\s*<xml>\s*<w:WordDocument\s+xmlns:w="urn:schemas-microsoft-com:office:word">\s*<w:DontUseAdvancedTypographyReadingMail><\/w:DontUseAdvancedTypographyReadingMail>\s*<\/w:WordDocument>\s*<\/xml>\s*<!\[endif\]-->/g,
+      /<\!--\[if \!mso\]><\!--\s*\d*\s*-->\s*<\!--\[if \!mso\]><\!--\s*\d*\s*-->\s*<\!--<!\[endif\]-->/g,
+      /<!--\[if\s\!mso\]>\s*<!-- \d -->/g
+    ],
+    priority: 22
+  },
+  {
+    id: "add-mso-conditions",
+    description: "Adding MSO Conditions",
+    type: "custom",
+    processor: (e) => {
+      const t = [
+        `<!--[if gte mso 9]>
+<style>sup {
+    font-size: 100% !important;
+}</style><![endif]-->`,
+        `<!--[if gte mso 9]>
+<noscript>
+    <xml>
+        <o:OfficeDocumentSettings>
+            <o:AllowPNG></o:AllowPNG>
+            <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+    </xml>
+</noscript><![endif]-->`,
+        `<!--[if mso]>
+<xml>
+    <w:WordDocument xmlns:w="urn:schemas-microsoft-com:office:word">
+        <w:DontUseAdvancedTypographyReadingMail></w:DontUseAdvancedTypographyReadingMail>
+    </w:WordDocument>
+</xml><![endif]-->`
+      ], s = /<head>([\S\s]*)<\/head>/, o = new RegExp(s);
+      if (!e.match(o))
+        return e;
+      let i = e;
+      return t.forEach((r) => {
+        i = i.replace("</head>", `${r}</head>`);
+      }), i;
+    },
+    priority: 30
+  },
+  {
+    id: "replace-old-image-domain",
+    description: "Replacing old image domains",
+    type: "replace",
+    search: "stripo-editor-image.s3-eu-west-1.amazonaws.com",
+    replacement: "email-static.useinsider.com",
+    replaceAll: !0,
+    priority: 40
+  },
+  {
+    id: "replace-old-v2-image-domain",
+    description: "Replacing old image domains",
+    type: "replace",
+    search: "email.static.useinsider.com",
+    replacement: "email-static.useinsider.com",
+    replaceAll: !0,
+    priority: 41
+  }
+];
+export {
+  a as defaultHtmlCompilerRules
+};

package/dist/enums/displayConditions.d.ts

@@ -0,0 +1,2 @@
+import type { ConditionCategories } from '@@/Types/condition-categories';
+export declare const displayConditions: ConditionCategories;

package/dist/enums/displayConditions.js

@@ -0,0 +1,80 @@
+const e = [
+  {
+    category: "Demographics",
+    conditions: [
+      {
+        id: 1,
+        name: "Language",
+        description: "Users who are in the English will see the banner",
+        beforeScript: '{% if language == "en_US" %}',
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 2,
+        name: "Country",
+        description: "Only people who live in Australia will see the banner",
+        beforeScript: '{% if country == "Australia" %}',
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 3,
+        name: "Country & City",
+        description: "Only people who are located in that country and city",
+        beforeScript: '{% if country == "United Kingdom" and city == "London" %}',
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 4,
+        name: "Age (Less than operator)",
+        description: "Users whose age is less than 18",
+        beforeScript: "{% if age < 18 %}",
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 5,
+        name: "Age (Equal and greater than operator)",
+        description: "Users whose age is equal or greater than 25",
+        beforeScript: "{% if age >= 25 %}",
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 6,
+        name: "Age (Greater than & less than operators)",
+        description: "Users whose age is between 18 and 25",
+        beforeScript: "{% if age > 18 and age < 25 %}",
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 7,
+        name: "Gender",
+        description: "Users whose gender is Female",
+        beforeScript: '{% if gender == "Female" %}',
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 8,
+        name: "State",
+        description: "Users whose state is one of the followings. c_state is a custom attribute. Use this condition if you have the attribute with the same naming. ",
+        beforeScript: '{% if c_state == "VIC" or c_state == "NSW" or c_state == "QLD" %}',
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 9,
+        name: "VIP User",
+        description: "Users who are VIP users for that brand. c_is_vip_user = true. c_is_vip_user is a custom attribute. Use this condition if you have the attribute with the same naming.",
+        beforeScript: "{% if c_is_vip_user %}",
+        afterScript: "{% endif %}"
+      },
+      {
+        id: 10,
+        name: "Membership Type",
+        description: "Users who belong to gold or silver membership type. c_is_gold_member = true, c_is_silver_member = true. These are custom attributes. Use this condition if you have the attribute with the same naming.",
+        beforeScript: "{% if c_is_gold_member or c_is_silver_member %}",
+        afterScript: "{% endif %}"
+      }
+    ]
+  }
+];
+export {
+  e as displayConditions
+};

package/dist/guido.css

@@ -1 +1 @@
-.version-history-item[data-v-0e2ff42d]{flex-basis:200px}.version-history-wrapper[data-v-187d41fa]{gap:8px}[data-v-6a2bde67] .guido__verion-history-view-option-selection-desktop svg,[data-v-6a2bde67] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6a2bde67] .in-segments-wrapper__button_selected,[data-v-6a2bde67] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-0fff376c] .guido__view-option-selection-desktop svg,[data-v-0fff376c] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-0fff376c] .in-segments-wrapper__button_selected,[data-v-0fff376c] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.header-right-slot[data-v-fefca98f]{gap:16px}.guido-editor__wrapper[data-v-d4a5c957],.guido-editor__container[data-v-d4a5c957]{width:100%;height:100vh}
+.version-history-item[data-v-0e2ff42d]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}[data-v-6a2bde67] .guido__verion-history-view-option-selection-desktop svg,[data-v-6a2bde67] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6a2bde67] .in-segments-wrapper__button_selected,[data-v-6a2bde67] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-0fff376c] .guido__view-option-selection-desktop svg,[data-v-0fff376c] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-0fff376c] .in-segments-wrapper__button_selected,[data-v-0fff376c] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.guido-editor__wrapper[data-v-8e229594],.guido-editor__container[data-v-8e229594]{width:100%;height:calc(100vh - 75px)}

package/dist/static/styles/base.css.js

@@ -0,0 +1,11 @@
+const t = `.amp-input-list,
+.button,
+.base-input,
+ue-stripe-thumb,
+.ue-stripe-thumb {
+    transition: all .5s ease;
+}
+`;
+export {
+  t as default
+};

package/dist/static/styles/components/alert-message.css.js

@@ -0,0 +1,39 @@
+const n = `.alert-message-wrapper {
+    box-shadow: none;
+    border: 1px solid var(--guido-color-gray-300);
+    color: var(--guido-color-gray-600);
+}
+
+.alert-message-wrapper.info,
+.alert-message-wrapper.loader {
+    background: var(--guido-color-background-onpage-message-info);
+    border-color: var(--guido-color-border-onpage-message-info);
+    color: inherit;
+}
+
+.alert-message-wrapper.info ue-icon-component.icon,
+.alert-message-wrapper.loader ue-icon-component.icon {
+    color: var(--guido-color-border-onpage-message-info);
+}
+
+.alert-message-wrapper ue-button {
+    padding: 0;
+}
+
+.alert-message-wrapper .button {
+    border: none;
+    background: transparent;
+    color: var(--guido-color-primary-500);
+    padding: 0;
+    min-width: unset;
+    min-height: unset;
+}
+
+.alert-message-wrapper .button:hover:not(:disabled,.disabled) {
+    background-color: transparent;
+    text-decoration: underline;
+}
+`;
+export {
+  n as default
+};

package/dist/static/styles/components/amp-block.css.js

@@ -0,0 +1,18 @@
+const n = `.amp-input-list {
+    box-shadow: none;
+    border: 1px solid var(--guido-color-gray-300);
+    margin-bottom: 16px;
+}
+
+.amp-input-list:last-child {
+    margin-bottom: 0;
+}
+
+.amp-input-list.active,
+.amp-input-list:hover {
+    background-color: var(--guido-color-neutral-100);
+}
+`;
+export {
+  n as default
+};

package/dist/static/styles/components/base-input.css.js

@@ -0,0 +1,47 @@
+const n = `.base-input {
+    border: 1px solid var(--guido-color-gray-300);
+    border-radius: 4px;
+    background-color: var(--guido-color-gray-0);
+    align-items: center;
+    height: 40px;
+    max-height: 40px;
+    box-sizing: content-box;
+    outline: none;
+    resize: vertical;
+    padding: 8px;
+    font-size: 13px;
+    color: var(--guido-color-gray-800);
+    box-shadow: none !important;
+    box-sizing: border-box !important;
+}
+
+.base-input:hover:not(:disabled) {
+    background-color: var(--guido-color-gray-0);
+    border-color: var(--guido-color-primary-500);
+}
+
+.base-input:focus:not(:disabled),
+.base-input.focused {
+    background-color: var(--guido-color-gray-0);
+    border-color: var(--guido-color-primary-500);
+    box-shadow: 0 0 0 3px var(--guido-color-primary-200) !important;
+}
+
+ue-contenteditable {
+    height: 40px;
+    overflow: unset;
+}
+
+ue-contenteditable .base-input {
+    line-height: 24px;
+}
+
+ue-icon-component.icon-button.icon-clear-input {
+    right: 2px;
+    top: 2px;
+    padding: 9px;
+}
+`;
+export {
+  n as default
+};

package/dist/static/styles/components/button-group.css.js

@@ -0,0 +1,54 @@
+const o = `/* Radio Buttons and Check Buttons */
+
+.button-group {
+    padding: 0;
+    column-gap: 0;
+    border-radius: 0;
+    background-color: transparent;
+}
+
+.button-group .button {
+    background-color: var(--guido-color-gray-0);
+    outline: none;
+    padding: 8px 12px;
+    border: 1px solid var(--guido-color-gray-300);
+    box-shadow: none;
+    height: 40px;
+}
+
+.button-group .button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-gray-1);
+}
+
+.button-group .button ue-icon-component.icon-button {
+    color: var(--guido-color-gray-800);
+}
+
+.button-group > div:first-of-type .button {
+    border-radius: 4px 0 0 4px;
+}
+
+.button-group > *:last-child .button {
+    border-radius: 0 4px 4px 0;
+}
+
+ue-check-buttons input:checked + .button,
+ue-radio-buttons input:checked + .button {
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border-color: var(--guido-color-primary-500);
+}
+
+ue-check-buttons input:checked + .button ue-icon-component.icon-button,
+ue-radio-buttons input:checked + .button ue-icon-component.icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+ue-check-buttons input:checked + label:hover:not(:disabled,.disabled),
+ue-radio-buttons input:checked + label:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-primary-100) !important;
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/button.css.js

@@ -0,0 +1,106 @@
+const o = `.control-shadow-wrapper:has(.button) {
+    border-radius: 0;
+    box-shadow: none;
+    background-color: transparent;
+    padding: 0;
+}
+
+.button {
+    min-width: 40px;
+    min-height: 40px;
+    padding: 8px;
+    background-color: var(--guido-color-gray-0);
+    border: 1px solid var(--guido-color-gray-300);
+    border-radius: 4px;
+    box-shadow: none;
+}
+
+.button:not(:disabled,.disabled):active {
+    transform: none !important;
+}
+
+.button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-gray-1);
+}
+
+.button .icon-button {
+    color: var(--guido-color-gray-800);
+}
+
+.on > .button {
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border-color: var(--guido-color-primary-500);
+    box-shadow: none;
+}
+
+.on > .button .icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+.on > .button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-primary-100);
+}
+
+.e2e-remove-container-item .button .icon-button,
+.e2e-delete-menu-btn .button .icon-button {
+    color: var(--guido-color-danger-500);
+}
+
+.e2e-text-insert-controls .control-shadow-wrapper:not(:last-of-type) {
+    margin-right: 16px;
+}
+
+.flat-white > .button {
+    border: 0;
+}
+
+.flat-white > .button:hover:not(:disabled,.disabled) {
+    background-color: transparent !important;
+    color: var(--guido-color-primary-500);
+}
+
+.flat-white > .button:hover:not(:disabled,.disabled) {
+    color: var(--guido-color-primary-500);
+}
+
+ue-check-button.checked:not(.flat-white) input:checked + label {
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border: 1px solid var(--guido-color-primary-500);
+    box-shadow: none;
+}
+
+ue-check-button.checked:not(.flat-white) input:checked + label:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-primary-100);
+}
+
+ue-check-button.checked:not(.flat-white) input:checked + label .icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+ue-select.full-width .button {
+    border: none !important;
+    background-color: var(--guido-color-neutral-200) !important;
+    color: var(--guido-color-neutral-800) !important;
+}
+
+ue-select.full-width .button .icon-button {
+    color: var(--guido-color-gray-600) !important;
+}
+
+ue-select.full-width .button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-neutral-100) !important;
+}
+
+ue-color {
+    width: 80px;
+}
+
+ue-color .base-input {
+    width: 100%;
+}
+`;
+export {
+  o as default
+};