@infonomic/uikit 5.39.0 → 5.40.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.
@@ -38,8 +38,10 @@ const checkbox_Checkbox = function({ ref, id, name, label, variant = 'outlined',
38
38
  }),
39
39
  error ? /*#__PURE__*/ jsx(ErrorText, {
40
40
  id: `error-for-${id}`,
41
+ size: size,
41
42
  text: errorText ?? helpText
42
43
  }) : helpText?.length > 0 && /*#__PURE__*/ jsx(HelpText, {
44
+ size: size,
43
45
  text: helpText
44
46
  })
45
47
  ]
@@ -106,22 +106,55 @@ infonomic-components;
106
106
  /* Sizes */
107
107
  .sm,
108
108
  :global(.infonomic-checkbox-sm) {
109
- width: 18px;
110
- height: 18px;
109
+ width: 16px;
110
+ height: 16px;
111
+ }
112
+
113
+ .sm .icon,
114
+ :global(.infonomic-checkbox-sm) :global(.infonomic-checkbox-icon) {
115
+ width: 16px;
116
+ height: 16px;
117
+ }
118
+
119
+ .sm~.label,
120
+ :global(.infonomic-checkbox-sm)~ :global(.infonomic-checkbox-label) {
121
+ font-size: 0.85rem;
111
122
  }
112
123
 
113
124
  .md,
114
125
  :global(.infonomic-checkbox-md) {
115
- width: 20px;
116
- height: 20px;
126
+ width: 18px;
127
+ height: 18px;
128
+ }
129
+
130
+ .md .icon,
131
+ :global(.infonomic-checkbox-md) :global(.infonomic-checkbox-icon) {
132
+ width: 18px;
133
+ height: 18px;
134
+ }
135
+
136
+ .md~.label,
137
+ :global(.infonomic-checkbox-md)~ :global(.infonomic-checkbox-label) {
138
+ font-size: 0.875rem;
117
139
  }
118
140
 
119
141
  .lg,
120
142
  :global(.infonomic-checkbox-lg) {
143
+ width: 20px;
144
+ height: 20px;
145
+ }
146
+
147
+ .lg .icon,
148
+ :global(.infonomic-checkbox-lg) :global(.infonomic-checkbox-icon) {
121
149
  width: 22px;
122
150
  height: 22px;
123
151
  }
124
152
 
153
+ .lg~.label,
154
+ :global(.infonomic-checkbox-lg)~ :global(.infonomic-checkbox-label) {
155
+ font-size: 1rem;
156
+ }
157
+
125
158
  /* Variants */
126
159
  .outlined,
127
160
  :global(.infonomic-checkbox-outlined) {
@@ -78,21 +78,38 @@
78
78
  font-size: .875rem;
79
79
  }
80
80
 
81
- :is(.sm-FMFjMf, .infonomic-checkbox-sm) {
81
+ :is(.sm-FMFjMf, .infonomic-checkbox-sm), :is(.sm-FMFjMf .icon-gwRvT_, .infonomic-checkbox-sm .infonomic-checkbox-icon) {
82
+ width: 16px;
83
+ height: 16px;
84
+ }
85
+
86
+ :is(.sm-FMFjMf ~ .label-rsCVhp, .infonomic-checkbox-sm ~ .infonomic-checkbox-label) {
87
+ font-size: .85rem;
88
+ }
89
+
90
+ :is(.md-iztHYW, .infonomic-checkbox-md), :is(.md-iztHYW .icon-gwRvT_, .infonomic-checkbox-md .infonomic-checkbox-icon) {
82
91
  width: 18px;
83
92
  height: 18px;
84
93
  }
85
94
 
86
- :is(.md-iztHYW, .infonomic-checkbox-md) {
95
+ :is(.md-iztHYW ~ .label-rsCVhp, .infonomic-checkbox-md ~ .infonomic-checkbox-label) {
96
+ font-size: .875rem;
97
+ }
98
+
99
+ :is(.lg-GVxECP, .infonomic-checkbox-lg) {
87
100
  width: 20px;
88
101
  height: 20px;
89
102
  }
90
103
 
91
- :is(.lg-GVxECP, .infonomic-checkbox-lg) {
104
+ :is(.lg-GVxECP .icon-gwRvT_, .infonomic-checkbox-lg .infonomic-checkbox-icon) {
92
105
  width: 22px;
93
106
  height: 22px;
94
107
  }
95
108
 
109
+ :is(.lg-GVxECP ~ .label-rsCVhp, .infonomic-checkbox-lg ~ .infonomic-checkbox-label) {
110
+ font-size: 1rem;
111
+ }
112
+
96
113
  :is(.outlined-VB1vGz, .infonomic-checkbox-outlined) {
97
114
  border: 2px solid var(--checkbox-variant-outlined-border);
98
115
  --checkbox-icon-color: white;
@@ -2,8 +2,9 @@ import type React from 'react';
2
2
  interface ErrorTextProps {
3
3
  id: string;
4
4
  className?: string;
5
+ size?: 'sm' | 'md' | 'lg';
5
6
  text: string;
6
7
  }
7
- export declare function ErrorText({ id, className, text }: ErrorTextProps): React.JSX.Element;
8
+ export declare function ErrorText({ id, className, size, text }: ErrorTextProps): React.JSX.Element;
8
9
  export {};
9
10
  //# sourceMappingURL=error-text.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"error-text.d.ts","sourceRoot":"","sources":["../../../src/components/forms/error-text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,UAAU,cAAc;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;CACb;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,cAAc,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAMpF"}
1
+ {"version":3,"file":"error-text.d.ts","sourceRoot":"","sources":["../../../src/components/forms/error-text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,UAAU,cAAc;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,IAAI,EAAE,MAAM,CAAA;CACb;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,cAAc,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAM1F"}
@@ -1,10 +1,10 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import classnames from "classnames";
3
3
  import error_text_module from "./error-text.module.js";
4
- function ErrorText({ id, className, text }) {
4
+ function ErrorText({ id, className, size, text }) {
5
5
  return /*#__PURE__*/ jsx("p", {
6
6
  id: id,
7
- className: classnames('error-text', error_text_module.text, className),
7
+ className: classnames('error-text', error_text_module.text, size && error_text_module[size], className),
8
8
  children: text
9
9
  });
10
10
  }
@@ -12,4 +12,19 @@ infonomic-components;
12
12
  font-size: 0.875rem;
13
13
  color: var(--error);
14
14
  }
15
+
16
+ .sm,
17
+ :global(.infonomic-error-text-sm) {
18
+ font-size: 0.85rem;
19
+ }
20
+
21
+ .md,
22
+ :global(.infonomic-error-text-md) {
23
+ font-size: 0.875rem;
24
+ }
25
+
26
+ .lg,
27
+ :global(.infonomic-error-text-lg) {
28
+ font-size: 0.9rem;
29
+ }
15
30
  }
@@ -1,5 +1,8 @@
1
1
  import "./error-text_module.css";
2
2
  const error_text_module = {
3
- text: "text-xJE0DB"
3
+ text: "text-xJE0DB",
4
+ sm: "sm-jCozDb",
5
+ md: "md-b7GT8M",
6
+ lg: "lg-q2oWv7"
4
7
  };
5
8
  export { error_text_module as default };
@@ -5,5 +5,17 @@
5
5
  color: var(--error);
6
6
  font-size: .875rem;
7
7
  }
8
+
9
+ :is(.sm-jCozDb, .infonomic-error-text-sm) {
10
+ font-size: .85rem;
11
+ }
12
+
13
+ :is(.md-b7GT8M, .infonomic-error-text-md) {
14
+ font-size: .875rem;
15
+ }
16
+
17
+ :is(.lg-q2oWv7, .infonomic-error-text-lg) {
18
+ font-size: .9rem;
19
+ }
8
20
  }
9
21
 
@@ -1,8 +1,9 @@
1
1
  import type React from 'react';
2
2
  interface HelpTextProps {
3
3
  className?: string;
4
+ size?: 'sm' | 'md' | 'lg';
4
5
  text: string;
5
6
  }
6
- export declare function HelpText({ className, text }: HelpTextProps): React.JSX.Element;
7
+ export declare function HelpText({ className, size, text }: HelpTextProps): React.JSX.Element;
7
8
  export {};
8
9
  //# sourceMappingURL=help-text.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"help-text.d.ts","sourceRoot":"","sources":["../../../src/components/forms/help-text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,UAAU,aAAa;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;CACb;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,aAAa,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAE9E"}
1
+ {"version":3,"file":"help-text.d.ts","sourceRoot":"","sources":["../../../src/components/forms/help-text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,UAAU,aAAa;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,IAAI,EAAE,MAAM,CAAA;CACb;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,aAAa,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAEpF"}
@@ -1,9 +1,9 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import classnames from "classnames";
3
3
  import help_text_module from "./help-text.module.js";
4
- function HelpText({ className, text }) {
4
+ function HelpText({ className, size, text }) {
5
5
  return /*#__PURE__*/ jsx("p", {
6
- className: classnames('infonomic-help-text', help_text_module.text, className),
6
+ className: classnames('infonomic-help-text', help_text_module.text, size && help_text_module[size], className),
7
7
  children: text
8
8
  });
9
9
  }
@@ -12,4 +12,19 @@ infonomic-components;
12
12
  font-size: 0.875rem;
13
13
  color: var(--muted);
14
14
  }
15
+
16
+ .sm,
17
+ :global(.infonomic-help-text-sm) {
18
+ font-size: 0.85rem;
19
+ }
20
+
21
+ .md,
22
+ :global(.infonomic-help-text-md) {
23
+ font-size: 0.875rem;
24
+ }
25
+
26
+ .lg,
27
+ :global(.infonomic-help-text-lg) {
28
+ font-size: 0.9rem;
29
+ }
15
30
  }
@@ -1,5 +1,8 @@
1
1
  import "./help-text_module.css";
2
2
  const help_text_module = {
3
- text: "text-U6KD9f"
3
+ text: "text-U6KD9f",
4
+ sm: "sm-NX28sU",
5
+ md: "md-BEtXW1",
6
+ lg: "lg-han8YY"
4
7
  };
5
8
  export { help_text_module as default };
@@ -5,5 +5,17 @@
5
5
  color: var(--muted);
6
6
  font-size: .875rem;
7
7
  }
8
+
9
+ :is(.sm-NX28sU, .infonomic-help-text-sm) {
10
+ font-size: .85rem;
11
+ }
12
+
13
+ :is(.md-BEtXW1, .infonomic-help-text-md) {
14
+ font-size: .875rem;
15
+ }
16
+
17
+ :is(.lg-han8YY, .infonomic-help-text-lg) {
18
+ font-size: .9rem;
19
+ }
8
20
  }
9
21
 
@@ -51,8 +51,10 @@ const Input = ({ ref, id, name, type = 'text', variant = 'outlined', inputSize =
51
51
  }),
52
52
  error ? /*#__PURE__*/ jsx(ErrorText, {
53
53
  id: `error-for-${id}`,
54
+ size: inputSize,
54
55
  text: errorText ?? helpText
55
56
  }) : helpText?.length > 0 && /*#__PURE__*/ jsx(HelpText, {
57
+ size: inputSize,
56
58
  text: helpText
57
59
  })
58
60
  ]
@@ -8,7 +8,7 @@ function Label({ className, id, htmlFor, label, required }) {
8
8
  className: classnames('label', label_module.label, className),
9
9
  children: [
10
10
  label,
11
- null != required && /*#__PURE__*/ jsx("span", {
11
+ required && /*#__PURE__*/ jsx("span", {
12
12
  className: label_module.required,
13
13
  children: "\xa0*"
14
14
  })
@@ -1 +1 @@
1
- @layer infonomic-base,infonomic-functional,infonomic-utilities,infonomic-theme,infonomic-typography;@layer infonomic-components{:is(.card-mqJaiW,.infonomic-card){width:100%;max-width:100%;color:var(--foreground);background:var(--canvas-25);border-width:var(--border-width-thin);border-color:var(--border-color);border-style:var(--border-style-solid);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm);flex-direction:column;text-decoration:none;display:flex}:is(:is(.dark,[data-theme=dark]) .card-mqJaiW,:is(.dark,[data-theme=dark]) .infonomic-card){background:var(--canvas-800)}:is(.card-hover-hvT4d6,.infonomic-card-hover){transition:background .2s ease-in-out}:is(.card-hover-hvT4d6:hover,.infonomic-card-hover:hover){background:oklch(from var(--theme-50) 1 .03 h)}:is(:is(.dark,[data-theme=dark]) .card-hover-hvT4d6:hover,:is(.dark,[data-theme=dark]) .infonomic-card-hover:hover){background:oklch(from var(--canvas-800) .2 c h)}:is(.card-header-XnoBkP,.infonomic-card-header){flex-direction:column;gap:.5rem;padding:1rem;display:flex}:is(.card-title-JI7Lu3,.infonomic-card-title){color:var(--headings);letter-spacing:-.015em;font-size:1.8rem;font-weight:700;line-height:1}:is(.card-description-fwu7HE,.infonomic-card-description){color:var(--muted);font-size:.875rem}:is(.card-content-uhoZYJ,.infonomic-card-content){flex:1;padding:0 1rem 1rem}:is(.card-footer-BxTa4b,.infonomic-card-footer){align-items:center;padding:0 1rem 1rem;display:flex}:is(.container-tSpizY,.infonomic-container){width:100%;max-width:60rem;margin:0 auto;padding:0 1rem}@media (width>=66rem){:is(.container-tSpizY,.infonomic-container){max-width:64rem}}@media (width>=77rem){:is(.container-tSpizY,.infonomic-container){max-width:74.375rem}}@media (width>=94rem){:is(.container-tSpizY,.infonomic-container){max-width:87.5rem}}:is(.badge-8xVidp,.infonomic-badge){font-size:var(--font-size-sm);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--border-radius-sm);padding:.25em .4em;font-weight:400;line-height:1;display:inline-block}:is(.primary-oZyR_M,.infonomic-badge-primary){color:var(--text-on-primary-strong);background-color:var(--fill-primary-strong)}:is(.secondary-VsqJTm,.infonomic-badge-secondary){color:var(--text-on-secondary-strong);background-color:var(--fill-secondary-strong)}:is(.noeffect-R8eJtO,.infonomic-badge-noeffect){color:var(--text-on-noeffect-strong);background-color:var(--fill-noeffect-strong)}:is(.success-h2otET,.infonomic-badge-success){color:var(--text-on-success-strong);background-color:var(--fill-success-strong)}:is(.info-OG3F3u,.infonomic-badge-info){color:var(--text-on-info-strong);background-color:var(--fill-info-strong)}:is(.warning-zTXksZ,.infonomic-badge-warning){color:var(--text-on-warning-strong);background-color:var(--fill-warning-strong)}:is(.danger-hKF7l_,.infonomic-badge-danger){color:var(--text-on-danger-strong);background-color:var(--fill-danger-strong)}:is(.button-IjDhC0,.infonomic-button){cursor:pointer;text-align:center;gap:var(--gap-2);white-space:nowrap;outline-offset:2px;transition:background-color var(--transition-normal), box-shadow var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:2px solid #0000;justify-content:center;align-items:center;font-weight:400;line-height:0;display:inline-flex}:is(.button-IjDhC0:disabled,.button-IjDhC0[disabled],.infonomic-button:disabled,.infonomic-button[disabled]){pointer-events:none}:is(.button-IjDhC0:focus,.button-IjDhC0:active,.infonomic-button:focus,.infonomic-button:active){--ring-offset-color:var(--background);--ring-offset-shadow:var(--ring-inset) 0 0 0 var(--ring-offset-width) var(--ring-offset-color);--ring-shadow:var(--ring-inset) 0 0 0 calc(1px + var(--ring-offset-width)) var(--ring-color);box-shadow:var(--ring-offset-shadow), var(--ring-shadow), var(--shadow,0 0 #0000)}.button-IjDhC0.square-P_6yde,.infonomic-button-square{aspect-ratio:1;border-radius:var(--border-radius-sm);padding:0}.button-IjDhC0.round-uqus3n,.infonomic-button-round{aspect-ratio:1;border-radius:var(--border-radius-full);padding:0}:is(.xs-jxTd5R,.infonomic-button-xs){min-height:26px;padding:.2rem .4rem;font-size:.7rem}:is(.sm-uD_Ugt,.infonomic-button-sm){min-height:32px;padding:.25rem .5rem;font-size:.775rem}:is(.md-Qp9ad6,.infonomic-button-md){min-height:38px;padding:.625rem 1.25rem;font-size:.95rem}:is(.lg-FAYTen,.infonomic-button-lg){min-height:46px;padding:.75rem 1.5rem;font-size:1.1rem}:is(.xl-Gwvhl4,.infonomic-button-xl){min-height:54px;padding:.75rem 1.5rem;font-size:1.2rem}:is(.filled-CwGsrO,.infonomic-button-filled){color:var(--button-variant-filled-foreground);background-color:var(--button-variant-filled)}:is(.filled-CwGsrO:hover,.infonomic-button-filled:hover){background-color:var(--button-variant-filled-hover)}:is(.filled-CwGsrO:focus,.filled-CwGsrO:active,.infonomic-button-filled:focus,.infonomic-button-filled:active){--ring-color:var(--button-ring-color)}:is(.filled-CwGsrO:disabled,.filled-CwGsrO[disabled],.infonomic-button-filled:disabled,.infonomic-button-filled[disabled]){background-color:var(--button-variant-filled-disabled,oklch(from var(--button-variant-filled) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-foreground-disabled,oklch(from var(--button-variant-filled-foreground) calc(l * .9) calc(c * .85) h))}:is(.filled-weak-QLU8bA,.infonomic-button-filled-weak){color:var(--button-variant-filled-weak-foreground);background-color:var(--button-variant-filled-weak)}:is(.filled-weak-QLU8bA:hover,.infonomic-button-filled-weak:hover){background-color:var(--button-variant-filled-weak-hover)}:is(.filled-weak-QLU8bA:focus,.filled-weak-QLU8bA:active,.infonomic-button-filled-weak:focus,.infonomic-button-filled-weak:active){--ring-color:var(--button-ring-color)}:is(.filled-weak-QLU8bA:disabled,.filled-weak-QLU8bA[disabled],.infonomic-button-filled-weak:disabled,.infonomic-button-filled-weak[disabled]){background-color:var(--button-variant-filled-weak-disabled,oklch(from var(--button-variant-filled-weak) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-weak-foreground-disabled,oklch(from var(--button-variant-filled-weak-foreground) calc(l * .9) calc(c * .85) h))}:is(.outlined-nZGbxu,.infonomic-button-outlined){border:1px solid var(--button-variant-outlined-border);color:var(--button-variant-outlined-foreground);background-color:var(--button-variant-outlined)}:is(.outlined-nZGbxu:disabled,.outlined-nZGbxu[disabled],.infonomic-button-outlined:disabled,.infonomic-button-outlined[disabled]){border-color:var(--button-variant-outlined-border-disabled,oklch(from var(--button-variant-outlined-border) calc(l * 1.5) calc(c * .8) h));color:var(--button-variant-outlined-foreground-disabled,oklch(from var(--button-variant-outlined-foreground) calc(l * 1.1) calc(c * .7) h))}:is(.outlined-nZGbxu:hover,.infonomic-button-outlined:hover){background-color:var(--button-variant-outlined-hover)}:is(.outlined-nZGbxu:focus,.outlined-nZGbxu:active,.infonomic-button-outlined:focus,.infonomic-button-outlined:active){--ring-color:var(--button-ring-color)}:is(.gradient-ySC3O3,.infonomic-button-gradient){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:disabled,.gradient-ySC3O3[disabled],.infonomic-button-gradient:disabled,.infonomic-button-gradient[disabled]){background:unset;background-color:var(--button-variant-gradient-disabled,oklch(from var(--button-variant-gradient-end) calc(l * 1.2) calc(c * .85) h));color:var(--button-variant-gradient-foreground-disabled,oklch(from var(--button-variant-gradient-foreground) calc(l * .9) calc(c * .85) h))}:is(.gradient-ySC3O3:hover,.infonomic-button-gradient:hover){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:focus,.gradient-ySC3O3:active,.infonomic-button-gradient:focus,.infonomic-button-gradient:active){--ring-color:var(--button-ring-color)}:is(.text-GaxlcE,.infonomic-button-text){background-color:var(--button-variant-text);color:var(--button-variant-text-foreground)}:is(.text-GaxlcE:disabled,.text-GaxlcE[disabled],.infonomic-button-text:disabled,.infonomic-button-text[disabled]){color:oklch(from var(--button-variant-text-foreground) calc(l * 1.5) calc(c * .5) h)}:is(.text-GaxlcE:hover,.infonomic-button-text:hover){background-color:var(--button-variant-text-hover)}:is(.text-GaxlcE:focus,.text-GaxlcE:active,.infonomic-button-text:focus,.infonomic-button-text:active){--ring-color:var(--button-ring-color)}:is(.primary-tUmczz,.infonomic-button-primary){--button-ring-color:var(--ring-primary);--button-variant-filled:var(--fill-primary-strong);--button-variant-filled-hover:var(--fill-primary-strong-hover);--button-variant-filled-disabled:var(--fill-primary-strong-disabled);--button-variant-filled-foreground:var(--text-on-primary-strong);--button-variant-filled-foreground-disabled:var(--text-on-primary-strong-disabled);--button-variant-filled-weak:var(--fill-primary-weak);--button-variant-filled-weak-hover:var(--fill-primary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-primary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-primary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-primary-weak-disabled);--button-variant-outlined:var(--fill-primary-outlined);--button-variant-outlined-hover:var(--fill-primary-outlined-hover);--button-variant-outlined-border:var(--stroke-primary);--button-variant-outlined-border-disabled:var(--stroke-primary-disabled);--button-variant-outlined-foreground:var(--text-on-primary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-primary-outlined-disabled);--button-variant-text:var(--fill-primary-text);--button-variant-text-hover:var(--fill-primary-text-hover);--button-variant-text-foreground:var(--text-primary);--button-variant-gradient-start:var(--gradient-primary-start);--button-variant-gradient-end:var(--gradient-primary-end);--button-variant-gradient-foreground:var(--gradient-primary-foreground);--button-variant-gradient-disabled:var(--gradient-primary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-primary-disabled)}:is(.secondary-UqT2AY,.infonomic-button-secondary){--button-ring-color:var(--ring-secondary);--button-variant-filled:var(--fill-secondary-strong);--button-variant-filled-hover:var(--fill-secondary-strong-hover);--button-variant-filled-disabled:var(--fill-secondary-strong-disabled);--button-variant-filled-foreground:var(--text-on-secondary-strong);--button-variant-filled-foreground-disabled:var(--text-on-secondary-strong-disabled);--button-variant-filled-weak:var(--fill-secondary-weak);--button-variant-filled-weak-hover:var(--fill-secondary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-secondary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-secondary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-secondary-weak-disabled);--button-variant-outlined:var(--fill-secondary-outlined);--button-variant-outlined-border:var(--stroke-secondary);--button-variant-outlined-border-disabled:var(--stroke-secondary-disabled);--button-variant-outlined-hover:var(--fill-secondary-outlined-hover);--button-variant-outlined-foreground:var(--text-on-secondary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-secondary-outlined-disabled);--button-variant-text:var(--fill-secondary-text);--button-variant-text-hover:var(--fill-secondary-text-hover);--button-variant-text-foreground:var(--text-secondary);--button-variant-gradient-start:var(--gradient-secondary-start);--button-variant-gradient-end:var(--gradient-secondary-end);--button-variant-gradient-foreground:var(--gradient-secondary-foreground);--button-variant-gradient-disabled:var(--gradient-secondary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-secondary-disabled)}:is(.noeffect-fpxSgg,.infonomic-button-noeffect){--button-ring-color:var(--ring-noeffect);--button-variant-filled:var(--fill-noeffect-strong);--button-variant-filled-hover:var(--fill-noeffect-strong-hover);--button-variant-filled-disabled:var(--fill-noeffect-strong-disabled);--button-variant-filled-foreground:var(--text-on-noeffect-strong);--button-variant-filled-foreground-disabled:var(--text-on-noeffect-strong-disabled);--button-variant-filled-weak:var(--fill-noeffect-weak);--button-variant-filled-weak-hover:var(--fill-noeffect-weak-hover);--button-variant-filled-weak-disabled:var(--fill-noeffect-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-noeffect-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-noeffect-weak-disabled);--button-variant-outlined:var(--fill-noeffect-outlined);--button-variant-outlined-hover:var(--fill-noeffect-outlined-hover);--button-variant-outlined-disabled:var(--fill-noeffect-outlined-disabled);--button-variant-outlined-border:var(--stroke-noeffect);--button-variant-outlined-border-disabled:var(--stroke-noeffect-disabled);--button-variant-outlined-foreground:var(--text-on-noeffect-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-noeffect-disabled);--button-variant-text:var(--fill-noeffect-text);--button-variant-text-hover:var(--fill-noeffect-text-hover);--button-variant-text-foreground:var(--text-noeffect);--button-variant-gradient-start:var(--gradient-noeffect-start);--button-variant-gradient-end:var(--gradient-noeffect-end);--button-variant-gradient-foreground:var(--gradient-noeffect-foreground);--button-variant-gradient-disabled:var(--gradient-noeffect-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-noeffect-disabled)}:is(.success-fTNDEn,.infonomic-button-success){--button-ring-color:var(--ring-success);--button-variant-filled:var(--fill-success-strong);--button-variant-filled-hover:var(--fill-success-strong-hover);--button-variant-filled-disabled:var(--fill-success-strong-disabled);--button-variant-filled-foreground:var(--text-on-success-strong);--button-variant-filled-foreground-disabled:var(--text-on-success-strong-disabled);--button-variant-filled-weak:var(--fill-success-weak);--button-variant-filled-weak-hover:var(--fill-success-weak-hover);--button-variant-filled-weak-disabled:var(--fill-success-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-success-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-success-weak-disabled);--button-variant-outlined:var(--fill-success-outlined);--button-variant-outlined-hover:var(--fill-success-outlined-hover);--button-variant-outlined-border:var(--stroke-success);--button-variant-outlined-border-disabled:var(--stroke-success-disabled);--button-variant-outlined-foreground:var(--text-on-success-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-success-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-success-text-hover);--button-variant-text-foreground:var(--text-success);--button-variant-gradient-start:var(--gradient-success-start);--button-variant-gradient-end:var(--gradient-success-end);--button-variant-gradient-foreground:var(--gradient-success-foreground);--button-variant-gradient-disabled:var(--gradient-success-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-success-disabled)}:is(.info-qrdXQD,.infonomic-button-info){--button-ring-color:var(--ring-info);--button-variant-filled:var(--fill-info-strong);--button-variant-filled-hover:var(--fill-info-strong-hover);--button-variant-filled-disabled:var(--fill-info-strong-disabled);--button-variant-filled-foreground:var(--text-on-info-strong);--button-variant-filled-foreground-disabled:var(--text-on-info-strong-disabled);--button-variant-filled-weak:var(--fill-info-weak);--button-variant-filled-weak-hover:var(--fill-info-weak-hover);--button-variant-filled-weak-disabled:var(--fill-info-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-info-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-info-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-info-outlined-hover);--button-variant-outlined-border:var(--stroke-info);--button-variant-outlined-border-disabled:var(--stroke-info-disabled);--button-variant-outlined-foreground:var(--text-on-info-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-info-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-info-text-hover);--button-variant-text-foreground:var(--text-info);--button-variant-gradient-start:var(--gradient-info-start);--button-variant-gradient-end:var(--gradient-info-end);--button-variant-gradient-foreground:var(--gradient-info-foreground);--button-variant-gradient-disabled:var(--gradient-info-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-info-disabled)}:is(.warning-a00T3A,.infonomic-button-warning){--button-ring-color:var(--ring-warning);--button-variant-filled:var(--fill-warning-strong);--button-variant-filled-hover:var(--fill-warning-strong-hover);--button-variant-filled-disabled:var(--fill-warning-strong-disabled);--button-variant-filled-foreground:var(--text-on-warning-strong);--button-variant-filled-foreground-disabled:var(--text-on-warning-strong-disabled);--button-variant-filled-weak:var(--fill-warning-weak);--button-variant-filled-weak-hover:var(--fill-warning-weak-hover);--button-variant-filled-weak-disabled:var(--fill-warning-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-warning-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-warning-weak-disabled);--button-variant-outlined:var(--fill-warning-outlined);--button-variant-outlined-hover:var(--fill-warning-outlined-hover);--button-variant-outlined-border:var(--stroke-warning);--button-variant-outlined-border-disabled:var(--stroke-warning-disabled);--button-variant-outlined-foreground:var(--text-on-warning-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-warning-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-warning-text-hover);--button-variant-text-foreground:var(--text-warning);--button-variant-gradient-start:var(--gradient-warning-start);--button-variant-gradient-end:var(--gradient-warning-end);--button-variant-gradient-foreground:var(--gradient-warning-foreground);--button-variant-gradient-disabled:var(--gradient-warning-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-warning-disabled)}:is(.danger-rwIV_i,.infonomic-button-danger){--button-ring-color:var(--ring-danger);--button-variant-filled:var(--fill-danger-strong);--button-variant-filled-hover:var(--fill-danger-strong-hover);--button-variant-filled-disabled:var(--fill-danger-strong-disabled);--button-variant-filled-foreground:var(--text-on-danger-strong);--button-variant-filled-foreground-disabled:var(--text-on-danger-strong-disabled);--button-variant-filled-weak:var(--fill-danger-weak);--button-variant-filled-weak-hover:var(--fill-danger-weak-hover);--button-variant-filled-weak-disabled:var(--fill-danger-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-danger-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-danger-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-danger-outlined-hover);--button-variant-outlined-border:var(--stroke-danger);--button-variant-outlined-border-disabled:var(--stroke-danger-disabled);--button-variant-outlined-foreground:var(--text-on-danger-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-danger-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-danger-text-hover);--button-variant-text-foreground:var(--text-danger);--button-variant-gradient-start:var(--gradient-danger-start);--button-variant-gradient-end:var(--gradient-danger-end);--button-variant-gradient-foreground:var(--gradient-danger-foreground);--button-variant-gradient-disabled:var(--gradient-danger-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-danger-disabled)}:is(.fullWidth-wXvP0v,.infonomic-button-full-width){width:100%;display:flex}:is(.button-group-uqvOi8,.infonomic-button-group){place-items:center;gap:var(--gap-2);flex-direction:column;display:flex}@media screen and (width>=40rem){:is(.button-group-uqvOi8,.infonomic-button-group){flex-direction:row}}:is(.copy-button-container-vCNz8o,.infonomic-copy-button-container){display:inline-block}:is(.copy-button-oa4bdj svg,.infonomic-copy-button svg){width:90%;height:90%;display:block}:is(.xs-lZmf78,.infonomic-copy-button-xs){width:26px;height:26px;min-height:26px;padding:.25rem}:is(.sm-KNN1e5,.infonomic-copy-button-sm){width:32px;height:32px;min-height:32px;padding:.35rem}:is(.md-OoH0l4,.infonomic-copy-button-md){width:38px;height:38px;min-height:38px;padding:.45rem}:is(.lg-uu5ujz,.infonomic-copy-button-lg){width:46px;height:46px;min-height:46px;padding:.55rem}:is(.xl-pFYyrS,.infonomic-copy-button-xl){width:54px;height:54px;min-height:54px;padding:.65rem}:is(.input-wrapper-xxN94z,.infonomic-input-wrapper){gap:var(--gap-1);flex-direction:column;display:flex}:is(.input-container-GveKcr,.infonomic-input-container){align-items:center;gap:var(--gap-2);width:100%;padding:0;display:flex;position:relative}:is(.input-voSL1w,.infonomic-input){gap:var(--gap-2);width:100%;transition:all var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:none;align-items:center;font-weight:400;display:inline-flex}:is(.input-voSL1w:focus,.input-voSL1w:active,.infonomic-input:focus,.infonomic-input:active){--ring-offset-color:var(--background);--ring-offset-shadow:var(--ring-inset) 0 0 0 var(--ring-offset-width) var(--ring-offset-color);--ring-shadow:var(--ring-inset) 0 0 0 calc(1px + var(--ring-offset-width)) var(--ring-color);box-shadow:var(--ring-offset-shadow), var(--ring-shadow), var(--shadow,0 0 #0000)}:is(.input-voSL1w:disabled,.input-voSL1w[disabled],.infonomic-input:disabled,.infonomic-input[disabled]){pointer-events:none}:is(.label-a8k0oS,.infonomic-input-label){color:var(--label-color);font-size:.875rem;font-weight:500}:is(.sm-cI5ETu,.infonomic-input-sm){min-height:32px;padding:.25rem .5rem;font-size:.875rem;line-height:0}:is(.md-moqLi4,.infonomic-input-md){min-height:36px;padding:.3rem .5rem;font-size:1rem;line-height:0}:is(.lg-Tn3YZZ,.infonomic-input-lg){min-height:40px;padding:.4rem .5rem;font-size:1.175rem;line-height:0}:is(.start-adornment-H0sdmX,.end-adornment-xl3mid,.infonomic-input-start-adornment,.infonomic-input-end-adornment){align-items:center;display:flex;position:absolute}:is(.start-adornment-H0sdmX,.infonomic-input-start-adornment){left:5px}:is(.end-adornment-xl3mid,.infonomic-input-end-adornment){right:5px}:is(.help-text-MZW4yX,.infonomic-input-help-text){color:var(--help-text-color);font-size:.75rem}:is(.outlined-xbB8mE,.infonomic-input-outlined){border:1px solid var(--input-variant-outlined-border);background-color:#0000}:is(.outlined-xbB8mE:hover,.infonomic-input-outlined:hover){border:1px solid var(--input-variant-outlined-hover-border)}:is(.outlined-xbB8mE:focus,.outlined-xbB8mE:active,.infonomic-input-outlined:focus,.infonomic-input-outlined:active){--ring-color:var(--input-variant-outline-ring-color)}:is(.underlined-zAz2HP,.infonomic-input-underlined){border-bottom:1px solid var(--input-variant-underlined-border);gap:var(--gap-1);background-color:var(--input-variant-underlined);border-radius:0}.underlined-zAz2HP.sm-cI5ETu,.infonomic-input-underlined.input-sm{min-height:26px;padding:.25rem .1rem}.underlined-zAz2HP.md-moqLi4,.infonomic-input-underlined.input-md{min-height:30px;padding:.25rem .1rem}.underlined-zAz2HP.lg-Tn3YZZ,.infonomic-input-underlined.input-lg{min-height:34px;padding:0 .1rem}:is(.underlined-zAz2HP:hover,.infonomic-input-underlined:hover){border-bottom:1px solid var(--input-variant-underlined-hover-border)}:is(.filled-M1_LzJ,.infonomic-input-filled){background-color:var(--input-variant-filled)}:is(.error-n0kSb0,.infonomic-input-error),:is(.error-n0kSb0:hover,.infonomic-input-error:hover){border:1px solid var(--red-400)}:is(.error-n0kSb0:focus,.error-n0kSb0:active,.infonomic-input-error:focus,.infonomic-input-error:active){--ring-color:var(--red-300)}.underlined-zAz2HP.start-adornment-padding-YAcYOx,.start-adornment-padding-YAcYOx,.infonomic-input-underlined.input-start-adornment-padding,.infonomic-input-start-adornment-padding{padding-left:2rem}.underlined-zAz2HP.end-adornment-padding-nC63CK,.end-adornment-padding-nC63CK,.infonomic-input-underlined.input-end-adornment-padding,.infonomic-input-end-adornment-padding{padding-right:2rem}.underlined-zAz2HP.start-adornment-H0sdmX,.infonomic-input-underlined.input-start-adornment{left:0}.underlined-zAz2HP.end-adornment-xl3mid,.infonomic-input-underlined.input-end-adornment{right:0}:is(.primary-xZZpZI,.infonomic-input-primary){--input-variant-outlined-border:var(--stroke-primary);--input-variant-outlined-hover-border:var(--stroke-primary-hover);--input-variant-outline-ring-color:var(--ring-primary);--input-variant-underlined-border:var(--stroke-primary);--input-variant-underlined-hover-border:var(--stroke-primary-hover);--input-variant-filled:var(--fill-primary-weak)}:is(.secondary-WWDy2x,.infonomic-input-secondary){--input-variant-outlined-border:var(--stroke-secondary);--input-variant-outlined-hover-border:var(--stroke-secondary-hover);--input-variant-outline-ring-color:var(--ring-secondary);--input-variant-underlined-border:var(--stroke-secondary);--input-variant-underlined-hover-border:var(--stroke-secondary-hover);--input-variant-filled:var(--fill-secondary-weak)}:is(.noeffect-LHbgak,.infonomic-input-noeffect){--input-variant-outlined-border:var(--stroke-noeffect);--input-variant-outlined-hover-border:var(--stroke-noeffect-hover);--input-variant-outline-ring-color:var(--ring-noeffect);--input-variant-underlined-border:var(--stroke-noeffect);--input-variant-underlined-hover-border:var(--stroke-noeffect-hover);--input-variant-filled:var(--fill-noeffect-weak)}:is(.success-pMbTwx,.infonomic-input-success){--input-variant-outlined-border:var(--stroke-success);--input-variant-outlined-hover-border:var(--stroke-success-hover);--input-variant-outline-ring-color:var(--ring-success);--input-variant-underlined-border:var(--stroke-success);--input-variant-underlined-hover-border:var(--stroke-success-hover);--input-variant-filled:var(--fill-success-weak)}:is(.info-SRpUkb,.infonomic-input-info){--input-variant-outlined-border:var(--stroke-info);--input-variant-outlined-hover-border:var(--stroke-info-hover);--input-variant-outline-ring-color:var(--ring-info);--input-variant-underlined-border:var(--stroke-info);--input-variant-underlined-hover-border:var(--stroke-info-hover);--input-variant-filled:var(--fill-info-weak)}:is(.warning-mHL8O2,.infonomic-input-warning){--input-variant-outlined-border:var(--stroke-warning);--input-variant-outlined-hover-border:var(--stroke-warning-hover);--input-variant-outline-ring-color:var(--ring-warning);--input-variant-underlined-border:var(--stroke-warning);--input-variant-underlined-hover-border:var(--stroke-warning-hover);--input-variant-filled:var(--fill-warning-weak)}:is(.danger-Rzx3WQ,.infonomic-input-danger){--input-variant-outlined-border:var(--stroke-danger);--input-variant-outlined-hover-border:var(--stroke-danger-hover);--input-variant-outline-ring-color:var(--ring-danger);--input-variant-underlined-border:var(--stroke-danger);--input-variant-underlined-hover-border:var(--stroke-danger-hover);--input-variant-filled:var(--fill-danger-weak)}:is(.adornment-IbSUaL,.infonomic-input-adornment){white-space:nowrap;align-items:center;line-height:0;display:flex}:is(.start-hcDqEk,.infonomic-input-adornment-start){justify-content:flex-start}:is(.end-j0ZhyO,.infonomic-input-adornment-end){justify-content:flex-end}:is(.text-area-P_aQjC,.infonomic-text-area){width:100%;padding:.5rem;font-size:1rem}:is(.underlined-a9hkur,.infonomic-text-area--underlined){padding-left:0;padding-right:0}:is(.label-Q88hWY,.infonomic-label){color:var(--text);font-weight:500;display:block}:is(.required-uod5eu,.infonomic-label-required){color:var(--error)}:is(.text-xJE0DB,.infonomic-error-text){color:var(--error);font-size:.875rem}:is(.text-U6KD9f,.infonomic-help-text){color:var(--muted);font-size:.875rem}:is(.section-CEcZOp,.infonomic-section){width:100%;position:relative}:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){opacity:0;visibility:hidden;z-index:20;width:0;height:0;color:var(--text-on-primary);background-color:var(--fill-primary-strong);cursor:pointer;border-style:none;outline:none;justify-content:center;align-items:center;margin:0;padding:0;text-decoration:none;transition:all .3s cubic-bezier(.25,.8,.5,1),color 1ms;display:flex;position:fixed;bottom:45px;right:30px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px;padding-bottom:3px}.scroll-to-top-WYqAAl span svg path,.infonomic-scroll-to-top span svg path{stroke:none;fill:var(--text-on-primary)}.scroll-to-top-WYqAAl:hover,.scroll-to-top-WYqAAl:focus,.infonomic-scroll-to-top:hover,.infonomic-scroll-to-top:focus{color:var(--text-on-primary);background-color:var(--fill-primary-strong-hover);transform:translateY(-5px)}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){opacity:1;visibility:visible;border-radius:20px;width:40px;min-width:0;height:40px;padding:0;bottom:20px;right:10px}@media screen and (width>=587px){:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){bottom:45px;right:45px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){border-radius:21px;width:42px;height:42px;bottom:22px;right:22px}}}
1
+ @layer infonomic-base,infonomic-functional,infonomic-utilities,infonomic-theme,infonomic-typography;@layer infonomic-components{:is(.card-mqJaiW,.infonomic-card){width:100%;max-width:100%;color:var(--foreground);background:var(--canvas-25);border-width:var(--border-width-thin);border-color:var(--border-color);border-style:var(--border-style-solid);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm);flex-direction:column;text-decoration:none;display:flex}:is(:is(.dark,[data-theme=dark]) .card-mqJaiW,:is(.dark,[data-theme=dark]) .infonomic-card){background:var(--canvas-800)}:is(.card-hover-hvT4d6,.infonomic-card-hover){transition:background .2s ease-in-out}:is(.card-hover-hvT4d6:hover,.infonomic-card-hover:hover){background:oklch(from var(--theme-50) 1 .03 h)}:is(:is(.dark,[data-theme=dark]) .card-hover-hvT4d6:hover,:is(.dark,[data-theme=dark]) .infonomic-card-hover:hover){background:oklch(from var(--canvas-800) .2 c h)}:is(.card-header-XnoBkP,.infonomic-card-header){flex-direction:column;gap:.5rem;padding:1rem;display:flex}:is(.card-title-JI7Lu3,.infonomic-card-title){color:var(--headings);letter-spacing:-.015em;font-size:1.8rem;font-weight:700;line-height:1}:is(.card-description-fwu7HE,.infonomic-card-description){color:var(--muted);font-size:.875rem}:is(.card-content-uhoZYJ,.infonomic-card-content){flex:1;padding:0 1rem 1rem}:is(.card-footer-BxTa4b,.infonomic-card-footer){align-items:center;padding:0 1rem 1rem;display:flex}:is(.container-tSpizY,.infonomic-container){width:100%;max-width:60rem;margin:0 auto;padding:0 1rem}@media (width>=66rem){:is(.container-tSpizY,.infonomic-container){max-width:64rem}}@media (width>=77rem){:is(.container-tSpizY,.infonomic-container){max-width:74.375rem}}@media (width>=94rem){:is(.container-tSpizY,.infonomic-container){max-width:87.5rem}}:is(.badge-8xVidp,.infonomic-badge){font-size:var(--font-size-sm);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--border-radius-sm);padding:.25em .4em;font-weight:400;line-height:1;display:inline-block}:is(.primary-oZyR_M,.infonomic-badge-primary){color:var(--text-on-primary-strong);background-color:var(--fill-primary-strong)}:is(.secondary-VsqJTm,.infonomic-badge-secondary){color:var(--text-on-secondary-strong);background-color:var(--fill-secondary-strong)}:is(.noeffect-R8eJtO,.infonomic-badge-noeffect){color:var(--text-on-noeffect-strong);background-color:var(--fill-noeffect-strong)}:is(.success-h2otET,.infonomic-badge-success){color:var(--text-on-success-strong);background-color:var(--fill-success-strong)}:is(.info-OG3F3u,.infonomic-badge-info){color:var(--text-on-info-strong);background-color:var(--fill-info-strong)}:is(.warning-zTXksZ,.infonomic-badge-warning){color:var(--text-on-warning-strong);background-color:var(--fill-warning-strong)}:is(.danger-hKF7l_,.infonomic-badge-danger){color:var(--text-on-danger-strong);background-color:var(--fill-danger-strong)}:is(.button-IjDhC0,.infonomic-button){cursor:pointer;text-align:center;gap:var(--gap-2);white-space:nowrap;outline-offset:2px;transition:background-color var(--transition-normal), box-shadow var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:2px solid #0000;justify-content:center;align-items:center;font-weight:400;line-height:0;display:inline-flex}:is(.button-IjDhC0:disabled,.button-IjDhC0[disabled],.infonomic-button:disabled,.infonomic-button[disabled]){pointer-events:none}:is(.button-IjDhC0:focus,.button-IjDhC0:active,.infonomic-button:focus,.infonomic-button:active){--ring-offset-color:var(--background);--ring-offset-shadow:var(--ring-inset) 0 0 0 var(--ring-offset-width) var(--ring-offset-color);--ring-shadow:var(--ring-inset) 0 0 0 calc(1px + var(--ring-offset-width)) var(--ring-color);box-shadow:var(--ring-offset-shadow), var(--ring-shadow), var(--shadow,0 0 #0000)}.button-IjDhC0.square-P_6yde,.infonomic-button-square{aspect-ratio:1;border-radius:var(--border-radius-sm);padding:0}.button-IjDhC0.round-uqus3n,.infonomic-button-round{aspect-ratio:1;border-radius:var(--border-radius-full);padding:0}:is(.xs-jxTd5R,.infonomic-button-xs){min-height:26px;padding:.2rem .4rem;font-size:.7rem}:is(.sm-uD_Ugt,.infonomic-button-sm){min-height:32px;padding:.25rem .5rem;font-size:.775rem}:is(.md-Qp9ad6,.infonomic-button-md){min-height:38px;padding:.625rem 1.25rem;font-size:.95rem}:is(.lg-FAYTen,.infonomic-button-lg){min-height:46px;padding:.75rem 1.5rem;font-size:1.1rem}:is(.xl-Gwvhl4,.infonomic-button-xl){min-height:54px;padding:.75rem 1.5rem;font-size:1.2rem}:is(.filled-CwGsrO,.infonomic-button-filled){color:var(--button-variant-filled-foreground);background-color:var(--button-variant-filled)}:is(.filled-CwGsrO:hover,.infonomic-button-filled:hover){background-color:var(--button-variant-filled-hover)}:is(.filled-CwGsrO:focus,.filled-CwGsrO:active,.infonomic-button-filled:focus,.infonomic-button-filled:active){--ring-color:var(--button-ring-color)}:is(.filled-CwGsrO:disabled,.filled-CwGsrO[disabled],.infonomic-button-filled:disabled,.infonomic-button-filled[disabled]){background-color:var(--button-variant-filled-disabled,oklch(from var(--button-variant-filled) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-foreground-disabled,oklch(from var(--button-variant-filled-foreground) calc(l * .9) calc(c * .85) h))}:is(.filled-weak-QLU8bA,.infonomic-button-filled-weak){color:var(--button-variant-filled-weak-foreground);background-color:var(--button-variant-filled-weak)}:is(.filled-weak-QLU8bA:hover,.infonomic-button-filled-weak:hover){background-color:var(--button-variant-filled-weak-hover)}:is(.filled-weak-QLU8bA:focus,.filled-weak-QLU8bA:active,.infonomic-button-filled-weak:focus,.infonomic-button-filled-weak:active){--ring-color:var(--button-ring-color)}:is(.filled-weak-QLU8bA:disabled,.filled-weak-QLU8bA[disabled],.infonomic-button-filled-weak:disabled,.infonomic-button-filled-weak[disabled]){background-color:var(--button-variant-filled-weak-disabled,oklch(from var(--button-variant-filled-weak) calc(l * 1.1) calc(c * .85) h));color:var(--button-variant-filled-weak-foreground-disabled,oklch(from var(--button-variant-filled-weak-foreground) calc(l * .9) calc(c * .85) h))}:is(.outlined-nZGbxu,.infonomic-button-outlined){border:1px solid var(--button-variant-outlined-border);color:var(--button-variant-outlined-foreground);background-color:var(--button-variant-outlined)}:is(.outlined-nZGbxu:disabled,.outlined-nZGbxu[disabled],.infonomic-button-outlined:disabled,.infonomic-button-outlined[disabled]){border-color:var(--button-variant-outlined-border-disabled,oklch(from var(--button-variant-outlined-border) calc(l * 1.5) calc(c * .8) h));color:var(--button-variant-outlined-foreground-disabled,oklch(from var(--button-variant-outlined-foreground) calc(l * 1.1) calc(c * .7) h))}:is(.outlined-nZGbxu:hover,.infonomic-button-outlined:hover){background-color:var(--button-variant-outlined-hover)}:is(.outlined-nZGbxu:focus,.outlined-nZGbxu:active,.infonomic-button-outlined:focus,.infonomic-button-outlined:active){--ring-color:var(--button-ring-color)}:is(.gradient-ySC3O3,.infonomic-button-gradient){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:disabled,.gradient-ySC3O3[disabled],.infonomic-button-gradient:disabled,.infonomic-button-gradient[disabled]){background:unset;background-color:var(--button-variant-gradient-disabled,oklch(from var(--button-variant-gradient-end) calc(l * 1.2) calc(c * .85) h));color:var(--button-variant-gradient-foreground-disabled,oklch(from var(--button-variant-gradient-foreground) calc(l * .9) calc(c * .85) h))}:is(.gradient-ySC3O3:hover,.infonomic-button-gradient:hover){color:var(--button-variant-gradient-foreground);background:linear-gradient(45deg, var(--button-variant-gradient-start), var(--button-variant-gradient-end))}:is(.gradient-ySC3O3:focus,.gradient-ySC3O3:active,.infonomic-button-gradient:focus,.infonomic-button-gradient:active){--ring-color:var(--button-ring-color)}:is(.text-GaxlcE,.infonomic-button-text){background-color:var(--button-variant-text);color:var(--button-variant-text-foreground)}:is(.text-GaxlcE:disabled,.text-GaxlcE[disabled],.infonomic-button-text:disabled,.infonomic-button-text[disabled]){color:oklch(from var(--button-variant-text-foreground) calc(l * 1.5) calc(c * .5) h)}:is(.text-GaxlcE:hover,.infonomic-button-text:hover){background-color:var(--button-variant-text-hover)}:is(.text-GaxlcE:focus,.text-GaxlcE:active,.infonomic-button-text:focus,.infonomic-button-text:active){--ring-color:var(--button-ring-color)}:is(.primary-tUmczz,.infonomic-button-primary){--button-ring-color:var(--ring-primary);--button-variant-filled:var(--fill-primary-strong);--button-variant-filled-hover:var(--fill-primary-strong-hover);--button-variant-filled-disabled:var(--fill-primary-strong-disabled);--button-variant-filled-foreground:var(--text-on-primary-strong);--button-variant-filled-foreground-disabled:var(--text-on-primary-strong-disabled);--button-variant-filled-weak:var(--fill-primary-weak);--button-variant-filled-weak-hover:var(--fill-primary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-primary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-primary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-primary-weak-disabled);--button-variant-outlined:var(--fill-primary-outlined);--button-variant-outlined-hover:var(--fill-primary-outlined-hover);--button-variant-outlined-border:var(--stroke-primary);--button-variant-outlined-border-disabled:var(--stroke-primary-disabled);--button-variant-outlined-foreground:var(--text-on-primary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-primary-outlined-disabled);--button-variant-text:var(--fill-primary-text);--button-variant-text-hover:var(--fill-primary-text-hover);--button-variant-text-foreground:var(--text-primary);--button-variant-gradient-start:var(--gradient-primary-start);--button-variant-gradient-end:var(--gradient-primary-end);--button-variant-gradient-foreground:var(--gradient-primary-foreground);--button-variant-gradient-disabled:var(--gradient-primary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-primary-disabled)}:is(.secondary-UqT2AY,.infonomic-button-secondary){--button-ring-color:var(--ring-secondary);--button-variant-filled:var(--fill-secondary-strong);--button-variant-filled-hover:var(--fill-secondary-strong-hover);--button-variant-filled-disabled:var(--fill-secondary-strong-disabled);--button-variant-filled-foreground:var(--text-on-secondary-strong);--button-variant-filled-foreground-disabled:var(--text-on-secondary-strong-disabled);--button-variant-filled-weak:var(--fill-secondary-weak);--button-variant-filled-weak-hover:var(--fill-secondary-weak-hover);--button-variant-filled-weak-disabled:var(--fill-secondary-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-secondary-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-secondary-weak-disabled);--button-variant-outlined:var(--fill-secondary-outlined);--button-variant-outlined-border:var(--stroke-secondary);--button-variant-outlined-border-disabled:var(--stroke-secondary-disabled);--button-variant-outlined-hover:var(--fill-secondary-outlined-hover);--button-variant-outlined-foreground:var(--text-on-secondary-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-secondary-outlined-disabled);--button-variant-text:var(--fill-secondary-text);--button-variant-text-hover:var(--fill-secondary-text-hover);--button-variant-text-foreground:var(--text-secondary);--button-variant-gradient-start:var(--gradient-secondary-start);--button-variant-gradient-end:var(--gradient-secondary-end);--button-variant-gradient-foreground:var(--gradient-secondary-foreground);--button-variant-gradient-disabled:var(--gradient-secondary-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-secondary-disabled)}:is(.noeffect-fpxSgg,.infonomic-button-noeffect){--button-ring-color:var(--ring-noeffect);--button-variant-filled:var(--fill-noeffect-strong);--button-variant-filled-hover:var(--fill-noeffect-strong-hover);--button-variant-filled-disabled:var(--fill-noeffect-strong-disabled);--button-variant-filled-foreground:var(--text-on-noeffect-strong);--button-variant-filled-foreground-disabled:var(--text-on-noeffect-strong-disabled);--button-variant-filled-weak:var(--fill-noeffect-weak);--button-variant-filled-weak-hover:var(--fill-noeffect-weak-hover);--button-variant-filled-weak-disabled:var(--fill-noeffect-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-noeffect-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-noeffect-weak-disabled);--button-variant-outlined:var(--fill-noeffect-outlined);--button-variant-outlined-hover:var(--fill-noeffect-outlined-hover);--button-variant-outlined-disabled:var(--fill-noeffect-outlined-disabled);--button-variant-outlined-border:var(--stroke-noeffect);--button-variant-outlined-border-disabled:var(--stroke-noeffect-disabled);--button-variant-outlined-foreground:var(--text-on-noeffect-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-noeffect-disabled);--button-variant-text:var(--fill-noeffect-text);--button-variant-text-hover:var(--fill-noeffect-text-hover);--button-variant-text-foreground:var(--text-noeffect);--button-variant-gradient-start:var(--gradient-noeffect-start);--button-variant-gradient-end:var(--gradient-noeffect-end);--button-variant-gradient-foreground:var(--gradient-noeffect-foreground);--button-variant-gradient-disabled:var(--gradient-noeffect-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-noeffect-disabled)}:is(.success-fTNDEn,.infonomic-button-success){--button-ring-color:var(--ring-success);--button-variant-filled:var(--fill-success-strong);--button-variant-filled-hover:var(--fill-success-strong-hover);--button-variant-filled-disabled:var(--fill-success-strong-disabled);--button-variant-filled-foreground:var(--text-on-success-strong);--button-variant-filled-foreground-disabled:var(--text-on-success-strong-disabled);--button-variant-filled-weak:var(--fill-success-weak);--button-variant-filled-weak-hover:var(--fill-success-weak-hover);--button-variant-filled-weak-disabled:var(--fill-success-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-success-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-success-weak-disabled);--button-variant-outlined:var(--fill-success-outlined);--button-variant-outlined-hover:var(--fill-success-outlined-hover);--button-variant-outlined-border:var(--stroke-success);--button-variant-outlined-border-disabled:var(--stroke-success-disabled);--button-variant-outlined-foreground:var(--text-on-success-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-success-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-success-text-hover);--button-variant-text-foreground:var(--text-success);--button-variant-gradient-start:var(--gradient-success-start);--button-variant-gradient-end:var(--gradient-success-end);--button-variant-gradient-foreground:var(--gradient-success-foreground);--button-variant-gradient-disabled:var(--gradient-success-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-success-disabled)}:is(.info-qrdXQD,.infonomic-button-info){--button-ring-color:var(--ring-info);--button-variant-filled:var(--fill-info-strong);--button-variant-filled-hover:var(--fill-info-strong-hover);--button-variant-filled-disabled:var(--fill-info-strong-disabled);--button-variant-filled-foreground:var(--text-on-info-strong);--button-variant-filled-foreground-disabled:var(--text-on-info-strong-disabled);--button-variant-filled-weak:var(--fill-info-weak);--button-variant-filled-weak-hover:var(--fill-info-weak-hover);--button-variant-filled-weak-disabled:var(--fill-info-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-info-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-info-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-info-outlined-hover);--button-variant-outlined-border:var(--stroke-info);--button-variant-outlined-border-disabled:var(--stroke-info-disabled);--button-variant-outlined-foreground:var(--text-on-info-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-info-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-info-text-hover);--button-variant-text-foreground:var(--text-info);--button-variant-gradient-start:var(--gradient-info-start);--button-variant-gradient-end:var(--gradient-info-end);--button-variant-gradient-foreground:var(--gradient-info-foreground);--button-variant-gradient-disabled:var(--gradient-info-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-info-disabled)}:is(.warning-a00T3A,.infonomic-button-warning){--button-ring-color:var(--ring-warning);--button-variant-filled:var(--fill-warning-strong);--button-variant-filled-hover:var(--fill-warning-strong-hover);--button-variant-filled-disabled:var(--fill-warning-strong-disabled);--button-variant-filled-foreground:var(--text-on-warning-strong);--button-variant-filled-foreground-disabled:var(--text-on-warning-strong-disabled);--button-variant-filled-weak:var(--fill-warning-weak);--button-variant-filled-weak-hover:var(--fill-warning-weak-hover);--button-variant-filled-weak-disabled:var(--fill-warning-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-warning-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-warning-weak-disabled);--button-variant-outlined:var(--fill-warning-outlined);--button-variant-outlined-hover:var(--fill-warning-outlined-hover);--button-variant-outlined-border:var(--stroke-warning);--button-variant-outlined-border-disabled:var(--stroke-warning-disabled);--button-variant-outlined-foreground:var(--text-on-warning-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-warning-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-warning-text-hover);--button-variant-text-foreground:var(--text-warning);--button-variant-gradient-start:var(--gradient-warning-start);--button-variant-gradient-end:var(--gradient-warning-end);--button-variant-gradient-foreground:var(--gradient-warning-foreground);--button-variant-gradient-disabled:var(--gradient-warning-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-warning-disabled)}:is(.danger-rwIV_i,.infonomic-button-danger){--button-ring-color:var(--ring-danger);--button-variant-filled:var(--fill-danger-strong);--button-variant-filled-hover:var(--fill-danger-strong-hover);--button-variant-filled-disabled:var(--fill-danger-strong-disabled);--button-variant-filled-foreground:var(--text-on-danger-strong);--button-variant-filled-foreground-disabled:var(--text-on-danger-strong-disabled);--button-variant-filled-weak:var(--fill-danger-weak);--button-variant-filled-weak-hover:var(--fill-danger-weak-hover);--button-variant-filled-weak-disabled:var(--fill-danger-weak-disabled);--button-variant-filled-weak-foreground:var(--text-on-danger-weak);--button-variant-filled-weak-foreground-disabled:var(--text-on-danger-weak-disabled);--button-variant-outlined:transparent;--button-variant-outlined-hover:var(--fill-danger-outlined-hover);--button-variant-outlined-border:var(--stroke-danger);--button-variant-outlined-border-disabled:var(--stroke-danger-disabled);--button-variant-outlined-foreground:var(--text-on-danger-outlined);--button-variant-outlined-foreground-disabled:var(--text-on-danger-outlined-disabled);--button-variant-text:transparent;--button-variant-text-hover:var(--fill-danger-text-hover);--button-variant-text-foreground:var(--text-danger);--button-variant-gradient-start:var(--gradient-danger-start);--button-variant-gradient-end:var(--gradient-danger-end);--button-variant-gradient-foreground:var(--gradient-danger-foreground);--button-variant-gradient-disabled:var(--gradient-danger-disabled);--button-variant-gradient-foreground-disabled:var(--text-on-danger-disabled)}:is(.fullWidth-wXvP0v,.infonomic-button-full-width){width:100%;display:flex}:is(.button-group-uqvOi8,.infonomic-button-group){place-items:center;gap:var(--gap-2);flex-direction:column;display:flex}@media screen and (width>=40rem){:is(.button-group-uqvOi8,.infonomic-button-group){flex-direction:row}}:is(.copy-button-container-vCNz8o,.infonomic-copy-button-container){display:inline-block}:is(.copy-button-oa4bdj svg,.infonomic-copy-button svg){width:90%;height:90%;display:block}:is(.xs-lZmf78,.infonomic-copy-button-xs){width:26px;height:26px;min-height:26px;padding:.25rem}:is(.sm-KNN1e5,.infonomic-copy-button-sm){width:32px;height:32px;min-height:32px;padding:.35rem}:is(.md-OoH0l4,.infonomic-copy-button-md){width:38px;height:38px;min-height:38px;padding:.45rem}:is(.lg-uu5ujz,.infonomic-copy-button-lg){width:46px;height:46px;min-height:46px;padding:.55rem}:is(.xl-pFYyrS,.infonomic-copy-button-xl){width:54px;height:54px;min-height:54px;padding:.65rem}:is(.input-wrapper-xxN94z,.infonomic-input-wrapper){gap:var(--gap-1);flex-direction:column;display:flex}:is(.input-container-GveKcr,.infonomic-input-container){align-items:center;gap:var(--gap-2);width:100%;padding:0;display:flex;position:relative}:is(.input-voSL1w,.infonomic-input){gap:var(--gap-2);width:100%;transition:all var(--transition-normal);border-radius:var(--border-radius-sm);border:none;outline:none;align-items:center;font-weight:400;display:inline-flex}:is(.input-voSL1w:focus,.input-voSL1w:active,.infonomic-input:focus,.infonomic-input:active){--ring-offset-color:var(--background);--ring-offset-shadow:var(--ring-inset) 0 0 0 var(--ring-offset-width) var(--ring-offset-color);--ring-shadow:var(--ring-inset) 0 0 0 calc(1px + var(--ring-offset-width)) var(--ring-color);box-shadow:var(--ring-offset-shadow), var(--ring-shadow), var(--shadow,0 0 #0000)}:is(.input-voSL1w:disabled,.input-voSL1w[disabled],.infonomic-input:disabled,.infonomic-input[disabled]){pointer-events:none}:is(.label-a8k0oS,.infonomic-input-label){color:var(--label-color);font-size:.875rem;font-weight:500}:is(.sm-cI5ETu,.infonomic-input-sm){min-height:32px;padding:.25rem .5rem;font-size:.875rem;line-height:0}:is(.md-moqLi4,.infonomic-input-md){min-height:36px;padding:.3rem .5rem;font-size:1rem;line-height:0}:is(.lg-Tn3YZZ,.infonomic-input-lg){min-height:40px;padding:.4rem .5rem;font-size:1.175rem;line-height:0}:is(.start-adornment-H0sdmX,.end-adornment-xl3mid,.infonomic-input-start-adornment,.infonomic-input-end-adornment){align-items:center;display:flex;position:absolute}:is(.start-adornment-H0sdmX,.infonomic-input-start-adornment){left:5px}:is(.end-adornment-xl3mid,.infonomic-input-end-adornment){right:5px}:is(.help-text-MZW4yX,.infonomic-input-help-text){color:var(--help-text-color);font-size:.75rem}:is(.outlined-xbB8mE,.infonomic-input-outlined){border:1px solid var(--input-variant-outlined-border);background-color:#0000}:is(.outlined-xbB8mE:hover,.infonomic-input-outlined:hover){border:1px solid var(--input-variant-outlined-hover-border)}:is(.outlined-xbB8mE:focus,.outlined-xbB8mE:active,.infonomic-input-outlined:focus,.infonomic-input-outlined:active){--ring-color:var(--input-variant-outline-ring-color)}:is(.underlined-zAz2HP,.infonomic-input-underlined){border-bottom:1px solid var(--input-variant-underlined-border);gap:var(--gap-1);background-color:var(--input-variant-underlined);border-radius:0}.underlined-zAz2HP.sm-cI5ETu,.infonomic-input-underlined.input-sm{min-height:26px;padding:.25rem .1rem}.underlined-zAz2HP.md-moqLi4,.infonomic-input-underlined.input-md{min-height:30px;padding:.25rem .1rem}.underlined-zAz2HP.lg-Tn3YZZ,.infonomic-input-underlined.input-lg{min-height:34px;padding:0 .1rem}:is(.underlined-zAz2HP:hover,.infonomic-input-underlined:hover){border-bottom:1px solid var(--input-variant-underlined-hover-border)}:is(.filled-M1_LzJ,.infonomic-input-filled){background-color:var(--input-variant-filled)}:is(.error-n0kSb0,.infonomic-input-error),:is(.error-n0kSb0:hover,.infonomic-input-error:hover){border:1px solid var(--red-400)}:is(.error-n0kSb0:focus,.error-n0kSb0:active,.infonomic-input-error:focus,.infonomic-input-error:active){--ring-color:var(--red-300)}.underlined-zAz2HP.start-adornment-padding-YAcYOx,.start-adornment-padding-YAcYOx,.infonomic-input-underlined.input-start-adornment-padding,.infonomic-input-start-adornment-padding{padding-left:2rem}.underlined-zAz2HP.end-adornment-padding-nC63CK,.end-adornment-padding-nC63CK,.infonomic-input-underlined.input-end-adornment-padding,.infonomic-input-end-adornment-padding{padding-right:2rem}.underlined-zAz2HP.start-adornment-H0sdmX,.infonomic-input-underlined.input-start-adornment{left:0}.underlined-zAz2HP.end-adornment-xl3mid,.infonomic-input-underlined.input-end-adornment{right:0}:is(.primary-xZZpZI,.infonomic-input-primary){--input-variant-outlined-border:var(--stroke-primary);--input-variant-outlined-hover-border:var(--stroke-primary-hover);--input-variant-outline-ring-color:var(--ring-primary);--input-variant-underlined-border:var(--stroke-primary);--input-variant-underlined-hover-border:var(--stroke-primary-hover);--input-variant-filled:var(--fill-primary-weak)}:is(.secondary-WWDy2x,.infonomic-input-secondary){--input-variant-outlined-border:var(--stroke-secondary);--input-variant-outlined-hover-border:var(--stroke-secondary-hover);--input-variant-outline-ring-color:var(--ring-secondary);--input-variant-underlined-border:var(--stroke-secondary);--input-variant-underlined-hover-border:var(--stroke-secondary-hover);--input-variant-filled:var(--fill-secondary-weak)}:is(.noeffect-LHbgak,.infonomic-input-noeffect){--input-variant-outlined-border:var(--stroke-noeffect);--input-variant-outlined-hover-border:var(--stroke-noeffect-hover);--input-variant-outline-ring-color:var(--ring-noeffect);--input-variant-underlined-border:var(--stroke-noeffect);--input-variant-underlined-hover-border:var(--stroke-noeffect-hover);--input-variant-filled:var(--fill-noeffect-weak)}:is(.success-pMbTwx,.infonomic-input-success){--input-variant-outlined-border:var(--stroke-success);--input-variant-outlined-hover-border:var(--stroke-success-hover);--input-variant-outline-ring-color:var(--ring-success);--input-variant-underlined-border:var(--stroke-success);--input-variant-underlined-hover-border:var(--stroke-success-hover);--input-variant-filled:var(--fill-success-weak)}:is(.info-SRpUkb,.infonomic-input-info){--input-variant-outlined-border:var(--stroke-info);--input-variant-outlined-hover-border:var(--stroke-info-hover);--input-variant-outline-ring-color:var(--ring-info);--input-variant-underlined-border:var(--stroke-info);--input-variant-underlined-hover-border:var(--stroke-info-hover);--input-variant-filled:var(--fill-info-weak)}:is(.warning-mHL8O2,.infonomic-input-warning){--input-variant-outlined-border:var(--stroke-warning);--input-variant-outlined-hover-border:var(--stroke-warning-hover);--input-variant-outline-ring-color:var(--ring-warning);--input-variant-underlined-border:var(--stroke-warning);--input-variant-underlined-hover-border:var(--stroke-warning-hover);--input-variant-filled:var(--fill-warning-weak)}:is(.danger-Rzx3WQ,.infonomic-input-danger){--input-variant-outlined-border:var(--stroke-danger);--input-variant-outlined-hover-border:var(--stroke-danger-hover);--input-variant-outline-ring-color:var(--ring-danger);--input-variant-underlined-border:var(--stroke-danger);--input-variant-underlined-hover-border:var(--stroke-danger-hover);--input-variant-filled:var(--fill-danger-weak)}:is(.adornment-IbSUaL,.infonomic-input-adornment){white-space:nowrap;align-items:center;line-height:0;display:flex}:is(.start-hcDqEk,.infonomic-input-adornment-start){justify-content:flex-start}:is(.end-j0ZhyO,.infonomic-input-adornment-end){justify-content:flex-end}:is(.text-area-P_aQjC,.infonomic-text-area){width:100%;padding:.5rem;font-size:1rem}:is(.underlined-a9hkur,.infonomic-text-area--underlined){padding-left:0;padding-right:0}:is(.label-Q88hWY,.infonomic-label){color:var(--text);font-weight:500;display:block}:is(.required-uod5eu,.infonomic-label-required){color:var(--error)}:is(.text-xJE0DB,.infonomic-error-text){color:var(--error);font-size:.875rem}:is(.sm-jCozDb,.infonomic-error-text-sm){font-size:.85rem}:is(.md-b7GT8M,.infonomic-error-text-md){font-size:.875rem}:is(.lg-q2oWv7,.infonomic-error-text-lg){font-size:.9rem}:is(.text-U6KD9f,.infonomic-help-text){color:var(--muted);font-size:.875rem}:is(.sm-NX28sU,.infonomic-help-text-sm){font-size:.85rem}:is(.md-BEtXW1,.infonomic-help-text-md){font-size:.875rem}:is(.lg-han8YY,.infonomic-help-text-lg){font-size:.9rem}:is(.section-CEcZOp,.infonomic-section){width:100%;position:relative}:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){opacity:0;visibility:hidden;z-index:20;width:0;height:0;color:var(--text-on-primary);background-color:var(--fill-primary-strong);cursor:pointer;border-style:none;outline:none;justify-content:center;align-items:center;margin:0;padding:0;text-decoration:none;transition:all .3s cubic-bezier(.25,.8,.5,1),color 1ms;display:flex;position:fixed;bottom:45px;right:30px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px;padding-bottom:3px}.scroll-to-top-WYqAAl span svg path,.infonomic-scroll-to-top span svg path{stroke:none;fill:var(--text-on-primary)}.scroll-to-top-WYqAAl:hover,.scroll-to-top-WYqAAl:focus,.infonomic-scroll-to-top:hover,.infonomic-scroll-to-top:focus{color:var(--text-on-primary);background-color:var(--fill-primary-strong-hover);transform:translateY(-5px)}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){opacity:1;visibility:visible;border-radius:20px;width:40px;min-width:0;height:40px;padding:0;bottom:20px;right:10px}@media screen and (width>=587px){:is(.scroll-to-top-WYqAAl,.infonomic-scroll-to-top){bottom:45px;right:45px}.scroll-to-top-WYqAAl span,.infonomic-scroll-to-top span{width:18px}:is(.scroll-to-top-shown-Wemu5m,.infonomic-scroll-to-top-shown){border-radius:21px;width:42px;height:42px;bottom:22px;right:22px}}}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@infonomic/uikit",
3
3
  "private": false,
4
4
  "license": "MIT",
5
- "version": "5.39.0",
5
+ "version": "5.40.0",
6
6
  "type": "module",
7
7
  "description": "Infonomic UI kit is a collection of reusable UI components and utilities for React and Astro.",
8
8
  "keywords": [
@@ -106,22 +106,55 @@ infonomic-components;
106
106
  /* Sizes */
107
107
  .sm,
108
108
  :global(.infonomic-checkbox-sm) {
109
- width: 18px;
110
- height: 18px;
109
+ width: 16px;
110
+ height: 16px;
111
+ }
112
+
113
+ .sm .icon,
114
+ :global(.infonomic-checkbox-sm) :global(.infonomic-checkbox-icon) {
115
+ width: 16px;
116
+ height: 16px;
117
+ }
118
+
119
+ .sm~.label,
120
+ :global(.infonomic-checkbox-sm)~ :global(.infonomic-checkbox-label) {
121
+ font-size: 0.85rem;
111
122
  }
112
123
 
113
124
  .md,
114
125
  :global(.infonomic-checkbox-md) {
115
- width: 20px;
116
- height: 20px;
126
+ width: 18px;
127
+ height: 18px;
128
+ }
129
+
130
+ .md .icon,
131
+ :global(.infonomic-checkbox-md) :global(.infonomic-checkbox-icon) {
132
+ width: 18px;
133
+ height: 18px;
134
+ }
135
+
136
+ .md~.label,
137
+ :global(.infonomic-checkbox-md)~ :global(.infonomic-checkbox-label) {
138
+ font-size: 0.875rem;
117
139
  }
118
140
 
119
141
  .lg,
120
142
  :global(.infonomic-checkbox-lg) {
143
+ width: 20px;
144
+ height: 20px;
145
+ }
146
+
147
+ .lg .icon,
148
+ :global(.infonomic-checkbox-lg) :global(.infonomic-checkbox-icon) {
121
149
  width: 22px;
122
150
  height: 22px;
123
151
  }
124
152
 
153
+ .lg~.label,
154
+ :global(.infonomic-checkbox-lg)~ :global(.infonomic-checkbox-label) {
155
+ font-size: 1rem;
156
+ }
157
+
125
158
  /* Variants */
126
159
  .outlined,
127
160
  :global(.infonomic-checkbox-outlined) {
@@ -215,6 +215,55 @@ export const Checked = (): React.JSX.Element => {
215
215
  )
216
216
  }
217
217
 
218
+ export const Sized = (): React.JSX.Element => {
219
+ const [checked, setChecked] = useState(true)
220
+ const handleOnClick = (): void => {
221
+ setChecked(!checked)
222
+ }
223
+ return (
224
+ <div style={{ maxWidth: '800px', margin: '2rem auto 2rem' }}>
225
+ <h2 className="text-xl" style={{ marginBottom: '1rem' }}>
226
+ Outlined
227
+ </h2>
228
+ <div className="grid gap-4 grid-cols-3">
229
+ <div className="control">
230
+ <Checkbox
231
+ onClick={handleOnClick}
232
+ aria-label="Large Checkbox"
233
+ size="lg"
234
+ checked={checked}
235
+ id="large"
236
+ name="large"
237
+ label="Large Checkbox"
238
+ />
239
+ </div>
240
+ <div className="control">
241
+ <Checkbox
242
+ onClick={handleOnClick}
243
+ aria-label="Medium Checkbox"
244
+ size="md"
245
+ checked={checked}
246
+ id="medium"
247
+ name="medium"
248
+ label="Medium Checkbox"
249
+ />
250
+ </div>
251
+ <div className="control">
252
+ <Checkbox
253
+ onClick={handleOnClick}
254
+ aria-label="Small Checkbox"
255
+ size="sm"
256
+ checked={checked}
257
+ id="small"
258
+ name="small"
259
+ label="Small Checkbox"
260
+ />
261
+ </div>
262
+ </div>
263
+ </div>
264
+ )
265
+ }
266
+
218
267
  export const Disabled = (): React.JSX.Element => {
219
268
  const [checked, setChecked] = useState(true)
220
269
  const handleOnClick = (): void => {
@@ -92,9 +92,9 @@ export const Checkbox = function Checkbox({
92
92
  )}
93
93
  </div>
94
94
  {error ? (
95
- <ErrorText id={`error-for-${id}`} text={errorText ?? helpText} />
95
+ <ErrorText id={`error-for-${id}`} size={size} text={errorText ?? helpText} />
96
96
  ) : (
97
- helpText?.length > 0 && <HelpText text={helpText} />
97
+ helpText?.length > 0 && <HelpText size={size} text={helpText} />
98
98
  )}
99
99
  </div>
100
100
  )
@@ -12,4 +12,19 @@ infonomic-components;
12
12
  font-size: 0.875rem;
13
13
  color: var(--error);
14
14
  }
15
+
16
+ .sm,
17
+ :global(.infonomic-error-text-sm) {
18
+ font-size: 0.85rem;
19
+ }
20
+
21
+ .md,
22
+ :global(.infonomic-error-text-md) {
23
+ font-size: 0.875rem;
24
+ }
25
+
26
+ .lg,
27
+ :global(.infonomic-error-text-lg) {
28
+ font-size: 0.9rem;
29
+ }
15
30
  }
@@ -7,12 +7,13 @@ import styles from './error-text.module.css'
7
7
  interface ErrorTextProps {
8
8
  id: string
9
9
  className?: string
10
+ size?: 'sm' | 'md' | 'lg'
10
11
  text: string
11
12
  }
12
13
 
13
- export function ErrorText({ id, className, text }: ErrorTextProps): React.JSX.Element {
14
+ export function ErrorText({ id, className, size, text }: ErrorTextProps): React.JSX.Element {
14
15
  return (
15
- <p id={id} className={cx('error-text', styles.text, className)}>
16
+ <p id={id} className={cx('error-text', styles.text, size && styles[size], className)}>
16
17
  {text}
17
18
  </p>
18
19
  )
@@ -12,4 +12,19 @@ infonomic-components;
12
12
  font-size: 0.875rem;
13
13
  color: var(--muted);
14
14
  }
15
+
16
+ .sm,
17
+ :global(.infonomic-help-text-sm) {
18
+ font-size: 0.85rem;
19
+ }
20
+
21
+ .md,
22
+ :global(.infonomic-help-text-md) {
23
+ font-size: 0.875rem;
24
+ }
25
+
26
+ .lg,
27
+ :global(.infonomic-help-text-lg) {
28
+ font-size: 0.9rem;
29
+ }
15
30
  }
@@ -6,9 +6,10 @@ import styles from './help-text.module.css'
6
6
 
7
7
  interface HelpTextProps {
8
8
  className?: string
9
+ size?: 'sm' | 'md' | 'lg'
9
10
  text: string
10
11
  }
11
12
 
12
- export function HelpText({ className, text }: HelpTextProps): React.JSX.Element {
13
- return <p className={cx('infonomic-help-text', styles.text, className)}>{text}</p>
13
+ export function HelpText({ className, size, text }: HelpTextProps): React.JSX.Element {
14
+ return <p className={cx('infonomic-help-text', styles.text, size && styles[size], className)}>{text}</p>
14
15
  }
@@ -94,9 +94,9 @@ export const Input = <_C extends React.ElementType = 'input'>({
94
94
  )}
95
95
  </div>
96
96
  {error ? (
97
- <ErrorText id={`error-for-${id}`} text={errorText ?? helpText} />
97
+ <ErrorText id={`error-for-${id}`} size={inputSize} text={errorText ?? helpText} />
98
98
  ) : (
99
- helpText?.length > 0 && <HelpText text={helpText} />
99
+ helpText?.length > 0 && <HelpText size={inputSize} text={helpText} />
100
100
  )}
101
101
  </div>
102
102
  )
@@ -20,7 +20,7 @@ export function Label({ className, id, htmlFor, label, required }: LabelProps):
20
20
  className={cx('label', styles.label, className)}
21
21
  >
22
22
  {label}
23
- {required != null && <span className={styles.required}>&nbsp;*</span>}
23
+ {required && <span className={styles.required}>&nbsp;*</span>}
24
24
  </label>
25
25
  )
26
26
  }