@ttoss/theme 1.7.14 → 1.7.16

package/dist/index.js

@@ -1,951 +0,0 @@
-/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-"use strict";
-
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = {
-    exports: {}
-  }).exports, mod), mod.exports;
-};
-var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-// If the importer is in node compatibility mode or this is not an ESM
-// file that has been converted to a CommonJS file using a Babel-
-// compatible transform (i.e. "__esModule" has not been set), then set
-// "default" to the CommonJS "module.exports" for node compatibility.
-isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-  value: mod,
-  enumerable: true
-}) : target, mod));
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
-
-// ../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/loading.js
-var require_loading = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/loading.js"(exports2) {
-    "use strict";
-
-    var data = {
-      "width": 24,
-      "height": 24,
-      "body": '<path fill="currentColor" d="M12 2A10 10 0 1 0 22 12A10 10 0 0 0 12 2Zm0 18a8 8 0 1 1 8-8A8 8 0 0 1 12 20Z" opacity=".5"/><path fill="currentColor" d="M20 12h2A10 10 0 0 0 12 2V4A8 8 0 0 1 20 12Z"><animateTransform attributeName="transform" dur="1s" from="0 12 12" repeatCount="indefinite" to="360 12 12" type="rotate"/></path>'
-    };
-    exports2.__esModule = true;
-    exports2.default = data;
-  }
-});
-
-// ../../node_modules/.pnpm/@iconify+icons-mdi@1.2.48/node_modules/@iconify/icons-mdi/success-circle.js
-var require_success_circle = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-mdi@1.2.48/node_modules/@iconify/icons-mdi/success-circle.js"(exports2) {
-    "use strict";
-
-    var data = {
-      "width": 24,
-      "height": 24,
-      "body": '<path fill="currentColor" d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10s10-4.5 10-10S17.5 2 12 2m-2 15l-5-5l1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9Z"/>'
-    };
-    exports2.__esModule = true;
-    exports2.default = data;
-  }
-});
-
-// ../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/three-dots-loading.js
-var require_three_dots_loading = __commonJS({
-  "../../node_modules/.pnpm/@iconify+icons-eos-icons@1.2.6/node_modules/@iconify/icons-eos-icons/three-dots-loading.js"(exports2) {
-    "use strict";
-
-    var data = {
-      "width": 24,
-      "height": 24,
-      "body": '<circle cx="18" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin=".67" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle><circle cx="12" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin=".33" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle><circle cx="6" cy="12" r="0" fill="currentColor"><animate attributeName="r" begin="0" calcMode="spline" dur="1.5s" keySplines="0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8;0.2 0.2 0.4 0.8" repeatCount="indefinite" values="0;2;0;0"/></circle>'
-    };
-    exports2.__esModule = true;
-    exports2.default = data;
-  }
-});
-
-// src/index.ts
-var src_exports = {};
-__export(src_exports, {
-  createTheme: () => createTheme
-});
-module.exports = __toCommonJS(src_exports);
-
-// src/themes/Bruttal/BruttalIcons.ts
-var import_react_icons = require("@ttoss/react-icons");
-var import_add_filled = __toESM(require("@iconify/icons-carbon/add-filled"));
-var import_arrow_right = __toESM(require("@iconify/icons-carbon/arrow-right"));
-var import_arrow_up_right = __toESM(require("@iconify/icons-carbon/arrow-up-right"));
-var import_attachment = __toESM(require("@iconify/icons-carbon/attachment"));
-var import_calendar = __toESM(require("@iconify/icons-carbon/calendar"));
-var import_caret_down = __toESM(require("@iconify/icons-carbon/caret-down"));
-var import_caret_up = __toESM(require("@iconify/icons-carbon/caret-up"));
-var import_checkmark = __toESM(require("@iconify/icons-carbon/checkmark"));
-var import_checkmark_outline = __toESM(require("@iconify/icons-carbon/checkmark-outline"));
-var import_checkbox_checked_filled = __toESM(require("@iconify/icons-carbon/checkbox-checked-filled"));
-var import_checkbox = __toESM(require("@iconify/icons-carbon/checkbox"));
-var import_checkbox_indeterminate_filled = __toESM(require("@iconify/icons-carbon/checkbox-indeterminate-filled"));
-var import_chevron_down = __toESM(require("@iconify/icons-carbon/chevron-down"));
-var import_chevron_left = __toESM(require("@iconify/icons-carbon/chevron-left"));
-var import_chevron_right = __toESM(require("@iconify/icons-carbon/chevron-right"));
-var import_chevron_up = __toESM(require("@iconify/icons-carbon/chevron-up"));
-var import_close_filled = __toESM(require("@iconify/icons-carbon/close-filled"));
-var import_close = __toESM(require("@iconify/icons-carbon/close"));
-var import_copy = __toESM(require("@iconify/icons-carbon/copy"));
-var import_download = __toESM(require("@iconify/icons-carbon/download"));
-var import_edit = __toESM(require("@iconify/icons-carbon/edit"));
-var import_email = __toESM(require("@iconify/icons-carbon/email"));
-var import_error_filled = __toESM(require("@iconify/icons-carbon/error-filled"));
-var import_information_filled = __toESM(require("@iconify/icons-carbon/information-filled"));
-var import_language = __toESM(require("@iconify/icons-carbon/language"));
-var import_loading = __toESM(require_loading());
-var import_menu = __toESM(require("@iconify/icons-carbon/menu"));
-var import_paste = __toESM(require("@iconify/icons-carbon/paste"));
-var import_radio_button_checked = __toESM(require("@iconify/icons-carbon/radio-button-checked"));
-var import_radio_button = __toESM(require("@iconify/icons-carbon/radio-button"));
-var import_renew = __toESM(require("@iconify/icons-carbon/renew"));
-var import_search = __toESM(require("@iconify/icons-carbon/search"));
-var import_share = __toESM(require("@iconify/icons-carbon/share"));
-var import_success_circle = __toESM(require_success_circle());
-var import_three_dots_loading = __toESM(require_three_dots_loading());
-var import_time = __toESM(require("@iconify/icons-carbon/time"));
-var import_trash_can = __toESM(require("@iconify/icons-carbon/trash-can"));
-var import_upload = __toESM(require("@iconify/icons-carbon/upload"));
-var import_user_avatar_filled_alt = __toESM(require("@iconify/icons-carbon/user-avatar-filled-alt"));
-var import_view_filled = __toESM(require("@iconify/icons-carbon/view-filled"));
-var import_view_off_filled = __toESM(require("@iconify/icons-carbon/view-off-filled"));
-var import_warning_alt = __toESM(require("@iconify/icons-carbon/warning-alt"));
-var import_warning_filled = __toESM(require("@iconify/icons-carbon/warning-filled"));
-var replicateIcon = {
-  body: `<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M42 15V42H15V15H42ZM42 12H15C14.2044 12 13.4413 12.3161 12.8787 12.8787C12.3161 13.4413 12 14.2044 12 15V42C12 42.7956 12.3161 43.5587 12.8787 44.1213C13.4413 44.6839 14.2044 45 15 45H42C42.7956 45 43.5587 44.6839 44.1213 44.1213C44.6839 43.5587 45 42.7956 45 42V15C45 14.2044 44.6839 13.4413 44.1213 12.8787C43.5587 12.3161 42.7956 12 42 12Z" fill="currentColor"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M3 5.76389C3 4.23744 4.26071 3 5.81588 3H29V5.57963H5.81588C5.71221 5.57963 5.62816 5.66213 5.62816 5.76389V28.994C5.62816 29.0957 5.71221 29.1782 5.81588 29.1782H22.2607L18.7784 25.7602L20.6368 23.9361L27.2916 30.4681L20.6368 37L18.7784 35.1759L22.2607 31.7579H5.81588C4.26071 31.7579 3 30.5204 3 28.994V5.76389Z" fill="currentColor"/>
-  </svg>`,
-  width: 48,
-  height: 48
-};
-var subtractIcon = {
-  body: `<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M14 26H34V22H14V26ZM24 44C21.2333 44 18.6333 43.4747 16.2 42.424C13.7667 41.3733 11.65 39.9487 9.85 38.15C8.05 36.35 6.62533 34.2333 5.576 31.8C4.52667 29.3667 4.00133 26.7667 4 24C4 21.2333 4.52533 18.6333 5.576 16.2C6.62667 13.7667 8.05133 11.65 9.85 9.85C11.65 8.05 13.7667 6.62533 16.2 5.576C18.6333 4.52667 21.2333 4.00133 24 4C26.7667 4 29.3667 4.52533 31.8 5.576C34.2333 6.62667 36.35 8.05133 38.15 9.85C39.95 11.65 41.3753 13.7667 42.426 16.2C43.4767 18.6333 44.0013 21.2333 44 24C44 26.7667 43.4747 29.3667 42.424 31.8C41.3733 34.2333 39.9487 36.35 38.15 38.15C36.35 39.95 34.2333 41.3753 31.8 42.426C29.3667 43.4767 26.7667 44.0013 24 44Z" fill="black"/>
-  </svg>
-  `,
-  width: 48,
-  height: 48
-};
-var BrutalIcons = {
-  add: import_add_filled.default,
-  "arrow-right": import_arrow_right.default,
-  attachment: import_attachment.default,
-  avatar: import_user_avatar_filled_alt.default,
-  "caret-down": import_caret_down.default,
-  "caret-up": import_caret_up.default,
-  calendar: import_calendar.default,
-  "checkbox-checked": import_checkbox_checked_filled.default,
-  "checkbox-indeterminate": import_checkbox_indeterminate_filled.default,
-  "checkbox-unchecked": import_checkbox.default,
-  check: import_checkmark.default,
-  "check-mark": import_checkmark_outline.default,
-  close: import_close.default,
-  copy: import_copy.default,
-  download: import_download.default,
-  edit: import_edit.default,
-  email: import_email.default,
-  delete: import_trash_can.default,
-  error: import_error_filled.default,
-  info: import_information_filled.default,
-  language: import_language.default,
-  loading: import_loading.default,
-  "menu-open": import_menu.default,
-  "open-link": import_arrow_up_right.default,
-  paste: import_paste.default,
-  "picker-down": import_chevron_down.default,
-  "picker-up": import_chevron_up.default,
-  "nav-left": import_chevron_left.default,
-  "nav-right": import_chevron_right.default,
-  "radio-not-selected": import_radio_button.default,
-  "radio-selected": import_radio_button_checked.default,
-  refresh: import_renew.default,
-  replicate: replicateIcon,
-  search: import_search.default,
-  share: import_share.default,
-  subtract: subtractIcon,
-  "success-circle": import_success_circle.default,
-  "small-close": import_close_filled.default,
-  "three-dots-loading": import_three_dots_loading.default,
-  time: import_time.default,
-  upload: import_upload.default,
-  "view-off": import_view_off_filled.default,
-  "view-on": import_view_filled.default,
-  warning: import_warning_filled.default,
-  "warning-alt": import_warning_alt.default
-};
-Object.entries(BrutalIcons).forEach(([key, icon]) => {
-  (0, import_react_icons.addIcon)(key, icon);
-});
-
-// src/helpers/geometricCalc.ts
-var SIZE_TYPE = "rem";
-var calcMultiplyingValues = (initialValue, base, ratio, sizeType = SIZE_TYPE) => {
-  const result = initialValue * Math.pow(base, ratio);
-  return `${result.toFixed(2)}${sizeType}`;
-};
-var calcDividingValues = (initialValue, base, ratio, sizeType = SIZE_TYPE) => {
-  const result = initialValue / Math.pow(base, ratio);
-  return `${result.toFixed(2)}${sizeType}`;
-};
-
-// src/tokens/fontSizes.ts
-var SIZE_TYPE2 = "rem";
-var BASE = 1;
-var MULTIPLIER_FACTOR = 1.333;
-var fontSizes = {
-  "2xs": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, -3),
-  xs: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, -2),
-  sm: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, -1),
-  base: `${BASE}${SIZE_TYPE2}`,
-  lg: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 1),
-  xl: calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 2),
-  "2xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 3),
-  "3xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 4),
-  "4xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 5),
-  "5xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 6),
-  "6xl": calcMultiplyingValues(BASE, MULTIPLIER_FACTOR, 7)
-};
-
-// src/tokens/fontWeights.ts
-var fontWeights = {
-  thin: 100,
-  extralight: 200,
-  light: 300,
-  normal: 400,
-  medium: 500,
-  semibold: 600,
-  bold: 700,
-  extrabold: 800
-};
-
-// src/tokens/letterSpacings.ts
-var letterSpacings = {
-  tighter: "-0.05em",
-  tight: "-0.025em",
-  regular: "0em",
-  wide: "0.05em",
-  wider: "0.1em",
-  widest: "0.5em"
-};
-
-// src/tokens/lineHeights.ts
-var BASE2 = 100;
-var MULTIPLIER_FACTOR2 = 1.333;
-var SIZE_TYPE3 = "%";
-var lineHeights = {
-  "2xs": calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, -3, SIZE_TYPE3),
-  xs: calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, -2, SIZE_TYPE3),
-  sm: calcDividingValues(BASE2, MULTIPLIER_FACTOR2, 1, SIZE_TYPE3),
-  base: "normal",
-  lg: calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, 1, SIZE_TYPE3),
-  xl: calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, 2, SIZE_TYPE3),
-  "2xl": calcMultiplyingValues(BASE2, MULTIPLIER_FACTOR2, 3, SIZE_TYPE3),
-  flat: "100%"
-};
-
-// src/tokens/space.ts
-var SIZE_TYPE4 = "rem";
-var MD = 0.5;
-var MULTIPLIER_FACTOR3 = 1.618;
-var space = {
-  none: 0,
-  "2xs": calcDividingValues(MD, MULTIPLIER_FACTOR3, 3),
-  xs: calcDividingValues(MD, MULTIPLIER_FACTOR3, 2),
-  sm: calcDividingValues(MD, MULTIPLIER_FACTOR3, 1),
-  md: `${MD}${SIZE_TYPE4}`,
-  lg: calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 1),
-  xl: calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 2),
-  "2xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 3),
-  "3xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 4),
-  "4xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 5),
-  "5xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 6),
-  "6xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 7),
-  "7xl": calcMultiplyingValues(MD, MULTIPLIER_FACTOR3, 8)
-};
-
-// src/tokens/zIndices.ts
-var zIndices = {
-  deep: -9999,
-  behind: -1,
-  auto: "auto",
-  base: 0,
-  docked: 10,
-  /**
-   * Sticky is a CSS property that can be applied to an element to make it
-   * "stick" or remain fixed in a specific position relative to the viewport
-   * as the user scrolls the page. When an element is set as sticky, it will
-   * initially behave like a normal element but once the user scrolls past a
-   * certain threshold, it will stick to the designated position.
-   */
-  sticky: 100,
-  /**
-   * An overlay is a graphical element used in user interfaces to cover or
-   * partially obscure the underlying content. It is typically a
-   * semi-transparent or opaque layer that is positioned above other elements
-   * on the screen. Overlays are commonly employed to provide visual effects,
-   * create modal or pop-up dialogs, highlight or focus user attention, or
-   * serve as a background for elements such as tooltips, modals, or dropdown
-   * menus. They are often used to add depth, dimension, and visual hierarchy
-   * to the interface by visually separating or layering content.
-   */
-  overlay: 1e3,
-  /**
-   * A modal is a user interface component that appears as a dialog or window
-   * overlay on top of the main content, temporarily interrupting the user's
-   * interaction flow. It is commonly used to display additional information,
-   * request user input, or confirm an action. Modals typically have a higher
-   * z-index value than other elements on the page to ensure they are visually
-   * prominent and receive the user's full attention. They often feature a
-   * close button or an overlay click outside the modal to dismiss them and
-   * return to the underlying content. Modals help to focus user attention and
-   * provide a context-specific interaction within a larger interface.
-   */
-  modal: 2e3,
-  /**
-   * A dropdown is a user interface component that presents a list of
-   * selectable options when triggered by a user action, such as clicking on a
-   * dropdown button or input field. When activated, a dropdown expands
-   * vertically to reveal a list of choices, allowing the user to select a
-   * single option. The selected option is then displayed in the closed state
-   * of the dropdown. Dropdowns are commonly used to conserve space on a page
-   * or provide a convenient way to choose from a predefined set of options.
-   * They can be found in various contexts, such as navigation menus, form
-   * inputs, or filter controls. Dropdowns enhance user interaction by
-   * providing a compact and organized selection mechanism within the interface.
-   */
-  dropdown: 3e3,
-  /**
-   * A popover is a user interface component that provides contextual
-   * information or options when triggered by a user action, such as hovering
-   * over an element or clicking a button. It typically appears as a small
-   * overlay near the triggering element, offering additional details, actions,
-   * or related content. Popovers are designed to be non-intrusive and provide
-   * concise information or quick actions without requiring the user to
-   * navigate to a different page or screen. They are often used to enhance the
-   * user's understanding or provide supplementary functionality within a
-   * specific context. Popovers are commonly positioned above other elements in
-   * the interface to ensure visibility and accessibility.
-   */
-  popover: 4e3,
-  /**
-   * A tooltip is a small, informative message or hint that appears when a user
-   * hovers over or interacts with an element, such as a button, link, or icon.
-   * It is typically displayed as a brief, contextual text or label that
-   * provides additional information or clarifies the purpose of the element.
-   * Tooltips are used to improve the user's understanding of interface
-   * elements and enhance usability. They are generally positioned near the
-   * associated element, often appearing as a small box or bubble that pops up
-   * temporarily and disappears when the user moves the cursor away from the
-   * element. Tooltips are designed to be unobtrusive and provide helpful
-   * guidance or supplementary details without requiring the user to take any
-   * additional actions.
-   */
-  tooltip: 5e3,
-  /**
-   * A toast is a brief, temporary notification or message that appears on the
-   *  screen to provide important information or alerts to the user. It
-   * typically appears as a small box or banner positioned in a non-intrusive
-   * area of the interface, such as the top or bottom of the screen. Toasts are
-   * used to communicate updates, notifications, or status messages that may
-   * require the user's attention but do not require immediate action. They are
-   *  designed to be unobtrusive and automatically disappear after a short
-   * period, often with a fade-out animation. Toasts are commonly used in web
-   * and mobile applications to provide timely feedback or inform the user
-   * about completed actions, errors, or system updates.
-   */
-  toast: 6e3
-};
-
-// src/themes/Bruttal/BruttalTheme.ts
-var coreFonts = {
-  main: '"Atkinson Hyperlegible", sans-serif',
-  contrast: '"Work Sans", sans-serif',
-  monospace: '"Inconsolata", sans-serif'
-};
-var brandColors = {
-  complimentary: "#f4f3f3",
-  main: "#292C2a",
-  darkNeutral: "#325C82",
-  accent: "#0469E3",
-  lightNeutral: "#F8F8F8"
-};
-var coreColors = {
-  ...brandColors,
-  gray100: "#f9f9f9",
-  gray200: "#dedede",
-  gray300: "#c4c4c4",
-  gray400: "#ababab",
-  gray500: "#929292",
-  gray600: "#7a7a7a",
-  gray700: "#626262",
-  gray800: "#4c4c4c",
-  gray900: "#323232",
-  black: "#000000",
-  red100: "#ffebeb",
-  red200: "#fdbfbf",
-  red300: "#f99595",
-  red400: "#f56c6c",
-  red500: "#ef4444",
-  red600: "#e42828",
-  red700: "#c62121",
-  white: "#ffffff",
-  amber600: "#d97706",
-  teal600: "#0d9488"
-};
-var coreBorders = {
-  none: "0px solid",
-  thin: "1px solid",
-  medium: "2px solid",
-  thick: "4px solid"
-};
-var coreRadii = {
-  sharp: "0px",
-  xs: "2px",
-  sm: "4px",
-  md: "6px",
-  lg: "8px",
-  xl: "12px",
-  "2xl": "16px",
-  "3xl": "24px",
-  circle: "9999px"
-};
-var BruttalTheme = {
-  /**
-   * Tokens
-   */
-  fontSizes,
-  fontWeights,
-  letterSpacings,
-  space,
-  lineHeights,
-  zIndices,
-  colors: {
-    background: coreColors.complimentary,
-    text: coreColors.black,
-    muted: coreColors.gray200,
-    onMuted: coreColors.gray600,
-    mutedOutline: coreColors.gray300,
-    danger: coreColors.red700,
-    onDanger: coreColors.white,
-    notice: coreColors.amber600,
-    onNotice: coreColors.white,
-    positive: coreColors.teal600,
-    onPositive: coreColors.white,
-    surface: coreColors.white,
-    contentHeader: coreColors.gray200,
-    onContentHeader: coreColors.black,
-    outline: coreColors.gray500,
-    primary: coreColors.main,
-    onPrimary: coreColors.white,
-    secondary: coreColors.gray100,
-    onSecondary: coreColors.black,
-    highlight: coreColors.darkNeutral,
-    onHighlight: coreColors.complimentary,
-    accent: coreColors.accent,
-    onAccent: coreColors.white,
-    neutral: coreColors.darkNeutral,
-    onNeutral: coreColors.lightNeutral,
-    underemphasize: coreColors.gray300
-  },
-  fonts: {
-    main: coreColors.main,
-    contrast: coreFonts.contrast,
-    body: coreFonts.main,
-    highlight: coreFonts.main,
-    caption: coreFonts.main
-  },
-  borders: {
-    default: coreBorders.thin,
-    secondary: coreBorders.medium,
-    muted: coreBorders.thin,
-    interaction: coreBorders.medium,
-    danger: coreBorders.medium,
-    highlight: coreBorders.medium
-  },
-  radii: {
-    informative: coreRadii.xs,
-    default: coreRadii.sm,
-    action: coreRadii.sm
-  },
-  /**
-   * Global styles
-   */
-  styles: {
-    root: {
-      fontFamily: "body",
-      fontWeight: "normal",
-      fontSize: "base",
-      zIndex: "base",
-      margin: 0,
-      padding: 0,
-      backgroundColor: "background",
-      /**
-       * HTML elements
-       */
-      table: {
-        borderCollapse: "collapse"
-      },
-      th: {
-        paddingX: "md",
-        paddingY: "md"
-      },
-      tr: {
-        borderBottom: "default"
-      },
-      td: {
-        paddingX: "xl",
-        paddingY: "md"
-      }
-    },
-    a: {
-      color: "text",
-      fontFamily: "body",
-      textDecorationLine: "underline",
-      lineHeight: "base",
-      "&.quiet:not(:hover)": {
-        textDecorationLine: "none"
-      },
-      ":visited": {
-        color: "highlight"
-      }
-    }
-  },
-  /**
-   * Components
-   */
-  badges: {
-    positive: {
-      color: "onPositive",
-      bg: "positive"
-    },
-    negative: {
-      color: "onDanger",
-      bg: "danger"
-    },
-    neutral: {
-      color: "onSecondary",
-      bg: "secondary",
-      border: "muted",
-      borderColor: "onMuted"
-    },
-    informative: {
-      color: "onNotice",
-      bg: "notice"
-    },
-    muted: {
-      color: "onMuted",
-      bg: "muted"
-    }
-  },
-  buttons: {
-    accent: {
-      backgroundColor: "accent",
-      color: "onAccent",
-      borderRadius: "action",
-      borderColor: "accent",
-      ":hover:not(:active,[disabled])": {
-        filter: "brightness(90%)"
-      },
-      ":disabled": {
-        cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
-      }
-    },
-    primary: {
-      backgroundColor: "primary",
-      color: "onPrimary",
-      borderRadius: "action",
-      borderColor: "primary",
-      ":hover:not(:active,[disabled])": {
-        filter: "brightness(90%)"
-      },
-      ":active": {
-        backgroundColor: "primary",
-        color: "onPrimary",
-        borderColor: "outline"
-      },
-      ":disabled": {
-        cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
-      }
-    },
-    secondary: {
-      backgroundColor: "secondary",
-      color: "onSecondary",
-      borderRadius: "action",
-      border: "secondary",
-      borderColor: "onSecondary",
-      ":hover:not(:active,[disabled])": {
-        filter: "brightness(90%)"
-      },
-      ":disabled": {
-        cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
-      }
-    },
-    destructive: {
-      color: "onDanger",
-      backgroundColor: "danger",
-      ":hover:not(:active,[disabled])": {
-        filter: "brightness(90%)"
-      },
-      ":disabled": {
-        cursor: "default",
-        backgroundColor: "muted",
-        borderColor: "muted",
-        color: "onMuted"
-      }
-    },
-    closeButton: {
-      backgroundColor: "background",
-      color: "primary",
-      border: "default",
-      borderColor: "primary",
-      borderRadius: "action",
-      ":disabled": {
-        border: "muted",
-        borderColor: "onMuted",
-        backgroundColor: "muted",
-        color: "onMuted",
-        cursor: "not-allowed"
-      },
-      ":is(:focus-within, :hover):not(:disabled)": {
-        color: "onHighlight",
-        backgroundColor: "highlight",
-        borderColor: "highlight"
-      }
-    },
-    actionButton: {
-      default: {
-        backgroundColor: "secondary",
-        color: "onSecondary",
-        border: "default",
-        borderColor: "onSecondary",
-        transition: "all 0.2s",
-        ":is(:focus-within, :hover)": {
-          backgroundColor: "highlight",
-          borderColor: "highlight",
-          color: "onHighlight"
-        }
-      },
-      accent: {
-        backgroundColor: "accent",
-        color: "onAccent",
-        border: "none"
-      },
-      quiet: {
-        backgroundColor: "transparent",
-        color: "text",
-        border: "none",
-        borderColor: "transparent"
-      }
-    }
-  },
-  cards: {
-    primary: {
-      backgroundColor: "primary",
-      border: "1px solid black",
-      padding: [4, 5],
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      width: "fit-content"
-    }
-  },
-  forms: {
-    label: {
-      color: "text",
-      '&:is([aria-disabled="true"])': {
-        color: "onMuted"
-      },
-      '& > span[aria-label="tooltip"]': {
-        fontSize: "sm",
-        marginLeft: "2xs"
-      },
-      '&:has(input[type="checkbox"])': {
-        fontSize: "base",
-        gap: "md"
-      },
-      '& > div:has(input[type="checkbox"]) > svg': {
-        marginRight: 0
-      },
-      '&:has(input[type="checkbox"]:disabled)': {
-        color: "onMuted"
-      },
-      '&:has(div > input[type="radio"])': {
-        alignItems: "center"
-      },
-      '&:has(div > input[type="radio"]:disabled)': {
-        color: "muted"
-      }
-    },
-    radio: {
-      color: "text",
-      fontFamily: "body",
-      fontSize: "lg",
-      "input:disabled ~ &": {
-        color: "muted"
-      },
-      'input[aria-invalid="true"] ~ &': {
-        color: "danger"
-      },
-      "input:focus ~ &": {
-        bg: "transparent"
-      },
-      "&:is(svg, svg + svg)": {
-        width: fontSizes.base,
-        height: fontSizes.base
-      }
-    },
-    checkbox: {
-      "input:focus ~ &": {
-        bg: "transparent"
-      },
-      "input:not(:checked) ~ &": {
-        color: "primary"
-      },
-      "input:disabled ~ &": {
-        color: "muted"
-      },
-      "input:disabled ~ & path": {
-        backgroundColor: "onMuted"
-      },
-      'input[aria-invalid="true"] ~ &': {
-        color: "danger"
-      },
-      "&:is(svg, svg + svg)": {
-        width: fontSizes.base,
-        height: fontSizes.base
-      }
-    },
-    input: {
-      color: "text",
-      border: "interaction",
-      borderColor: "onMuted",
-      borderRadius: "action",
-      backgroundColor: "surface",
-      fontSize: "base",
-      lineHeight: "base",
-      "::placeholder": {
-        color: "onMuted"
-      },
-      ":focus-within": {
-        outlineColor: "neutral"
-      },
-      ":disabled": {
-        backgroundColor: "muted",
-        color: "onMuted",
-        border: "muted",
-        borderColor: "onMuted"
-      },
-      '&[aria-invalid="true"]': {
-        borderColor: "danger"
-      },
-      '&[aria-invalid="true"] ~ span:has(iconify-icon)': {
-        color: "danger"
-      }
-    },
-    inputNumber: {
-      color: "text",
-      border: "interaction",
-      borderColor: "onMuted",
-      borderRadius: "action",
-      ":disabled": {
-        border: "muted",
-        borderColor: "onMuted",
-        color: "muted"
-      },
-      ":disabled ~ span > iconify-icon": {
-        color: "muted",
-        cursor: "default"
-      },
-      ":focus-within": {
-        outlineColor: "highlight"
-      },
-      ':not(:disabled, [aria-invalid="true"]):hover': {
-        borderColor: "highlight"
-      },
-      ':not(:disabled, [aria-invalid="true"]) ~ span:has(iconify-icon):hover': {
-        color: "highlight"
-      },
-      "& ~ span:has(iconify-icon)": {
-        fontSize: "base"
-      },
-      '&[aria-invalid="true"]': {
-        border: "danger",
-        borderColor: "danger",
-        color: "danger",
-        outlineColor: "danger"
-      },
-      '&[aria-invalid="true"] ~ span>iconify-icon': {
-        color: "danger"
-      }
-    },
-    select: {
-      color: "text",
-      backgroundColor: "surface",
-      border: "interaction",
-      borderColor: "onMuted",
-      borderRadius: "action",
-      ":disabled": {
-        border: "muted",
-        borderColor: "onMuted",
-        backgroundColor: "muted",
-        color: "onMuted"
-      },
-      ":disabled ~ * > span:has(iconify-icon)": {
-        color: "onMuted"
-      },
-      '&[aria-invalid="true"]': {
-        border: "danger",
-        borderColor: "danger",
-        outlineColor: "danger"
-      },
-      '&[aria-invalid="true"] ~ * > span.error-icon': {
-        color: "danger"
-      }
-    },
-    textarea: {
-      color: "text",
-      border: "interaction",
-      borderColor: "onMuted",
-      backgroundColor: "surface",
-      borderRadius: "action",
-      ":focus-within": {
-        outlineColor: "primary"
-      },
-      ":disabled::placeholder": {
-        color: "onMuted"
-      },
-      ":disabled": {
-        borderColor: "onMuted",
-        backgroundColor: "muted",
-        border: "muted",
-        color: "onMuted"
-      },
-      '&[aria-invalid="true"]': {
-        borderColor: "danger",
-        outlineColor: "danger"
-      },
-      '&[aria-invalid="true"]+span>iconify-icon': {
-        color: "danger",
-        fontSize: "base"
-      }
-    }
-  },
-  text: {
-    default: {
-      color: "text",
-      fontFamily: "body"
-    },
-    title: {
-      fontFamily: "heading",
-      fontSize: 4,
-      lineSpace: "3.5"
-    },
-    help: {
-      color: "text",
-      '&[aria-disabled="true"]': {
-        color: "onMuted"
-      },
-      negative: {
-        color: "danger",
-        '&[aria-disabled="true"]': {
-          color: "onMuted"
-        }
-      }
-    },
-    headline: {
-      fontFamily: "contrast",
-      fontWeight: "bold",
-      lineHeight: "flat",
-      fontSize: "5xl",
-      letterSpacing: "regular"
-    },
-    subheadline: {
-      fontFamily: "main",
-      fontWeight: "bold",
-      lineHeight: "base",
-      fontSize: "xl",
-      letterSpacing: "regular"
-    },
-    h1: {
-      fontFamily: "contrast",
-      fontWeight: "extrabold",
-      lineHeight: "base",
-      fontSize: "3xl",
-      letterSpacing: "regular"
-    },
-    h2: {
-      fontFamily: "contrast",
-      fontWeight: "bold",
-      lineHeight: "base",
-      fontSize: "2xl",
-      letterSpacing: "regular"
-    },
-    h3: {
-      fontFamily: "contrast",
-      fontWeight: "bold",
-      lineHeight: "base",
-      fontSize: "xl",
-      letterSpacing: "regular"
-    },
-    h4: {
-      fontFamily: "contrast",
-      fontWeight: "semibold",
-      lineHeight: "base",
-      fontSize: "lg",
-      letterSpacing: "regular"
-    },
-    h5: {
-      fontFamily: "contrast",
-      fontWeight: "semibold",
-      lineHeight: "base",
-      fontSize: "base",
-      letterSpacing: "regular"
-    }
-  }
-};
-
-// src/createTheme.ts
-var import_deepmerge = __toESM(require("deepmerge"));
-var createTheme = theme => {
-  return (0, import_deepmerge.default)(BruttalTheme, theme);
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  createTheme
-});