@adam-milo/ui 1.0.21 → 1.0.22

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 (40) hide show
  1. package/dist/index14.cjs +1 -1
  2. package/dist/index14.js +1 -1
  3. package/dist/index19.cjs +1 -0
  4. package/dist/index19.js +22 -0
  5. package/dist/index20.cjs +1 -0
  6. package/dist/index20.js +301 -0
  7. package/dist/index21.cjs +1 -0
  8. package/dist/index21.js +16 -0
  9. package/dist/index3.cjs +1 -1
  10. package/dist/index3.js +28 -104
  11. package/dist/index33.cjs +1 -0
  12. package/dist/index33.js +21 -0
  13. package/dist/index4.cjs +1 -1
  14. package/dist/index4.js +15 -178
  15. package/dist/index5.cjs +1 -1
  16. package/dist/index5.js +42 -172
  17. package/dist/index6.cjs +1 -1
  18. package/dist/index6.js +85 -171
  19. package/dist/src/components/forms/alphanumeric-input/AlphanumericInput.component.d.ts +23 -38
  20. package/dist/src/components/forms/alphanumeric-input/AlphanumericInput.component.d.ts.map +1 -1
  21. package/dist/src/components/forms/email-input/EmailInput.component.d.ts +17 -20
  22. package/dist/src/components/forms/email-input/EmailInput.component.d.ts.map +1 -1
  23. package/dist/src/components/forms/input/Input.component.d.ts +105 -0
  24. package/dist/src/components/forms/input/Input.component.d.ts.map +1 -0
  25. package/dist/src/components/forms/numeric-input/NumericInput.component.d.ts +30 -48
  26. package/dist/src/components/forms/numeric-input/NumericInput.component.d.ts.map +1 -1
  27. package/dist/src/components/forms/password-input/PasswordInput.component.d.ts +19 -16
  28. package/dist/src/components/forms/password-input/PasswordInput.component.d.ts.map +1 -1
  29. package/dist/src/lib/debounce.d.ts +12 -0
  30. package/dist/src/lib/debounce.d.ts.map +1 -0
  31. package/dist/src/lib/debounce.spec.d.ts +2 -0
  32. package/dist/src/lib/debounce.spec.d.ts.map +1 -0
  33. package/dist/src/lib/index.d.ts +2 -0
  34. package/dist/src/lib/index.d.ts.map +1 -1
  35. package/dist/src/lib/useMergedRef.d.ts +19 -0
  36. package/dist/src/lib/useMergedRef.d.ts.map +1 -0
  37. package/dist/style.css +1 -1
  38. package/package.json +2 -1
  39. /package/dist/{index31.cjs → index30.cjs} +0 -0
  40. /package/dist/{index31.js → index30.js} +0 -0
@@ -1,25 +1,28 @@
1
- import { InputHTMLAttributes } from 'react';
1
+ import { InputProps } from '../input/Input.component';
2
2
 
3
- export interface PasswordInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
4
- label?: string;
5
- error?: string;
6
- helperText?: string;
7
- fullWidth?: boolean;
3
+ export interface PasswordInputProps extends Omit<InputProps, 'type'> {
8
4
  /**
9
5
  * Show password visibility toggle button
10
6
  * @default true
11
7
  */
12
8
  showToggle?: boolean;
13
- /**
14
- * Custom data-cy attribute for Cypress testing
15
- * Auto-generates as "password-input" if not provided
16
- */
17
- 'data-cy'?: string;
18
- /**
19
- * Custom data-testid attribute for unit testing
20
- * Auto-generates as "password-input" if not provided
21
- */
22
- 'data-testid'?: string;
23
9
  }
10
+ /**
11
+ * PasswordInput - Specialized input component for passwords
12
+ *
13
+ * A wrapper around the base Input component with password-specific features:
14
+ * - Password visibility toggle
15
+ * - Type="password" by default
16
+ *
17
+ * @example
18
+ * ```tsx
19
+ * <PasswordInput
20
+ * label="Password"
21
+ * placeholder="Enter your password"
22
+ * required
23
+ * showToggle={true}
24
+ * />
25
+ * ```
26
+ */
24
27
  export declare const PasswordInput: import('react').ForwardRefExoticComponent<PasswordInputProps & import('react').RefAttributes<HTMLInputElement>>;
25
28
  //# sourceMappingURL=PasswordInput.component.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"PasswordInput.component.d.ts","sourceRoot":"","sources":["../../../../../src/components/forms/password-input/PasswordInput.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAA+B,MAAM,OAAO,CAAC;AAEzE,OAAO,qBAAqB,CAAC;AAE7B,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC7F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,aAAa,iHA8JzB,CAAC"}
1
+ {"version":3,"file":"PasswordInput.component.d.ts","sourceRoot":"","sources":["../../../../../src/components/forms/password-input/PasswordInput.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAE7D,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC;IAClE;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,aAAa,iHAazB,CAAC"}
@@ -0,0 +1,12 @@
1
+ /**
2
+ * Creates a debounced function that delays invoking func until after wait milliseconds
3
+ * have elapsed since the last time the debounced function was invoked.
4
+ *
5
+ * @param func - The function to debounce
6
+ * @param wait - The number of milliseconds to delay
7
+ * @returns The debounced function with a cancel method
8
+ */
9
+ export declare function debounce<T extends (...args: any[]) => void>(func: T, wait: number): ((...args: Parameters<T>) => void) & {
10
+ cancel: () => void;
11
+ };
12
+ //# sourceMappingURL=debounce.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"debounce.d.ts","sourceRoot":"","sources":["../../../src/lib/debounce.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,EACzD,IAAI,EAAE,CAAC,EACP,IAAI,EAAE,MAAM,GACX,CAAC,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,GAAG;IAAE,MAAM,EAAE,MAAM,IAAI,CAAA;CAAE,CAyB7D"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=debounce.spec.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"debounce.spec.d.ts","sourceRoot":"","sources":["../../../src/lib/debounce.spec.ts"],"names":[],"mappings":""}
@@ -14,4 +14,6 @@ import { ClassValue } from 'clsx';
14
14
  export declare function cn(...inputs: ClassValue[]): string;
15
15
  export declare function generateId(prefix?: string): string;
16
16
  export { devWarn, devError, devLog } from './dev-utils';
17
+ export { debounce } from './debounce';
18
+ export { useMergedRef } from './useMergedRef';
17
19
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAC;AAG7C;;;;;;;;;;GAUG;AACH,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,GAAG,MAAM,CAElD;AAMD,wBAAgB,UAAU,CAAC,MAAM,SAAO,GAAG,MAAM,CAGhD;AAGD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAC;AAG7C;;;;;;;;;;GAUG;AACH,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,GAAG,MAAM,CAElD;AAMD,wBAAgB,UAAU,CAAC,MAAM,SAAO,GAAG,MAAM,CAGhD;AAGD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}
@@ -0,0 +1,19 @@
1
+ /**
2
+ * Merges multiple React refs into a single callback ref.
3
+ * Useful when you need to forward a ref while also keeping an internal ref.
4
+ *
5
+ * @param refs - Array of refs to merge (can be callback refs or ref objects)
6
+ * @returns A callback ref that updates all provided refs
7
+ *
8
+ * @example
9
+ * ```tsx
10
+ * const MyComponent = forwardRef((props, forwardedRef) => {
11
+ * const internalRef = useRef(null);
12
+ * const mergedRef = useMergedRef(forwardedRef, internalRef);
13
+ *
14
+ * return <input ref={mergedRef} />;
15
+ * });
16
+ * ```
17
+ */
18
+ export declare function useMergedRef<T = unknown>(...refs: (React.Ref<T> | undefined)[]): React.RefCallback<T>;
19
+ //# sourceMappingURL=useMergedRef.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useMergedRef.d.ts","sourceRoot":"","sources":["../../../src/lib/useMergedRef.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,YAAY,CAAC,CAAC,GAAG,OAAO,EACtC,GAAG,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,EAAE,GACpC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CActB"}
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- .btn{display:inline-flex;align-items:center;justify-content:center;block-size:2.5rem;padding-block:var(--spacing-3);padding-inline:var(--spacing-4);gap:var(--spacing-2);font-family:Almoni DL AAA,sans-serif;font-weight:400;font-size:var(--font-size-8);line-height:1.5rem;text-align:center;white-space:nowrap;border:none;border-radius:var(--radius-default);transition-property:background-color,color,border-color,transform;transition-duration:.2s;transition-timing-function:ease-in-out;will-change:transform;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}.btn:focus-visible{outline:2px solid;outline-offset:2px}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{cursor:not-allowed;opacity:1;pointer-events:none}.btn--primary-workspace{background-color:var(--color-popup);color:var(--color-card);outline-color:var(--color-popup)}.btn--primary-workspace:hover:not(:disabled){background-color:var(--color-action)}.btn--primary-workspace:disabled{background-color:var(--color-bg-secondary);color:var(--color-icon-secondary);border:1px solid var(--color-border)}.btn--primary-builder{background-color:var(--color-action);color:var(--color-card);outline-color:var(--color-action)}.btn--primary-builder:hover:not(:disabled){background-color:var(--color-text)}.btn--primary-builder:disabled{background-color:var(--color-bg-secondary);color:var(--color-icon-secondary);border:1px solid var(--color-border)}.btn--secondary{background-color:var(--color-card);color:var(--color-text);border:1px solid var(--color-system-text);outline-color:var(--color-border)}.btn--secondary:hover:not(:disabled){background-color:var(--color-bg-secondary)}.btn--secondary:disabled{background-color:transparent;color:var(--color-icon-secondary);border:1px solid var(--color-border)}.btn--ghost{background-color:transparent;color:var(--color-text);outline-color:var(--color-border)}.btn--ghost:hover:not(:disabled){background-color:var(--color-bg-secondary)}.btn--ghost:disabled{background-color:transparent;color:var(--color-icon-secondary)}.btn--full-width{inline-size:100%}.btn__icon{display:inline-flex;align-items:center;justify-content:center;inline-size:1rem;block-size:1rem;flex-shrink:0}.password-input-wrapper{position:relative;display:flex;flex-direction:column;gap:var(--spacing-2);inline-size:100%}.password-input__toggle{position:absolute;inset-block-start:var(--spacing-3);inset-inline-end:var(--spacing-3-5);display:flex;align-items:center;justify-content:center;inline-size:var(--spacing-5);block-size:var(--spacing-5);padding:0;background:transparent;border:none;color:var(--color-system-text);cursor:pointer;transition-property:color,transform;transition-duration:.2s;transition-timing-function:ease-in-out}.password-input__toggle:hover{color:var(--color-text)}.password-input__toggle:focus{outline:2px solid var(--color-clickable);outline-offset:2px;border-radius:var(--radius-sm)}.password-input__toggle:focus:not(:focus-visible){outline:none}.password-input__toggle:active{transform:scale(.95)}.password-input__toggle svg{inline-size:100%;block-size:100%}.password-input-wrapper:has(.input__label) .password-input__toggle{inset-block-start:2.125rem}.password-input{padding-inline-end:var(--spacing-12)}@media (min-width: 768px){.input{block-size:var(--spacing-11)}.password-input__toggle{inset-block-start:var(--spacing-3)}.password-input-wrapper:has(.input__label) .password-input__toggle{inset-block-start:2.125rem}}.input-wrapper{display:flex;flex-direction:column;gap:var(--spacing-2);inline-size:100%}.input-wrapper--full-width{inline-size:100%}.input__label{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);font-weight:400;color:var(--color-grey-07);line-height:1}.input{display:block;inline-size:100%;block-size:var(--spacing-11);padding-inline:var(--spacing-3-5);padding-block:var(--spacing-3-5);font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-8);line-height:1;color:var(--color-text);background-color:var(--color-card);border:1px solid var(--color-icon-secondary);border-radius:var(--radius-5px);transition-property:border-color,box-shadow;transition-duration:.2s;transition-timing-function:ease-in-out;cursor:text}.input:focus{outline:none;border-color:var(--color-clickable);box-shadow:none}.input:hover:not(:disabled):not(:focus){border-color:var(--color-clickable)}.input:disabled{cursor:not-allowed;opacity:.5;background-color:var(--color-card);color:var(--color-text);pointer-events:none}.input::placeholder{color:var(--color-icon-secondary)}.input--error{border-color:var(--color-error)}.input--error:focus{border-color:var(--color-error);box-shadow:none}.input--error:hover:not(:disabled){border-color:var(--color-error)}.input--full-width{inline-size:100%}.input__helper{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-10);line-height:1;color:var(--color-grey-07);padding-inline-start:var(--spacing-3-5);padding-block-start:var(--spacing-1-5)}.input__error{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-10);line-height:1;color:var(--color-error);padding-inline-start:var(--spacing-3-5);padding-block-start:var(--spacing-1-5)}@media (min-width: 768px){.input{block-size:var(--spacing-11)}}.checkbox-wrapper{display:flex;flex-direction:column;gap:var(--spacing-1-5)}.checkbox-wrapper--disabled{opacity:.5;cursor:not-allowed}.checkbox__container{display:flex;align-items:center;gap:var(--spacing-2)}.checkbox__input{appearance:none;-webkit-appearance:none;-moz-appearance:none;width:1rem;height:1rem;margin:0;border:1px solid var(--color-icon-secondary);border-radius:.1875rem;background-color:var(--color-card);cursor:pointer;position:relative;flex-shrink:0;transition:all .15s ease-in-out}.checkbox__input:hover:not(:disabled){border-color:var(--color-icon-secondary);background-color:var(--color-bg)}.checkbox__input:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px}.checkbox__input:checked{background-color:var(--color-clickable);border-color:var(--color-clickable)}.checkbox__input:checked:before{content:"";position:absolute;inset-inline-start:50%;inset-block-start:50%;transform:translate(-50%,-50%) rotate(45deg);width:.3125rem;height:.625rem;border:solid var(--color-card);border-width:0 .125rem .125rem 0;border-inline-start-width:0;border-block-start-width:0}.checkbox__input[data-indeterminate=true]{background-color:var(--color-clickable);border-color:var(--color-clickable)}.checkbox__input[data-indeterminate=true]:before{content:"";position:absolute;inset-inline-start:50%;inset-block-start:50%;transform:translate(-50%,-50%);width:.625rem;height:.125rem;background-color:var(--color-card);border:none;border-radius:.0625rem}.checkbox__input:disabled{border-color:var(--color-border);background-color:var(--color-bg-secondary);cursor:not-allowed}.checkbox__input:disabled:checked{background-color:var(--color-border);border-color:var(--color-border)}.checkbox__input--error{border-color:var(--color-error)}.checkbox__input--error:checked{background-color:var(--color-error);border-color:var(--color-error)}.checkbox__label{color:var(--color-text);font-size:var(--font-size-9);line-height:1.5;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-wrapper--disabled .checkbox__label{cursor:not-allowed}.checkbox__error{display:block;color:var(--color-error);font-size:var(--font-size-10);line-height:1.4;margin-inline-start:calc(1rem + var(--spacing-2))}.checkbox__helper{display:block;color:var(--color-system-text);font-size:var(--font-size-10);line-height:1.4;margin-inline-start:calc(1rem + var(--spacing-2))}@media (min-width: 768px){.checkbox__label{font-size:var(--font-size-9)}}.radio-wrapper{display:inline-flex;flex-direction:column;gap:var(--spacing-2)}.radio-wrapper--disabled{opacity:1;cursor:not-allowed}.radio__container{display:inline-flex;align-items:center;gap:var(--spacing-2);position:relative}.radio__input{appearance:none;-webkit-appearance:none;-moz-appearance:none;width:1.25rem;height:1.25rem;border:1px solid var(--color-icon-secondary);border-radius:50%;background-color:transparent;cursor:pointer;flex-shrink:0;position:relative;transition:all .2s ease}.radio__input:not(:disabled):hover{border-color:var(--color-action)}.radio__input:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px}.radio__input:checked{border-color:var(--color-action);border-width:1px}.radio__input:checked:before{content:"";position:absolute;inset-inline-start:22%;inset-block-start:22%;width:56%;height:56%;background-color:var(--color-clickable);border-radius:50%;transition:all .2s ease}.radio__input:disabled{border-color:var(--color-border);background-color:transparent;cursor:not-allowed}.radio__input:disabled:checked{border-color:var(--color-icon-secondary)}.radio__input:disabled:checked:before{background-color:var(--color-icon-secondary)}.radio__input--error{border-color:var(--color-error)}.radio__input--error:checked{border-color:var(--color-error)}.radio__label{color:var(--color-text);font-size:var(--font-size-9);font-weight:400;line-height:1.5;cursor:pointer;-webkit-user-select:none;user-select:none}.radio-wrapper--disabled .radio__label{color:var(--color-system-text);cursor:not-allowed}.radio__error{color:var(--color-error);font-size:var(--font-size-8);line-height:1.5;margin-inline-start:calc(1.25rem + var(--spacing-2))}.radio__helper{color:var(--color-system-text);font-size:var(--font-size-8);line-height:1.5;margin-inline-start:calc(1.25rem + var(--spacing-2))}@media (min-width: 768px){.radio__input{width:1.25rem;height:1.25rem}}@media (prefers-contrast: high){.radio__input{border-width:2px}.radio__input:checked:before{border:1px solid var(--color-bg)}}@media (prefers-reduced-motion: reduce){.radio__input,.radio__input:before{transition:none}}.tabs-list{display:inline-flex;align-items:center;justify-content:center;block-size:2.5rem;padding:var(--spacing-1);gap:var(--spacing-1);background-color:var(--color-bg-secondary);border-radius:var(--radius-md);color:var(--color-icon-secondary)}.tabs-trigger{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding-inline:var(--spacing-3);padding-block:var(--spacing-1-5);font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);font-weight:500;line-height:1.5;border:none;border-radius:var(--radius-default);background-color:transparent;color:var(--color-icon-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,color,box-shadow;transition-duration:.2s;transition-timing-function:ease-in-out}.tabs-trigger:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px;z-index:1}.tabs-trigger:disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.tabs-trigger[data-state=active]{background-color:var(--color-card);color:var(--color-text);box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f}.tabs-trigger:hover:not([data-state=active]):not(:disabled){background-color:var(--color-border);color:var(--color-text)}.tabs-content{margin-block-start:var(--spacing-2)}.tabs-content:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px;border-radius:var(--radius-default)}@media (max-width: 639px){.tabs-list{inline-size:100%;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.tabs-list::-webkit-scrollbar{display:none}.tabs-trigger{padding-inline:var(--spacing-4);padding-block:var(--spacing-2)}}.alert{position:relative;display:flex;gap:var(--spacing-3);padding-inline:var(--spacing-4);padding-block:var(--spacing-3);font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;border:1px solid;border-radius:var(--radius-md)}.alert--info{background-color:var(--color-clickable-light, rgba(47, 157, 178, .05));border-color:var(--color-clickable-light, rgba(47, 157, 178, .2));color:var(--color-clickable)}.alert--success{background-color:var(--color-success-light, rgba(76, 175, 80, .05));border-color:var(--color-success-light, rgba(76, 175, 80, .2));color:var(--color-success, #4caf50)}.alert--warning{background-color:var(--color-warning-light, rgba(255, 152, 0, .05));border-color:var(--color-warning-light, rgba(255, 152, 0, .2));color:var(--color-warning, #ff9800)}.alert--error{background-color:var(--color-error-light, rgba(255, 104, 104, .05));border-color:var(--color-error-light, rgba(255, 104, 104, .2));color:var(--color-error)}.alert__icon{display:inline-flex;align-items:flex-start;justify-content:center;flex-shrink:0;margin-block-start:.125rem}.alert--info .alert__icon{color:var(--color-clickable)}.alert--success .alert__icon{color:var(--color-success, #4caf50)}.alert--warning .alert__icon{color:var(--color-warning, #ff9800)}.alert--error .alert__icon{color:var(--color-error)}.alert__content{flex:1;min-inline-size:0}.alert__title{font-weight:600;margin-block-end:var(--spacing-1);line-height:1.3}@media (min-width: 768px){.alert{padding-inline:var(--spacing-5);padding-block:var(--spacing-4)}}.card{display:flex;flex-direction:column;border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-card);overflow:hidden}.card--default{border:1px solid var(--color-border);background-color:var(--color-card)}.card--outlined{border:2px solid var(--color-system-text);background-color:var(--color-card)}.card--elevated{border:1px solid var(--color-border);background-color:var(--color-card);box-shadow:0 .625rem 1.875rem -.1875rem #0000001a,0 .25rem .375rem -.125rem #0000000d}.card-header{display:flex;flex-direction:column;gap:var(--spacing-1-5);padding:var(--spacing-6)}.card-title{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-6);font-weight:600;line-height:1.2;color:var(--color-text)}.card-description{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;color:var(--color-icon-secondary)}.card-content{padding-inline:var(--spacing-6);padding-block:var(--spacing-6);padding-block-start:0}.card-footer{display:flex;align-items:center;gap:var(--spacing-4);padding-inline:var(--spacing-6);padding-block:var(--spacing-6);padding-block-start:0}@media (max-width: 639px){.card-header,.card-content,.card-footer{padding-inline:var(--spacing-4);padding-block:var(--spacing-4)}.card-content,.card-footer{padding-block-start:0}}.datatable-wrapper{inline-size:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--color-border) var(--color-bg-secondary)}.datatable{inline-size:100%;border-collapse:collapse;font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;color:var(--color-text)}.datatable__head{border-block-end:1px solid var(--color-border);background-color:var(--color-bg-secondary)}.datatable__header-cell{padding-inline:var(--spacing-4);padding-block:var(--spacing-3);text-align:start;font-weight:600;color:var(--color-system-text)}.datatable__body-row{border-block-end:1px solid var(--color-border)}.datatable__body-row.datatable__body-row--hoverable:hover{background-color:var(--color-bg)}.datatable__body-row.datatable__body-row--striped:nth-child(2n){background-color:var(--color-bg)}.datatable__body-cell{padding-inline:var(--spacing-4);padding-block:var(--spacing-3);color:var(--color-text)}.datatable__empty{padding:var(--spacing-12);text-align:center;color:var(--color-icon-secondary);font-style:italic}@media (max-width: 639px){.datatable__header-cell,.datatable__body-cell{padding-inline:var(--spacing-2);padding-block:var(--spacing-2);font-size:var(--font-size-10)}.datatable__empty{padding:var(--spacing-8)}}.chip{display:inline-flex;align-items:center;justify-content:center;padding-block:var(--spacing-1);padding-inline:var(--spacing-3);border-radius:var(--radius-default);border-width:var(--border-width-default);border-style:solid;font-size:var(--font-size-9);line-height:1;font-weight:400;transition:all .2s ease-in-out;cursor:default;-webkit-user-select:none;user-select:none}.chip__label{white-space:nowrap}.chip--primary{background-color:color-mix(in srgb,var(--color-clickable) 10%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 30%,transparent);color:var(--color-clickable)}.chip--primary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-clickable) 15%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 40%,transparent)}.chip--primary.chip--selected{background-color:var(--color-clickable);border-color:var(--color-clickable);color:var(--color-card)}.chip--secondary{background-color:color-mix(in srgb,var(--color-toggle) 10%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 30%,transparent);color:var(--color-toggle)}.chip--secondary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-toggle) 15%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 40%,transparent)}.chip--secondary.chip--selected{background-color:var(--color-toggle);border-color:var(--color-toggle);color:var(--color-card)}.chip--tertiary{background-color:color-mix(in srgb,var(--color-popup) 10%,transparent);border-color:color-mix(in srgb,var(--color-popup) 30%,transparent);color:var(--color-popup)}.chip--tertiary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-popup) 15%,transparent);border-color:color-mix(in srgb,var(--color-popup) 40%,transparent)}.chip--tertiary.chip--selected{background-color:var(--color-popup);border-color:var(--color-popup);color:var(--color-card)}.chip--quaternary{background-color:color-mix(in srgb,var(--color-secondary) 10%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 30%,transparent);color:var(--color-secondary)}.chip--quaternary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-secondary) 15%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 40%,transparent)}.chip--quaternary.chip--selected{background-color:var(--color-secondary);border-color:var(--color-secondary);color:var(--color-card)}.chip--disabled{opacity:.4;cursor:not-allowed;pointer-events:none}@media (min-width: 768px){.chip{padding-inline:var(--spacing-3-5)}}@media (min-width: 1024px){.chip{padding-inline:var(--spacing-3)}}.sr-only{position:absolute;width:.0625rem;height:.0625rem;padding:0;margin:-.0625rem;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.chip-group{display:block;width:100%;position:relative;overflow:visible}.chip-group__container{display:flex;flex-wrap:nowrap;gap:var(--spacing-2);align-items:center}.chip-group__item-wrapper{display:inline-flex;flex-shrink:0}.chip-group__item{position:relative;display:inline-flex;align-items:center;gap:var(--spacing-1);cursor:pointer;outline:none;transition:all .2s ease-in-out;border-radius:var(--radius-default)}.chip-group__item:hover:not([aria-disabled=true]){cursor:pointer}.chip-group__item:focus-visible{outline:var(--border-width-md) solid var(--color-clickable);outline-offset:var(--spacing-0-5);border-radius:var(--radius-default)}.chip-group__item:focus-visible:not(:focus){outline:none}.chip-group__item:active:not([aria-disabled=true]){transform:scale(.98)}.chip-group__item[aria-disabled=true]{cursor:not-allowed}.chip-group__item .chip{cursor:pointer}.chip-group__item[aria-disabled=true] .chip{cursor:not-allowed}.chip-group__remove{position:absolute;inset-inline-end:var(--spacing-1);inset-block-start:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:var(--spacing-4);height:var(--spacing-4);padding:0;border:none;background:transparent;cursor:pointer;border-radius:var(--radius-round);transition:background-color .2s ease-in-out;color:currentColor}.chip-group__remove:hover{background-color:color-mix(in srgb,currentColor 20%,transparent)}.chip-group__remove:focus-visible{outline:var(--border-width-md) solid var(--color-clickable);outline-offset:var(--border-width-default)}.chip-group__item:has(.chip-group__remove) .chip{padding-inline-end:var(--spacing-6)}.chip-group__overflow{position:relative;display:inline-flex;flex-shrink:0;cursor:pointer}.chip-group__overflow .chip{transition:all .2s ease-in-out}.chip-group__overflow .chip--primary{background-color:color-mix(in srgb,var(--color-clickable) 20%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 50%,transparent);color:var(--color-clickable);cursor:pointer}.chip-group__overflow .chip--secondary{background-color:color-mix(in srgb,var(--color-toggle) 20%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 50%,transparent);color:var(--color-toggle);cursor:pointer}.chip-group__overflow .chip--tertiary{background-color:color-mix(in srgb,var(--color-popup) 20%,transparent);border-color:color-mix(in srgb,var(--color-popup) 50%,transparent);color:var(--color-popup);cursor:pointer}.chip-group__overflow .chip--quaternary{background-color:color-mix(in srgb,var(--color-secondary) 20%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 50%,transparent);color:var(--color-secondary);cursor:pointer}.chip-group__overflow:hover .chip--primary{background-color:color-mix(in srgb,var(--color-clickable) 25%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 60%,transparent)}.chip-group__overflow:hover .chip--secondary{background-color:color-mix(in srgb,var(--color-toggle) 25%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 60%,transparent)}.chip-group__overflow:hover .chip--tertiary{background-color:color-mix(in srgb,var(--color-popup) 25%,transparent);border-color:color-mix(in srgb,var(--color-popup) 60%,transparent)}.chip-group__overflow:hover .chip--quaternary{background-color:color-mix(in srgb,var(--color-secondary) 25%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 60%,transparent)}.chip-group__tooltip{position:absolute;inset-block-end:calc(100% + var(--spacing-2));inset-inline-start:50%;translate:-50% 0;z-index:var(--z-index-popover, 1000);min-width:calc(var(--spacing-35));max-width:calc(var(--spacing-62-5));padding-block:var(--spacing-2);padding-inline:var(--spacing-3);background-color:var(--color-text);color:var(--color-card);border:none;border-radius:var(--radius-default);font-size:var(--font-size-8);line-height:normal;animation:tooltipFadeIn .2s ease-in-out;display:flex;flex-direction:column;gap:var(--spacing-2);pointer-events:none}.chip-group__tooltip-item{white-space:pre-wrap;word-break:break-word;min-width:100%;width:min-content}.chip-group__dropdown{position:absolute;inset-block-end:calc(100% + var(--spacing-2));inset-inline-start:50%;translate:-50% 0;z-index:var(--z-index-popover, 1000);min-width:calc(var(--spacing-35));max-width:calc(var(--spacing-62-5));padding:0;background-color:var(--color-card);border:none;border-radius:var(--radius-md);box-shadow:0 0 var(--spacing-4) #0000001a;animation:tooltipFadeIn .2s ease-in-out;overflow:hidden}.chip-group__dropdown-item{padding-block:var(--spacing-2-5);padding-inline:var(--spacing-3);font-size:var(--font-size-9);color:var(--color-grey-07);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:background-color .15s ease-in-out;width:100%}.chip-group__dropdown-item:first-child{background-color:var(--color-bg)}.chip-group__dropdown-item:hover:not(.chip-group__dropdown-item--disabled){background-color:var(--color-bg)}.chip-group__dropdown-item--disabled{opacity:.4;cursor:not-allowed}.chip-group__tooltip:after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:50%;translate:-50% 0;border-width:var(--spacing-2);border-style:solid;border-color:var(--color-text) transparent transparent transparent}.chip-group__dropdown:after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:50%;translate:-50% 0;border-width:var(--spacing-2);border-style:solid;border-color:var(--color-card) transparent transparent transparent}@keyframes tooltipFadeIn{0%{opacity:0;translate:-50% calc(var(--spacing-1) * -1)}to{opacity:1;translate:-50% 0}}.chip-group--disabled{opacity:.4;pointer-events:none}@media (min-width: 768px){.chip-group__container{gap:var(--spacing-2-5)}}@media (min-width: 1024px){.chip-group__container{gap:var(--spacing-2)}}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background-color:#191a3980;-webkit-backdrop-filter:blur(.25rem);backdrop-filter:blur(.25rem);animation-duration:.2s;animation-timing-function:ease-out;animation-fill-mode:forwards}.dialog-overlay[data-state=open]{animation-name:dialog-overlay-fade-in}.dialog-overlay[data-state=closed]{animation-name:dialog-overlay-fade-out}.dialog-content{position:fixed;inset-inline-start:50%;inset-block-start:50%;z-index:50;transform:translate(-50%,-50%);display:grid;gap:var(--spacing-4);inline-size:100%;max-inline-size:32rem;padding:var(--spacing-6);background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:0 .625rem 1.875rem -.1875rem #0000001a,0 .25rem .375rem -.125rem #0000000d;animation-duration:.2s;animation-timing-function:cubic-bezier(.16,1,.3,1);animation-fill-mode:forwards}.dialog-content[data-state=open]{animation-name:dialog-content-show}.dialog-content[data-state=closed]{animation-name:dialog-content-hide}.dialog-content:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px}.dialog-header{display:flex;flex-direction:column;gap:var(--spacing-1-5);text-align:center}@media (min-width: 640px){.dialog-header{text-align:start}}.dialog-footer{display:flex;flex-direction:column-reverse;gap:var(--spacing-2)}@media (min-width: 640px){.dialog-footer{flex-direction:row;justify-content:flex-end;gap:var(--spacing-2)}}.dialog-title{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-6);font-weight:600;line-height:1.2;color:var(--color-text);letter-spacing:-.01em}.dialog-description{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;color:var(--color-icon-secondary)}@keyframes dialog-overlay-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dialog-overlay-fade-out{0%{opacity:1}to{opacity:0}}@keyframes dialog-content-show{0%{opacity:0;transform:translate(-50%,-48%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes dialog-content-hide{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-48%) scale(.95)}}@media (max-width: 639px){.dialog-content{inline-size:calc(100% - var(--spacing-8));max-inline-size:calc(100% - var(--spacing-8));padding:var(--spacing-5)}}.stack{display:flex}.stack--horizontal{flex-direction:row}.stack--vertical{flex-direction:column}.stack--spacing-0{gap:0}.stack--spacing-1{gap:var(--spacing-1)}.stack--spacing-2{gap:var(--spacing-2)}.stack--spacing-3{gap:var(--spacing-3)}.stack--spacing-4{gap:var(--spacing-4)}.stack--spacing-5{gap:var(--spacing-5)}.stack--spacing-6{gap:var(--spacing-6)}.stack--spacing-8{gap:var(--spacing-8)}.stack--spacing-10{gap:var(--spacing-10)}.stack--spacing-12{gap:var(--spacing-12)}.stack--align-start{align-items:flex-start}.stack--align-center{align-items:center}.stack--align-end{align-items:flex-end}.stack--align-stretch{align-items:stretch}.stack--justify-start{justify-content:flex-start}.stack--justify-center{justify-content:center}.stack--justify-end{justify-content:flex-end}.stack--justify-between{justify-content:space-between}.stack--justify-around{justify-content:space-around}.stack--wrap{flex-wrap:wrap}@media (max-width: 639px){.stack--horizontal.stack--responsive{flex-direction:column}}
1
+ .btn{display:inline-flex;align-items:center;justify-content:center;block-size:2.5rem;padding-block:var(--spacing-3);padding-inline:var(--spacing-4);gap:var(--spacing-2);font-family:Almoni DL AAA,sans-serif;font-weight:400;font-size:var(--font-size-8);line-height:1.5rem;text-align:center;white-space:nowrap;border:none;border-radius:var(--radius-default);transition-property:background-color,color,border-color,transform;transition-duration:.2s;transition-timing-function:ease-in-out;will-change:transform;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}.btn:focus-visible{outline:2px solid;outline-offset:2px}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{cursor:not-allowed;opacity:1;pointer-events:none}.btn--primary-workspace{background-color:var(--color-popup);color:var(--color-card);outline-color:var(--color-popup)}.btn--primary-workspace:hover:not(:disabled){background-color:var(--color-action)}.btn--primary-workspace:disabled{background-color:var(--color-bg-secondary);color:var(--color-icon-secondary);border:1px solid var(--color-border)}.btn--primary-builder{background-color:var(--color-action);color:var(--color-card);outline-color:var(--color-action)}.btn--primary-builder:hover:not(:disabled){background-color:var(--color-text)}.btn--primary-builder:disabled{background-color:var(--color-bg-secondary);color:var(--color-icon-secondary);border:1px solid var(--color-border)}.btn--secondary{background-color:var(--color-card);color:var(--color-text);border:1px solid var(--color-system-text);outline-color:var(--color-border)}.btn--secondary:hover:not(:disabled){background-color:var(--color-bg-secondary)}.btn--secondary:disabled{background-color:transparent;color:var(--color-icon-secondary);border:1px solid var(--color-border)}.btn--ghost{background-color:transparent;color:var(--color-text);outline-color:var(--color-border)}.btn--ghost:hover:not(:disabled){background-color:var(--color-bg-secondary)}.btn--ghost:disabled{background-color:transparent;color:var(--color-icon-secondary)}.btn--full-width{inline-size:100%}.btn__icon{display:inline-flex;align-items:center;justify-content:center;inline-size:1rem;block-size:1rem;flex-shrink:0}.input-wrapper{display:flex;flex-direction:column;gap:var(--spacing-2);inline-size:100%}.input-wrapper--full-width{inline-size:100%}.input__label{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);font-weight:400;color:var(--color-grey-07);line-height:1}.input__field-container{position:relative;display:flex;align-items:center;inline-size:100%}.input{display:block;inline-size:100%;block-size:var(--spacing-11);padding-inline:var(--spacing-3-5);padding-block:var(--spacing-3-5);font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-8);line-height:1;color:var(--color-text);background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-5px);transition-property:border-color,box-shadow;transition-duration:.2s;transition-timing-function:ease-in-out;cursor:text}.input:focus{outline:none;border-color:var(--color-clickable);box-shadow:none}.input:hover:not(:disabled):not(:focus){border-color:var(--color-clickable)}.input:disabled{cursor:not-allowed;opacity:.5;background-color:var(--color-card);color:var(--color-text);pointer-events:none}.input::placeholder{color:var(--color-icon-secondary)}.input--error{border-color:var(--color-error)}.input--error:focus{border-color:var(--color-error);box-shadow:none}.input--error:hover:not(:disabled){border-color:var(--color-error)}.input--full-width{inline-size:100%}.input--with-toggle{padding-inline-end:var(--spacing-12)}.input__toggle{position:absolute;inset-block-start:50%;inset-inline-end:var(--spacing-3-5);transform:translateY(-50%);display:flex;align-items:center;justify-content:center;inline-size:var(--spacing-5);block-size:var(--spacing-5);padding:0;background:transparent;border:none;color:var(--color-border);cursor:pointer;transition-property:color,transform;transition-duration:.2s;transition-timing-function:ease-in-out}.input__toggle:hover{color:var(--color-system-text)}.input__toggle:focus{outline:2px solid var(--color-clickable);outline-offset:2px;border-radius:var(--radius-sm)}.input__toggle:focus:not(:focus-visible){outline:none}.input__toggle:active{transform:translateY(-50%) scale(.95)}.input__toggle svg{inline-size:100%;block-size:100%}.input__helper{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-10);line-height:1;color:var(--color-grey-07);padding-inline-start:var(--spacing-3-5);padding-block-start:var(--spacing-1-5)}.input__error{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-10);line-height:1;color:var(--color-error);padding-inline-start:var(--spacing-3-5);padding-block-start:var(--spacing-1-5)}@media (min-width: 768px){.input{block-size:var(--spacing-11)}}.checkbox-wrapper{display:flex;flex-direction:column;gap:var(--spacing-1-5)}.checkbox-wrapper--disabled{opacity:.5;cursor:not-allowed}.checkbox__container{display:flex;align-items:center;gap:var(--spacing-2)}.checkbox__input{appearance:none;-webkit-appearance:none;-moz-appearance:none;width:1rem;height:1rem;margin:0;border:1px solid var(--color-icon-secondary);border-radius:.1875rem;background-color:var(--color-card);cursor:pointer;position:relative;flex-shrink:0;transition:all .15s ease-in-out}.checkbox__input:hover:not(:disabled){border-color:var(--color-icon-secondary);background-color:var(--color-bg)}.checkbox__input:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px}.checkbox__input:checked{background-color:var(--color-clickable);border-color:var(--color-clickable)}.checkbox__input:checked:before{content:"";position:absolute;inset-inline-start:50%;inset-block-start:50%;transform:translate(-50%,-50%) rotate(45deg);width:.3125rem;height:.625rem;border:solid var(--color-card);border-width:0 .125rem .125rem 0;border-inline-start-width:0;border-block-start-width:0}.checkbox__input[data-indeterminate=true]{background-color:var(--color-clickable);border-color:var(--color-clickable)}.checkbox__input[data-indeterminate=true]:before{content:"";position:absolute;inset-inline-start:50%;inset-block-start:50%;transform:translate(-50%,-50%);width:.625rem;height:.125rem;background-color:var(--color-card);border:none;border-radius:.0625rem}.checkbox__input:disabled{border-color:var(--color-border);background-color:var(--color-bg-secondary);cursor:not-allowed}.checkbox__input:disabled:checked{background-color:var(--color-border);border-color:var(--color-border)}.checkbox__input--error{border-color:var(--color-error)}.checkbox__input--error:checked{background-color:var(--color-error);border-color:var(--color-error)}.checkbox__label{color:var(--color-text);font-size:var(--font-size-9);line-height:1.5;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-wrapper--disabled .checkbox__label{cursor:not-allowed}.checkbox__error{display:block;color:var(--color-error);font-size:var(--font-size-10);line-height:1.4;margin-inline-start:calc(1rem + var(--spacing-2))}.checkbox__helper{display:block;color:var(--color-system-text);font-size:var(--font-size-10);line-height:1.4;margin-inline-start:calc(1rem + var(--spacing-2))}@media (min-width: 768px){.checkbox__label{font-size:var(--font-size-9)}}.radio-wrapper{display:inline-flex;flex-direction:column;gap:var(--spacing-2)}.radio-wrapper--disabled{opacity:1;cursor:not-allowed}.radio__container{display:inline-flex;align-items:center;gap:var(--spacing-2);position:relative}.radio__input{appearance:none;-webkit-appearance:none;-moz-appearance:none;width:1.25rem;height:1.25rem;border:1px solid var(--color-icon-secondary);border-radius:50%;background-color:transparent;cursor:pointer;flex-shrink:0;position:relative;transition:all .2s ease}.radio__input:not(:disabled):hover{border-color:var(--color-action)}.radio__input:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px}.radio__input:checked{border-color:var(--color-action);border-width:1px}.radio__input:checked:before{content:"";position:absolute;inset-inline-start:22%;inset-block-start:22%;width:56%;height:56%;background-color:var(--color-clickable);border-radius:50%;transition:all .2s ease}.radio__input:disabled{border-color:var(--color-border);background-color:transparent;cursor:not-allowed}.radio__input:disabled:checked{border-color:var(--color-icon-secondary)}.radio__input:disabled:checked:before{background-color:var(--color-icon-secondary)}.radio__input--error{border-color:var(--color-error)}.radio__input--error:checked{border-color:var(--color-error)}.radio__label{color:var(--color-text);font-size:var(--font-size-9);font-weight:400;line-height:1.5;cursor:pointer;-webkit-user-select:none;user-select:none}.radio-wrapper--disabled .radio__label{color:var(--color-system-text);cursor:not-allowed}.radio__error{color:var(--color-error);font-size:var(--font-size-8);line-height:1.5;margin-inline-start:calc(1.25rem + var(--spacing-2))}.radio__helper{color:var(--color-system-text);font-size:var(--font-size-8);line-height:1.5;margin-inline-start:calc(1.25rem + var(--spacing-2))}@media (min-width: 768px){.radio__input{width:1.25rem;height:1.25rem}}@media (prefers-contrast: high){.radio__input{border-width:2px}.radio__input:checked:before{border:1px solid var(--color-bg)}}@media (prefers-reduced-motion: reduce){.radio__input,.radio__input:before{transition:none}}.tabs-list{display:inline-flex;align-items:center;justify-content:center;block-size:2.5rem;padding:var(--spacing-1);gap:var(--spacing-1);background-color:var(--color-bg-secondary);border-radius:var(--radius-md);color:var(--color-icon-secondary)}.tabs-trigger{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding-inline:var(--spacing-3);padding-block:var(--spacing-1-5);font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);font-weight:500;line-height:1.5;border:none;border-radius:var(--radius-default);background-color:transparent;color:var(--color-icon-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,color,box-shadow;transition-duration:.2s;transition-timing-function:ease-in-out}.tabs-trigger:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px;z-index:1}.tabs-trigger:disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.tabs-trigger[data-state=active]{background-color:var(--color-card);color:var(--color-text);box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f}.tabs-trigger:hover:not([data-state=active]):not(:disabled){background-color:var(--color-border);color:var(--color-text)}.tabs-content{margin-block-start:var(--spacing-2)}.tabs-content:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px;border-radius:var(--radius-default)}@media (max-width: 639px){.tabs-list{inline-size:100%;justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.tabs-list::-webkit-scrollbar{display:none}.tabs-trigger{padding-inline:var(--spacing-4);padding-block:var(--spacing-2)}}.alert{position:relative;display:flex;gap:var(--spacing-3);padding-inline:var(--spacing-4);padding-block:var(--spacing-3);font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;border:1px solid;border-radius:var(--radius-md)}.alert--info{background-color:var(--color-clickable-light, rgba(47, 157, 178, .05));border-color:var(--color-clickable-light, rgba(47, 157, 178, .2));color:var(--color-clickable)}.alert--success{background-color:var(--color-success-light, rgba(76, 175, 80, .05));border-color:var(--color-success-light, rgba(76, 175, 80, .2));color:var(--color-success, #4caf50)}.alert--warning{background-color:var(--color-warning-light, rgba(255, 152, 0, .05));border-color:var(--color-warning-light, rgba(255, 152, 0, .2));color:var(--color-warning, #ff9800)}.alert--error{background-color:var(--color-error-light, rgba(255, 104, 104, .05));border-color:var(--color-error-light, rgba(255, 104, 104, .2));color:var(--color-error)}.alert__icon{display:inline-flex;align-items:flex-start;justify-content:center;flex-shrink:0;margin-block-start:.125rem}.alert--info .alert__icon{color:var(--color-clickable)}.alert--success .alert__icon{color:var(--color-success, #4caf50)}.alert--warning .alert__icon{color:var(--color-warning, #ff9800)}.alert--error .alert__icon{color:var(--color-error)}.alert__content{flex:1;min-inline-size:0}.alert__title{font-weight:600;margin-block-end:var(--spacing-1);line-height:1.3}@media (min-width: 768px){.alert{padding-inline:var(--spacing-5);padding-block:var(--spacing-4)}}.card{display:flex;flex-direction:column;border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-card);overflow:hidden}.card--default{border:1px solid var(--color-border);background-color:var(--color-card)}.card--outlined{border:2px solid var(--color-system-text);background-color:var(--color-card)}.card--elevated{border:1px solid var(--color-border);background-color:var(--color-card);box-shadow:0 .625rem 1.875rem -.1875rem #0000001a,0 .25rem .375rem -.125rem #0000000d}.card-header{display:flex;flex-direction:column;gap:var(--spacing-1-5);padding:var(--spacing-6)}.card-title{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-6);font-weight:600;line-height:1.2;color:var(--color-text)}.card-description{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;color:var(--color-icon-secondary)}.card-content{padding-inline:var(--spacing-6);padding-block:var(--spacing-6);padding-block-start:0}.card-footer{display:flex;align-items:center;gap:var(--spacing-4);padding-inline:var(--spacing-6);padding-block:var(--spacing-6);padding-block-start:0}@media (max-width: 639px){.card-header,.card-content,.card-footer{padding-inline:var(--spacing-4);padding-block:var(--spacing-4)}.card-content,.card-footer{padding-block-start:0}}.datatable-wrapper{inline-size:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--color-border) var(--color-bg-secondary)}.datatable{inline-size:100%;border-collapse:collapse;font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;color:var(--color-text)}.datatable__head{border-block-end:1px solid var(--color-border);background-color:var(--color-bg-secondary)}.datatable__header-cell{padding-inline:var(--spacing-4);padding-block:var(--spacing-3);text-align:start;font-weight:600;color:var(--color-system-text)}.datatable__body-row{border-block-end:1px solid var(--color-border)}.datatable__body-row.datatable__body-row--hoverable:hover{background-color:var(--color-bg)}.datatable__body-row.datatable__body-row--striped:nth-child(2n){background-color:var(--color-bg)}.datatable__body-cell{padding-inline:var(--spacing-4);padding-block:var(--spacing-3);color:var(--color-text)}.datatable__empty{padding:var(--spacing-12);text-align:center;color:var(--color-icon-secondary);font-style:italic}@media (max-width: 639px){.datatable__header-cell,.datatable__body-cell{padding-inline:var(--spacing-2);padding-block:var(--spacing-2);font-size:var(--font-size-10)}.datatable__empty{padding:var(--spacing-8)}}.chip{display:inline-flex;align-items:center;justify-content:center;padding-block:var(--spacing-1);padding-inline:var(--spacing-3);border-radius:var(--radius-default);border-width:var(--border-width-default);border-style:solid;font-size:var(--font-size-9);line-height:1;font-weight:400;transition:all .2s ease-in-out;cursor:default;-webkit-user-select:none;user-select:none}.chip__label{white-space:nowrap}.chip--primary{background-color:color-mix(in srgb,var(--color-clickable) 10%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 30%,transparent);color:var(--color-clickable)}.chip--primary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-clickable) 15%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 40%,transparent)}.chip--primary.chip--selected{background-color:var(--color-clickable);border-color:var(--color-clickable);color:var(--color-card)}.chip--secondary{background-color:color-mix(in srgb,var(--color-toggle) 10%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 30%,transparent);color:var(--color-toggle)}.chip--secondary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-toggle) 15%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 40%,transparent)}.chip--secondary.chip--selected{background-color:var(--color-toggle);border-color:var(--color-toggle);color:var(--color-card)}.chip--tertiary{background-color:color-mix(in srgb,var(--color-popup) 10%,transparent);border-color:color-mix(in srgb,var(--color-popup) 30%,transparent);color:var(--color-popup)}.chip--tertiary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-popup) 15%,transparent);border-color:color-mix(in srgb,var(--color-popup) 40%,transparent)}.chip--tertiary.chip--selected{background-color:var(--color-popup);border-color:var(--color-popup);color:var(--color-card)}.chip--quaternary{background-color:color-mix(in srgb,var(--color-secondary) 10%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 30%,transparent);color:var(--color-secondary)}.chip--quaternary:hover:not(.chip--disabled):not(.chip--selected){background-color:color-mix(in srgb,var(--color-secondary) 15%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 40%,transparent)}.chip--quaternary.chip--selected{background-color:var(--color-secondary);border-color:var(--color-secondary);color:var(--color-card)}.chip--disabled{opacity:.4;cursor:not-allowed;pointer-events:none}@media (min-width: 768px){.chip{padding-inline:var(--spacing-3-5)}}@media (min-width: 1024px){.chip{padding-inline:var(--spacing-3)}}.sr-only{position:absolute;width:.0625rem;height:.0625rem;padding:0;margin:-.0625rem;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.chip-group{display:block;width:100%;position:relative;overflow:visible}.chip-group__container{display:flex;flex-wrap:nowrap;gap:var(--spacing-2);align-items:center}.chip-group__item-wrapper{display:inline-flex;flex-shrink:0}.chip-group__item{position:relative;display:inline-flex;align-items:center;gap:var(--spacing-1);cursor:pointer;outline:none;transition:all .2s ease-in-out;border-radius:var(--radius-default)}.chip-group__item:hover:not([aria-disabled=true]){cursor:pointer}.chip-group__item:focus-visible{outline:var(--border-width-md) solid var(--color-clickable);outline-offset:var(--spacing-0-5);border-radius:var(--radius-default)}.chip-group__item:focus-visible:not(:focus){outline:none}.chip-group__item:active:not([aria-disabled=true]){transform:scale(.98)}.chip-group__item[aria-disabled=true]{cursor:not-allowed}.chip-group__item .chip{cursor:pointer}.chip-group__item[aria-disabled=true] .chip{cursor:not-allowed}.chip-group__remove{position:absolute;inset-inline-end:var(--spacing-1);inset-block-start:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:var(--spacing-4);height:var(--spacing-4);padding:0;border:none;background:transparent;cursor:pointer;border-radius:var(--radius-round);transition:background-color .2s ease-in-out;color:currentColor}.chip-group__remove:hover{background-color:color-mix(in srgb,currentColor 20%,transparent)}.chip-group__remove:focus-visible{outline:var(--border-width-md) solid var(--color-clickable);outline-offset:var(--border-width-default)}.chip-group__item:has(.chip-group__remove) .chip{padding-inline-end:var(--spacing-6)}.chip-group__overflow{position:relative;display:inline-flex;flex-shrink:0;cursor:pointer}.chip-group__overflow .chip{transition:all .2s ease-in-out}.chip-group__overflow .chip--primary{background-color:color-mix(in srgb,var(--color-clickable) 20%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 50%,transparent);color:var(--color-clickable);cursor:pointer}.chip-group__overflow .chip--secondary{background-color:color-mix(in srgb,var(--color-toggle) 20%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 50%,transparent);color:var(--color-toggle);cursor:pointer}.chip-group__overflow .chip--tertiary{background-color:color-mix(in srgb,var(--color-popup) 20%,transparent);border-color:color-mix(in srgb,var(--color-popup) 50%,transparent);color:var(--color-popup);cursor:pointer}.chip-group__overflow .chip--quaternary{background-color:color-mix(in srgb,var(--color-secondary) 20%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 50%,transparent);color:var(--color-secondary);cursor:pointer}.chip-group__overflow:hover .chip--primary{background-color:color-mix(in srgb,var(--color-clickable) 25%,transparent);border-color:color-mix(in srgb,var(--color-clickable) 60%,transparent)}.chip-group__overflow:hover .chip--secondary{background-color:color-mix(in srgb,var(--color-toggle) 25%,transparent);border-color:color-mix(in srgb,var(--color-toggle) 60%,transparent)}.chip-group__overflow:hover .chip--tertiary{background-color:color-mix(in srgb,var(--color-popup) 25%,transparent);border-color:color-mix(in srgb,var(--color-popup) 60%,transparent)}.chip-group__overflow:hover .chip--quaternary{background-color:color-mix(in srgb,var(--color-secondary) 25%,transparent);border-color:color-mix(in srgb,var(--color-secondary) 60%,transparent)}.chip-group__tooltip{position:absolute;inset-block-end:calc(100% + var(--spacing-2));inset-inline-start:50%;translate:-50% 0;z-index:var(--z-index-popover, 1000);min-width:calc(var(--spacing-35));max-width:calc(var(--spacing-62-5));padding-block:var(--spacing-2);padding-inline:var(--spacing-3);background-color:var(--color-text);color:var(--color-card);border:none;border-radius:var(--radius-default);font-size:var(--font-size-8);line-height:normal;animation:tooltipFadeIn .2s ease-in-out;display:flex;flex-direction:column;gap:var(--spacing-2);pointer-events:none}.chip-group__tooltip-item{white-space:pre-wrap;word-break:break-word;min-width:100%;width:min-content}.chip-group__dropdown{position:absolute;inset-block-end:calc(100% + var(--spacing-2));inset-inline-start:50%;translate:-50% 0;z-index:var(--z-index-popover, 1000);min-width:calc(var(--spacing-35));max-width:calc(var(--spacing-62-5));padding:0;background-color:var(--color-card);border:none;border-radius:var(--radius-md);box-shadow:0 0 var(--spacing-4) #0000001a;animation:tooltipFadeIn .2s ease-in-out;overflow:hidden}.chip-group__dropdown-item{padding-block:var(--spacing-2-5);padding-inline:var(--spacing-3);font-size:var(--font-size-9);color:var(--color-grey-07);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:background-color .15s ease-in-out;width:100%}.chip-group__dropdown-item:first-child{background-color:var(--color-bg)}.chip-group__dropdown-item:hover:not(.chip-group__dropdown-item--disabled){background-color:var(--color-bg)}.chip-group__dropdown-item--disabled{opacity:.4;cursor:not-allowed}.chip-group__tooltip:after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:50%;translate:-50% 0;border-width:var(--spacing-2);border-style:solid;border-color:var(--color-text) transparent transparent transparent}.chip-group__dropdown:after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:50%;translate:-50% 0;border-width:var(--spacing-2);border-style:solid;border-color:var(--color-card) transparent transparent transparent}@keyframes tooltipFadeIn{0%{opacity:0;translate:-50% calc(var(--spacing-1) * -1)}to{opacity:1;translate:-50% 0}}.chip-group--disabled{opacity:.4;pointer-events:none}@media (min-width: 768px){.chip-group__container{gap:var(--spacing-2-5)}}@media (min-width: 1024px){.chip-group__container{gap:var(--spacing-2)}}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background-color:#191a3980;-webkit-backdrop-filter:blur(.25rem);backdrop-filter:blur(.25rem);animation-duration:.2s;animation-timing-function:ease-out;animation-fill-mode:forwards}.dialog-overlay[data-state=open]{animation-name:dialog-overlay-fade-in}.dialog-overlay[data-state=closed]{animation-name:dialog-overlay-fade-out}.dialog-content{position:fixed;inset-inline-start:50%;inset-block-start:50%;z-index:50;transform:translate(-50%,-50%);display:grid;gap:var(--spacing-4);inline-size:100%;max-inline-size:32rem;padding:var(--spacing-6);background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:0 .625rem 1.875rem -.1875rem #0000001a,0 .25rem .375rem -.125rem #0000000d;animation-duration:.2s;animation-timing-function:cubic-bezier(.16,1,.3,1);animation-fill-mode:forwards}.dialog-content[data-state=open]{animation-name:dialog-content-show}.dialog-content[data-state=closed]{animation-name:dialog-content-hide}.dialog-content:focus-visible{outline:2px solid var(--color-clickable);outline-offset:2px}.dialog-header{display:flex;flex-direction:column;gap:var(--spacing-1-5);text-align:center}@media (min-width: 640px){.dialog-header{text-align:start}}.dialog-footer{display:flex;flex-direction:column-reverse;gap:var(--spacing-2)}@media (min-width: 640px){.dialog-footer{flex-direction:row;justify-content:flex-end;gap:var(--spacing-2)}}.dialog-title{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-6);font-weight:600;line-height:1.2;color:var(--color-text);letter-spacing:-.01em}.dialog-description{font-family:Almoni DL AAA,sans-serif;font-size:var(--font-size-9);line-height:1.5;color:var(--color-icon-secondary)}@keyframes dialog-overlay-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dialog-overlay-fade-out{0%{opacity:1}to{opacity:0}}@keyframes dialog-content-show{0%{opacity:0;transform:translate(-50%,-48%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes dialog-content-hide{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-48%) scale(.95)}}@media (max-width: 639px){.dialog-content{inline-size:calc(100% - var(--spacing-8));max-inline-size:calc(100% - var(--spacing-8));padding:var(--spacing-5)}}.stack{display:flex}.stack--horizontal{flex-direction:row}.stack--vertical{flex-direction:column}.stack--spacing-0{gap:0}.stack--spacing-1{gap:var(--spacing-1)}.stack--spacing-2{gap:var(--spacing-2)}.stack--spacing-3{gap:var(--spacing-3)}.stack--spacing-4{gap:var(--spacing-4)}.stack--spacing-5{gap:var(--spacing-5)}.stack--spacing-6{gap:var(--spacing-6)}.stack--spacing-8{gap:var(--spacing-8)}.stack--spacing-10{gap:var(--spacing-10)}.stack--spacing-12{gap:var(--spacing-12)}.stack--align-start{align-items:flex-start}.stack--align-center{align-items:center}.stack--align-end{align-items:flex-end}.stack--align-stretch{align-items:stretch}.stack--justify-start{justify-content:flex-start}.stack--justify-center{justify-content:center}.stack--justify-end{justify-content:flex-end}.stack--justify-between{justify-content:space-between}.stack--justify-around{justify-content:space-around}.stack--wrap{flex-wrap:wrap}@media (max-width: 639px){.stack--horizontal.stack--responsive{flex-direction:column}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adam-milo/ui",
3
- "version": "1.0.21",
3
+ "version": "1.0.22",
4
4
  "type": "module",
5
5
  "description": "Adam Milo Design System - UI Component Library",
6
6
  "keywords": [
@@ -70,6 +70,7 @@
70
70
  "@testing-library/jest-dom": "^6.1.5",
71
71
  "@testing-library/react": "^14.1.2",
72
72
  "@testing-library/user-event": "^14.5.1",
73
+ "@types/email-validator": "^1.0.30",
73
74
  "@types/react": "^18.2.43",
74
75
  "@types/react-dom": "^18.2.17",
75
76
  "@vitejs/plugin-react": "^4.2.1",
File without changes
File without changes