@rotki/ui-library 2.8.1 → 2.8.2

package/dist/theme/index.js

@@ -0,0 +1,185 @@
+import plugin from "tailwindcss/plugin";
+import { baseColors, baseColorsIntensities, contextColors } from "../consts/colors.js";
+const baseColorsCombination = Object.fromEntries(
+  baseColors.map((color) => [
+    color,
+    Object.fromEntries(
+      baseColorsIntensities.map((intensity) => [
+        intensity,
+        `rgba(var(--rui-${color}-${intensity}), <alpha-value>)`
+      ])
+    )
+  ])
+);
+const contextColorsCombination = Object.fromEntries(
+  ["light", "dark"].map((theme) => [
+    theme,
+    Object.fromEntries(
+      contextColors.map((color) => [
+        color,
+        {
+          darker: `rgba(var(--rui-${theme}-${color}-darker), <alpha-value>)`,
+          DEFAULT: `rgba(var(--rui-${theme}-${color}-main), <alpha-value>)`,
+          lighter: `rgba(var(--rui-${theme}-${color}-lighter), <alpha-value>)`,
+          shade: `color-mix(in srgb, black calc(<alpha-value> * 100%), rgb(var(--rui-${theme}-${color}-main)))`,
+          tint: `color-mix(in srgb, white calc(<alpha-value> * 100%), rgb(var(--rui-${theme}-${color}-main)))`
+        }
+      ])
+    )
+  ])
+);
+const adaptiveContextColorCombination = Object.fromEntries(
+  contextColors.map((color) => [
+    color,
+    {
+      darker: `rgba(var(--rui-${color}-darker), <alpha-value>)`,
+      DEFAULT: `rgba(var(--rui-${color}-main), <alpha-value>)`,
+      lighter: `rgba(var(--rui-${color}-lighter), <alpha-value>)`,
+      shade: `color-mix(in srgb, black calc(<alpha-value> * 100%), rgb(var(--rui-${color}-main)))`,
+      tint: `color-mix(in srgb, white calc(<alpha-value> * 100%), rgb(var(--rui-${color}-main)))`
+    }
+  ])
+);
+const textColorsCombination = Object.fromEntries(
+  ["light", "dark"].map((theme) => [
+    theme,
+    {
+      text: {
+        DEFAULT: `var(--rui-${theme}-text-primary)`,
+        disabled: `var(--rui-${theme}-text-disabled)`,
+        secondary: `var(--rui-${theme}-text-secondary)`
+      }
+    }
+  ])
+);
+const adaptiveTextColorsCombination = {
+  text: {
+    DEFAULT: `var(--rui-text-primary)`,
+    disabled: `var(--rui-text-disabled)`,
+    secondary: `var(--rui-text-secondary)`
+  }
+};
+const themePlugin = plugin(
+  ({ addUtilities, addVariant, matchUtilities }) => {
+    addUtilities({
+      ".border-default": {
+        "border-color": "rgb(var(--rui-grey-200))"
+      },
+      ".dark .border-default": {
+        "border-color": "rgb(var(--rui-grey-800))"
+      }
+    });
+    addUtilities({
+      ".text-body-1": {
+        "@apply text-base": {}
+      },
+      ".text-body-2": {
+        "@apply text-sm": {}
+      },
+      ".text-caption": {
+        "@apply text-xs": {},
+        "line-height": "1.25rem"
+      },
+      ".text-h1": {
+        "@apply text-8xl font-light": {},
+        "line-height": "7rem"
+      },
+      ".text-h2": {
+        "@apply text-6xl font-light": {},
+        "line-height": "4.5rem"
+      },
+      ".text-h3": {
+        "@apply text-5xl": {},
+        "line-height": "3.5rem"
+      },
+      ".text-h4": {
+        "@apply text-4xl font-semibold": {},
+        "line-height": "2.625rem"
+      },
+      ".text-h5": {
+        "@apply text-2xl": {},
+        "line-height": "2rem"
+      },
+      ".text-h6": {
+        "@apply text-xl font-medium": {},
+        "line-height": "2rem"
+      },
+      ".text-overline": {
+        "@apply text-xs uppercase": {},
+        "line-height": "2rem"
+      },
+      ".text-subtitle-1": {
+        "@apply text-base": {},
+        "line-height": "1.75rem"
+      },
+      ".text-subtitle-2": {
+        "@apply text-sm font-medium": {},
+        "line-height": "1.25rem"
+      }
+    });
+    matchUtilities(
+      Object.fromEntries(
+        ["bg-tint", "bg-shade", "text-tint", "text-shade"].map((item) => [
+          item,
+          (value) => ({
+            animation: `${item} 1s calc(${value} * -1s) linear forwards paused`
+          })
+        ])
+      )
+    );
+    addVariant("color-mix-supported", "@supports (color-mix())");
+  },
+  {
+    theme: {
+      extend: {
+        boxShadow: {
+          1: "0px 2px 1px -1px var(--rui-shadow-primary), 0px 1px 1px var(--rui-shadow-secondary), 0px 1px 3px var(--rui-shadow-tertiary)",
+          10: "0px 6px 6px -3px var(--rui-shadow-primary), 0px 10px 14px 1px var(--rui-shadow-secondary), 0px 4px 18px 3px var(--rui-shadow-tertiary)",
+          11: "0px 6px 7px -4px var(--rui-shadow-primary), 0px 11px 15px 1px var(--rui-shadow-secondary), 0px 4px 20px 3px var(--rui-shadow-tertiary)",
+          12: "0px 7px 8px -4px var(--rui-shadow-primary), 0px 12px 17px 2px var(--rui-shadow-secondary), 0px 5px 22px 4px var(--rui-shadow-tertiary)",
+          13: "0px 7px 8px -4px var(--rui-shadow-primary), 0px 13px 19px 2px var(--rui-shadow-secondary), 0px 5px 24px 4px var(--rui-shadow-tertiary)",
+          14: "0px 7px 9px -4px var(--rui-shadow-primary), 0px 14px 21px 2px var(--rui-shadow-secondary), 0px 5px 26px 4px var(--rui-shadow-tertiary)",
+          15: "0px 8px 9px -5px var(--rui-shadow-primary), 0px 15px 22px 2px var(--rui-shadow-secondary), 0px 6px 28px 5px var(--rui-shadow-tertiary)",
+          16: "0px 8px 10px -5px var(--rui-shadow-primary), 0px 16px 24px 2px var(--rui-shadow-secondary), 0px 6px 30px 5px var(--rui-shadow-tertiary)",
+          17: "0px 8px 11px -5px var(--rui-shadow-primary), 0px 17px 26px 2px var(--rui-shadow-secondary), 0px 6px 32px 5px var(--rui-shadow-tertiary)",
+          18: "0px 9px 11px -5px var(--rui-shadow-primary), 0px 18px 28px 2px var(--rui-shadow-secondary), 0px 7px 34px 6px var(--rui-shadow-tertiary)",
+          19: "0px 9px 12px -6px var(--rui-shadow-primary), 0px 19px 29px 2px var(--rui-shadow-secondary), 0px 7px 36px 6px var(--rui-shadow-tertiary)",
+          2: "0px 3px 1px -2px var(--rui-shadow-primary), 0px 2px 2px var(--rui-shadow-secondary), 0px 1px 5px var(--rui-shadow-tertiary)",
+          20: "0px 10px 13px -6px var(--rui-shadow-primary), 0px 20px 31px 3px var(--rui-shadow-secondary), 0px 8px 38px 7px var(--rui-shadow-tertiary)",
+          21: "0px 10px 13px -6px var(--rui-shadow-primary), 0px 21px 33px 3px var(--rui-shadow-secondary), 0px 8px 40px 7px var(--rui-shadow-tertiary)",
+          22: "0px 10px 14px -6px var(--rui-shadow-primary), 0px 22px 35px 3px var(--rui-shadow-secondary), 0px 8px 42px 7px var(--rui-shadow-tertiary)",
+          23: "0px 11px 14px -7px var(--rui-shadow-primary), 0px 23px 36px 3px var(--rui-shadow-secondary), 0px 9px 44px 8px var(--rui-shadow-tertiary)",
+          24: "0px 11px 15px -7px var(--rui-shadow-primary), 0px 24px 38px 3px var(--rui-shadow-secondary), 0px 9px 46px 8px var(--rui-shadow-tertiary)",
+          3: "0px 3px 3px -2px var(--rui-shadow-primary), 0px 3px 4px var(--rui-shadow-secondary), 0px 1px 8px var(--rui-shadow-tertiary)",
+          4: "0px 2px 4px -1px var(--rui-shadow-primary), 0px 4px 5px var(--rui-shadow-secondary), 0px 1px 10px var(--rui-shadow-tertiary)",
+          5: "0px 3px 5px -1px var(--rui-shadow-primary), 0px 5px 8px var(--rui-shadow-secondary), 0px 1px 14px var(--rui-shadow-tertiary)",
+          6: "0px 3px 5px -1px var(--rui-shadow-primary), 0px 6px 10px var(--rui-shadow-secondary), 0px 1px 18px var(--rui-shadow-tertiary)",
+          7: "0px 4px 5px -2px var(--rui-shadow-primary), 0px 7px 10px 1px var(--rui-shadow-secondary), 0px 2px 16px 1px var(--rui-shadow-tertiary)",
+          8: "0px 5px 5px -3px var(--rui-shadow-primary), 0px 8px 10px 1px var(--rui-shadow-secondary), 0px 3px 14px 2px var(--rui-shadow-tertiary)",
+          9: "0px 5px 6px -3px var(--rui-shadow-primary), 0px 9px 12px 1px var(--rui-shadow-secondary), 0px 3px 16px 2px var(--rui-shadow-tertiary)"
+        },
+        colors: {
+          rui: {
+            ...baseColorsCombination,
+            ...contextColorsCombination,
+            ...textColorsCombination,
+            dark: {
+              ...contextColorsCombination.dark,
+              ...textColorsCombination.dark
+            },
+            light: {
+              ...contextColorsCombination.light,
+              ...textColorsCombination.light
+            },
+            ...adaptiveContextColorCombination,
+            ...adaptiveTextColorsCombination
+          }
+        }
+      }
+    }
+  }
+);
+export {
+  themePlugin as default
+};
+//# sourceMappingURL=index.js.map

package/dist/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/theme/index.ts"],"sourcesContent":["import plugin from 'tailwindcss/plugin';\nimport {\n  baseColors,\n  baseColorsIntensities,\n  contextColors,\n} from '../consts/colors';\n\nconst baseColorsCombination = Object.fromEntries(\n  baseColors.map((color: string) => [\n    color,\n    Object.fromEntries(\n      baseColorsIntensities.map((intensity: string) => [\n        intensity,\n        `rgba(var(--rui-${color}-${intensity}), <alpha-value>)`,\n      ]),\n    ),\n  ]),\n);\n\nconst contextColorsCombination = Object.fromEntries(\n  ['light', 'dark'].map(theme => [\n    theme,\n    Object.fromEntries(\n      contextColors.map(color => [\n        color,\n        {\n          darker: `rgba(var(--rui-${theme}-${color}-darker), <alpha-value>)`,\n          DEFAULT: `rgba(var(--rui-${theme}-${color}-main), <alpha-value>)`,\n          lighter: `rgba(var(--rui-${theme}-${color}-lighter), <alpha-value>)`,\n          shade: `color-mix(in srgb, black calc(<alpha-value> * 100%), rgb(var(--rui-${theme}-${color}-main)))`,\n          tint: `color-mix(in srgb, white calc(<alpha-value> * 100%), rgb(var(--rui-${theme}-${color}-main)))`,\n        },\n      ]),\n    ),\n  ]),\n);\n\nconst adaptiveContextColorCombination = Object.fromEntries(\n  contextColors.map(color => [\n    color,\n    {\n      darker: `rgba(var(--rui-${color}-darker), <alpha-value>)`,\n      DEFAULT: `rgba(var(--rui-${color}-main), <alpha-value>)`,\n      lighter: `rgba(var(--rui-${color}-lighter), <alpha-value>)`,\n      shade: `color-mix(in srgb, black calc(<alpha-value> * 100%), rgb(var(--rui-${color}-main)))`,\n      tint: `color-mix(in srgb, white calc(<alpha-value> * 100%), rgb(var(--rui-${color}-main)))`,\n    },\n  ]),\n);\n\nconst textColorsCombination = Object.fromEntries(\n  ['light', 'dark'].map(theme => [\n    theme,\n    {\n      text: {\n        DEFAULT: `var(--rui-${theme}-text-primary)`,\n        disabled: `var(--rui-${theme}-text-disabled)`,\n        secondary: `var(--rui-${theme}-text-secondary)`,\n      },\n    },\n  ]),\n);\n\nconst adaptiveTextColorsCombination = {\n  text: {\n    DEFAULT: `var(--rui-text-primary)`,\n    disabled: `var(--rui-text-disabled)`,\n    secondary: `var(--rui-text-secondary)`,\n  },\n};\n\nconst themePlugin = plugin(\n  ({ addUtilities, addVariant, matchUtilities }) => {\n    // Border utilities\n    addUtilities({\n      '.border-default': {\n        'border-color': 'rgb(var(--rui-grey-200))',\n      },\n      '.dark .border-default': {\n        'border-color': 'rgb(var(--rui-grey-800))',\n      },\n    });\n\n    // Typography\n    addUtilities({\n      '.text-body-1': {\n        '@apply text-base': {},\n      },\n      '.text-body-2': {\n        '@apply text-sm': {},\n      },\n      '.text-caption': {\n        '@apply text-xs': {},\n        'line-height': '1.25rem',\n      },\n      '.text-h1': {\n        '@apply text-8xl font-light': {},\n        'line-height': '7rem',\n      },\n      '.text-h2': {\n        '@apply text-6xl font-light': {},\n        'line-height': '4.5rem',\n      },\n      '.text-h3': {\n        '@apply text-5xl': {},\n        'line-height': '3.5rem',\n      },\n      '.text-h4': {\n        '@apply text-4xl font-semibold': {},\n        'line-height': '2.625rem',\n      },\n      '.text-h5': {\n        '@apply text-2xl': {},\n        'line-height': '2rem',\n      },\n      '.text-h6': {\n        '@apply text-xl font-medium': {},\n        'line-height': '2rem',\n      },\n      '.text-overline': {\n        '@apply text-xs uppercase': {},\n        'line-height': '2rem',\n      },\n      '.text-subtitle-1': {\n        '@apply text-base': {},\n        'line-height': '1.75rem',\n      },\n      '.text-subtitle-2': {\n        '@apply text-sm font-medium': {},\n        'line-height': '1.25rem',\n      },\n    });\n\n    // Tint and Shade Colors\n    matchUtilities(\n      Object.fromEntries(\n        ['bg-tint', 'bg-shade', 'text-tint', 'text-shade'].map(item => [\n          item,\n          value => ({\n            animation: `${item} 1s calc(${value} * -1s) linear forwards paused`,\n          }),\n        ]),\n      ),\n    );\n    addVariant('color-mix-supported', '@supports (color-mix())');\n  },\n  {\n    theme: {\n      extend: {\n        boxShadow: {\n          1: '0px 2px 1px -1px var(--rui-shadow-primary), 0px 1px 1px var(--rui-shadow-secondary), 0px 1px 3px var(--rui-shadow-tertiary)',\n          10: '0px 6px 6px -3px var(--rui-shadow-primary), 0px 10px 14px 1px var(--rui-shadow-secondary), 0px 4px 18px 3px var(--rui-shadow-tertiary)',\n          11: '0px 6px 7px -4px var(--rui-shadow-primary), 0px 11px 15px 1px var(--rui-shadow-secondary), 0px 4px 20px 3px var(--rui-shadow-tertiary)',\n          12: '0px 7px 8px -4px var(--rui-shadow-primary), 0px 12px 17px 2px var(--rui-shadow-secondary), 0px 5px 22px 4px var(--rui-shadow-tertiary)',\n          13: '0px 7px 8px -4px var(--rui-shadow-primary), 0px 13px 19px 2px var(--rui-shadow-secondary), 0px 5px 24px 4px var(--rui-shadow-tertiary)',\n          14: '0px 7px 9px -4px var(--rui-shadow-primary), 0px 14px 21px 2px var(--rui-shadow-secondary), 0px 5px 26px 4px var(--rui-shadow-tertiary)',\n          15: '0px 8px 9px -5px var(--rui-shadow-primary), 0px 15px 22px 2px var(--rui-shadow-secondary), 0px 6px 28px 5px var(--rui-shadow-tertiary)',\n          16: '0px 8px 10px -5px var(--rui-shadow-primary), 0px 16px 24px 2px var(--rui-shadow-secondary), 0px 6px 30px 5px var(--rui-shadow-tertiary)',\n          17: '0px 8px 11px -5px var(--rui-shadow-primary), 0px 17px 26px 2px var(--rui-shadow-secondary), 0px 6px 32px 5px var(--rui-shadow-tertiary)',\n          18: '0px 9px 11px -5px var(--rui-shadow-primary), 0px 18px 28px 2px var(--rui-shadow-secondary), 0px 7px 34px 6px var(--rui-shadow-tertiary)',\n          19: '0px 9px 12px -6px var(--rui-shadow-primary), 0px 19px 29px 2px var(--rui-shadow-secondary), 0px 7px 36px 6px var(--rui-shadow-tertiary)',\n          2: '0px 3px 1px -2px var(--rui-shadow-primary), 0px 2px 2px var(--rui-shadow-secondary), 0px 1px 5px var(--rui-shadow-tertiary)',\n          20: '0px 10px 13px -6px var(--rui-shadow-primary), 0px 20px 31px 3px var(--rui-shadow-secondary), 0px 8px 38px 7px var(--rui-shadow-tertiary)',\n          21: '0px 10px 13px -6px var(--rui-shadow-primary), 0px 21px 33px 3px var(--rui-shadow-secondary), 0px 8px 40px 7px var(--rui-shadow-tertiary)',\n          22: '0px 10px 14px -6px var(--rui-shadow-primary), 0px 22px 35px 3px var(--rui-shadow-secondary), 0px 8px 42px 7px var(--rui-shadow-tertiary)',\n          23: '0px 11px 14px -7px var(--rui-shadow-primary), 0px 23px 36px 3px var(--rui-shadow-secondary), 0px 9px 44px 8px var(--rui-shadow-tertiary)',\n          24: '0px 11px 15px -7px var(--rui-shadow-primary), 0px 24px 38px 3px var(--rui-shadow-secondary), 0px 9px 46px 8px var(--rui-shadow-tertiary)',\n          3: '0px 3px 3px -2px var(--rui-shadow-primary), 0px 3px 4px var(--rui-shadow-secondary), 0px 1px 8px var(--rui-shadow-tertiary)',\n          4: '0px 2px 4px -1px var(--rui-shadow-primary), 0px 4px 5px var(--rui-shadow-secondary), 0px 1px 10px var(--rui-shadow-tertiary)',\n          5: '0px 3px 5px -1px var(--rui-shadow-primary), 0px 5px 8px var(--rui-shadow-secondary), 0px 1px 14px var(--rui-shadow-tertiary)',\n          6: '0px 3px 5px -1px var(--rui-shadow-primary), 0px 6px 10px var(--rui-shadow-secondary), 0px 1px 18px var(--rui-shadow-tertiary)',\n          7: '0px 4px 5px -2px var(--rui-shadow-primary), 0px 7px 10px 1px var(--rui-shadow-secondary), 0px 2px 16px 1px var(--rui-shadow-tertiary)',\n          8: '0px 5px 5px -3px var(--rui-shadow-primary), 0px 8px 10px 1px var(--rui-shadow-secondary), 0px 3px 14px 2px var(--rui-shadow-tertiary)',\n          9: '0px 5px 6px -3px var(--rui-shadow-primary), 0px 9px 12px 1px var(--rui-shadow-secondary), 0px 3px 16px 2px var(--rui-shadow-tertiary)',\n        },\n        colors: {\n          rui: {\n            ...baseColorsCombination,\n            ...contextColorsCombination,\n            ...textColorsCombination,\n            dark: {\n              ...contextColorsCombination.dark,\n              ...textColorsCombination.dark,\n            },\n            light: {\n              ...contextColorsCombination.light,\n              ...textColorsCombination.light,\n            },\n            ...adaptiveContextColorCombination,\n            ...adaptiveTextColorsCombination,\n          },\n        },\n      },\n    },\n  },\n);\n\nexport default themePlugin;\n"],"names":[],"mappings":"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"}

package/dist/types/stepper.js

@@ -0,0 +1,17 @@
+const StepperState = {
+  active: "active",
+  done: "done",
+  error: "error",
+  inactive: "inactive",
+  info: "info",
+  success: "success",
+  warning: "warning"
+};
+const StepperOrientation = {
+  horizontal: "horizontal"
+};
+export {
+  StepperOrientation,
+  StepperState
+};
+//# sourceMappingURL=stepper.js.map

package/dist/types/stepper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stepper.js","sources":["../../src/types/stepper.ts"],"sourcesContent":["export const StepperState = {\n  active: 'active',\n  done: 'done',\n  error: 'error',\n  inactive: 'inactive',\n  info: 'info',\n  success: 'success',\n  warning: 'warning',\n} as const;\n\nexport type StepperState = (typeof StepperState)[keyof typeof StepperState];\n\nexport interface StepperStep {\n  title?: string;\n  description?: string;\n  state?: StepperState;\n  loading?: boolean;\n}\n\nexport const StepperOrientation = {\n  horizontal: 'horizontal',\n  vertical: 'vertical',\n} as const;\n\nexport type StepperOrientation =\n  (typeof StepperOrientation)[keyof typeof StepperOrientation];\n"],"names":[],"mappings":"AAAO,MAAM,eAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AAAA,EACV,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AACX;AAWO,MAAM,qBAAqB;AAAA,EAChC,YAAY;AAEd;"}

package/dist/types/theme.js

@@ -0,0 +1,27 @@
+import { contextColors } from "../consts/colors.js";
+const ThemeMode = {
+  auto: "auto",
+  dark: "dark",
+  light: "light"
+};
+function createDefaultTheme(theme) {
+  return Object.fromEntries(
+    contextColors.map((color) => [
+      color,
+      {
+        darker: `var(--rui-${theme}-${color}-darker)`,
+        DEFAULT: `var(--rui-${theme}-${color}-main)`,
+        lighter: `var(--rui-${theme}-${color}-lighter)`
+      }
+    ])
+  );
+}
+const defaultTheme = {
+  dark: createDefaultTheme("dark"),
+  light: createDefaultTheme("light")
+};
+export {
+  ThemeMode,
+  defaultTheme
+};
+//# sourceMappingURL=theme.js.map

package/dist/types/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sources":["../../src/types/theme.ts"],"sourcesContent":["import type { BasicColorSchema } from '@vueuse/core';\nimport type { ComputedRef, Ref } from 'vue';\nimport type { GeneratedIcon } from '@/types/icons';\nimport { contextColors } from '@/consts/colors';\n\nexport const ThemeMode = {\n  auto: 'auto',\n  dark: 'dark',\n  light: 'light',\n} as const;\n\nexport type ThemeMode = (typeof ThemeMode)[keyof typeof ThemeMode];\n\nexport interface ColorIntensity {\n  DEFAULT: string;\n  lighter: string;\n  darker: string;\n}\n\nexport type ThemeData = {\n  [key in string]: ColorIntensity;\n};\n\nexport interface ThemeConfig {\n  light: ThemeData;\n  dark: ThemeData;\n}\n\nexport interface InitThemeOptions {\n  mode?: ThemeMode;\n  config?: ThemeConfig;\n  icons?: GeneratedIcon[];\n}\n\nexport interface ThemeContent {\n  theme: Ref<ThemeData | undefined>;\n  store: Ref<ThemeMode | BasicColorSchema>;\n  state: ComputedRef<ThemeMode | BasicColorSchema>;\n  config: Ref<ThemeConfig | undefined>;\n  isAutoControlled: ComputedRef<boolean>;\n  isDark: ComputedRef<boolean>;\n  isLight: ComputedRef<boolean>;\n  init: (options: InitThemeOptions) => void;\n  switchThemeScheme: (mode: ThemeMode) => void;\n  toggleThemeMode: () => void;\n  setThemeConfig: (newConfig: ThemeConfig) => void;\n}\n\nfunction createDefaultTheme(theme: 'light' | 'dark') {\n  return Object.fromEntries(\n    contextColors.map(color => [\n      color,\n      {\n        darker: `var(--rui-${theme}-${color}-darker)`,\n        DEFAULT: `var(--rui-${theme}-${color}-main)`,\n        lighter: `var(--rui-${theme}-${color}-lighter)`,\n      },\n    ]),\n  );\n}\n\nexport const defaultTheme: ThemeConfig = {\n  dark: createDefaultTheme('dark'),\n  light: createDefaultTheme('light'),\n};\n"],"names":[],"mappings":";AAKO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AACT;AAuCA,SAAS,mBAAmB,OAAyB;AACnD,SAAO,OAAO;AAAA,IACZ,cAAc,IAAI,CAAA,UAAS;AAAA,MACzB;AAAA,MACA;AAAA,QACE,QAAQ,aAAa,KAAK,IAAI,KAAK;AAAA,QACnC,SAAS,aAAa,KAAK,IAAI,KAAK;AAAA,QACpC,SAAS,aAAa,KAAK,IAAI,KAAK;AAAA,MAAA;AAAA,IACtC,CACD;AAAA,EAAA;AAEL;AAEO,MAAM,eAA4B;AAAA,EACvC,MAAM,mBAAmB,MAAM;AAAA,EAC/B,OAAO,mBAAmB,OAAO;AACnC;"}

package/dist/utils/assert.js

@@ -0,0 +1,14 @@
+class AssertionError extends Error {
+  constructor(msg) {
+    super(msg ?? "AssertionError");
+    this.name = "AssertionError";
+  }
+}
+function assert(condition, msg) {
+  if (!condition)
+    throw new AssertionError(msg);
+}
+export {
+  assert
+};
+//# sourceMappingURL=assert.js.map

package/dist/utils/assert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"assert.js","sources":["../../src/utils/assert.ts"],"sourcesContent":["class AssertionError extends Error {\n  constructor(msg?: string) {\n    super(msg ?? 'AssertionError');\n    this.name = 'AssertionError';\n  }\n}\n\nexport function assert(condition: any, msg?: string): asserts condition {\n  if (!condition)\n    throw new AssertionError(msg);\n}\n"],"names":[],"mappings":"AAAA,MAAM,uBAAuB,MAAM;AAAA,EACjC,YAAY,KAAc;AACxB,UAAM,OAAO,gBAAgB;AAC7B,SAAK,OAAO;AAAA,EACd;AACF;AAEO,SAAS,OAAO,WAAgB,KAAiC;AACtE,MAAI,CAAC;AACH,UAAM,IAAI,eAAe,GAAG;AAChC;"}

package/dist/utils/blockie.js

@@ -0,0 +1,79 @@
+const randSeed = new Array(4);
+function seedRand(seed) {
+  for (let i = 0; i < randSeed.length; i++) randSeed[i] = 0;
+  for (let i = 0; i < seed.length; i++)
+    randSeed[i % 4] = (randSeed[i % 4] << 5) - randSeed[i % 4] + seed.charCodeAt(i);
+}
+function rand() {
+  const t = randSeed[0] ^ randSeed[0] << 11;
+  randSeed[0] = randSeed[1];
+  randSeed[1] = randSeed[2];
+  randSeed[2] = randSeed[3];
+  randSeed[3] = randSeed[3] ^ randSeed[3] >> 19 ^ t ^ t >> 8;
+  return (randSeed[3] >>> 0) / (1 << 31 >>> 0);
+}
+function createColor() {
+  const h = Math.floor(rand() * 360);
+  const s = `${rand() * 60 + 40}%`;
+  const l = `${(rand() + rand() + rand() + rand()) * 25}%`;
+  return `hsl(${h},${s},${l})`;
+}
+function createImageData(size) {
+  const width = size;
+  const height = size;
+  const dataWidth = Math.ceil(width / 2);
+  const mirrorWidth = width - dataWidth;
+  const data = [];
+  for (let y = 0; y < height; y++) {
+    let row = [];
+    for (let x = 0; x < dataWidth; x++) {
+      row[x] = Math.floor(rand() * 2.3);
+    }
+    const r = row.slice(0, mirrorWidth);
+    r.reverse();
+    row = row.concat(r);
+    for (const element of row) data.push(element);
+  }
+  return data;
+}
+function buildOpts(opts) {
+  const newOpts = {};
+  newOpts.seed = opts.seed || Math.floor(Math.random() * 10 ** 16).toString(16);
+  seedRand(newOpts.seed);
+  newOpts.size = opts.size || 8;
+  newOpts.scale = opts.scale || 8;
+  newOpts.color = opts.color || createColor();
+  newOpts.bgcolor = opts.bgcolor || createColor();
+  newOpts.spotColor = opts.spotColor || createColor();
+  return newOpts;
+}
+function renderIcon(opts, canvas) {
+  const newOpts = buildOpts(opts || {});
+  const imageData = createImageData(newOpts.size);
+  const width = Math.sqrt(imageData.length);
+  canvas.width = canvas.height = newOpts.size * newOpts.scale;
+  const cc = canvas.getContext("2d");
+  if (cc) {
+    cc.fillStyle = newOpts.bgcolor;
+    cc.fillRect(0, 0, canvas.width, canvas.height);
+    cc.fillStyle = newOpts.color;
+    for (const [i, imageDatum] of imageData.entries()) {
+      if (imageDatum) {
+        const row = Math.floor(i / width);
+        const col = i % width;
+        cc.fillStyle = imageDatum === 1 ? newOpts.color : newOpts.spotColor;
+        cc.fillRect(col * newOpts.scale, row * newOpts.scale, newOpts.scale, newOpts.scale);
+      }
+    }
+  }
+  return canvas;
+}
+function createBlockie(opts) {
+  const canvas = document.createElement("canvas");
+  renderIcon(opts, canvas);
+  return canvas.toDataURL("image/jpeg");
+}
+export {
+  createBlockie
+};
+//# sourceMappingURL=blockie.js.map

package/dist/utils/blockie.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"blockie.js","sources":["../../src/utils/blockie.ts"],"sourcesContent":["// Source: https://github.com/ethereum/blockies\n// The random number is a js implementation of the Xorshift PRNG\ninterface BlockieOptions {\n  /** seed used to generate icon data, default: random */\n  seed: string;\n  /** to manually specify the icon color, default: random */\n  color: string;\n  /** choose a different background color, default: random */\n  bgcolor: string;\n  /** width/height of the icon in blocks, default: 8 */\n  size: number;\n  /** width/height of each block in pixels, default: 4 */\n  scale: number;\n  /**\n   * each pixel has a 13% chance of being of a third color, default: random.\n   *\n   * Set to -1 to disable it.\n   *\n   * These \"spots\" create structures that look like eyes, mouths and noses.\n   */\n  spotColor: string;\n}\n\nconst randSeed = new Array(4); // Xorshift: [x, y, z, w] 32 bit values\n\nfunction seedRand(seed: string): void {\n  for (let i = 0; i < randSeed.length; i++) randSeed[i] = 0;\n\n  for (let i = 0; i < seed.length; i++)\n    randSeed[i % 4] = (randSeed[i % 4] << 5) - randSeed[i % 4] + seed.charCodeAt(i);\n}\n\nfunction rand(): number {\n  // based on Java's String.hashCode(), expanded to 4 32bit values\n  const t = randSeed[0] ^ (randSeed[0] << 11);\n\n  randSeed[0] = randSeed[1];\n  randSeed[1] = randSeed[2];\n  randSeed[2] = randSeed[3];\n  randSeed[3] = randSeed[3] ^ (randSeed[3] >> 19) ^ t ^ (t >> 8);\n\n  return (randSeed[3] >>> 0) / ((1 << 31) >>> 0);\n}\n\nfunction createColor(): string {\n  // saturation is the whole color spectrum\n  const h = Math.floor(rand() * 360);\n  // saturation goes from 40 to 100, it avoids greyish colors\n  const s = `${rand() * 60 + 40}%`;\n  // lightness can be anything from 0 to 100, but probabilities are a bell curve around 50%\n  const l = `${(rand() + rand() + rand() + rand()) * 25}%`;\n\n  return `hsl(${h},${s},${l})`;\n}\n\nfunction createImageData(size: number): number[] {\n  const width = size; // Only support square icons for now\n  const height = size;\n\n  const dataWidth = Math.ceil(width / 2);\n  const mirrorWidth = width - dataWidth;\n\n  const data = [];\n  for (let y = 0; y < height; y++) {\n    let row = [];\n    for (let x = 0; x < dataWidth; x++) {\n      // this makes foreground and background color to have a 43% (1/2.3) probability\n      // spot color has 13% chance\n      row[x] = Math.floor(rand() * 2.3);\n    }\n    const r = row.slice(0, mirrorWidth);\n    r.reverse();\n    row = row.concat(r);\n\n    for (const element of row) data.push(element);\n  }\n\n  return data;\n}\n\nfunction buildOpts(opts: Partial<BlockieOptions>): BlockieOptions {\n  const newOpts: Partial<BlockieOptions> = {};\n\n  newOpts.seed = opts.seed || Math.floor(Math.random() * 10 ** 16).toString(16);\n\n  seedRand(newOpts.seed);\n\n  newOpts.size = opts.size || 8;\n  newOpts.scale = opts.scale || 8;\n  newOpts.color = opts.color || createColor();\n  newOpts.bgcolor = opts.bgcolor || createColor();\n  newOpts.spotColor = opts.spotColor || createColor();\n\n  return newOpts as BlockieOptions;\n}\n\nfunction renderIcon(opts: Partial<BlockieOptions>, canvas: HTMLCanvasElement): HTMLCanvasElement {\n  const newOpts: BlockieOptions = buildOpts(opts || {});\n  const imageData = createImageData(newOpts.size);\n  const width = Math.sqrt(imageData.length);\n\n  canvas.width = canvas.height = newOpts.size * newOpts.scale;\n\n  const cc = canvas.getContext('2d') as CanvasRenderingContext2D;\n  if (cc) {\n    cc.fillStyle = newOpts.bgcolor;\n    cc.fillRect(0, 0, canvas.width, canvas.height);\n    cc.fillStyle = newOpts.color;\n\n    for (const [i, imageDatum] of imageData.entries()) {\n      // if data is 0, leave the background\n      if (imageDatum) {\n        const row = Math.floor(i / width);\n        const col = i % width;\n\n        // if data is 2, choose spot color, if 1 choose foreground\n        cc.fillStyle = imageDatum === 1 ? newOpts.color : newOpts.spotColor;\n\n        cc.fillRect(col * newOpts.scale, row * newOpts.scale, newOpts.scale, newOpts.scale);\n      }\n    }\n  }\n\n  return canvas;\n}\n\nexport function createBlockie(opts: Partial<BlockieOptions>): string {\n  const canvas = document.createElement('canvas');\n\n  renderIcon(opts, canvas);\n\n  return canvas.toDataURL('image/jpeg');\n}\n"],"names":[],"mappings":"AAuBA,MAAM,WAAW,IAAI,MAAM,CAAC;AAE5B,SAAS,SAAS,MAAoB;AACpC,WAAS,IAAI,GAAG,IAAI,SAAS,QAAQ,IAAK,UAAS,CAAC,IAAI;AAExD,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ;AAC/B,aAAS,IAAI,CAAC,KAAK,SAAS,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,CAAC,IAAI,KAAK,WAAW,CAAC;AAClF;AAEA,SAAS,OAAe;AAEtB,QAAM,IAAI,SAAS,CAAC,IAAK,SAAS,CAAC,KAAK;AAExC,WAAS,CAAC,IAAI,SAAS,CAAC;AACxB,WAAS,CAAC,IAAI,SAAS,CAAC;AACxB,WAAS,CAAC,IAAI,SAAS,CAAC;AACxB,WAAS,CAAC,IAAI,SAAS,CAAC,IAAK,SAAS,CAAC,KAAK,KAAM,IAAK,KAAK;AAE5D,UAAQ,SAAS,CAAC,MAAM,MAAO,KAAK,OAAQ;AAC9C;AAEA,SAAS,cAAsB;AAE7B,QAAM,IAAI,KAAK,MAAM,KAAA,IAAS,GAAG;AAEjC,QAAM,IAAI,GAAG,KAAA,IAAS,KAAK,EAAE;AAE7B,QAAM,IAAI,IAAI,SAAS,SAAS,SAAS,UAAU,EAAE;AAErD,SAAO,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;AAC3B;AAEA,SAAS,gBAAgB,MAAwB;AAC/C,QAAM,QAAQ;AACd,QAAM,SAAS;AAEf,QAAM,YAAY,KAAK,KAAK,QAAQ,CAAC;AACrC,QAAM,cAAc,QAAQ;AAE5B,QAAM,OAAO,CAAA;AACb,WAAS,IAAI,GAAG,IAAI,QAAQ,KAAK;AAC/B,QAAI,MAAM,CAAA;AACV,aAAS,IAAI,GAAG,IAAI,WAAW,KAAK;AAGlC,UAAI,CAAC,IAAI,KAAK,MAAM,KAAA,IAAS,GAAG;AAAA,IAClC;AACA,UAAM,IAAI,IAAI,MAAM,GAAG,WAAW;AAClC,MAAE,QAAA;AACF,UAAM,IAAI,OAAO,CAAC;AAElB,eAAW,WAAW,IAAK,MAAK,KAAK,OAAO;AAAA,EAC9C;AAEA,SAAO;AACT;AAEA,SAAS,UAAU,MAA+C;AAChE,QAAM,UAAmC,CAAA;AAEzC,UAAQ,OAAO,KAAK,QAAQ,KAAK,MAAM,KAAK,OAAA,IAAW,MAAM,EAAE,EAAE,SAAS,EAAE;AAE5E,WAAS,QAAQ,IAAI;AAErB,UAAQ,OAAO,KAAK,QAAQ;AAC5B,UAAQ,QAAQ,KAAK,SAAS;AAC9B,UAAQ,QAAQ,KAAK,SAAS,YAAA;AAC9B,UAAQ,UAAU,KAAK,WAAW,YAAA;AAClC,UAAQ,YAAY,KAAK,aAAa,YAAA;AAEtC,SAAO;AACT;AAEA,SAAS,WAAW,MAA+B,QAA8C;AAC/F,QAAM,UAA0B,UAAU,QAAQ,EAAE;AACpD,QAAM,YAAY,gBAAgB,QAAQ,IAAI;AAC9C,QAAM,QAAQ,KAAK,KAAK,UAAU,MAAM;AAExC,SAAO,QAAQ,OAAO,SAAS,QAAQ,OAAO,QAAQ;AAEtD,QAAM,KAAK,OAAO,WAAW,IAAI;AACjC,MAAI,IAAI;AACN,OAAG,YAAY,QAAQ;AACvB,OAAG,SAAS,GAAG,GAAG,OAAO,OAAO,OAAO,MAAM;AAC7C,OAAG,YAAY,QAAQ;AAEvB,eAAW,CAAC,GAAG,UAAU,KAAK,UAAU,WAAW;AAEjD,UAAI,YAAY;AACd,cAAM,MAAM,KAAK,MAAM,IAAI,KAAK;AAChC,cAAM,MAAM,IAAI;AAGhB,WAAG,YAAY,eAAe,IAAI,QAAQ,QAAQ,QAAQ;AAE1D,WAAG,SAAS,MAAM,QAAQ,OAAO,MAAM,QAAQ,OAAO,QAAQ,OAAO,QAAQ,KAAK;AAAA,MACpF;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;AAEO,SAAS,cAAc,MAAuC;AACnE,QAAM,SAAS,SAAS,cAAc,QAAQ;AAE9C,aAAW,MAAM,MAAM;AAEvB,SAAO,OAAO,UAAU,YAAY;AACtC;"}

package/dist/utils/form-text-detail.js

@@ -0,0 +1,31 @@
+import { logicOr } from "@vueuse/math";
+import { computed } from "vue";
+import { get } from "@vueuse/shared";
+function useFormTextDetail(errorMessages, successMessages) {
+  const formattedErrorMessages = computed(() => {
+    let errorMessagesVal = get(errorMessages);
+    if (typeof errorMessagesVal === "string")
+      errorMessagesVal = [errorMessagesVal];
+    return errorMessagesVal.filter((item) => !!item);
+  });
+  const formattedSuccessMessages = computed(() => {
+    let successMessagesVal = get(successMessages);
+    if (typeof successMessagesVal === "string")
+      successMessagesVal = [successMessagesVal];
+    return successMessagesVal.filter((item) => !!item);
+  });
+  const hasError = computed(() => get(formattedErrorMessages).length > 0);
+  const hasSuccess = computed(() => get(formattedSuccessMessages).length > 0);
+  const hasMessages = logicOr(hasError, hasSuccess);
+  return {
+    formattedErrorMessages,
+    formattedSuccessMessages,
+    hasError,
+    hasMessages,
+    hasSuccess
+  };
+}
+export {
+  useFormTextDetail
+};
+//# sourceMappingURL=form-text-detail.js.map

package/dist/utils/form-text-detail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-text-detail.js","sources":["../../src/utils/form-text-detail.ts"],"sourcesContent":["import type { MaybeRef } from 'vue';\nimport { logicOr } from '@vueuse/math';\n\nexport function useFormTextDetail(errorMessages: MaybeRef<string | string[]>, successMessages: MaybeRef<string | string[]>) {\n  const formattedErrorMessages = computed(() => {\n    let errorMessagesVal = get(errorMessages);\n    if (typeof errorMessagesVal === 'string')\n      errorMessagesVal = [errorMessagesVal];\n\n    return errorMessagesVal.filter(item => !!item);\n  });\n\n  const formattedSuccessMessages = computed(() => {\n    let successMessagesVal = get(successMessages);\n    if (typeof successMessagesVal === 'string')\n      successMessagesVal = [successMessagesVal];\n\n    return successMessagesVal.filter(item => !!item);\n  });\n\n  const hasError = computed(() => get(formattedErrorMessages).length > 0);\n\n  const hasSuccess = computed(() => get(formattedSuccessMessages).length > 0);\n  const hasMessages = logicOr(hasError, hasSuccess);\n\n  return {\n    formattedErrorMessages,\n    formattedSuccessMessages,\n    hasError,\n    hasMessages,\n    hasSuccess,\n  };\n}\n"],"names":[],"mappings":";;;AAGO,SAAS,kBAAkB,eAA4C,iBAA8C;AAC1H,QAAM,yBAAyB,SAAS,MAAM;AAC5C,QAAI,mBAAmB,IAAI,aAAa;AACxC,QAAI,OAAO,qBAAqB;AAC9B,yBAAmB,CAAC,gBAAgB;AAEtC,WAAO,iBAAiB,OAAO,CAAA,SAAQ,CAAC,CAAC,IAAI;AAAA,EAC/C,CAAC;AAED,QAAM,2BAA2B,SAAS,MAAM;AAC9C,QAAI,qBAAqB,IAAI,eAAe;AAC5C,QAAI,OAAO,uBAAuB;AAChC,2BAAqB,CAAC,kBAAkB;AAE1C,WAAO,mBAAmB,OAAO,CAAA,SAAQ,CAAC,CAAC,IAAI;AAAA,EACjD,CAAC;AAED,QAAM,WAAW,SAAS,MAAM,IAAI,sBAAsB,EAAE,SAAS,CAAC;AAEtE,QAAM,aAAa,SAAS,MAAM,IAAI,wBAAwB,EAAE,SAAS,CAAC;AAC1E,QAAM,cAAc,QAAQ,UAAU,UAAU;AAEhD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}

package/dist/utils/generate-id.js

@@ -0,0 +1,21 @@
+import { createGlobalState } from "@vueuse/core";
+import { ref } from "vue";
+import { get, set } from "@vueuse/shared";
+const useGlobalId = createGlobalState(() => {
+  const count = ref(0);
+  const nextId = () => {
+    const countVal = get(count) + 1;
+    set(count, countVal);
+    return countVal;
+  };
+  return { count, nextId };
+});
+function generateId(prefix = "") {
+  const { nextId } = useGlobalId();
+  return `${prefix}-${nextId()}`;
+}
+export {
+  generateId,
+  useGlobalId
+};
+//# sourceMappingURL=generate-id.js.map

package/dist/utils/generate-id.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate-id.js","sources":["../../src/utils/generate-id.ts"],"sourcesContent":["export const useGlobalId = createGlobalState(() => {\n  const count = ref(0);\n\n  const nextId = () => {\n    const countVal = get(count) + 1;\n    set(count, countVal);\n\n    return countVal;\n  };\n\n  return { count, nextId };\n});\n\nexport function generateId(prefix = '') {\n  const { nextId } = useGlobalId();\n\n  return `${prefix}-${nextId()}`;\n}\n"],"names":[],"mappings":";;;AAAO,MAAM,cAAc,kBAAkB,MAAM;AACjD,QAAM,QAAQ,IAAI,CAAC;AAEnB,QAAM,SAAS,MAAM;AACnB,UAAM,WAAW,IAAI,KAAK,IAAI;AAC9B,QAAI,OAAO,QAAQ;AAEnB,WAAO;AAAA,EACT;AAEA,SAAO,EAAE,OAAO,OAAA;AAClB,CAAC;AAEM,SAAS,WAAW,SAAS,IAAI;AACtC,QAAM,EAAE,OAAA,IAAW,YAAA;AAEnB,SAAO,GAAG,MAAM,IAAI,OAAA,CAAQ;AAC9B;"}

package/dist/utils/helpers.js

@@ -0,0 +1,51 @@
+import { objectPick, objectOmit } from "@vueuse/shared";
+import { camelCase } from "scule";
+function formatNumber(amount, { fractionDigits = 2 }) {
+  return new Intl.NumberFormat(void 0, {
+    maximumFractionDigits: fractionDigits,
+    minimumFractionDigits: fractionDigits
+  }).format(Number(amount));
+}
+function formatInteger(amount) {
+  return formatNumber(amount, { fractionDigits: 0 });
+}
+function getRootKeys(data) {
+  return Object.keys(data).filter(
+    (key) => key.startsWith("data-")
+  );
+}
+function getRootAttrs(data, include = ["class"]) {
+  return objectPick(data, [...getRootKeys(data), ...include]);
+}
+function getNonRootAttrs(data, exclude = ["class"]) {
+  return objectOmit(data, [...getRootKeys(data), ...exclude]);
+}
+function transformCase(item, to) {
+  if (!item)
+    return item;
+  return Object.keys(item).reduce((acc, curr) => {
+    acc[camelCase(curr)] = item[curr];
+    return acc;
+  }, {});
+}
+function getTextToken(string) {
+  if (!string)
+    return "";
+  return string.toString().toLowerCase().replace(/[^\da-z]/gi, "");
+}
+function transformPropsUnit(value) {
+  if (value === void 0 || typeof value === "string" && isNaN(Number(value)))
+    return value;
+  return `${value}px`;
+}
+export {
+  formatInteger,
+  formatNumber,
+  getNonRootAttrs,
+  getRootAttrs,
+  getRootKeys,
+  getTextToken,
+  transformCase,
+  transformPropsUnit
+};
+//# sourceMappingURL=helpers.js.map

package/dist/utils/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sources":["../../src/utils/helpers.ts"],"sourcesContent":["import type { SetupContext } from 'vue';\nimport { objectOmit, objectPick } from '@vueuse/shared';\nimport { camelCase, snakeCase } from 'scule';\n\ninterface CurrencyOptions {\n  currency?: string;\n  locale?: string;\n  style?: Intl.NumberFormatOptionsStyle;\n  fractionDigits?: number;\n}\n\ntype SetupContextAttrs = SetupContext['attrs'];\n\ntype SetupContextAttrsKeys = (keyof SetupContextAttrs)[];\n\n/**\n * Format number value to specified currency format\n * @param {number} amount\n * @param {CurrencyOptions} options\n */\nexport function formatCurrency(amount: number | string, {\n  currency = 'EUR',\n  fractionDigits = 2,\n  locale = 'de-De',\n  style = 'currency',\n}: CurrencyOptions) {\n  return new Intl.NumberFormat(locale, {\n    currency,\n    maximumFractionDigits: fractionDigits,\n    minimumFractionDigits: fractionDigits,\n    style,\n  }).format(Number(amount));\n}\n\n/**\n * Format number value\n * @param {number} amount\n * @param {CurrencyOptions} options\n */\nexport function formatNumber(amount: number | string, { fractionDigits = 2 }: CurrencyOptions) {\n  return new Intl.NumberFormat(undefined, {\n    maximumFractionDigits: fractionDigits,\n    minimumFractionDigits: fractionDigits,\n  }).format(Number(amount));\n}\n\n/**\n * Format number value without fraction\n * @param {number} amount\n */\nexport function formatInteger(amount: number | string) {\n  return formatNumber(amount, { fractionDigits: 0 });\n}\n\n/**\n * Generates and returns the array of root allowed attributes\n * @param {SetupContextAttrs} data\n * @returns {SetupContextAttrsKeys}\n */\nexport function getRootKeys(data: SetupContextAttrs) {\n  return Object.keys(data).filter(key =>\n    key.startsWith('data-'),\n  ) as SetupContextAttrsKeys;\n}\n\n/**\n * Picks only required attributes for root element\n * @param {SetupContextAttrs} data\n * @param {SetupContextAttrsKeys} include\n * @returns {Pick<SetupContextAttrs, any>}\n */\nexport function getRootAttrs(data: SetupContextAttrs, include: SetupContextAttrsKeys = ['class']) {\n  return objectPick(data, [...getRootKeys(data), ...include]);\n}\n\n/**\n * Omits root attributes from component's attributes\n * @param {SetupContextAttrs} data\n * @param {SetupContextAttrsKeys} exclude\n * @returns {Omit<SetupContextAttrs, any>}\n */\nexport function getNonRootAttrs(data: SetupContextAttrs, exclude: SetupContextAttrsKeys = ['class']) {\n  return objectOmit(data, [...getRootKeys(data), ...exclude]);\n}\n\n/**\n * Transforms the keys of an object to either camelCase or snake_case\n * @param {T} item\n * @param {\"camelCase\" | \"snake_case\"} to\n * @returns {Record<string, any>}\n */\nexport function transformCase<T extends object>(item: T, to: 'camelCase' | 'snake_case') {\n  if (!item)\n    return item;\n\n  return Object.keys(item).reduce((acc, curr) => {\n    if (to === 'camelCase')\n      acc[camelCase(curr)] = item[curr as keyof T];\n    else\n      acc[snakeCase(curr)] = item[curr as keyof T];\n\n    return acc;\n  }, {} as Record<string, any>);\n}\n\n/**\n *\n * @param {string} string - String to convert\n * @return {string} - String converted to text token, mostly used to matching keyword\n * @example\n * getTextToken('this is a sentence'); // thisisasentence\n */\n\nexport function getTextToken(string: any): string {\n  if (!string)\n    return '';\n\n  return string.toString().toLowerCase().replace(/[^\\da-z]/gi, '');\n}\n\nexport function transformPropsUnit(value?: string | number): string | undefined {\n  if (value === undefined || (typeof value === 'string' && isNaN(Number(value))))\n    return value;\n  return `${value}px`;\n}\n"],"names":[],"mappings":";;AAuCO,SAAS,aAAa,QAAyB,EAAE,iBAAiB,KAAsB;AAC7F,SAAO,IAAI,KAAK,aAAa,QAAW;AAAA,IACtC,uBAAuB;AAAA,IACvB,uBAAuB;AAAA,EAAA,CACxB,EAAE,OAAO,OAAO,MAAM,CAAC;AAC1B;AAMO,SAAS,cAAc,QAAyB;AACrD,SAAO,aAAa,QAAQ,EAAE,gBAAgB,GAAG;AACnD;AAOO,SAAS,YAAY,MAAyB;AACnD,SAAO,OAAO,KAAK,IAAI,EAAE;AAAA,IAAO,CAAA,QAC9B,IAAI,WAAW,OAAO;AAAA,EAAA;AAE1B;AAQO,SAAS,aAAa,MAAyB,UAAiC,CAAC,OAAO,GAAG;AAChG,SAAO,WAAW,MAAM,CAAC,GAAG,YAAY,IAAI,GAAG,GAAG,OAAO,CAAC;AAC5D;AAQO,SAAS,gBAAgB,MAAyB,UAAiC,CAAC,OAAO,GAAG;AACnG,SAAO,WAAW,MAAM,CAAC,GAAG,YAAY,IAAI,GAAG,GAAG,OAAO,CAAC;AAC5D;AAQO,SAAS,cAAgC,MAAS,IAAgC;AACvF,MAAI,CAAC;AACH,WAAO;AAET,SAAO,OAAO,KAAK,IAAI,EAAE,OAAO,CAAC,KAAK,SAAS;AAE3C,QAAI,UAAU,IAAI,CAAC,IAAI,KAAK,IAAe;AAI7C,WAAO;AAAA,EACT,GAAG,CAAA,CAAyB;AAC9B;AAUO,SAAS,aAAa,QAAqB;AAChD,MAAI,CAAC;AACH,WAAO;AAET,SAAO,OAAO,WAAW,cAAc,QAAQ,cAAc,EAAE;AACjE;AAEO,SAAS,mBAAmB,OAA6C;AAC9E,MAAI,UAAU,UAAc,OAAO,UAAU,YAAY,MAAM,OAAO,KAAK,CAAC;AAC1E,WAAO;AACT,SAAO,GAAG,KAAK;AACjB;"}

package/dist/utils/is-equal.js

@@ -0,0 +1,33 @@
+function isEqual(value, other) {
+  if (value === other)
+    return true;
+  if (value == null || other == null)
+    return value === other;
+  if (typeof value !== typeof other)
+    return false;
+  if (Array.isArray(value)) {
+    if (!Array.isArray(other) || value.length !== other.length)
+      return false;
+    for (const [i, element] of value.entries()) {
+      if (!isEqual(element, other[i]))
+        return false;
+    }
+    return true;
+  }
+  if (typeof value === "object") {
+    const valueKeys = Object.keys(value);
+    const otherKeys = Object.keys(other);
+    if (valueKeys.length !== otherKeys.length)
+      return false;
+    for (const key of valueKeys) {
+      if (!isEqual(value[key], other[key]))
+        return false;
+    }
+    return true;
+  }
+  return false;
+}
+export {
+  isEqual
+};
+//# sourceMappingURL=is-equal.js.map

package/dist/utils/is-equal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"is-equal.js","sources":["../../src/utils/is-equal.ts"],"sourcesContent":["export function isEqual(value: any, other: any) {\n  // Check if the values are identical (covers primitives and functions)\n  if (value === other)\n    return true;\n\n  // Check if the values are null or undefined\n  if (value == null || other == null)\n    return value === other;\n\n  // Check if the values are of different types\n  if (typeof value !== typeof other)\n    return false;\n\n  // Compare arrays\n  if (Array.isArray(value)) {\n    if (!Array.isArray(other) || value.length !== other.length)\n      return false;\n\n    for (const [i, element] of value.entries()) {\n      if (!isEqual(element, other[i]))\n        return false;\n    }\n    return true;\n  }\n\n  // Compare objects\n  if (typeof value === 'object') {\n    const valueKeys = Object.keys(value);\n    const otherKeys = Object.keys(other);\n\n    if (valueKeys.length !== otherKeys.length)\n      return false;\n\n    for (const key of valueKeys) {\n      if (!isEqual(value[key], other[key]))\n        return false;\n    }\n    return true;\n  }\n\n  // If the values are neither primitives, arrays, nor objects, return false\n  return false;\n}\n"],"names":[],"mappings":"AAAO,SAAS,QAAQ,OAAY,OAAY;AAE9C,MAAI,UAAU;AACZ,WAAO;AAGT,MAAI,SAAS,QAAQ,SAAS;AAC5B,WAAO,UAAU;AAGnB,MAAI,OAAO,UAAU,OAAO;AAC1B,WAAO;AAGT,MAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,QAAI,CAAC,MAAM,QAAQ,KAAK,KAAK,MAAM,WAAW,MAAM;AAClD,aAAO;AAET,eAAW,CAAC,GAAG,OAAO,KAAK,MAAM,WAAW;AAC1C,UAAI,CAAC,QAAQ,SAAS,MAAM,CAAC,CAAC;AAC5B,eAAO;AAAA,IACX;AACA,WAAO;AAAA,EACT;AAGA,MAAI,OAAO,UAAU,UAAU;AAC7B,UAAM,YAAY,OAAO,KAAK,KAAK;AACnC,UAAM,YAAY,OAAO,KAAK,KAAK;AAEnC,QAAI,UAAU,WAAW,UAAU;AACjC,aAAO;AAET,eAAW,OAAO,WAAW;AAC3B,UAAI,CAAC,QAAQ,MAAM,GAAG,GAAG,MAAM,GAAG,CAAC;AACjC,eAAO;AAAA,IACX;AACA,WAAO;AAAA,EACT;AAGA,SAAO;AACT;"}

package/dist/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "http://json.schemastore.org/web-types",
   "framework": "vue",
   "name": "@rotki/ui-library",
-  "version": "2.8.1",
+  "version": "2.8.2",
   "js-types-syntax": "typescript",
   "description-markup": "markdown",
   "contributions": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rotki/ui-library",
-  "version": "2.8.1",
+  "version": "2.8.2",
   "description": "A vue design system and component library for rotki",
   "type": "module",
   "keywords": [
@@ -22,28 +22,28 @@
   "files": [
     "/dist"
   ],
-  "module": "dist/index.es.js",
+  "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.es.js",
-      "default": "./dist/index.es.js"
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
     },
     "./theme": {
       "types": "./dist/theme/index.d.ts",
-      "import": "./dist/theme/index.es.js",
-      "default": "./dist/theme/index.es.js"
+      "import": "./dist/theme/index.js",
+      "default": "./dist/theme/index.js"
     },
     "./components": {
       "types": "./dist/components/index.d.ts",
-      "import": "./dist/components/index.es.js",
-      "default": "./dist/components/index.es.js"
+      "import": "./dist/components/index.js",
+      "default": "./dist/components/index.js"
     },
     "./composables": {
       "types": "./dist/composables/index.d.ts",
-      "import": "./dist/composables/index.es.js",
-      "default": "./dist/composables/index.es.js"
+      "import": "./dist/composables/index.js",
+      "default": "./dist/composables/index.js"
     },
     "./style.css": {
       "default": "./dist/style.css"
@@ -69,13 +69,17 @@
     "vue": ">=3.5.0"
   },
   "web-types": "dist/web-types.json",
+  "dependencies": {
+    "@popperjs/core": "2.11.8",
+    "scule": "1.3.0",
+    "tinycolor2": "1.6.0"
+  },
   "devDependencies": {
     "@babel/core": "7.28.5",
     "@babel/types": "7.28.5",
     "@commitlint/cli": "20.1.0",
     "@commitlint/config-conventional": "20.0.0",
     "@fontsource/roboto": "5.2.8",
-    "@popperjs/core": "2.11.8",
     "@rotki/eslint-config": "4.5.0",
     "@rotki/eslint-plugin": "1.2.0",
     "@storybook/addon-docs": "10.0.2",
@@ -114,10 +118,8 @@
     "msw": "2.11.6",
     "postcss": "8.5.6",
     "sass": "1.93.2",
-    "scule": "1.3.0",
     "storybook": "10.0.2",
     "tailwindcss": "3.4.18",
-    "tinycolor2": "1.6.0",
     "tsc-alias": "1.8.16",
     "tsx": "4.20.6",
     "typescript": "5.9.3",
@@ -137,7 +139,7 @@
   },
   "scripts": {
     "build:prod": "tsx scripts/dist-build.mjs",
-    "build": "pnpm run generate-icons && vite build",
+    "build": "pnpm run generate-icons && vite build && cp ../../README.md dist/",
     "build:storybook": "STORYBOOK=true storybook build",
     "build:tailwind": "tailwindcss -o dist/style.css --minify",
     "build:types": "vue-tsc -p tsconfig.build.json",