@rotki/ui-library 2.17.2 → 2.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/components/buttons/button/button-props.d.ts +1 -0
  2. package/dist/components/buttons/button/button-props.js +5 -4
  3. package/dist/components/buttons/button/button-props.js.map +1 -1
  4. package/dist/components/buttons/button/button-styles.d.ts +9 -0
  5. package/dist/components/buttons/button/button-styles.js +20 -4
  6. package/dist/components/buttons/button/button-styles.js.map +1 -1
  7. package/dist/web-types.json +1 -1
  8. package/package.json +1 -1
package/dist/components/buttons/button/button-props.d.ts CHANGED
@@ -11,6 +11,7 @@ export declare const ButtonSize: {
11
11
  readonly sm: "sm";
12
12
  readonly lg: "lg";
13
13
  readonly xl: "xl";
14
+ readonly '2xl': "2xl";
14
15
  };
15
16
  export type ButtonSize = (typeof ButtonSize)[keyof typeof ButtonSize];
16
17
  export declare const FAB_DEFAULT_ELEVATION = 6;
package/dist/components/buttons/button/button-props.js CHANGED
@@ -7,10 +7,11 @@ var ButtonVariant = {
7
7
  list: "list"
8
8
  };
9
9
  var SPINNER_SIZES = {
10
- xs: 12,
11
- sm: 18,
12
- lg: 26,
13
- xl: 28
10
+ "xs": 12,
11
+ "sm": 18,
12
+ "lg": 26,
13
+ "xl": 26,
14
+ "2xl": 28
14
15
  };
15
16
  var DEFAULT_SPINNER_SIZE = 22;
16
17
  function getButtonSpinnerSize(size) {
package/dist/components/buttons/button/button-props.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button-props.js","names":[],"sources":["../../../../src/components/buttons/button/button-props.ts"],"sourcesContent":["export const ButtonVariant = {\n default: 'default',\n outlined: 'outlined',\n text: 'text',\n fab: 'fab',\n list: 'list',\n} as const;\n\nexport type ButtonVariant = (typeof ButtonVariant)[keyof typeof ButtonVariant];\n\nexport const ButtonSize = {\n xs: 'xs',\n sm: 'sm',\n lg: 'lg',\n xl: 'xl',\n} as const;\n\nexport type ButtonSize = (typeof ButtonSize)[keyof typeof ButtonSize];\n\nconst SPINNER_SIZES: Record<string, number> = { xs: 12, sm: 18, lg: 26, xl: 28 };\nconst DEFAULT_SPINNER_SIZE = 22;\n\nexport const FAB_DEFAULT_ELEVATION = 6;\n\nexport const NO_ELEVATION = 0;\n\nexport function getButtonSpinnerSize(size?: ButtonSize): number {\n return (size && SPINNER_SIZES[size]) || DEFAULT_SPINNER_SIZE;\n}\n"],"mappings":";AAAA,IAAa,gBAAgB;CAC3B,SAAS;CACT,UAAU;CACV,MAAM;CACN,KAAK;CACL,MAAM;CACP;AAaD,IAAM,gBAAwC;CAAE,IAAI;CAAI,IAAI;CAAI,IAAI;CAAI,IAAI;CAAI;AAChF,IAAM,uBAAuB;AAM7B,SAAgB,qBAAqB,MAA2B;AAC9D,QAAQ,QAAQ,cAAc,SAAU"}
1
+ {"version":3,"file":"button-props.js","names":[],"sources":["../../../../src/components/buttons/button/button-props.ts"],"sourcesContent":["export const ButtonVariant = {\n default: 'default',\n outlined: 'outlined',\n text: 'text',\n fab: 'fab',\n list: 'list',\n} as const;\n\nexport type ButtonVariant = (typeof ButtonVariant)[keyof typeof ButtonVariant];\n\nexport const ButtonSize = {\n 'xs': 'xs',\n 'sm': 'sm',\n 'lg': 'lg',\n 'xl': 'xl',\n '2xl': '2xl',\n} as const;\n\nexport type ButtonSize = (typeof ButtonSize)[keyof typeof ButtonSize];\n\nconst SPINNER_SIZES: Record<string, number> = { 'xs': 12, 'sm': 18, 'lg': 26, 'xl': 26, '2xl': 28 };\nconst DEFAULT_SPINNER_SIZE = 22;\n\nexport const FAB_DEFAULT_ELEVATION = 6;\n\nexport const NO_ELEVATION = 0;\n\nexport function getButtonSpinnerSize(size?: ButtonSize): number {\n return (size && SPINNER_SIZES[size]) || DEFAULT_SPINNER_SIZE;\n}\n"],"mappings":";AAAA,IAAa,gBAAgB;CAC3B,SAAS;CACT,UAAU;CACV,MAAM;CACN,KAAK;CACL,MAAM;CACP;AAcD,IAAM,gBAAwC;CAAE,MAAM;CAAI,MAAM;CAAI,MAAM;CAAI,MAAM;CAAI,OAAO;CAAI;AACnG,IAAM,uBAAuB;AAM7B,SAAgB,qBAAqB,MAA2B;AAC9D,QAAQ,QAAQ,cAAc,SAAU"}
package/dist/components/buttons/button/button-styles.d.ts CHANGED
@@ -26,6 +26,9 @@ export declare const buttonStyles: import("tailwind-variants").TVReturnType<{
26
26
  xl: {
27
27
  root: string;
28
28
  };
29
+ '2xl': {
30
+ root: string;
31
+ };
29
32
  };
30
33
  color: {
31
34
  grey: {
@@ -107,6 +110,9 @@ export declare const buttonStyles: import("tailwind-variants").TVReturnType<{
107
110
  xl: {
108
111
  root: string;
109
112
  };
113
+ '2xl': {
114
+ root: string;
115
+ };
110
116
  };
111
117
  color: {
112
118
  grey: {
@@ -188,6 +194,9 @@ export declare const buttonStyles: import("tailwind-variants").TVReturnType<{
188
194
  xl: {
189
195
  root: string;
190
196
  };
197
+ '2xl': {
198
+ root: string;
199
+ };
191
200
  };
192
201
  color: {
193
202
  grey: {
package/dist/components/buttons/button/button-styles.js CHANGED
@@ -25,10 +25,11 @@ var buttonStyles = tv({
25
25
  }
26
26
  },
27
27
  size: {
28
- xs: { root: "px-2 py-[0.125rem] text-[.75rem] leading-4 ![--rui-icon-size:0.75rem]" },
29
- sm: { root: "px-2.5 py-1 text-[.8125rem] leading-5 ![--rui-icon-size:1rem]" },
30
- lg: { root: "px-6 py-2 text-[1rem] leading-5 ![--rui-icon-size:1.25rem]" },
31
- xl: { root: "px-6 py-2.5 text-[1rem] leading-6 ![--rui-icon-size:1.375rem]" }
28
+ "xs": { root: "px-2 py-[0.125rem] text-[.75rem] leading-4 ![--rui-icon-size:0.75rem]" },
29
+ "sm": { root: "px-2.5 py-1 text-[.8125rem] leading-5 ![--rui-icon-size:1rem]" },
30
+ "lg": { root: "px-6 py-2 text-[1rem] leading-5 ![--rui-icon-size:1.25rem]" },
31
+ "xl": { root: "px-6 py-2 text-[1rem] leading-6 ![--rui-icon-size:1.375rem]" },
32
+ "2xl": { root: "px-6 py-2.5 text-[1rem] leading-6 ![--rui-icon-size:1.375rem]" }
32
33
  },
33
34
  color: {
34
35
  grey: { root: "bg-rui-grey-200 hover:bg-rui-grey-100 active:bg-rui-grey-50 text-rui-text ring-rui-grey-400 dark:bg-rui-grey-300 dark:text-rui-light-text dark:ring-rui-grey-600" },
@@ -294,6 +295,16 @@ var buttonStyles = tv({
294
295
  size: "lg",
295
296
  class: { root: "px-2.5" }
296
297
  },
298
+ {
299
+ variant: "text",
300
+ size: "xl",
301
+ class: { root: "px-2.5" }
302
+ },
303
+ {
304
+ variant: "text",
305
+ size: "2xl",
306
+ class: { root: "px-2.5" }
307
+ },
297
308
  {
298
309
  variant: "fab",
299
310
  size: "xs",
@@ -341,6 +352,11 @@ var buttonStyles = tv({
341
352
  {
342
353
  icon: true,
343
354
  size: "xl",
355
+ class: { root: "p-2 ![--rui-icon-size:1.5rem]" }
356
+ },
357
+ {
358
+ icon: true,
359
+ size: "2xl",
344
360
  class: { root: "p-2 ![--rui-icon-size:1.75rem]" }
345
361
  },
346
362
  {
package/dist/components/buttons/button/button-styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button-styles.js","names":[],"sources":["../../../../src/components/buttons/button/button-styles.ts"],"sourcesContent":["import { tv } from '@/utils/tv';\n\nexport const buttonStyles = tv({\n slots: {\n root: [\n 'text-sm leading-5 font-medium outline outline-1 outline-transparent outline-offset-[-1px]',\n // `position: relative` is only needed as a positioning context for the\n // absolute-positioned loading spinner; applied via the `loading` variant\n // below. Putting it here would collide with consumers that need to pin\n // the button with `fixed`/`absolute` (cascade order picks the later\n // utility — usually `relative` — and the consumer's `right-*`/`bottom-*`\n // end up as relative offsets, which misplaces FABs).\n 'flex items-center justify-center gap-x-2',\n 'px-4 py-1.5 rounded transition-all',\n // Default (md) icon sizing is driven by a CSS custom property so that\n // RuiIcon's `size` prop (stamped as inline `style=\"--rui-icon-size\"` on\n // the svg) can override it cleanly. Size variants below redefine the\n // property with `!` so they beat this baseline on the same element;\n // inline style on the svg then beats the inherited value when a\n // consumer supplies their own size. See rotki/ui-library#512.\n '[--rui-icon-size:1.125rem]',\n // `disabled` on the element covers two states: actually disabled and\n // loading (RuiButton sets `disabled = disabled || loading`). The\n // color/bg/text overrides for the \"grey disabled\" look live in the\n // `loading: false` compounds below so they skip firing on loading\n // buttons — where we want the variant color to stay visible behind\n // the spinner. Cursor stays here since both states are non-clickable.\n 'disabled:cursor-not-allowed',\n 'focus-visible:!ring-2',\n ].join(' '),\n label: 'inline-block text-nowrap',\n spinner: 'absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n },\n variants: {\n variant: {\n default: {},\n outlined: {},\n text: { root: 'px-2' },\n fab: { root: 'rounded-full py-2' },\n list: { root: 'p-3 px-3 rounded-none w-full justify-start text-left', label: 'w-full' },\n },\n size: {\n // Each size variant redefines `--rui-icon-size` on the button so the\n // value inherits into RuiIcons in button slots (prepend/append/default)\n // and drives their `width: var(--rui-icon-size, 1.5rem)` class. `!` on\n // the arbitrary property makes the variant beat the md baseline in the\n // base root regardless of CSS source order. A consumer passing `size`\n // on RuiIcon still wins: that path stamps an inline style on the svg\n // element itself, which beats the inherited value from the button.\n xs: { root: 'px-2 py-[0.125rem] text-[.75rem] leading-4 ![--rui-icon-size:0.75rem]' },\n sm: { root: 'px-2.5 py-1 text-[.8125rem] leading-5 ![--rui-icon-size:1rem]' },\n lg: { root: 'px-6 py-2 text-[1rem] leading-5 ![--rui-icon-size:1.25rem]' },\n xl: { root: 'px-6 py-2.5 text-[1rem] leading-6 ![--rui-icon-size:1.375rem]' },\n },\n color: {\n grey: { root: 'bg-rui-grey-200 hover:bg-rui-grey-100 active:bg-rui-grey-50 text-rui-text ring-rui-grey-400 dark:bg-rui-grey-300 dark:text-rui-light-text dark:ring-rui-grey-600' },\n primary: { root: 'bg-rui-primary hover:bg-rui-primary-darker active:bg-rui-primary-darker/90 text-rui-dark-text ring-rui-primary/40 dark:text-rui-text dark:ring-rui-primary/60' },\n secondary: { root: 'bg-rui-secondary hover:bg-rui-secondary-darker active:bg-rui-secondary-darker/90 text-rui-dark-text ring-rui-secondary/40 dark:text-rui-text dark:ring-rui-secondary/60' },\n error: { root: 'bg-rui-error hover:bg-rui-error-darker active:bg-rui-error-darker/90 text-rui-dark-text ring-rui-error/40 dark:text-rui-text dark:ring-rui-error/60' },\n warning: { root: 'bg-rui-warning hover:bg-rui-warning-darker active:bg-rui-warning-darker/90 text-rui-dark-text ring-rui-warning/40 dark:text-rui-text dark:ring-rui-warning/60' },\n info: { root: 'bg-rui-info hover:bg-rui-info-darker active:bg-rui-info-darker/90 text-rui-dark-text ring-rui-info/40 dark:text-rui-text dark:ring-rui-info/60' },\n success: { root: 'bg-rui-success hover:bg-rui-success-darker active:bg-rui-success-darker/90 text-rui-dark-text ring-rui-success/40 dark:text-rui-text dark:ring-rui-success/60' },\n },\n rounded: {\n true: { root: 'rounded-full' },\n },\n icon: {\n // Padding and icon sizing live in the `icon + size` compound variants\n // below so every size resolves to a height matching its text-button\n // counterpart; this base only contributes the round shape.\n true: { root: 'rounded-full' },\n },\n active: {\n true: {},\n false: {},\n },\n loading: {\n true: { root: 'relative !cursor-progress space-x-0 [&>*:not([data-spinner])]:opacity-0 [&>*:not([data-spinner])]:invisible' },\n false: {},\n },\n hideFocusIndicator: {\n true: { root: 'focus-visible:!ring-0' },\n },\n },\n compoundVariants: [\n // === Disabled (not loading) appearance ===\n // Applied only when `loading: false` so that loading buttons keep their\n // variant color/outline visible behind the spinner; pure disabled buttons\n // fade to the Material disabled palette.\n { loading: false, class: { root: 'disabled:!bg-black/[.12] dark:disabled:!bg-white/[.12] disabled:!text-rui-text-disabled disabled:active:!text-rui-text-disabled' } },\n { loading: false, variant: 'outlined', class: { root: 'disabled:!bg-transparent dark:disabled:!bg-transparent disabled:active:!bg-transparent disabled:outline-rui-text-disabled' } },\n { loading: false, variant: 'text', class: { root: 'disabled:!bg-transparent dark:disabled:!bg-transparent disabled:active:!bg-transparent' } },\n { loading: false, variant: 'list', class: { root: 'disabled:!bg-transparent dark:disabled:!bg-transparent disabled:active:!bg-transparent' } },\n\n // === Grey color variants ===\n { color: 'grey', active: true, class: { root: 'bg-rui-grey-50' } },\n { color: 'grey', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-black/[.04] active:bg-black/10 dark:bg-transparent dark:active:bg-white/10 dark:hover:bg-white/[.04] dark:text-rui-text' } },\n { color: 'grey', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-black/10 dark:bg-white/30' } },\n { color: 'grey', variant: 'outlined', class: { root: 'outline-rui-text' } },\n { color: 'grey', variant: 'text', class: { root: 'text-rui-text-secondary' } },\n\n // === Context colors — outlined/text variants ===\n // `dark:text-rui-<color>` is required to beat `dark:text-rui-text` set by\n // the base color variant (meant for filled buttons where text sits on a\n // colored bg). Without the override, outlined/text/list buttons in dark\n // mode render white text against a themed outline/underline.\n { color: 'primary', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-primary-lighter/[.04] active:bg-rui-primary-lighter/10 text-rui-primary dark:text-rui-primary' } },\n { color: 'secondary', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-secondary-lighter/[.04] active:bg-rui-secondary-lighter/10 text-rui-secondary dark:text-rui-secondary' } },\n { color: 'error', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-error-lighter/[.04] active:bg-rui-error-lighter/10 text-rui-error dark:text-rui-error' } },\n { color: 'warning', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-warning-lighter/[.04] active:bg-rui-warning-lighter/10 text-rui-warning dark:text-rui-warning' } },\n { color: 'info', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-info-lighter/[.04] active:bg-rui-info-lighter/10 text-rui-info dark:text-rui-info' } },\n { color: 'success', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-success-lighter/[.04] active:bg-rui-success-lighter/10 text-rui-success dark:text-rui-success' } },\n\n // === Context colors — active default ===\n { color: 'primary', active: true, class: { root: 'bg-rui-primary-darker' } },\n { color: 'secondary', active: true, class: { root: 'bg-rui-secondary-darker' } },\n { color: 'error', active: true, class: { root: 'bg-rui-error-darker' } },\n { color: 'warning', active: true, class: { root: 'bg-rui-warning-darker' } },\n { color: 'info', active: true, class: { root: 'bg-rui-info-darker' } },\n { color: 'success', active: true, class: { root: 'bg-rui-success-darker' } },\n\n // === Context colors — active outlined/text ===\n { color: 'primary', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-primary-lighter/30' } },\n { color: 'secondary', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-secondary-lighter/30' } },\n { color: 'error', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-error-lighter/30' } },\n { color: 'warning', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-warning-lighter/30' } },\n { color: 'info', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-info-lighter/30' } },\n { color: 'success', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-success-lighter/30' } },\n\n // === Context colors — outlined border ===\n { color: 'primary', variant: 'outlined', class: { root: 'outline-rui-primary/[0.5]' } },\n { color: 'secondary', variant: 'outlined', class: { root: 'outline-rui-secondary/[0.5]' } },\n { color: 'error', variant: 'outlined', class: { root: 'outline-rui-error/[0.5]' } },\n { color: 'warning', variant: 'outlined', class: { root: 'outline-rui-warning/[0.5]' } },\n { color: 'info', variant: 'outlined', class: { root: 'outline-rui-info/[0.5]' } },\n { color: 'success', variant: 'outlined', class: { root: 'outline-rui-success/[0.5]' } },\n\n // === Size overrides per variant ===\n { variant: 'text', size: 'xs', class: { root: 'px-1' } },\n { variant: 'text', size: 'sm', class: { root: 'px-1.5' } },\n { variant: 'text', size: 'lg', class: { root: 'px-2.5' } },\n { variant: 'fab', size: 'xs', class: { root: 'py-1 px-1' } },\n { variant: 'fab', size: 'sm', class: { root: 'py-1.5 px-2' } },\n { variant: 'fab', size: 'lg', class: { root: 'py-3' } },\n { variant: 'list', size: 'xs', class: { root: 'px-3 py-0.5' } },\n { variant: 'list', size: 'sm', class: { root: 'px-3 py-1' } },\n // Icon-only button sizing — every size lands at the same height as the\n // text button of the matching size, with a ~60–70% icon ratio (Material-3\n // style). The `size` rule sizes icons to 12/16/20/22px for text-button\n // prepend/append slots; here icon-only buttons get a larger glyph so they\n // don't look lost in the square. Values are rem-based throughout: p-1 =\n // 0.25rem, p-1.5 = 0.375rem, p-2 = 0.5rem; glyph sizes use rem literals.\n // xs uses an arbitrary 0.1875rem (3px) padding — no Tailwind token hits\n // it cleanly — to keep the 70% icon ratio with a 14px glyph.\n //\n // xs: p-[0.1875rem] + 0.875rem icon = 0.375 + 0.875 = 1.25rem (20px) — 70% ratio\n // sm: p-1 + 1.25rem icon = 0.5 + 1.25 = 1.75rem (28px)\n // md (default): p-1.5 + 1.25rem icon = 0.75 + 1.25 = 2rem (32px)\n // lg: p-1.5 + 1.5rem icon = 0.75 + 1.5 = 2.25rem (36px)\n // xl: p-2 + 1.75rem icon = 1 + 1.75 = 2.75rem (44px)\n { icon: true, class: { root: 'p-1.5 ![--rui-icon-size:1.25rem]' } },\n { icon: true, size: 'xs', class: { root: 'p-[0.1875rem] ![--rui-icon-size:0.875rem]' } },\n { icon: true, size: 'sm', class: { root: 'p-1 ![--rui-icon-size:1.25rem]' } },\n { icon: true, size: 'lg', class: { root: 'p-1.5 ![--rui-icon-size:1.5rem]' } },\n { icon: true, size: 'xl', class: { root: 'p-2 ![--rui-icon-size:1.75rem]' } },\n { variant: 'fab', icon: true, size: 'sm', class: { root: 'px-2 py-2' } },\n ],\n compoundSlots: [\n // Dark mode default variant text override for warning/success/info\n { slots: ['root'], color: ['warning', 'success', 'info'], variant: 'default', class: 'dark:text-rui-light-text' },\n // Dark mode active outlined/text override for primary/secondary\n { slots: ['root'], color: 'primary', variant: ['outlined', 'text', 'list'], active: true, class: 'dark:bg-rui-primary-darker/60 dark:text-rui-primary-lighter' },\n { slots: ['root'], color: 'secondary', variant: ['outlined', 'text', 'list'], active: true, class: 'dark:bg-rui-secondary-darker/60 dark:text-rui-secondary-lighter' },\n ],\n defaultVariants: {\n variant: 'default',\n color: 'grey',\n active: false,\n },\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"button-styles.js","names":[],"sources":["../../../../src/components/buttons/button/button-styles.ts"],"sourcesContent":["import { tv } from '@/utils/tv';\n\nexport const buttonStyles = tv({\n slots: {\n root: [\n 'text-sm leading-5 font-medium outline outline-1 outline-transparent outline-offset-[-1px]',\n // `position: relative` is only needed as a positioning context for the\n // absolute-positioned loading spinner; applied via the `loading` variant\n // below. Putting it here would collide with consumers that need to pin\n // the button with `fixed`/`absolute` (cascade order picks the later\n // utility — usually `relative` — and the consumer's `right-*`/`bottom-*`\n // end up as relative offsets, which misplaces FABs).\n 'flex items-center justify-center gap-x-2',\n 'px-4 py-1.5 rounded transition-all',\n // Default (md) icon sizing is driven by a CSS custom property so that\n // RuiIcon's `size` prop (stamped as inline `style=\"--rui-icon-size\"` on\n // the svg) can override it cleanly. Size variants below redefine the\n // property with `!` so they beat this baseline on the same element;\n // inline style on the svg then beats the inherited value when a\n // consumer supplies their own size. See rotki/ui-library#512.\n '[--rui-icon-size:1.125rem]',\n // `disabled` on the element covers two states: actually disabled and\n // loading (RuiButton sets `disabled = disabled || loading`). The\n // color/bg/text overrides for the \"grey disabled\" look live in the\n // `loading: false` compounds below so they skip firing on loading\n // buttons — where we want the variant color to stay visible behind\n // the spinner. Cursor stays here since both states are non-clickable.\n 'disabled:cursor-not-allowed',\n 'focus-visible:!ring-2',\n ].join(' '),\n label: 'inline-block text-nowrap',\n spinner: 'absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2',\n },\n variants: {\n variant: {\n default: {},\n outlined: {},\n text: { root: 'px-2' },\n fab: { root: 'rounded-full py-2' },\n list: { root: 'p-3 px-3 rounded-none w-full justify-start text-left', label: 'w-full' },\n },\n size: {\n // Each size variant redefines `--rui-icon-size` on the button so the\n // value inherits into RuiIcons in button slots (prepend/append/default)\n // and drives their `width: var(--rui-icon-size, 1.5rem)` class. `!` on\n // the arbitrary property makes the variant beat the md baseline in the\n // base root regardless of CSS source order. A consumer passing `size`\n // on RuiIcon still wins: that path stamps an inline style on the svg\n // element itself, which beats the inherited value from the button.\n 'xs': { root: 'px-2 py-[0.125rem] text-[.75rem] leading-4 ![--rui-icon-size:0.75rem]' },\n 'sm': { root: 'px-2.5 py-1 text-[.8125rem] leading-5 ![--rui-icon-size:1rem]' },\n 'lg': { root: 'px-6 py-2 text-[1rem] leading-5 ![--rui-icon-size:1.25rem]' },\n // `xl` targets the 40px input height — the common toolbar case where a\n // RuiButton needs to line up with RuiTextField / RuiMenuSelect. For a\n // 44px jumbo-CTA button (auth screens, empty-state primaries), reach for\n // `2xl` instead.\n 'xl': { root: 'px-6 py-2 text-[1rem] leading-6 ![--rui-icon-size:1.375rem]' },\n '2xl': { root: 'px-6 py-2.5 text-[1rem] leading-6 ![--rui-icon-size:1.375rem]' },\n },\n color: {\n grey: { root: 'bg-rui-grey-200 hover:bg-rui-grey-100 active:bg-rui-grey-50 text-rui-text ring-rui-grey-400 dark:bg-rui-grey-300 dark:text-rui-light-text dark:ring-rui-grey-600' },\n primary: { root: 'bg-rui-primary hover:bg-rui-primary-darker active:bg-rui-primary-darker/90 text-rui-dark-text ring-rui-primary/40 dark:text-rui-text dark:ring-rui-primary/60' },\n secondary: { root: 'bg-rui-secondary hover:bg-rui-secondary-darker active:bg-rui-secondary-darker/90 text-rui-dark-text ring-rui-secondary/40 dark:text-rui-text dark:ring-rui-secondary/60' },\n error: { root: 'bg-rui-error hover:bg-rui-error-darker active:bg-rui-error-darker/90 text-rui-dark-text ring-rui-error/40 dark:text-rui-text dark:ring-rui-error/60' },\n warning: { root: 'bg-rui-warning hover:bg-rui-warning-darker active:bg-rui-warning-darker/90 text-rui-dark-text ring-rui-warning/40 dark:text-rui-text dark:ring-rui-warning/60' },\n info: { root: 'bg-rui-info hover:bg-rui-info-darker active:bg-rui-info-darker/90 text-rui-dark-text ring-rui-info/40 dark:text-rui-text dark:ring-rui-info/60' },\n success: { root: 'bg-rui-success hover:bg-rui-success-darker active:bg-rui-success-darker/90 text-rui-dark-text ring-rui-success/40 dark:text-rui-text dark:ring-rui-success/60' },\n },\n rounded: {\n true: { root: 'rounded-full' },\n },\n icon: {\n // Padding and icon sizing live in the `icon + size` compound variants\n // below so every size resolves to a height matching its text-button\n // counterpart; this base only contributes the round shape.\n true: { root: 'rounded-full' },\n },\n active: {\n true: {},\n false: {},\n },\n loading: {\n true: { root: 'relative !cursor-progress space-x-0 [&>*:not([data-spinner])]:opacity-0 [&>*:not([data-spinner])]:invisible' },\n false: {},\n },\n hideFocusIndicator: {\n true: { root: 'focus-visible:!ring-0' },\n },\n },\n compoundVariants: [\n // === Disabled (not loading) appearance ===\n // Applied only when `loading: false` so that loading buttons keep their\n // variant color/outline visible behind the spinner; pure disabled buttons\n // fade to the Material disabled palette.\n { loading: false, class: { root: 'disabled:!bg-black/[.12] dark:disabled:!bg-white/[.12] disabled:!text-rui-text-disabled disabled:active:!text-rui-text-disabled' } },\n { loading: false, variant: 'outlined', class: { root: 'disabled:!bg-transparent dark:disabled:!bg-transparent disabled:active:!bg-transparent disabled:outline-rui-text-disabled' } },\n { loading: false, variant: 'text', class: { root: 'disabled:!bg-transparent dark:disabled:!bg-transparent disabled:active:!bg-transparent' } },\n { loading: false, variant: 'list', class: { root: 'disabled:!bg-transparent dark:disabled:!bg-transparent disabled:active:!bg-transparent' } },\n\n // === Grey color variants ===\n { color: 'grey', active: true, class: { root: 'bg-rui-grey-50' } },\n { color: 'grey', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-black/[.04] active:bg-black/10 dark:bg-transparent dark:active:bg-white/10 dark:hover:bg-white/[.04] dark:text-rui-text' } },\n { color: 'grey', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-black/10 dark:bg-white/30' } },\n { color: 'grey', variant: 'outlined', class: { root: 'outline-rui-text' } },\n { color: 'grey', variant: 'text', class: { root: 'text-rui-text-secondary' } },\n\n // === Context colors — outlined/text variants ===\n // `dark:text-rui-<color>` is required to beat `dark:text-rui-text` set by\n // the base color variant (meant for filled buttons where text sits on a\n // colored bg). Without the override, outlined/text/list buttons in dark\n // mode render white text against a themed outline/underline.\n { color: 'primary', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-primary-lighter/[.04] active:bg-rui-primary-lighter/10 text-rui-primary dark:text-rui-primary' } },\n { color: 'secondary', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-secondary-lighter/[.04] active:bg-rui-secondary-lighter/10 text-rui-secondary dark:text-rui-secondary' } },\n { color: 'error', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-error-lighter/[.04] active:bg-rui-error-lighter/10 text-rui-error dark:text-rui-error' } },\n { color: 'warning', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-warning-lighter/[.04] active:bg-rui-warning-lighter/10 text-rui-warning dark:text-rui-warning' } },\n { color: 'info', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-info-lighter/[.04] active:bg-rui-info-lighter/10 text-rui-info dark:text-rui-info' } },\n { color: 'success', variant: ['outlined', 'text', 'list'], class: { root: 'bg-transparent hover:bg-rui-success-lighter/[.04] active:bg-rui-success-lighter/10 text-rui-success dark:text-rui-success' } },\n\n // === Context colors — active default ===\n { color: 'primary', active: true, class: { root: 'bg-rui-primary-darker' } },\n { color: 'secondary', active: true, class: { root: 'bg-rui-secondary-darker' } },\n { color: 'error', active: true, class: { root: 'bg-rui-error-darker' } },\n { color: 'warning', active: true, class: { root: 'bg-rui-warning-darker' } },\n { color: 'info', active: true, class: { root: 'bg-rui-info-darker' } },\n { color: 'success', active: true, class: { root: 'bg-rui-success-darker' } },\n\n // === Context colors — active outlined/text ===\n { color: 'primary', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-primary-lighter/30' } },\n { color: 'secondary', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-secondary-lighter/30' } },\n { color: 'error', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-error-lighter/30' } },\n { color: 'warning', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-warning-lighter/30' } },\n { color: 'info', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-info-lighter/30' } },\n { color: 'success', variant: ['outlined', 'text', 'list'], active: true, class: { root: 'bg-rui-success-lighter/30' } },\n\n // === Context colors — outlined border ===\n { color: 'primary', variant: 'outlined', class: { root: 'outline-rui-primary/[0.5]' } },\n { color: 'secondary', variant: 'outlined', class: { root: 'outline-rui-secondary/[0.5]' } },\n { color: 'error', variant: 'outlined', class: { root: 'outline-rui-error/[0.5]' } },\n { color: 'warning', variant: 'outlined', class: { root: 'outline-rui-warning/[0.5]' } },\n { color: 'info', variant: 'outlined', class: { root: 'outline-rui-info/[0.5]' } },\n { color: 'success', variant: 'outlined', class: { root: 'outline-rui-success/[0.5]' } },\n\n // === Size overrides per variant ===\n { variant: 'text', size: 'xs', class: { root: 'px-1' } },\n { variant: 'text', size: 'sm', class: { root: 'px-1.5' } },\n { variant: 'text', size: 'lg', class: { root: 'px-2.5' } },\n { variant: 'text', size: 'xl', class: { root: 'px-2.5' } },\n { variant: 'text', size: '2xl', class: { root: 'px-2.5' } },\n { variant: 'fab', size: 'xs', class: { root: 'py-1 px-1' } },\n { variant: 'fab', size: 'sm', class: { root: 'py-1.5 px-2' } },\n { variant: 'fab', size: 'lg', class: { root: 'py-3' } },\n { variant: 'list', size: 'xs', class: { root: 'px-3 py-0.5' } },\n { variant: 'list', size: 'sm', class: { root: 'px-3 py-1' } },\n // Icon-only button sizing — every size lands at the same height as the\n // text button of the matching size, with a ~60–70% icon ratio (Material-3\n // style). The `size` rule sizes icons to 12/16/20/22px for text-button\n // prepend/append slots; here icon-only buttons get a larger glyph so they\n // don't look lost in the square. Values are rem-based throughout: p-1 =\n // 0.25rem, p-1.5 = 0.375rem, p-2 = 0.5rem; glyph sizes use rem literals.\n // xs uses an arbitrary 0.1875rem (3px) padding — no Tailwind token hits\n // it cleanly — to keep the 70% icon ratio with a 14px glyph.\n //\n // xs: p-[0.1875rem] + 0.875rem icon = 0.375 + 0.875 = 1.25rem (20px) — 70%\n // sm: p-1 + 1.25rem icon = 0.5 + 1.25 = 1.75rem (28px) — 71%\n // md (default): p-1.5 + 1.25rem icon = 0.75 + 1.25 = 2rem (32px) — 63%\n // lg: p-1.5 + 1.5rem icon = 0.75 + 1.5 = 2.25rem (36px) — 67%\n // xl: p-2 + 1.5rem icon = 1 + 1.5 = 2.5rem (40px) — 60%\n // 2xl: p-2 + 1.75rem icon = 1 + 1.75 = 2.75rem (44px) — 64%\n { icon: true, class: { root: 'p-1.5 ![--rui-icon-size:1.25rem]' } },\n { icon: true, size: 'xs', class: { root: 'p-[0.1875rem] ![--rui-icon-size:0.875rem]' } },\n { icon: true, size: 'sm', class: { root: 'p-1 ![--rui-icon-size:1.25rem]' } },\n { icon: true, size: 'lg', class: { root: 'p-1.5 ![--rui-icon-size:1.5rem]' } },\n { icon: true, size: 'xl', class: { root: 'p-2 ![--rui-icon-size:1.5rem]' } },\n { icon: true, size: '2xl', class: { root: 'p-2 ![--rui-icon-size:1.75rem]' } },\n { variant: 'fab', icon: true, size: 'sm', class: { root: 'px-2 py-2' } },\n ],\n compoundSlots: [\n // Dark mode default variant text override for warning/success/info\n { slots: ['root'], color: ['warning', 'success', 'info'], variant: 'default', class: 'dark:text-rui-light-text' },\n // Dark mode active outlined/text override for primary/secondary\n { slots: ['root'], color: 'primary', variant: ['outlined', 'text', 'list'], active: true, class: 'dark:bg-rui-primary-darker/60 dark:text-rui-primary-lighter' },\n { slots: ['root'], color: 'secondary', variant: ['outlined', 'text', 'list'], active: true, class: 'dark:bg-rui-secondary-darker/60 dark:text-rui-secondary-lighter' },\n ],\n defaultVariants: {\n variant: 'default',\n color: 'grey',\n active: false,\n },\n});\n"],"mappings":"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"}
package/dist/web-types.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "$schema": "http://json.schemastore.org/web-types",
3
3
  "framework": "vue",
4
4
  "name": "@rotki/ui-library",
5
- "version": "2.17.2",
5
+ "version": "2.18.0",
6
6
  "js-types-syntax": "typescript",
7
7
  "description-markup": "markdown",
8
8
  "contributions": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rotki/ui-library",
3
- "version": "2.17.2",
3
+ "version": "2.18.0",
4
4
  "description": "A vue design system and component library for rotki",
5
5
  "type": "module",
6
6
  "keywords": [