cattle-care-ui 0.1.5 → 0.1.6

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.
@@ -1,6 +1,6 @@
1
1
  import { ButtonHTMLAttributes, ReactNode } from 'react';
2
2
  type ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'dangerous';
3
- type ButtonSize = 'sm' | 'base' | 'lg';
3
+ type ButtonSize = 'sm' | 'base';
4
4
  interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className'> {
5
5
  variant?: ButtonVariant;
6
6
  size?: ButtonSize;
@@ -1,9 +1,10 @@
1
- import { ChangeEvent } from 'react';
1
+ import { ChangeEvent, ReactNode } from 'react';
2
2
  interface CheckboxProps {
3
3
  checked: boolean;
4
4
  onChange: (e: ChangeEvent<HTMLInputElement>) => void;
5
+ label?: ReactNode;
5
6
  ariaLabel?: string;
6
7
  className?: string;
7
8
  }
8
- export declare function Checkbox({ checked, onChange, ariaLabel, className }: CheckboxProps): import("react").JSX.Element;
9
+ export declare function Checkbox({ checked, onChange, label, ariaLabel, className }: CheckboxProps): import("react").JSX.Element;
9
10
  export {};
@@ -1,5 +1,5 @@
1
1
  import { ReactNode } from 'react';
2
- type DropdownSize = 'sm' | 'base' | 'lg';
2
+ type DropdownSize = 'sm' | 'base';
3
3
  interface DropdownOption<T extends string> {
4
4
  value: T;
5
5
  label: ReactNode;
@@ -1,11 +1,12 @@
1
- import { ChangeEvent } from 'react';
1
+ import { ChangeEvent, ReactNode } from 'react';
2
2
  interface RadioButtonProps {
3
3
  checked: boolean;
4
4
  onChange: (e: ChangeEvent<HTMLInputElement>) => void;
5
5
  name?: string;
6
6
  value?: string;
7
+ label?: ReactNode;
7
8
  ariaLabel?: string;
8
9
  className?: string;
9
10
  }
10
- export declare function RadioButton({ checked, onChange, name, value, ariaLabel, className }: RadioButtonProps): import("react").JSX.Element;
11
+ export declare function RadioButton({ checked, onChange, name, value, label, ariaLabel, className, }: RadioButtonProps): import("react").JSX.Element;
11
12
  export {};
@@ -0,0 +1,13 @@
1
+ import { ChangeEvent, ReactNode } from 'react';
2
+ type SwitchSize = 'sm' | 'base';
3
+ interface SwitchProps {
4
+ checked: boolean;
5
+ onChange: (e: ChangeEvent<HTMLInputElement>) => void;
6
+ size?: SwitchSize;
7
+ label?: ReactNode;
8
+ ariaLabel?: string;
9
+ disabled?: boolean;
10
+ className?: string;
11
+ }
12
+ export declare function Switch({ checked, onChange, size, label, ariaLabel, disabled, className, }: SwitchProps): import("react").JSX.Element;
13
+ export {};
@@ -1,11 +1,13 @@
1
1
  import { InputHTMLAttributes, ReactNode } from 'react';
2
- type TextFieldSize = 'sm' | 'base' | 'lg';
2
+ type TextFieldSize = 'sm' | 'base';
3
+ type TextFieldVariant = 'default' | 'toolbar';
3
4
  interface TextFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size'> {
4
5
  label?: string;
5
6
  helperText?: string;
6
7
  error?: string;
7
8
  size?: TextFieldSize;
9
+ variant?: TextFieldVariant;
8
10
  leadingIcon?: ReactNode;
9
11
  }
10
- export declare function TextField({ label, helperText, error, size, leadingIcon, id, ...rest }: TextFieldProps): import("react").JSX.Element;
12
+ export declare function TextField({ label, helperText, error, size, variant, leadingIcon, id, ...rest }: TextFieldProps): import("react").JSX.Element;
11
13
  export {};
package/dist/index.css CHANGED
@@ -1,2 +1,2 @@
1
- ._primary_d59gi_1,._secondary_d59gi_2,._tertiary_d59gi_3,._dangerous_d59gi_4{isolation:isolate;letter-spacing:.01em;cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;font-family:inherit;font-weight:450;transition:color .2s,transform .2s ease-out;display:inline-flex;position:relative;overflow:hidden}._primary_d59gi_1:active:not(:disabled),._secondary_d59gi_2:active:not(:disabled),._tertiary_d59gi_3:active:not(:disabled),._dangerous_d59gi_4:active:not(:disabled){transform:scale(.95)}._sm_d59gi_28{border-radius:10px;padding:8px 12px;font-size:.8rem}._base_d59gi_33{border-radius:12px;padding:12px 16px;font-size:.9rem}._lg_d59gi_38{border-radius:14px;padding:16px 22px;font-size:1rem}._icon_d59gi_44{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}._icon_d59gi_44 svg{width:100%;height:100%}._iconOnly_d59gi_57{aspect-ratio:1;box-sizing:border-box}._iconOnly_d59gi_57._sm_d59gi_28{padding:8px}._iconOnly_d59gi_57._base_d59gi_33{padding:12px}._iconOnly_d59gi_57._lg_d59gi_38{padding:16px}._primary_d59gi_1:before,._secondary_d59gi_2:before,._tertiary_d59gi_3:before,._dangerous_d59gi_4:before{content:"";aspect-ratio:1;z-index:-1;pointer-events:none;border-radius:50%;width:24%;transition:transform .3s cubic-bezier(.39,.575,.565,1);position:absolute;bottom:0;left:50%;transform:translate(-50%,100%)scale(1)}._primary_d59gi_1:hover:before,._secondary_d59gi_2:hover:before,._tertiary_d59gi_3:hover:before,._dangerous_d59gi_4:hover:before{transform:translate(-50%,15%)scale(8)}._primary_d59gi_1{background:var(--brand-dark);color:#fff;letter-spacing:.02em;font-weight:400}._primary_d59gi_1:before{background:#ffffff14}._primary_d59gi_1:active:not(:disabled):before{background:#00000014}._secondary_d59gi_2{background:var(--surface-muted);color:var(--text-primary)}._secondary_d59gi_2 ._icon_d59gi_44{color:var(--text-secondary)}._secondary_d59gi_2:before{background:rgba(var(--brand-main-rgb), .08)}._secondary_d59gi_2:active:not(:disabled):before{background:rgba(var(--brand-main-rgb), .28)}._secondary_d59gi_2:hover ._icon_d59gi_44,._secondary_d59gi_2:hover{color:var(--brand-main)}._tertiary_d59gi_3{color:var(--text-secondary);background:0 0}._tertiary_d59gi_3:before{background:rgba(var(--brand-main-rgb), .16)}._tertiary_d59gi_3:active:not(:disabled):before{background:rgba(var(--brand-main-rgb), .28)}._tertiary_d59gi_3:hover,._tertiary_d59gi_3:active:not(:disabled){background:var(--bg)}._tertiary_d59gi_3:hover{color:var(--brand-main)}._dangerous_d59gi_4{background:var(--danger-bg);color:var(--danger-text-dark)}._dangerous_d59gi_4:before{background:rgba(var(--danger-rgb), .16)}._dangerous_d59gi_4:active:not(:disabled):before{background:rgba(var(--danger-rgb), .28)}._primary_d59gi_1:disabled,._secondary_d59gi_2:disabled,._tertiary_d59gi_3:disabled,._dangerous_d59gi_4:disabled{background:var(--disabled-bg);color:var(--disabled-text);cursor:not-allowed}._primary_d59gi_1:disabled:hover,._secondary_d59gi_2:disabled:hover,._tertiary_d59gi_3:disabled:hover,._dangerous_d59gi_4:disabled:hover{color:var(--disabled-text)}._primary_d59gi_1:disabled:before,._secondary_d59gi_2:disabled:before,._tertiary_d59gi_3:disabled:before,._dangerous_d59gi_4:disabled:before{display:none}._wrap_ewoh2_1{flex:0 0 220px;width:220px;position:relative}._wrap_ewoh2_1:hover{z-index:10}._fluid_ewoh2_9{flex:none;width:100%}._backing_ewoh2_14{background:var(--card-surface);height:10px;box-shadow:inset 0 0 0 1px var(--border);z-index:0;border-radius:0 0 14px 14px;position:absolute;bottom:-4px;left:6px;right:6px}._backing_ewoh2_14._completed_ewoh2_25{background:var(--success-bg);box-shadow:inset 0 0 0 1px #bfe3cc}._card_ewoh2_30{z-index:1;box-sizing:border-box;background:var(--card-surface);cursor:default;border-radius:16px;width:100%;padding:12px 14px;transition:box-shadow .2s;position:relative;box-shadow:inset 0 0 0 1px #efefef,0 1px 2px #1018200a}._card_ewoh2_30._interactive_ewoh2_44{cursor:pointer}._card_ewoh2_30._grabbable_ewoh2_47{cursor:grab}._card_ewoh2_30._grabbable_ewoh2_47:active{cursor:grabbing}._card_ewoh2_30._dragging_ewoh2_53,._card_ewoh2_30._dragging_ewoh2_53:hover{box-shadow:inset 0 0 0 1px #efefef,0 1px 2px #1018200a}._card_ewoh2_30._interactive_ewoh2_44:hover{box-shadow:inset 0 0 0 1px #efefef, 0 0 0 2px var(--brand-main)}._card_ewoh2_30._completed_ewoh2_25{background:var(--success-bg);box-shadow:inset 0 0 0 1px #bfe3cc,0 1px 2px #1018200a,0 2px 8px #1018200f}._neutral_c7c7e_1,._pill_c7c7e_2,._accent_c7c7e_3,._success_c7c7e_4,._danger_c7c7e_5,._count_c7c7e_6{white-space:nowrap;align-items:center;font-weight:500;display:inline-flex}._neutral_c7c7e_1{color:var(--text-tertiary);background:var(--bg);border-radius:6px;padding:2px 7px;font-size:.75rem}._pill_c7c7e_2{background:var(--card-surface);box-shadow:inset 0 0 0 1px var(--border);color:var(--text-tertiary);border-radius:999px;padding:3px 11px;font-size:.8rem}._accent_c7c7e_3{background:var(--brand-bg);color:var(--brand-dark);border-radius:999px;padding:3px 11px;font-size:.8rem}._success_c7c7e_4{background:var(--success-bg);color:var(--success-text);border-radius:999px;padding:3px 11px;font-size:.8rem}._danger_c7c7e_5{color:var(--danger-text);background:var(--danger-bg);border-radius:6px;padding:2px 7px;font-size:.75rem}._count_c7c7e_6{background:var(--brand-main);color:#fff;text-align:center;border-radius:999px;justify-content:center;min-width:16px;height:16px;padding:0 4px;font-size:.65rem;line-height:16px}._toolbar_1rsvo_1{background:var(--card-surface);box-shadow:inset 0 0 0 1px var(--border), 0 1px 2px #1018200a, 0 2px 8px #1018200f;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;padding:0 8px;display:flex}._searchWrap_1rsvo_14{flex:1;min-width:0;position:relative}._searchWrap_1rsvo_14:after{content:"";background:var(--brand-main);opacity:0;pointer-events:none;height:2px;position:absolute;bottom:0;left:36px;right:0}._searchWrap_1rsvo_14:focus-within:after{opacity:1}._searchIcon_1rsvo_33{width:16px;height:16px;color:var(--text-tertiary);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-53%)}._searchIcon_1rsvo_33 svg{width:100%;height:100%}._search_1rsvo_14{box-sizing:border-box;width:100%;color:var(--text-primary);box-shadow:inset -1px 0 0 var(--border);background:0 0;border:none;padding:16px 52px 16px 36px;font-family:inherit;font-size:1rem}._search_1rsvo_14:focus{outline:none}._searchShortcut_1rsvo_61{background:var(--bg);color:var(--text-tertiary);letter-spacing:.02em;pointer-events:none;border-radius:6px;justify-content:center;align-items:center;padding:2px 6px;font-size:.75rem;font-weight:600;display:flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}._controls_1rsvo_78{flex:none;align-items:center;display:flex}._checkbox_veqkz_1{cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:inline-flex;position:relative}._input_veqkz_11{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}._box_veqkz_18{background:var(--surface-sunken);width:16px;height:16px;box-shadow:inset 0 0 0 1px var(--border);border-radius:6px;justify-content:center;align-items:center;transition:background-color .2s cubic-bezier(0,0,.2,1),box-shadow .2s cubic-bezier(0,0,.2,1),transform .1s cubic-bezier(0,0,.2,1);display:flex}._input_veqkz_11:hover+._box_veqkz_18{box-shadow:inset 0 0 0 1px var(--brand-main)}._input_veqkz_11:focus-visible+._box_veqkz_18{outline:2px solid var(--brand-main);outline-offset:2px}._input_veqkz_11:active+._box_veqkz_18{transform:scale(.88)}._input_veqkz_11:checked+._box_veqkz_18{background:var(--brand-main);box-shadow:inset 0 0 0 1px var(--brand-main)}._icon_veqkz_46{width:10px;height:10px;overflow:visible}._icon_veqkz_46 polyline{fill:none;stroke:#fff;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22;stroke-dashoffset:22px;transition:stroke-dashoffset .2s cubic-bezier(.4,0,.2,1)}._input_veqkz_11:checked+._box_veqkz_18 ._icon_veqkz_46 polyline{stroke-dashoffset:0}._radio_7q2jv_1{cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:inline-flex;position:relative}._input_7q2jv_11{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}._circle_7q2jv_18{background:var(--surface-sunken);width:16px;height:16px;box-shadow:inset 0 0 0 1px var(--border);border-radius:50%;justify-content:center;align-items:center;transition:background-color .2s cubic-bezier(0,0,.2,1),box-shadow .2s cubic-bezier(0,0,.2,1),transform .1s cubic-bezier(0,0,.2,1);display:flex}._input_7q2jv_11:hover+._circle_7q2jv_18{box-shadow:inset 0 0 0 1px var(--brand-main)}._input_7q2jv_11:focus-visible+._circle_7q2jv_18{outline:2px solid var(--brand-main);outline-offset:2px}._input_7q2jv_11:active+._circle_7q2jv_18{transform:scale(.88)}._input_7q2jv_11:checked+._circle_7q2jv_18{background:var(--brand-main);box-shadow:inset 0 0 0 1px var(--brand-main)}._dot_7q2jv_46{background:#fff;border-radius:50%;width:6px;height:6px;transition:transform .2s cubic-bezier(.4,0,.2,1);transform:scale(0)}._input_7q2jv_11:checked+._circle_7q2jv_18 ._dot_7q2jv_46{transform:scale(1)}._field_133ye_1{flex-direction:column;gap:6px;display:flex}._label_133ye_6{color:var(--text-primary);padding-left:8px;font-size:.85rem;font-weight:550}._inputWrap_133ye_12{background:var(--card-surface);box-shadow:inset 0 0 0 1px var(--border-input);align-items:center;transition:box-shadow .2s ease-out;display:flex;position:relative}._inputWrap_133ye_12:focus-within{box-shadow:inset 0 0 0 0 var(--border-input), 0 0 0 2px var(--brand-main)}._errorWrap_133ye_25,._errorWrap_133ye_25:focus-within{box-shadow:inset 0 0 0 1px var(--danger-text)}._inputWrap_133ye_12:has(._input_133ye_12:disabled){background:var(--surface-muted)}._sm_133ye_33{border-radius:10px}._sm_133ye_33 ._input_133ye_12{padding:8px 12px;font-size:.8rem}._base_133ye_40{border-radius:12px}._base_133ye_40 ._input_133ye_12{padding:12px 14px;font-size:.9rem}._lg_133ye_47{border-radius:14px}._lg_133ye_47 ._input_133ye_12{padding:16px;font-size:1rem}._inputWrap_133ye_12:has(._icon_133ye_54) ._input_133ye_12{padding-left:8px}._icon_133ye_54{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;margin-left:12px;display:flex}._icon_133ye_54 svg{width:100%;height:100%}._input_133ye_12{box-sizing:border-box;min-width:0;color:var(--text-primary);background:0 0;border:none;flex:1;font-family:inherit;font-weight:450}._input_133ye_12:focus{outline:none}._input_133ye_12::placeholder{color:var(--text-tertiary)}._input_133ye_12:disabled{color:var(--disabled-text);cursor:not-allowed}._helperText_133ye_92{color:var(--text-tertiary);padding-left:8px;font-size:.78rem}._errorText_133ye_97{color:var(--danger-text);font-size:.78rem}._menu_471l2_1{box-sizing:border-box;background:var(--card-surface);width:fit-content;min-width:180px;box-shadow:inset 0 0 0 1px var(--border), 0 8px 24px #0000001f;border-radius:12px;flex-direction:column;gap:2px;padding:4px;display:flex}._divider_471l2_15{background:var(--border);height:1px;margin:4px 6px}._item_1j7n9_1{box-sizing:border-box;width:100%;color:var(--text-primary);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:8px 10px;font-family:inherit;font-size:.9rem;transition:background .15s ease-out,color .15s ease-out;display:flex}._item_1j7n9_1:hover:not(:disabled){background:var(--brand-bg);color:var(--brand-dark)}._item_1j7n9_1:hover:not(:disabled) ._icon_1j7n9_24,._item_1j7n9_1:hover:not(:disabled) ._check_1j7n9_25{color:var(--brand-dark)}._item_1j7n9_1:active:not(:disabled){background:var(--brand-main-20)}._item_1j7n9_1:focus-visible{outline:2px solid var(--brand-main);outline-offset:-2px}._item_1j7n9_1:disabled{color:var(--disabled-text);cursor:not-allowed}._icon_1j7n9_24{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;display:flex}._icon_1j7n9_24 svg{width:100%;height:100%}._label_1j7n9_52{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}._trailing_1j7n9_59{color:var(--text-tertiary);flex-shrink:0;font-size:.8rem}._selected_1j7n9_64{color:var(--text-primary);font-weight:550}._selected_1j7n9_64 ._icon_1j7n9_24{color:var(--text-primary)}._check_1j7n9_25{width:16px;height:16px;color:var(--text-primary);flex-shrink:0;justify-content:center;align-items:center;margin-left:8px;display:flex}._check_1j7n9_25 svg{width:100%;height:100%}._destructive_1j7n9_85,._destructive_1j7n9_85 ._icon_1j7n9_24{color:var(--danger-text)}._destructive_1j7n9_85:hover:not(:disabled){background:var(--danger-bg);color:var(--danger-text)}._destructive_1j7n9_85:hover:not(:disabled) ._icon_1j7n9_24{color:var(--danger-text)}._field_1bvdj_1{flex-direction:column;gap:6px;display:flex;position:relative}._label_1bvdj_7{color:var(--text-primary);padding-left:8px;font-size:.85rem;font-weight:550}._trigger_1bvdj_13{box-sizing:border-box;background:var(--card-surface);width:100%;box-shadow:inset 0 0 0 1px var(--border-input);color:var(--text-primary);cursor:pointer;border:none;align-items:center;font-family:inherit;transition:box-shadow .2s ease-out;display:flex}._trigger_1bvdj_13:focus-visible{box-shadow:inset 0 0 0 0 var(--border-input), 0 0 0 2px var(--brand-main)}._errorWrap_1bvdj_31{box-shadow:inset 0 0 0 1px var(--danger-text)}._trigger_1bvdj_13:disabled{background:var(--surface-muted);color:var(--disabled-text);cursor:not-allowed}._sm_1bvdj_40{border-radius:10px}._sm_1bvdj_40._trigger_1bvdj_13{padding:8px 12px;font-size:.8rem}._base_1bvdj_47{border-radius:12px}._base_1bvdj_47._trigger_1bvdj_13{padding:12px 14px;font-size:.9rem}._lg_1bvdj_54{border-radius:14px}._lg_1bvdj_54._trigger_1bvdj_13{padding:16px;font-size:1rem}._icon_1bvdj_62{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;margin-right:8px;display:flex}._icon_1bvdj_62 svg{width:100%;height:100%}._value_1bvdj_76{text-align:left;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}._placeholder_1bvdj_84{color:var(--text-tertiary)}._chevron_1bvdj_87{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;margin-left:8px;transition:transform .15s ease-out;display:flex}._chevron_1bvdj_87 svg{width:100%;height:100%}._chevronOpen_1bvdj_102{transform:rotate(180deg)}._menuWrap_1bvdj_106{z-index:10;position:absolute;top:calc(100% + 4px);left:0;right:0}._helperText_1bvdj_113{color:var(--text-tertiary);padding-left:8px;font-size:.78rem}._errorText_1bvdj_118{color:var(--danger-text);font-size:.78rem}._highlight_1anli_1{background:var(--brand-bg);color:var(--brand-dark);border-radius:3px;padding:0 1px}._group_51gk7_1{position:relative}._btn_51gk7_4{color:var(--text-primary);cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;gap:6px;padding:12px;font-family:inherit;font-size:1rem;transition:background .2s ease-out,box-shadow .2s ease-out,transform .2s ease-out;display:flex}._btn_51gk7_4:hover{background:#0a0a0b0a}._btn_51gk7_4:active{background:var(--brand-bg);transform:scale(.95);box-shadow:inset 0 2px 1px #008cd840}._caret_51gk7_29{color:var(--text-tertiary);align-items:center;display:flex}._caret_51gk7_29 svg{width:14px;height:14px}._label_51gk7_38{color:var(--text-secondary)}._badge_51gk7_41{background:var(--brand-main,#0a84d8);color:#fff;text-align:center;border-radius:999px;min-width:16px;height:16px;padding:0 4px;font-size:.65rem;font-weight:600;line-height:16px;position:absolute;top:2px;right:2px}._value_51gk7_56{color:var(--text-primary);font-weight:500}._panel_51gk7_60{width:fit-content;min-width:220px;max-height:280px;box-shadow:inset 0 0 0 1px var(--border), 0 8px 24px #0000001f;z-index:50;background:#fff;border-radius:12px;display:none;position:absolute;top:calc(100% + 6px);left:0;overflow-y:auto}._panel_51gk7_60._open_51gk7_76{display:block}._panelRight_51gk7_79{left:auto;right:0}._panelWide_51gk7_83{min-width:260px;padding-bottom:4px}._sectionHeader_51gk7_87{justify-content:space-between;align-items:center;gap:8px;padding:12px 14px 4px;display:flex}._sectionLabel_51gk7_94{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.02em;font-size:.75rem;font-weight:600}._allToggle_51gk7_101{color:var(--brand-main,#0a84d8);cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:.75rem;font-weight:600}._allToggle_51gk7_101:hover{text-decoration:underline}._divider_51gk7_114{background:var(--border);height:1px;margin:4px 0}._option_51gk7_119{cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:8px;font-size:1rem;display:flex}._option_51gk7_119:hover{background:var(--bg)}._search_51gk7_131{box-sizing:border-box;width:calc(100% - 16px);box-shadow:inset 0 0 0 1px var(--border-input);border:none;border-radius:8px;margin:8px 8px 0;padding:8px 12px;font-family:inherit;font-size:1rem}._search_51gk7_131:focus{box-shadow:inset 0 0 0 1px var(--brand-main);outline:none}._optionsList_51gk7_147{padding:4px}._empty_51gk7_150{color:var(--text-tertiary);padding:7px 8px;font-size:.85rem}._sidebar_1fx39_1{background:var(--surface-sunken);box-sizing:border-box;border-radius:16px 16px 0 0;flex-direction:column;flex:0 0 256px;gap:4px;width:256px;padding:24px 16px 24px 24px;display:flex;overflow-y:auto;box-shadow:1px 0 #0a0a0b08,0 -1px #0a0a0b0d}._title_1fx39_16{letter-spacing:-.01em;margin:0 0 16px 8px;font-size:1.15rem;font-weight:500}._navLink_1fx39_22{color:var(--text-secondary);border-radius:8px;justify-content:space-between;align-items:center;gap:8px;padding:8px;font-size:.9rem;font-weight:500;text-decoration:none;display:flex}._navLink_1fx39_22:hover{background:var(--card-surface);color:var(--text-primary)}._count_1fx39_38{color:var(--text-tertiary);font-size:.78rem;font-weight:500}._line_gfgon_1,._box_gfgon_2{align-items:center;gap:4px;display:inline-flex;position:relative}._indicator_gfgon_9{pointer-events:none;transition:translate .25s cubic-bezier(.39,.575,.565,1),width .25s,scale .125s cubic-bezier(.39,.575,.565,1);position:absolute;left:0}._indicator_gfgon_9._settling_gfgon_17{transition:scale .1s linear}._indicatorLine_gfgon_21{background:var(--brand-main);height:2px;bottom:0}._indicatorBox_gfgon_27{background:var(--card-surface);box-shadow:0 0 1px .5px var(--border);border-radius:8px;top:4px;bottom:4px}._tab_gfgon_35{isolation:isolate;cursor:pointer;white-space:nowrap;border:none;border-radius:8px 8px 0 0;align-items:center;gap:6px;font-family:inherit;font-weight:450;transition:color .15s ease-out,background .15s ease-out,box-shadow .15s ease-out;display:inline-flex;position:relative;overflow:hidden}._tab_gfgon_35:before{content:"";aspect-ratio:1;z-index:-1;pointer-events:none;background:rgba(var(--brand-main-rgb), .08);border-radius:50%;width:40%;transition:transform .3s cubic-bezier(.39,.575,.565,1);position:absolute;bottom:0;left:50%;transform:translate(-50%,100%)scale(1)}._tab_gfgon_35:hover:not(:disabled):before{transform:translate(-50%,15%)scale(4)}._tab_gfgon_35:active:not(:disabled):before{background:rgba(var(--brand-main-rgb), .28)}._tab_gfgon_35:disabled{color:var(--disabled-text);cursor:not-allowed}._tab_gfgon_35:disabled:before,._tab_gfgon_35._selected_gfgon_80:hover:before{display:none}._tab_gfgon_35:focus-visible{outline:2px solid var(--brand-main);outline-offset:2px}._icon_gfgon_89{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}._icon_gfgon_89 svg{width:100%;height:100%}._line_gfgon_1{box-shadow:inset 0 -1px 0 0 var(--border)}._line_gfgon_1 ._tab_gfgon_35{color:var(--text-secondary);background:0 0;padding:12px 6px;font-size:1rem}._line_gfgon_1 ._tab_gfgon_35:hover:not(:disabled){color:var(--brand-main)}._line_gfgon_1 ._tab_gfgon_35._selected_gfgon_80{color:var(--text-primary);font-weight:550}._box_gfgon_2{background:#1018200a;border-radius:10px;gap:4px;padding:4px;box-shadow:inset 0 0 .5px 1px #e3e3e3}._box_gfgon_2 ._tab_gfgon_35{color:var(--text-secondary);background:0 0;border-radius:8px;padding:8px 14px;font-size:.9rem}._box_gfgon_2 ._tab_gfgon_35:hover:not(:disabled){color:var(--brand-main)}._box_gfgon_2 ._tab_gfgon_35._selected_gfgon_80{color:var(--text-primary);font-weight:550}._box_gfgon_2._sm_gfgon_148 ._tab_gfgon_35{border-radius:8px;padding:4px 14px}:root{--brand-main:#0090d9;--brand-dark:#007ebd;--brand-bg:#e0f5ff;--brand-main-rgb:0, 144, 217;--brand-main-5:rgba(var(--brand-main-rgb), .05);--brand-main-10:rgba(var(--brand-main-rgb), .1);--brand-main-20:rgba(var(--brand-main-rgb), .2);--brand-main-30:rgba(var(--brand-main-rgb), .3);--brand-main-50:rgba(var(--brand-main-rgb), .5);--brand-main-75:rgba(var(--brand-main-rgb), .75);--text-primary:#090b0b;--text-secondary:#5c5f61;--text-tertiary:#666e73;--bg:#f7f7f7;--card-surface:#fff;--surface-sunken:#f8f9fa;--surface-muted:#e5e7e9;--border:#e0e0e0;--border-input:#e0e0e0;--danger-bg:#fdeaea;--danger-text:#d92d20;--danger-text-dark:#b91c1c;--danger-rgb:217, 45, 32;--success-bg:#e3f6ea;--success-text:#2f8a52;--warning-text:#9a6400;--disabled-bg:#c4c4c4;--disabled-text:#8a8a8a;--font-family-base:"Inter", sans-serif;--font-size-sm:.75rem;--font-size-base:.875rem;--font-size-lg:1rem;--font-weight-regular:400;--font-weight-bold:500;--line-height-base:1.5;--line-height-tight:1.25}.text-base{font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weight-regular);line-height:var(--line-height-base)}.text-bold{font-weight:var(--font-weight-bold)}.text-sm{font-size:var(--font-size-sm)}.text-lg{font-size:var(--font-size-lg)}.text-2-line{line-height:var(--line-height-tight)}
1
+ ._primary_7m8el_1,._secondary_7m8el_2,._tertiary_7m8el_3,._dangerous_7m8el_4{isolation:isolate;letter-spacing:.01em;cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;font-family:inherit;font-weight:450;transition:color .2s,transform .2s ease-out;display:inline-flex;position:relative;overflow:hidden}._primary_7m8el_1:active:not(:disabled),._secondary_7m8el_2:active:not(:disabled),._tertiary_7m8el_3:active:not(:disabled),._dangerous_7m8el_4:active:not(:disabled){transform:scale(.95)}._sm_7m8el_28{height:var(--control-height-sm);border-radius:var(--radius-sm);padding:0 12px;font-size:.9rem}._base_7m8el_34{height:var(--control-height-base);border-radius:var(--radius-base);padding:0 16px;font-size:.9rem}._icon_7m8el_40{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}._icon_7m8el_40 svg{width:100%;height:100%}._iconOnly_7m8el_53{box-sizing:border-box;padding:0}._iconOnly_7m8el_53._sm_7m8el_28{width:var(--control-height-sm)}._iconOnly_7m8el_53._base_7m8el_34{width:var(--control-height-base)}._primary_7m8el_1:before,._secondary_7m8el_2:before,._tertiary_7m8el_3:before,._dangerous_7m8el_4:before{content:"";aspect-ratio:1;z-index:-1;pointer-events:none;border-radius:50%;width:24%;transition:transform .3s cubic-bezier(.39,.575,.565,1);position:absolute;bottom:0;left:50%;transform:translate(-50%,100%)scale(1)}._primary_7m8el_1:hover:before,._secondary_7m8el_2:hover:before,._tertiary_7m8el_3:hover:before,._dangerous_7m8el_4:hover:before{transform:translate(-50%,15%)scale(8)}._primary_7m8el_1{background:var(--brand-dark);color:#fff;letter-spacing:.02em;font-weight:400}._primary_7m8el_1:before{background:#ffffff14}._primary_7m8el_1:active:not(:disabled):before{background:#00000014}._secondary_7m8el_2{background:var(--surface-muted);color:var(--text-primary)}._secondary_7m8el_2 ._icon_7m8el_40{color:var(--text-secondary)}._secondary_7m8el_2:before{background:rgba(var(--brand-main-rgb), .08)}._secondary_7m8el_2:active:not(:disabled):before{background:rgba(var(--brand-main-rgb), .28)}._secondary_7m8el_2:hover ._icon_7m8el_40,._secondary_7m8el_2:hover{color:var(--brand-main)}._tertiary_7m8el_3{color:var(--text-secondary);background:0 0}._tertiary_7m8el_3:before{background:rgba(var(--brand-main-rgb), .16)}._tertiary_7m8el_3:active:not(:disabled):before{background:rgba(var(--brand-main-rgb), .28)}._tertiary_7m8el_3:hover,._tertiary_7m8el_3:active:not(:disabled){background:var(--bg)}._tertiary_7m8el_3:hover{color:var(--brand-main)}._dangerous_7m8el_4{background:var(--danger-bg);color:var(--danger-text-dark)}._dangerous_7m8el_4:before{background:rgba(var(--danger-rgb), .16)}._dangerous_7m8el_4:active:not(:disabled):before{background:rgba(var(--danger-rgb), .28)}._primary_7m8el_1:disabled,._secondary_7m8el_2:disabled,._tertiary_7m8el_3:disabled,._dangerous_7m8el_4:disabled{background:var(--disabled-bg);color:var(--disabled-text);cursor:not-allowed}._primary_7m8el_1:disabled:hover,._secondary_7m8el_2:disabled:hover,._tertiary_7m8el_3:disabled:hover,._dangerous_7m8el_4:disabled:hover{color:var(--disabled-text)}._primary_7m8el_1:disabled:before,._secondary_7m8el_2:disabled:before,._tertiary_7m8el_3:disabled:before,._dangerous_7m8el_4:disabled:before{display:none}._wrap_ewoh2_1{flex:0 0 220px;width:220px;position:relative}._wrap_ewoh2_1:hover{z-index:10}._fluid_ewoh2_9{flex:none;width:100%}._backing_ewoh2_14{background:var(--card-surface);height:10px;box-shadow:inset 0 0 0 1px var(--border);z-index:0;border-radius:0 0 14px 14px;position:absolute;bottom:-4px;left:6px;right:6px}._backing_ewoh2_14._completed_ewoh2_25{background:var(--success-bg);box-shadow:inset 0 0 0 1px #bfe3cc}._card_ewoh2_30{z-index:1;box-sizing:border-box;background:var(--card-surface);cursor:default;border-radius:16px;width:100%;padding:12px 14px;transition:box-shadow .2s;position:relative;box-shadow:inset 0 0 0 1px #efefef,0 1px 2px #1018200a}._card_ewoh2_30._interactive_ewoh2_44{cursor:pointer}._card_ewoh2_30._grabbable_ewoh2_47{cursor:grab}._card_ewoh2_30._grabbable_ewoh2_47:active{cursor:grabbing}._card_ewoh2_30._dragging_ewoh2_53,._card_ewoh2_30._dragging_ewoh2_53:hover{box-shadow:inset 0 0 0 1px #efefef,0 1px 2px #1018200a}._card_ewoh2_30._interactive_ewoh2_44:hover{box-shadow:inset 0 0 0 1px #efefef, 0 0 0 2px var(--brand-main)}._card_ewoh2_30._completed_ewoh2_25{background:var(--success-bg);box-shadow:inset 0 0 0 1px #bfe3cc,0 1px 2px #1018200a,0 2px 8px #1018200f}._neutral_c7c7e_1,._pill_c7c7e_2,._accent_c7c7e_3,._success_c7c7e_4,._danger_c7c7e_5,._count_c7c7e_6{white-space:nowrap;align-items:center;font-weight:500;display:inline-flex}._neutral_c7c7e_1{color:var(--text-tertiary);background:var(--bg);border-radius:6px;padding:2px 7px;font-size:.75rem}._pill_c7c7e_2{background:var(--card-surface);box-shadow:inset 0 0 0 1px var(--border);color:var(--text-tertiary);border-radius:999px;padding:3px 11px;font-size:.8rem}._accent_c7c7e_3{background:var(--brand-bg);color:var(--brand-dark);border-radius:999px;padding:3px 11px;font-size:.8rem}._success_c7c7e_4{background:var(--success-bg);color:var(--success-text);border-radius:999px;padding:3px 11px;font-size:.8rem}._danger_c7c7e_5{color:var(--danger-text);background:var(--danger-bg);border-radius:6px;padding:2px 7px;font-size:.75rem}._count_c7c7e_6{background:var(--brand-main);color:#fff;text-align:center;border-radius:999px;justify-content:center;min-width:16px;height:16px;padding:0 4px;font-size:.65rem;line-height:16px}._toolbar_1rsvo_1{background:var(--card-surface);box-shadow:inset 0 0 0 1px var(--border), 0 1px 2px #1018200a, 0 2px 8px #1018200f;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;padding:0 8px;display:flex}._searchWrap_1rsvo_14{flex:1;min-width:0;position:relative}._searchWrap_1rsvo_14:after{content:"";background:var(--brand-main);opacity:0;pointer-events:none;height:2px;position:absolute;bottom:0;left:36px;right:0}._searchWrap_1rsvo_14:focus-within:after{opacity:1}._searchIcon_1rsvo_33{width:16px;height:16px;color:var(--text-tertiary);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-53%)}._searchIcon_1rsvo_33 svg{width:100%;height:100%}._search_1rsvo_14{box-sizing:border-box;width:100%;color:var(--text-primary);box-shadow:inset -1px 0 0 var(--border);background:0 0;border:none;padding:16px 52px 16px 36px;font-family:inherit;font-size:1rem}._search_1rsvo_14:focus{outline:none}._searchShortcut_1rsvo_61{background:var(--bg);color:var(--text-tertiary);letter-spacing:.02em;pointer-events:none;border-radius:6px;justify-content:center;align-items:center;padding:2px 6px;font-size:.75rem;font-weight:600;display:flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}._controls_1rsvo_78{flex:none;align-items:center;display:flex}._checkbox_1lh2s_1{cursor:pointer;align-items:center;gap:8px;display:inline-flex}._control_1lh2s_7{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:inline-flex;position:relative}._labelText_1lh2s_16{color:var(--text-primary);font-size:.85rem;transition:color .2s ease-out}._checkbox_1lh2s_1:hover ._labelText_1lh2s_16{color:var(--brand-main)}._input_1lh2s_24{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}._box_1lh2s_31{background:var(--surface-sunken);width:16px;height:16px;box-shadow:inset 0 0 0 1px var(--border);border-radius:6px;justify-content:center;align-items:center;transition:background-color .2s cubic-bezier(0,0,.2,1),box-shadow .2s cubic-bezier(0,0,.2,1),transform .1s cubic-bezier(0,0,.2,1);display:flex}._checkbox_1lh2s_1:hover ._box_1lh2s_31{box-shadow:0 0 0 1px var(--brand-main)}._input_1lh2s_24:focus-visible+._box_1lh2s_31{outline:2px solid var(--brand-main);outline-offset:2px}._input_1lh2s_24:active+._box_1lh2s_31{transform:scale(.88)}._input_1lh2s_24:checked+._box_1lh2s_31{background:var(--brand-main);box-shadow:inset 0 0 0 1px var(--brand-main)}._checkbox_1lh2s_1:hover ._input_1lh2s_24:checked+._box_1lh2s_31{box-shadow:0 0 0 1px var(--brand-main)}._icon_1lh2s_62{width:10px;height:10px;overflow:visible}._icon_1lh2s_62 polyline{fill:none;stroke:#fff;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22;stroke-dashoffset:22px;transition:stroke-dashoffset .2s cubic-bezier(.4,0,.2,1)}._input_1lh2s_24:checked+._box_1lh2s_31 ._icon_1lh2s_62 polyline{stroke-dashoffset:0}._radio_su0wb_1{cursor:pointer;align-items:center;gap:8px;display:inline-flex}._control_su0wb_7{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:inline-flex;position:relative}._labelText_su0wb_16{color:var(--text-primary);font-size:.85rem;transition:color .2s ease-out}._radio_su0wb_1:hover ._labelText_su0wb_16{color:var(--brand-main)}._input_su0wb_24{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}._circle_su0wb_31{background:var(--surface-sunken);width:16px;height:16px;box-shadow:inset 0 0 0 1px var(--border);border-radius:50%;justify-content:center;align-items:center;transition:background-color .2s cubic-bezier(0,0,.2,1),box-shadow .2s cubic-bezier(0,0,.2,1),transform .1s cubic-bezier(0,0,.2,1);display:flex}._radio_su0wb_1:hover ._circle_su0wb_31{box-shadow:0 0 0 1px var(--brand-main)}._input_su0wb_24:focus-visible+._circle_su0wb_31{outline:2px solid var(--brand-main);outline-offset:2px}._input_su0wb_24:active+._circle_su0wb_31{transform:scale(.88)}._input_su0wb_24:checked+._circle_su0wb_31{background:var(--brand-main);box-shadow:inset 0 0 0 1px var(--brand-main)}._radio_su0wb_1:hover ._input_su0wb_24:checked+._circle_su0wb_31{box-shadow:0 0 0 1px var(--brand-main)}._dot_su0wb_62{background:#fff;border-radius:50%;width:6px;height:6px;transition:transform .2s cubic-bezier(.4,0,.2,1);transform:scale(0)}._input_su0wb_24:checked+._circle_su0wb_31 ._dot_su0wb_62{transform:scale(1)}._switch_5ouaa_1{cursor:pointer;align-items:center;gap:8px;display:inline-flex}._switch_5ouaa_1:has(._input_5ouaa_7:disabled){cursor:not-allowed}._control_5ouaa_10{flex-shrink:0;align-items:center;display:inline-flex;position:relative}._input_5ouaa_7{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}._input_5ouaa_7:disabled{cursor:not-allowed}._track_5ouaa_26{background:var(--surface-sunken);width:100%;height:100%;box-shadow:inset 0 0 0 1px var(--border);border-radius:999px;transition:background-color .2s cubic-bezier(0,0,.2,1),box-shadow .2s cubic-bezier(0,0,.2,1);position:relative}._switch_5ouaa_1:hover ._track_5ouaa_26{box-shadow:inset 0 0 0 1px var(--brand-main)}._input_5ouaa_7:focus-visible+._track_5ouaa_26{outline:2px solid var(--brand-main);outline-offset:2px}._input_5ouaa_7:checked+._track_5ouaa_26{background:var(--brand-main);box-shadow:inset 0 0 0 1px var(--brand-main)}._input_5ouaa_7:disabled+._track_5ouaa_26{background:var(--surface-muted);box-shadow:inset 0 0 0 1px var(--border)}._thumb_5ouaa_52{background:#fff;border-radius:50%;transition:transform .2s cubic-bezier(.4,0,.2,1);position:absolute;top:50%;left:2px;transform:translateY(-50%)}._input_5ouaa_7:checked+._track_5ouaa_26 ._thumb_5ouaa_52{transform:translateY(-50%) translateX(var(--switch-thumb-travel))}._sm_5ouaa_65{--switch-thumb-travel:14px;width:32px;height:18px}._sm_5ouaa_65 ._thumb_5ouaa_52{width:14px;height:14px}._base_5ouaa_74{--switch-thumb-travel:18px;width:40px;height:22px}._base_5ouaa_74 ._thumb_5ouaa_52{width:18px;height:18px}._labelText_5ouaa_84{color:var(--text-primary);font-size:.85rem;transition:color .2s ease-out}._switch_5ouaa_1:hover ._labelText_5ouaa_84{color:var(--brand-main)}._switch_5ouaa_1:has(._input_5ouaa_7:disabled) ._labelText_5ouaa_84{color:var(--disabled-text)}._field_16sx7_1{flex-direction:column;gap:6px;display:flex}._label_16sx7_6{color:var(--text-primary);padding-left:8px;font-size:.85rem;font-weight:550}._inputWrap_16sx7_12{background:var(--card-surface);box-shadow:inset 0 0 0 1px var(--border-input);align-items:center;transition:box-shadow .2s ease-out;display:flex;position:relative}._inputWrap_16sx7_12:focus-within{box-shadow:inset 0 0 0 0 var(--border-input), 0 0 0 2px var(--brand-main)}._errorWrap_16sx7_25,._errorWrap_16sx7_25:focus-within{box-shadow:inset 0 0 0 1px var(--danger-text)}._inputWrap_16sx7_12:has(._input_16sx7_12:disabled){background:var(--surface-muted)}._toolbar_16sx7_33{box-shadow:none;background:0 0}._toolbar_16sx7_33:after{content:"";background:var(--brand-main);opacity:0;height:2px;transition:opacity .2s ease-out;position:absolute;bottom:0;left:0;right:0}._toolbar_16sx7_33:focus-within{box-shadow:none}._toolbar_16sx7_33:focus-within:after{opacity:1}._toolbar_16sx7_33._errorWrap_16sx7_25,._toolbar_16sx7_33._errorWrap_16sx7_25:focus-within{box-shadow:none}._toolbar_16sx7_33._errorWrap_16sx7_25:after{background:var(--danger-text);opacity:1}._sm_16sx7_63{height:var(--control-height-sm);border-radius:var(--radius-sm)}._sm_16sx7_63 ._input_16sx7_12{padding:0 12px;font-size:.9rem}._base_16sx7_71{height:var(--control-height-base);border-radius:var(--radius-base)}._base_16sx7_71 ._input_16sx7_12{padding:0 14px;font-size:.9rem}._inputWrap_16sx7_12:has(._icon_16sx7_79) ._input_16sx7_12{padding-left:8px}._icon_16sx7_79{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;margin-left:12px;display:flex}._icon_16sx7_79 svg{width:100%;height:100%}._input_16sx7_12{box-sizing:border-box;min-width:0;color:var(--text-primary);background:0 0;border:none;flex:1;font-family:inherit;font-weight:450}._input_16sx7_12:focus{outline:none}._input_16sx7_12::placeholder{color:var(--text-tertiary)}._input_16sx7_12:disabled{color:var(--disabled-text);cursor:not-allowed}._helperText_16sx7_117{color:var(--text-tertiary);padding-left:8px;font-size:.78rem}._errorText_16sx7_122{color:var(--danger-text);font-size:.78rem}._menu_471l2_1{box-sizing:border-box;background:var(--card-surface);width:fit-content;min-width:180px;box-shadow:inset 0 0 0 1px var(--border), 0 8px 24px #0000001f;border-radius:12px;flex-direction:column;gap:2px;padding:4px;display:flex}._divider_471l2_15{background:var(--border);height:1px;margin:4px 6px}._item_1j7n9_1{box-sizing:border-box;width:100%;color:var(--text-primary);text-align:left;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:8px;padding:8px 10px;font-family:inherit;font-size:.9rem;transition:background .15s ease-out,color .15s ease-out;display:flex}._item_1j7n9_1:hover:not(:disabled){background:var(--brand-bg);color:var(--brand-dark)}._item_1j7n9_1:hover:not(:disabled) ._icon_1j7n9_24,._item_1j7n9_1:hover:not(:disabled) ._check_1j7n9_25{color:var(--brand-dark)}._item_1j7n9_1:active:not(:disabled){background:var(--brand-main-20)}._item_1j7n9_1:focus-visible{outline:2px solid var(--brand-main);outline-offset:-2px}._item_1j7n9_1:disabled{color:var(--disabled-text);cursor:not-allowed}._icon_1j7n9_24{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;display:flex}._icon_1j7n9_24 svg{width:100%;height:100%}._label_1j7n9_52{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}._trailing_1j7n9_59{color:var(--text-tertiary);flex-shrink:0;font-size:.8rem}._selected_1j7n9_64{color:var(--text-primary);font-weight:550}._selected_1j7n9_64 ._icon_1j7n9_24{color:var(--text-primary)}._check_1j7n9_25{width:16px;height:16px;color:var(--text-primary);flex-shrink:0;justify-content:center;align-items:center;margin-left:8px;display:flex}._check_1j7n9_25 svg{width:100%;height:100%}._destructive_1j7n9_85,._destructive_1j7n9_85 ._icon_1j7n9_24{color:var(--danger-text)}._destructive_1j7n9_85:hover:not(:disabled){background:var(--danger-bg);color:var(--danger-text)}._destructive_1j7n9_85:hover:not(:disabled) ._icon_1j7n9_24{color:var(--danger-text)}._field_333d5_1{flex-direction:column;gap:6px;display:flex;position:relative}._label_333d5_7{color:var(--text-primary);padding-left:8px;font-size:.85rem;font-weight:550}._trigger_333d5_13{box-sizing:border-box;background:var(--card-surface);width:100%;box-shadow:inset 0 0 0 1px var(--border-input);color:var(--text-primary);cursor:pointer;border:none;align-items:center;font-family:inherit;transition:box-shadow .2s ease-out;display:flex}._trigger_333d5_13:focus-visible{box-shadow:inset 0 0 0 0 var(--border-input), 0 0 0 2px var(--brand-main)}._errorWrap_333d5_31{box-shadow:inset 0 0 0 1px var(--danger-text)}._trigger_333d5_13:disabled{background:var(--surface-muted);color:var(--disabled-text);cursor:not-allowed}._sm_333d5_40{border-radius:var(--radius-sm)}._sm_333d5_40._trigger_333d5_13{height:var(--control-height-sm);padding:0 12px;font-size:.9rem}._base_333d5_48{border-radius:var(--radius-base)}._base_333d5_48._trigger_333d5_13{height:var(--control-height-base);padding:0 14px;font-size:.9rem}._icon_333d5_57{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;margin-right:8px;display:flex}._icon_333d5_57 svg{width:100%;height:100%}._value_333d5_71{text-align:left;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}._placeholder_333d5_79{color:var(--text-tertiary)}._chevron_333d5_82{width:16px;height:16px;color:var(--text-tertiary);flex-shrink:0;justify-content:center;align-items:center;margin-left:8px;transition:transform .15s ease-out;display:flex}._chevron_333d5_82 svg{width:100%;height:100%}._chevronOpen_333d5_97{transform:rotate(180deg)}._menuWrap_333d5_101{z-index:10;position:absolute;top:calc(100% + 4px);left:0;right:0}._helperText_333d5_108{color:var(--text-tertiary);padding-left:8px;font-size:.78rem}._errorText_333d5_113{color:var(--danger-text);font-size:.78rem}._highlight_1anli_1{background:var(--brand-bg);color:var(--brand-dark);border-radius:3px;padding:0 1px}._group_51gk7_1{position:relative}._btn_51gk7_4{color:var(--text-primary);cursor:pointer;background:0 0;border:none;border-radius:12px;align-items:center;gap:6px;padding:12px;font-family:inherit;font-size:1rem;transition:background .2s ease-out,box-shadow .2s ease-out,transform .2s ease-out;display:flex}._btn_51gk7_4:hover{background:#0a0a0b0a}._btn_51gk7_4:active{background:var(--brand-bg);transform:scale(.95);box-shadow:inset 0 2px 1px #008cd840}._caret_51gk7_29{color:var(--text-tertiary);align-items:center;display:flex}._caret_51gk7_29 svg{width:14px;height:14px}._label_51gk7_38{color:var(--text-secondary)}._badge_51gk7_41{background:var(--brand-main,#0a84d8);color:#fff;text-align:center;border-radius:999px;min-width:16px;height:16px;padding:0 4px;font-size:.65rem;font-weight:600;line-height:16px;position:absolute;top:2px;right:2px}._value_51gk7_56{color:var(--text-primary);font-weight:500}._panel_51gk7_60{width:fit-content;min-width:220px;max-height:280px;box-shadow:inset 0 0 0 1px var(--border), 0 8px 24px #0000001f;z-index:50;background:#fff;border-radius:12px;display:none;position:absolute;top:calc(100% + 6px);left:0;overflow-y:auto}._panel_51gk7_60._open_51gk7_76{display:block}._panelRight_51gk7_79{left:auto;right:0}._panelWide_51gk7_83{min-width:260px;padding-bottom:4px}._sectionHeader_51gk7_87{justify-content:space-between;align-items:center;gap:8px;padding:12px 14px 4px;display:flex}._sectionLabel_51gk7_94{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.02em;font-size:.75rem;font-weight:600}._allToggle_51gk7_101{color:var(--brand-main,#0a84d8);cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:.75rem;font-weight:600}._allToggle_51gk7_101:hover{text-decoration:underline}._divider_51gk7_114{background:var(--border);height:1px;margin:4px 0}._option_51gk7_119{cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:8px;font-size:1rem;display:flex}._option_51gk7_119:hover{background:var(--bg)}._search_51gk7_131{box-sizing:border-box;width:calc(100% - 16px);box-shadow:inset 0 0 0 1px var(--border-input);border:none;border-radius:8px;margin:8px 8px 0;padding:8px 12px;font-family:inherit;font-size:1rem}._search_51gk7_131:focus{box-shadow:inset 0 0 0 1px var(--brand-main);outline:none}._optionsList_51gk7_147{padding:4px}._empty_51gk7_150{color:var(--text-tertiary);padding:7px 8px;font-size:.85rem}._line_lhe96_1,._box_lhe96_2{align-items:center;gap:4px;display:inline-flex;position:relative}._indicator_lhe96_9{pointer-events:none;transition:translate .25s cubic-bezier(.39,.575,.565,1),width .25s,scale .125s cubic-bezier(.39,.575,.565,1);position:absolute;left:0}._indicator_lhe96_9._settling_lhe96_17{transition:scale .1s linear}._indicatorLine_lhe96_21{background:var(--brand-main);height:2px;bottom:0}._indicatorBox_lhe96_27{background:var(--card-surface);box-shadow:0 0 1px .5px var(--border);border-radius:8px;top:4px;bottom:4px}._tab_lhe96_35{isolation:isolate;cursor:pointer;white-space:nowrap;border:none;border-radius:8px 8px 0 0;align-items:center;gap:6px;font-family:inherit;font-weight:450;transition:color .15s ease-out,background .15s ease-out,box-shadow .15s ease-out;display:inline-flex;position:relative;overflow:hidden}._tab_lhe96_35:before{content:"";aspect-ratio:1;z-index:-1;pointer-events:none;background:rgba(var(--brand-main-rgb), .08);border-radius:50%;width:40%;transition:transform .3s cubic-bezier(.39,.575,.565,1);position:absolute;bottom:0;left:50%;transform:translate(-50%,100%)scale(1)}._tab_lhe96_35:hover:not(:disabled):before{transform:translate(-50%,15%)scale(4)}._tab_lhe96_35:active:not(:disabled):before{background:rgba(var(--brand-main-rgb), .28)}._tab_lhe96_35:disabled{color:var(--disabled-text);cursor:not-allowed}._tab_lhe96_35:disabled:before,._tab_lhe96_35._selected_lhe96_80:hover:before{display:none}._tab_lhe96_35:focus-visible{outline:2px solid var(--brand-main);outline-offset:2px}._icon_lhe96_89{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}._icon_lhe96_89 svg{width:100%;height:100%}._line_lhe96_1{box-shadow:inset 0 -1px 0 0 var(--border)}._line_lhe96_1 ._tab_lhe96_35{color:var(--text-secondary);background:0 0;padding:12px 6px;font-size:1rem}._line_lhe96_1 ._tab_lhe96_35:hover:not(:disabled){color:var(--brand-main)}._line_lhe96_1 ._tab_lhe96_35._selected_lhe96_80{color:var(--text-primary);font-weight:550}._box_lhe96_2{border-radius:var(--radius-base);background:#1018200a;gap:4px;padding:4px;box-shadow:inset 0 0 .5px 1px #e3e3e3}._box_lhe96_2 ._tab_lhe96_35{color:var(--text-secondary);background:0 0;border-radius:8px;padding:8px 14px;font-size:.9rem}._box_lhe96_2 ._tab_lhe96_35:hover:not(:disabled){color:var(--brand-main)}._box_lhe96_2 ._tab_lhe96_35._selected_lhe96_80{color:var(--text-primary);font-weight:550}._box_lhe96_2._sm_lhe96_148{border-radius:var(--radius-sm)}._box_lhe96_2._sm_lhe96_148 ._tab_lhe96_35{border-radius:6px;padding:4px 14px}._box_lhe96_2._sm_lhe96_148 ._indicatorBox_lhe96_27{border-radius:6px}:root{--brand-main:#0090d9;--brand-dark:#007ebd;--brand-bg:#e0f5ff;--brand-main-rgb:0, 144, 217;--brand-main-5:rgba(var(--brand-main-rgb), .05);--brand-main-10:rgba(var(--brand-main-rgb), .1);--brand-main-20:rgba(var(--brand-main-rgb), .2);--brand-main-30:rgba(var(--brand-main-rgb), .3);--brand-main-50:rgba(var(--brand-main-rgb), .5);--brand-main-75:rgba(var(--brand-main-rgb), .75);--text-primary:#090b0b;--text-secondary:#5c5f61;--text-tertiary:#666e73;--bg:#f7f7f7;--card-surface:#fff;--surface-sunken:#f8f9fa;--surface-muted:#e5e7e9;--border:#e0e0e0;--border-input:#e0e0e0;--danger-bg:#fdeaea;--danger-text:#d92d20;--danger-text-dark:#b91c1c;--danger-rgb:217, 45, 32;--success-bg:#e3f6ea;--success-text:#2f8a52;--warning-text:#9a6400;--disabled-bg:#c4c4c4;--disabled-text:#8a8a8a;--control-height-sm:36px;--control-height-base:44px;--radius-sm:10px;--radius-base:12px;--font-family-base:"Inter", sans-serif;--font-size-sm:.75rem;--font-size-base:.875rem;--font-size-lg:1rem;--font-weight-regular:400;--font-weight-bold:500;--line-height-base:1.5;--line-height-tight:1.25}.text-base{font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weight-regular);line-height:var(--line-height-base)}.text-bold{font-weight:var(--font-weight-bold)}.text-sm{font-size:var(--font-size-sm)}.text-lg{font-size:var(--font-size-lg)}.text-2-line{line-height:var(--line-height-tight)}
2
2
  /*$vite$:1*/
package/dist/index.d.ts CHANGED
@@ -4,12 +4,12 @@ export { Tag } from './components/Tag';
4
4
  export { Toolbar } from './components/Toolbar';
5
5
  export { Checkbox } from './components/Checkbox';
6
6
  export { RadioButton } from './components/RadioButton';
7
+ export { Switch } from './components/Switch';
7
8
  export { TextField } from './components/TextField';
8
9
  export { Dropdown } from './components/Dropdown';
9
10
  export { Menu, MenuDivider } from './components/Menu';
10
11
  export { MenuItem } from './components/MenuItem';
11
12
  export { HighlightText } from './components/HighlightText';
12
13
  export { FilterSection } from './components/FilterSection';
13
- export { UiElementsSidebar } from './components/UiElementsSidebar';
14
14
  export { Tabs } from './components/Tabs';
15
15
  export { formatDuration, formatDurationHMS } from './utils/format';
package/dist/index.js CHANGED
@@ -1,15 +1,14 @@
1
1
  import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
2
2
  import { Fragment as r, createContext as i, createElement as a, forwardRef as o, useContext as s, useEffect as c, useId as l, useLayoutEffect as u, useRef as d, useState as f } from "react";
3
3
  var p = {
4
- primary: "_primary_d59gi_1",
5
- secondary: "_secondary_d59gi_2",
6
- tertiary: "_tertiary_d59gi_3",
7
- dangerous: "_dangerous_d59gi_4",
8
- sm: "_sm_d59gi_28",
9
- base: "_base_d59gi_33",
10
- lg: "_lg_d59gi_38",
11
- icon: "_icon_d59gi_44",
12
- iconOnly: "_iconOnly_d59gi_57"
4
+ primary: "_primary_7m8el_1",
5
+ secondary: "_secondary_7m8el_2",
6
+ tertiary: "_tertiary_7m8el_3",
7
+ dangerous: "_dangerous_7m8el_4",
8
+ sm: "_sm_7m8el_28",
9
+ base: "_base_7m8el_34",
10
+ icon: "_icon_7m8el_40",
11
+ iconOnly: "_iconOnly_7m8el_53"
13
12
  };
14
13
  //#endregion
15
14
  //#region src/components/Button.tsx
@@ -226,7 +225,7 @@ var j = k(A), M = {
226
225
  }]]
227
226
  };
228
227
  M.node;
229
- var N = k(M), P = {
228
+ var re = k(M), N = {
230
229
  name: "search",
231
230
  size: 24,
232
231
  node: [["path", {
@@ -239,8 +238,8 @@ var N = k(M), P = {
239
238
  key: "4ej97u"
240
239
  }]]
241
240
  };
242
- P.node;
243
- var F = k(P), I = {
241
+ N.node;
242
+ var P = k(N), F = {
244
243
  toolbar: "_toolbar_1rsvo_1",
245
244
  searchWrap: "_searchWrap_1rsvo_14",
246
245
  searchIcon: "_searchIcon_1rsvo_33",
@@ -250,7 +249,7 @@ var F = k(P), I = {
250
249
  };
251
250
  //#endregion
252
251
  //#region src/components/Toolbar.tsx
253
- function L({ searchValue: e, onSearchChange: r, placeholder: i = "Search…", shortcutLabel: a = "⌘K", shortcutKey: o = "k", children: s }) {
252
+ function I({ searchValue: e, onSearchChange: r, placeholder: i = "Search…", shortcutLabel: a = "⌘K", shortcutKey: o = "k", children: s }) {
254
253
  let l = d(null);
255
254
  return c(() => {
256
255
  function e(e) {
@@ -258,155 +257,206 @@ function L({ searchValue: e, onSearchChange: r, placeholder: i = "Search…", sh
258
257
  }
259
258
  return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
260
259
  }, [o]), /* @__PURE__ */ n("div", {
261
- className: I.toolbar,
260
+ className: F.toolbar,
262
261
  children: [/* @__PURE__ */ n("div", {
263
- className: I.searchWrap,
262
+ className: F.searchWrap,
264
263
  children: [
265
264
  /* @__PURE__ */ t("span", {
266
- className: I.searchIcon,
267
- children: /* @__PURE__ */ t(F, {})
265
+ className: F.searchIcon,
266
+ children: /* @__PURE__ */ t(P, {})
268
267
  }),
269
268
  /* @__PURE__ */ t("input", {
270
269
  ref: l,
271
270
  type: "text",
272
- className: I.search,
271
+ className: F.search,
273
272
  placeholder: i,
274
273
  autoComplete: "off",
275
274
  value: e,
276
275
  onChange: (e) => r?.(e.target.value)
277
276
  }),
278
277
  a && /* @__PURE__ */ t("span", {
279
- className: I.searchShortcut,
278
+ className: F.searchShortcut,
280
279
  "aria-hidden": "true",
281
280
  children: a
282
281
  })
283
282
  ]
284
283
  }), s && /* @__PURE__ */ t("div", {
285
- className: I.controls,
284
+ className: F.controls,
286
285
  children: s
287
286
  })]
288
287
  });
289
288
  }
290
- var R = {
291
- checkbox: "_checkbox_veqkz_1",
292
- input: "_input_veqkz_11",
293
- box: "_box_veqkz_18",
294
- icon: "_icon_veqkz_46"
289
+ var L = {
290
+ checkbox: "_checkbox_1lh2s_1",
291
+ control: "_control_1lh2s_7",
292
+ labelText: "_labelText_1lh2s_16",
293
+ input: "_input_1lh2s_24",
294
+ box: "_box_1lh2s_31",
295
+ icon: "_icon_1lh2s_62"
295
296
  };
296
297
  //#endregion
297
298
  //#region src/components/Checkbox.tsx
298
- function z({ checked: e, onChange: r, ariaLabel: i, className: a }) {
299
+ function R({ checked: e, onChange: r, label: i, ariaLabel: a, className: o }) {
299
300
  return /* @__PURE__ */ n("label", {
300
- className: `${R.checkbox} ${a ?? ""}`,
301
- children: [/* @__PURE__ */ t("input", {
302
- type: "checkbox",
303
- className: R.input,
304
- checked: e,
305
- onChange: r,
306
- "aria-label": i
307
- }), /* @__PURE__ */ t("span", {
308
- className: R.box,
309
- children: /* @__PURE__ */ t("svg", {
310
- className: R.icon,
311
- viewBox: "0 0 17 18",
312
- "aria-hidden": "true",
313
- children: /* @__PURE__ */ t("polyline", { points: "1 9 7 14 15 4" })
314
- })
301
+ className: `${L.checkbox} ${o ?? ""}`,
302
+ children: [/* @__PURE__ */ n("span", {
303
+ className: L.control,
304
+ children: [/* @__PURE__ */ t("input", {
305
+ type: "checkbox",
306
+ className: L.input,
307
+ checked: e,
308
+ onChange: r,
309
+ "aria-label": a
310
+ }), /* @__PURE__ */ t("span", {
311
+ className: L.box,
312
+ children: /* @__PURE__ */ t("svg", {
313
+ className: L.icon,
314
+ viewBox: "0 0 17 18",
315
+ "aria-hidden": "true",
316
+ children: /* @__PURE__ */ t("polyline", { points: "1 9 7 14 15 4" })
317
+ })
318
+ })]
319
+ }), i && /* @__PURE__ */ t("span", {
320
+ className: L.labelText,
321
+ children: i
315
322
  })]
316
323
  });
317
324
  }
318
- var B = {
319
- radio: "_radio_7q2jv_1",
320
- input: "_input_7q2jv_11",
321
- circle: "_circle_7q2jv_18",
322
- dot: "_dot_7q2jv_46"
325
+ var z = {
326
+ radio: "_radio_su0wb_1",
327
+ control: "_control_su0wb_7",
328
+ labelText: "_labelText_su0wb_16",
329
+ input: "_input_su0wb_24",
330
+ circle: "_circle_su0wb_31",
331
+ dot: "_dot_su0wb_62"
323
332
  };
324
333
  //#endregion
325
334
  //#region src/components/RadioButton.tsx
326
- function V({ checked: e, onChange: r, name: i, value: a, ariaLabel: o, className: s }) {
335
+ function B({ checked: e, onChange: r, name: i, value: a, label: o, ariaLabel: s, className: c }) {
327
336
  return /* @__PURE__ */ n("label", {
328
- className: `${B.radio} ${s ?? ""}`,
329
- children: [/* @__PURE__ */ t("input", {
330
- type: "radio",
331
- className: B.input,
332
- checked: e,
333
- onChange: r,
334
- name: i,
335
- value: a,
336
- "aria-label": o
337
- }), /* @__PURE__ */ t("span", {
338
- className: B.circle,
339
- children: /* @__PURE__ */ t("span", { className: B.dot })
337
+ className: `${z.radio} ${c ?? ""}`,
338
+ children: [/* @__PURE__ */ n("span", {
339
+ className: z.control,
340
+ children: [/* @__PURE__ */ t("input", {
341
+ type: "radio",
342
+ className: z.input,
343
+ checked: e,
344
+ onChange: r,
345
+ name: i,
346
+ value: a,
347
+ "aria-label": s
348
+ }), /* @__PURE__ */ t("span", {
349
+ className: z.circle,
350
+ children: /* @__PURE__ */ t("span", { className: z.dot })
351
+ })]
352
+ }), o && /* @__PURE__ */ t("span", {
353
+ className: z.labelText,
354
+ children: o
340
355
  })]
341
356
  });
342
357
  }
343
- var H = {
344
- field: "_field_133ye_1",
345
- label: "_label_133ye_6",
346
- inputWrap: "_inputWrap_133ye_12",
347
- errorWrap: "_errorWrap_133ye_25",
348
- input: "_input_133ye_12",
349
- sm: "_sm_133ye_33",
350
- base: "_base_133ye_40",
351
- lg: "_lg_133ye_47",
352
- icon: "_icon_133ye_54",
353
- helperText: "_helperText_133ye_92",
354
- errorText: "_errorText_133ye_97"
358
+ var V = {
359
+ switch: "_switch_5ouaa_1",
360
+ input: "_input_5ouaa_7",
361
+ control: "_control_5ouaa_10",
362
+ track: "_track_5ouaa_26",
363
+ thumb: "_thumb_5ouaa_52",
364
+ sm: "_sm_5ouaa_65",
365
+ base: "_base_5ouaa_74",
366
+ labelText: "_labelText_5ouaa_84"
367
+ };
368
+ //#endregion
369
+ //#region src/components/Switch.tsx
370
+ function H({ checked: e, onChange: r, size: i = "base", label: a, ariaLabel: o, disabled: s, className: c }) {
371
+ return /* @__PURE__ */ n("label", {
372
+ className: `${V.switch} ${c ?? ""}`,
373
+ children: [/* @__PURE__ */ n("span", {
374
+ className: `${V.control} ${V[i]}`,
375
+ children: [/* @__PURE__ */ t("input", {
376
+ type: "checkbox",
377
+ role: "switch",
378
+ className: V.input,
379
+ checked: e,
380
+ onChange: r,
381
+ "aria-label": o,
382
+ disabled: s
383
+ }), /* @__PURE__ */ t("span", {
384
+ className: V.track,
385
+ children: /* @__PURE__ */ t("span", { className: V.thumb })
386
+ })]
387
+ }), a && /* @__PURE__ */ t("span", {
388
+ className: V.labelText,
389
+ children: a
390
+ })]
391
+ });
392
+ }
393
+ var U = {
394
+ field: "_field_16sx7_1",
395
+ label: "_label_16sx7_6",
396
+ inputWrap: "_inputWrap_16sx7_12",
397
+ errorWrap: "_errorWrap_16sx7_25",
398
+ input: "_input_16sx7_12",
399
+ toolbar: "_toolbar_16sx7_33",
400
+ sm: "_sm_16sx7_63",
401
+ base: "_base_16sx7_71",
402
+ icon: "_icon_16sx7_79",
403
+ helperText: "_helperText_16sx7_117",
404
+ errorText: "_errorText_16sx7_122"
355
405
  };
356
406
  //#endregion
357
407
  //#region src/components/TextField.tsx
358
- function U({ label: e, helperText: r, error: i, size: a = "base", leadingIcon: o, id: s, ...c }) {
359
- let u = l(), d = s ?? u;
408
+ function W({ label: e, helperText: r, error: i, size: a = "base", variant: o = "default", leadingIcon: s, id: c, ...u }) {
409
+ let d = l(), f = c ?? d;
360
410
  return /* @__PURE__ */ n("div", {
361
- className: H.field,
411
+ className: U.field,
362
412
  children: [
363
413
  e && /* @__PURE__ */ t("label", {
364
- className: H.label,
365
- htmlFor: d,
414
+ className: U.label,
415
+ htmlFor: f,
366
416
  children: e
367
417
  }),
368
418
  /* @__PURE__ */ n("div", {
369
- className: `${H.inputWrap} ${H[a]} ${i ? H.errorWrap : ""}`,
370
- children: [o && /* @__PURE__ */ t("span", {
371
- className: H.icon,
372
- children: o
419
+ className: `${U.inputWrap} ${U[o]} ${U[a]} ${i ? U.errorWrap : ""}`,
420
+ children: [s && /* @__PURE__ */ t("span", {
421
+ className: U.icon,
422
+ children: s
373
423
  }), /* @__PURE__ */ t("input", {
374
- id: d,
375
- className: H.input,
376
- ...c
424
+ id: f,
425
+ className: U.input,
426
+ ...u
377
427
  })]
378
428
  }),
379
429
  i ? /* @__PURE__ */ t("span", {
380
- className: H.errorText,
430
+ className: U.errorText,
381
431
  children: i
382
432
  }) : r ? /* @__PURE__ */ t("span", {
383
- className: H.helperText,
433
+ className: U.helperText,
384
434
  children: r
385
435
  }) : null
386
436
  ]
387
437
  });
388
438
  }
389
- var W = {
439
+ var G = {
390
440
  menu: "_menu_471l2_1",
391
441
  divider: "_divider_471l2_15"
392
442
  };
393
443
  //#endregion
394
444
  //#region src/components/Menu.tsx
395
- function G({ children: e, ...n }) {
445
+ function K({ children: e, ...n }) {
396
446
  return /* @__PURE__ */ t("div", {
397
447
  role: "menu",
398
- className: W.menu,
448
+ className: G.menu,
399
449
  ...n,
400
450
  children: e
401
451
  });
402
452
  }
403
- function K() {
453
+ function q() {
404
454
  return /* @__PURE__ */ t("div", {
405
- className: W.divider,
455
+ className: G.divider,
406
456
  role: "separator"
407
457
  });
408
458
  }
409
- var q = {
459
+ var J = {
410
460
  item: "_item_1j7n9_1",
411
461
  icon: "_icon_1j7n9_24",
412
462
  check: "_check_1j7n9_25",
@@ -417,11 +467,11 @@ var q = {
417
467
  };
418
468
  //#endregion
419
469
  //#region src/components/MenuItem.tsx
420
- function J({ icon: e, trailing: r, selected: i, destructive: a, children: o, ...s }) {
470
+ function Y({ icon: e, trailing: r, selected: i, destructive: a, children: o, ...s }) {
421
471
  let c = [
422
- q.item,
423
- i && q.selected,
424
- a && q.destructive
472
+ J.item,
473
+ i && J.selected,
474
+ a && J.destructive
425
475
  ].filter(Boolean).join(" ");
426
476
  return /* @__PURE__ */ n("button", {
427
477
  type: "button",
@@ -430,44 +480,43 @@ function J({ icon: e, trailing: r, selected: i, destructive: a, children: o, ...
430
480
  ...s,
431
481
  children: [
432
482
  e && /* @__PURE__ */ t("span", {
433
- className: q.icon,
483
+ className: J.icon,
434
484
  children: e
435
485
  }),
436
486
  /* @__PURE__ */ t("span", {
437
- className: q.label,
487
+ className: J.label,
438
488
  children: o
439
489
  }),
440
490
  r && /* @__PURE__ */ t("span", {
441
- className: q.trailing,
491
+ className: J.trailing,
442
492
  children: r
443
493
  }),
444
494
  i && /* @__PURE__ */ t("span", {
445
- className: q.check,
495
+ className: J.check,
446
496
  children: /* @__PURE__ */ t(j, {})
447
497
  })
448
498
  ]
449
499
  });
450
500
  }
451
- var Y = {
452
- field: "_field_1bvdj_1",
453
- label: "_label_1bvdj_7",
454
- trigger: "_trigger_1bvdj_13",
455
- errorWrap: "_errorWrap_1bvdj_31",
456
- sm: "_sm_1bvdj_40",
457
- base: "_base_1bvdj_47",
458
- lg: "_lg_1bvdj_54",
459
- icon: "_icon_1bvdj_62",
460
- value: "_value_1bvdj_76",
461
- placeholder: "_placeholder_1bvdj_84",
462
- chevron: "_chevron_1bvdj_87",
463
- chevronOpen: "_chevronOpen_1bvdj_102",
464
- menuWrap: "_menuWrap_1bvdj_106",
465
- helperText: "_helperText_1bvdj_113",
466
- errorText: "_errorText_1bvdj_118"
501
+ var X = {
502
+ field: "_field_333d5_1",
503
+ label: "_label_333d5_7",
504
+ trigger: "_trigger_333d5_13",
505
+ errorWrap: "_errorWrap_333d5_31",
506
+ sm: "_sm_333d5_40",
507
+ base: "_base_333d5_48",
508
+ icon: "_icon_333d5_57",
509
+ value: "_value_333d5_71",
510
+ placeholder: "_placeholder_333d5_79",
511
+ chevron: "_chevron_333d5_82",
512
+ chevronOpen: "_chevronOpen_333d5_97",
513
+ menuWrap: "_menuWrap_333d5_101",
514
+ helperText: "_helperText_333d5_108",
515
+ errorText: "_errorText_333d5_113"
467
516
  };
468
517
  //#endregion
469
518
  //#region src/components/Dropdown.tsx
470
- function X({ label: e, helperText: r, error: i, size: a = "base", placeholder: o = "Select…", options: s, value: u, onChange: p, disabled: m }) {
519
+ function ie({ label: e, helperText: r, error: i, size: a = "base", placeholder: o = "Select…", options: s, value: u, onChange: p, disabled: m }) {
471
520
  let [h, g] = f(!1), _ = d(null), v = l(), y = s.find((e) => e.value === u), b = s.filter((e) => !e.disabled).map((e) => e.value);
472
521
  c(() => {
473
522
  if (!h) return;
@@ -505,18 +554,18 @@ function X({ label: e, helperText: r, error: i, size: a = "base", placeholder: o
505
554
  e.key === "Escape" && g(!1);
506
555
  }
507
556
  return /* @__PURE__ */ n("div", {
508
- className: Y.field,
557
+ className: X.field,
509
558
  ref: _,
510
559
  children: [
511
560
  e && /* @__PURE__ */ t("label", {
512
- className: Y.label,
561
+ className: X.label,
513
562
  htmlFor: v,
514
563
  children: e
515
564
  }),
516
565
  /* @__PURE__ */ n("button", {
517
566
  id: v,
518
567
  type: "button",
519
- className: `${Y.trigger} ${Y[a]} ${i ? Y.errorWrap : ""}`,
568
+ className: `${X.trigger} ${X[a]} ${i ? X.errorWrap : ""}`,
520
569
  "aria-haspopup": "listbox",
521
570
  "aria-expanded": h,
522
571
  disabled: m,
@@ -524,25 +573,25 @@ function X({ label: e, helperText: r, error: i, size: a = "base", placeholder: o
524
573
  onKeyDown: x,
525
574
  children: [
526
575
  y?.icon && /* @__PURE__ */ t("span", {
527
- className: Y.icon,
576
+ className: X.icon,
528
577
  children: y.icon
529
578
  }),
530
579
  /* @__PURE__ */ t("span", {
531
- className: `${Y.value} ${y ? "" : Y.placeholder}`,
580
+ className: `${X.value} ${y ? "" : X.placeholder}`,
532
581
  children: y ? y.label : o
533
582
  }),
534
583
  /* @__PURE__ */ t("span", {
535
- className: `${Y.chevron} ${h ? Y.chevronOpen : ""}`,
536
- children: /* @__PURE__ */ t(N, {})
584
+ className: `${X.chevron} ${h ? X.chevronOpen : ""}`,
585
+ children: /* @__PURE__ */ t(re, {})
537
586
  })
538
587
  ]
539
588
  }),
540
589
  h && /* @__PURE__ */ t("div", {
541
- className: Y.menuWrap,
542
- children: /* @__PURE__ */ t(G, {
590
+ className: X.menuWrap,
591
+ children: /* @__PURE__ */ t(K, {
543
592
  role: "listbox",
544
593
  style: { width: "100%" },
545
- children: s.map((e) => /* @__PURE__ */ t(J, {
594
+ children: s.map((e) => /* @__PURE__ */ t(Y, {
546
595
  "data-value": e.value,
547
596
  role: "option",
548
597
  "aria-selected": e.value === u,
@@ -558,26 +607,26 @@ function X({ label: e, helperText: r, error: i, size: a = "base", placeholder: o
558
607
  })
559
608
  }),
560
609
  i ? /* @__PURE__ */ t("span", {
561
- className: Y.errorText,
610
+ className: X.errorText,
562
611
  children: i
563
612
  }) : r ? /* @__PURE__ */ t("span", {
564
- className: Y.helperText,
613
+ className: X.helperText,
565
614
  children: r
566
615
  }) : null
567
616
  ]
568
617
  });
569
618
  }
570
- var re = { highlight: "_highlight_1anli_1" };
619
+ var ae = { highlight: "_highlight_1anli_1" };
571
620
  //#endregion
572
621
  //#region src/components/HighlightText.tsx
573
- function ie(e) {
622
+ function oe(e) {
574
623
  return e.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
575
624
  }
576
- function ae({ text: n, query: i }) {
625
+ function se({ text: n, query: i }) {
577
626
  if (!i) return /* @__PURE__ */ t(e, { children: n });
578
- let a = n.split(RegExp(`(${ie(i)})`, "ig"));
627
+ let a = n.split(RegExp(`(${oe(i)})`, "ig"));
579
628
  return /* @__PURE__ */ t(e, { children: a.map((e, n) => e.toLowerCase() === i.toLowerCase() ? /* @__PURE__ */ t("mark", {
580
- className: re.highlight,
629
+ className: ae.highlight,
581
630
  children: e
582
631
  }, n) : /* @__PURE__ */ t(r, { children: e }, n)) });
583
632
  }
@@ -603,7 +652,7 @@ var Z = {
603
652
  };
604
653
  //#endregion
605
654
  //#region src/components/FilterSection.tsx
606
- function oe({ label: e, options: r, optionLabel: i, activeSet: a, onToggle: o, onSetAll: s, searchable: c }) {
655
+ function Q({ label: e, options: r, optionLabel: i, activeSet: a, onToggle: o, onSetAll: s, searchable: c }) {
607
656
  let [l, u] = f(""), d = l.trim().toLowerCase(), p = d ? r.filter((e) => i(e).toLowerCase().includes(d)) : r, m = r.length > 0 && a.size === r.length;
608
657
  return /* @__PURE__ */ n("div", { children: [
609
658
  /* @__PURE__ */ n("div", {
@@ -632,51 +681,26 @@ function oe({ label: e, options: r, optionLabel: i, activeSet: a, onToggle: o, o
632
681
  children: [p.length === 0 && /* @__PURE__ */ t("div", {
633
682
  className: Z.empty,
634
683
  children: "No match"
635
- }), p.map((e) => /* @__PURE__ */ n("label", {
684
+ }), p.map((e) => /* @__PURE__ */ t(R, {
636
685
  className: Z.option,
637
- children: [/* @__PURE__ */ t(z, {
638
- checked: a.has(e),
639
- onChange: () => o(e)
640
- }), /* @__PURE__ */ t("span", { children: i(e) })]
686
+ checked: a.has(e),
687
+ onChange: () => o(e),
688
+ label: i(e)
641
689
  }, e))]
642
690
  })
643
691
  ] });
644
692
  }
645
- var Q = {
646
- sidebar: "_sidebar_1fx39_1",
647
- title: "_title_1fx39_16",
648
- navLink: "_navLink_1fx39_22",
649
- count: "_count_1fx39_38"
650
- };
651
- //#endregion
652
- //#region src/components/UiElementsSidebar.tsx
653
- function se({ sections: e }) {
654
- return /* @__PURE__ */ n("aside", {
655
- className: Q.sidebar,
656
- children: [/* @__PURE__ */ t("div", {
657
- className: Q.title,
658
- children: "UI Elements"
659
- }), e.map((e) => /* @__PURE__ */ n("a", {
660
- href: `#${e.id}`,
661
- className: Q.navLink,
662
- children: [/* @__PURE__ */ t("span", { children: e.label }), /* @__PURE__ */ t("span", {
663
- className: Q.count,
664
- children: e.count
665
- })]
666
- }, e.id))]
667
- });
668
- }
669
693
  var $ = {
670
- line: "_line_gfgon_1",
671
- box: "_box_gfgon_2",
672
- indicator: "_indicator_gfgon_9",
673
- settling: "_settling_gfgon_17",
674
- indicatorLine: "_indicatorLine_gfgon_21",
675
- indicatorBox: "_indicatorBox_gfgon_27",
676
- tab: "_tab_gfgon_35",
677
- selected: "_selected_gfgon_80",
678
- icon: "_icon_gfgon_89",
679
- sm: "_sm_gfgon_148"
694
+ line: "_line_lhe96_1",
695
+ box: "_box_lhe96_2",
696
+ indicator: "_indicator_lhe96_9",
697
+ settling: "_settling_lhe96_17",
698
+ indicatorLine: "_indicatorLine_lhe96_21",
699
+ indicatorBox: "_indicatorBox_lhe96_27",
700
+ tab: "_tab_lhe96_35",
701
+ selected: "_selected_lhe96_80",
702
+ icon: "_icon_lhe96_89",
703
+ sm: "_sm_lhe96_148"
680
704
  };
681
705
  //#endregion
682
706
  //#region src/components/Tabs.tsx
@@ -766,6 +790,6 @@ function ue(e, t) {
766
790
  return `${i(n)}:${i(r)}:${i(t)}`;
767
791
  }
768
792
  //#endregion
769
- export { m as Button, g as Card, z as Checkbox, X as Dropdown, oe as FilterSection, ae as HighlightText, G as Menu, K as MenuDivider, J as MenuItem, V as RadioButton, ce as Tabs, v as Tag, U as TextField, L as Toolbar, se as UiElementsSidebar, le as formatDuration, ue as formatDurationHMS };
793
+ export { m as Button, g as Card, R as Checkbox, ie as Dropdown, Q as FilterSection, se as HighlightText, K as Menu, q as MenuDivider, Y as MenuItem, B as RadioButton, H as Switch, ce as Tabs, v as Tag, W as TextField, I as Toolbar, le as formatDuration, ue as formatDurationHMS };
770
794
 
771
795
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["__iconData","__iconData"],"sources":["../src/components/Button.module.css","../src/components/Button.tsx","../src/components/Card.module.css","../src/components/Card.tsx","../src/components/Tag.module.css","../src/components/Tag.tsx","../node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/toLucideIconData.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.mjs","../node_modules/lucide-react/dist/esm/shared/src/build/defaultAttributes.mjs","../node_modules/lucide-react/dist/esm/shared/src/build/buildLucideIconNode.mjs","../node_modules/lucide-react/dist/esm/shared/src/build/buildLucideIconForReact.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.mjs","../node_modules/lucide-react/dist/esm/context.mjs","../node_modules/lucide-react/dist/esm/Icon.mjs","../node_modules/lucide-react/dist/esm/createLucideIcon.mjs","../node_modules/lucide-react/dist/esm/icons/check.mjs","../node_modules/lucide-react/dist/esm/icons/chevron-down.mjs","../node_modules/lucide-react/dist/esm/icons/search.mjs","../src/components/Toolbar.module.css","../src/components/Toolbar.tsx","../src/components/Checkbox.module.css","../src/components/Checkbox.tsx","../src/components/RadioButton.module.css","../src/components/RadioButton.tsx","../src/components/TextField.module.css","../src/components/TextField.tsx","../src/components/Menu.module.css","../src/components/Menu.tsx","../src/components/MenuItem.module.css","../src/components/MenuItem.tsx","../src/components/Dropdown.module.css","../src/components/Dropdown.tsx","../src/components/HighlightText.module.css","../src/components/HighlightText.tsx","../src/components/FilterSection.module.css","../src/components/FilterSection.tsx","../src/components/UiElementsSidebar.module.css","../src/components/UiElementsSidebar.tsx","../src/components/Tabs.module.css","../src/components/Tabs.tsx","../src/utils/format.ts"],"sourcesContent":[".primary,\n.secondary,\n.tertiary,\n.dangerous {\n position: relative;\n isolation: isolate;\n overflow: hidden;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n border: none;\n font-family: inherit;\n font-weight: 450;\n letter-spacing: 0.01em;\n cursor: pointer;\n transition:\n color 0.2s ease,\n transform 0.2s ease-out;\n}\n.primary:active:not(:disabled),\n.secondary:active:not(:disabled),\n.tertiary:active:not(:disabled),\n.dangerous:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n.sm {\n border-radius: 10px;\n padding: 8px 12px;\n font-size: 0.8rem;\n}\n.base {\n border-radius: 12px;\n padding: 12px 16px;\n font-size: 0.9rem;\n}\n.lg {\n border-radius: 14px;\n padding: 16px 22px;\n font-size: 1rem;\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n\n.iconOnly {\n aspect-ratio: 1;\n box-sizing: border-box;\n}\n.iconOnly.sm {\n padding: 8px;\n}\n.iconOnly.base {\n padding: 12px;\n}\n.iconOnly.lg {\n padding: 16px;\n}\n.primary::before,\n.secondary::before,\n.tertiary::before,\n.dangerous::before {\n content: '';\n position: absolute;\n left: 50%;\n bottom: 0;\n width: 24%;\n aspect-ratio: 1;\n border-radius: 50%;\n transform: translate(-50%, 100%) scale(1);\n transition: transform 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);\n z-index: -1;\n pointer-events: none;\n}\n.primary:hover::before,\n.secondary:hover::before,\n.tertiary:hover::before,\n.dangerous:hover::before {\n transform: translate(-50%, 15%) scale(8);\n}\n\n.primary {\n background: var(--brand-dark);\n color: #fff;\n font-weight: 400;\n letter-spacing: 0.02em;\n}\n.primary::before {\n background: rgba(255, 255, 255, 0.08);\n}\n.primary:active:not(:disabled)::before {\n background: rgba(0, 0, 0, 0.08);\n}\n\n.secondary {\n background: var(--surface-muted);\n color: var(--text-primary);\n}\n.secondary .icon {\n color: var(--text-secondary);\n}\n.secondary::before {\n background: rgba(var(--brand-main-rgb), 0.08);\n}\n.secondary:active:not(:disabled)::before {\n background: rgba(var(--brand-main-rgb), 0.28);\n}\n.secondary:hover .icon {\n color: var(--brand-main);\n}\n.secondary:hover {\n color: var(--brand-main);\n}\n\n.tertiary {\n background: transparent;\n color: var(--text-secondary);\n}\n.tertiary::before {\n background: rgba(var(--brand-main-rgb), 0.16);\n}\n.tertiary:active:not(:disabled)::before {\n background: rgba(var(--brand-main-rgb), 0.28);\n}\n.tertiary:hover,\n.tertiary:active:not(:disabled) {\n background: var(--bg);\n}\n.tertiary:hover {\n color: var(--brand-main);\n}\n\n.dangerous {\n background: var(--danger-bg);\n color: var(--danger-text-dark);\n}\n.dangerous::before {\n background: rgba(var(--danger-rgb), 0.16);\n}\n.dangerous:active:not(:disabled)::before {\n background: rgba(var(--danger-rgb), 0.28);\n}\n\n.primary:disabled,\n.secondary:disabled,\n.tertiary:disabled,\n.dangerous:disabled {\n background: var(--disabled-bg);\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.primary:disabled:hover,\n.secondary:disabled:hover,\n.tertiary:disabled:hover,\n.dangerous:disabled:hover {\n color: var(--disabled-text);\n}\n.primary:disabled::before,\n.secondary:disabled::before,\n.tertiary:disabled::before,\n.dangerous:disabled::before {\n display: none;\n}\n","import type { ButtonHTMLAttributes, ReactNode } from 'react';\nimport styles from './Button.module.css';\n\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'dangerous';\ntype ButtonSize = 'sm' | 'base' | 'lg';\n\ninterface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className'> {\n variant?: ButtonVariant;\n size?: ButtonSize;\n /** Icon shown before the label. Omit `children` to render an icon-only square button — pass `aria-label` in that case. */\n leadingIcon?: ReactNode;\n /** Icon shown after the label. */\n trailingIcon?: ReactNode;\n children?: ReactNode;\n}\n\nexport function Button({\n variant = 'primary',\n size = 'base',\n leadingIcon,\n trailingIcon,\n children,\n ...rest\n}: ButtonProps) {\n const iconOnly = !children && Boolean(leadingIcon);\n return (\n <button\n type=\"button\"\n className={`${styles[variant]} ${styles[size]}${iconOnly ? ` ${styles.iconOnly}` : ''}`}\n {...rest}\n >\n {leadingIcon && <span className={styles.icon}>{leadingIcon}</span>}\n {children}\n {trailingIcon && <span className={styles.icon}>{trailingIcon}</span>}\n </button>\n );\n}\n",".wrap {\n position: relative;\n width: 220px;\n flex: 0 0 220px;\n}\n.wrap:hover {\n z-index: 10;\n}\n.fluid {\n width: 100%;\n flex: none;\n}\n\n.backing {\n position: absolute;\n left: 6px;\n right: 6px;\n bottom: -4px;\n height: 10px;\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border);\n border-radius: 0 0 14px 14px;\n z-index: 0;\n}\n.backing.completed {\n background: var(--success-bg);\n box-shadow: inset 0 0 0 1px #bfe3cc;\n}\n\n.card {\n position: relative;\n z-index: 1;\n width: 100%;\n box-sizing: border-box;\n background: var(--card-surface);\n box-shadow:\n inset 0 0 0 1px #efefef,\n 0 1px 2px rgba(16, 24, 32, 0.04);\n border-radius: 16px;\n padding: 12px 14px;\n cursor: default;\n transition: box-shadow 0.2s;\n}\n.card.interactive {\n cursor: pointer;\n}\n.card.grabbable {\n cursor: grab;\n}\n.card.grabbable:active {\n cursor: grabbing;\n}\n.card.dragging,\n.card.dragging:hover {\n box-shadow:\n inset 0 0 0 1px #efefef,\n 0 1px 2px rgba(16, 24, 32, 0.04);\n}\n.card.interactive:hover {\n box-shadow:\n inset 0 0 0 1px #efefef,\n 0 0 0 2px var(--brand-main);\n}\n.card.completed {\n background: var(--success-bg);\n box-shadow:\n inset 0 0 0 1px #bfe3cc,\n 0 1px 2px rgba(16, 24, 32, 0.04),\n 0 2px 8px rgba(16, 24, 32, 0.06);\n}\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './Card.module.css';\n\ninterface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'className'> {\n /** Shows a second sheet behind the card, for representing a stack/batch. */\n stacked?: boolean;\n /** Success-tinted surface, e.g. a completed task. */\n completed?: boolean;\n /** Adds pointer cursor + accent hover ring. */\n interactive?: boolean;\n /** Grab cursor, for drag sources — pair with `interactive`. */\n draggable?: boolean;\n /** Suppresses the hover ring while a drag is in progress. */\n dragging?: boolean;\n /** Card fills its container width instead of a fixed width. */\n fluid?: boolean;\n children: ReactNode;\n}\n\nexport function Card({\n stacked,\n completed,\n interactive,\n draggable,\n dragging,\n fluid,\n children,\n ...rest\n}: CardProps) {\n return (\n <div className={`${styles.wrap} ${fluid ? styles.fluid : ''}`}>\n {stacked && <div className={`${styles.backing} ${completed ? styles.completed : ''}`} />}\n <div\n className={[\n styles.card,\n completed ? styles.completed : '',\n interactive ? styles.interactive : '',\n draggable ? styles.grabbable : '',\n dragging ? styles.dragging : '',\n ]\n .filter(Boolean)\n .join(' ')}\n {...rest}\n >\n {children}\n </div>\n </div>\n );\n}\n",".neutral,\n.pill,\n.accent,\n.success,\n.danger,\n.count {\n display: inline-flex;\n align-items: center;\n font-weight: 500;\n white-space: nowrap;\n}\n\n/* Square tags — e.g. day badges, worker names, video panel tags */\n.neutral {\n color: var(--text-tertiary);\n font-size: 0.75rem;\n background: var(--bg);\n border-radius: 6px;\n padding: 2px 7px;\n}\n\n/* Pill tags — e.g. BPO group labels, total-duration tags */\n.pill {\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border);\n color: var(--text-tertiary);\n font-size: 0.8rem;\n padding: 3px 11px;\n border-radius: 999px;\n}\n\n/* Accent pill — e.g. \"current\" stat, read-only banner badge */\n.accent {\n background: var(--brand-bg);\n color: var(--brand-dark);\n font-size: 0.8rem;\n padding: 3px 11px;\n border-radius: 999px;\n}\n\n/* Success pill — e.g. \"time spent\" stat */\n.success {\n background: var(--success-bg);\n color: var(--success-text);\n font-size: 0.8rem;\n padding: 3px 11px;\n border-radius: 999px;\n}\n\n/* Danger — square (e.g. ASAP tag) reuses the same token pair as the\n pill-shaped status variant; only the shape differs by context. */\n.danger {\n color: var(--danger-text);\n font-size: 0.75rem;\n background: var(--danger-bg);\n border-radius: 6px;\n padding: 2px 7px;\n}\n\n/* Count badge — small solid circle, e.g. active-filter count */\n.count {\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 999px;\n background: var(--brand-main);\n color: #fff;\n font-size: 0.65rem;\n line-height: 16px;\n text-align: center;\n}\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './Tag.module.css';\n\ntype TagVariant = 'neutral' | 'pill' | 'accent' | 'success' | 'danger' | 'count';\n\ninterface TagProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'className'> {\n variant?: TagVariant;\n children: ReactNode;\n}\n\nexport function Tag({ variant = 'neutral', children, ...rest }: TagProps) {\n return (\n <span className={styles[variant]} {...rest}>\n {children}\n </span>\n );\n}\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst toKebabCase = (string) => string?.replace(/([a-z0-9])([A-Z])/g, \"$1-$2\").toLowerCase();\n\nexport { toKebabCase };\n//# sourceMappingURL=toKebabCase.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { toKebabCase } from './toKebabCase.mjs';\n\nfunction toLucideIconData(iconName, iconNode, aliases = []) {\n if (iconNode == null) {\n throw new Error(\"[lucide]: iconNode is required when icon name is used\");\n }\n return {\n name: toKebabCase(iconName),\n size: 24,\n node: iconNode,\n ...aliases.length > 0 ? { aliases } : {}\n };\n}\n\nexport { toLucideIconData };\n//# sourceMappingURL=toLucideIconData.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst toCamelCase = (string) => {\n let out = \"\";\n let upperNext = false;\n for (const ch of string) {\n if (ch === \"-\" || ch === \"_\" || ch <= \" \") {\n upperNext = out.length > 0;\n continue;\n }\n if (out.length === 0) {\n out += ch.toLowerCase();\n } else {\n out += upperNext ? ch.toUpperCase() : ch;\n }\n upperNext = false;\n }\n return out;\n};\n\nexport { toCamelCase };\n//# sourceMappingURL=toCamelCase.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { toCamelCase } from './toCamelCase.mjs';\n\nconst toPascalCase = (string) => {\n const camelCase = toCamelCase(string);\n return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);\n};\n\nexport { toPascalCase };\n//# sourceMappingURL=toPascalCase.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst mergeClasses = (...classes) => classes.filter((className, index, array) => {\n return Boolean(className) && className.trim() !== \"\" && array.indexOf(className) === index;\n}).join(\" \").trim();\n\nexport { mergeClasses };\n//# sourceMappingURL=mergeClasses.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst defaultAttributes = {\n xmlns: \"http://www.w3.org/2000/svg\",\n width: 24,\n height: 24,\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n stroke: \"currentColor\",\n \"stroke-width\": 2,\n \"stroke-linecap\": \"round\",\n \"stroke-linejoin\": \"round\"\n};\n\nexport { defaultAttributes as default };\n//# sourceMappingURL=defaultAttributes.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport defaultAttributes from './defaultAttributes.mjs';\nimport { mergeClasses } from '../utils/mergeClasses.mjs';\n\nfunction isDefined(value) {\n return value !== null && value !== void 0;\n}\nfunction buildLucideIconNode(icon, params = {}) {\n const attributeNames = params.attributeNames ?? {};\n const getAttributeName = (attributeName) => attributeNames[attributeName] ?? attributeName;\n const viewBoxWidth = icon.size ?? icon.width ?? defaultAttributes[\"width\"];\n const viewBoxHeight = icon.size ?? icon.height ?? defaultAttributes[\"height\"];\n const aliasClassNames = icon.aliases?.filter((alias) => typeof alias === \"string\" && alias.trim() !== \"\").map((alias) => `lucide-${alias}`) ?? [];\n const iconClassNames = [...icon.name ? [`lucide-${icon.name}`] : [], ...aliasClassNames];\n const classNamesFromClassName = params.className?.split(\" \").filter(Boolean) ?? [];\n const className = params.includeDefaultClasses === false ? mergeClasses(...classNamesFromClassName) : mergeClasses(\"lucide\", ...iconClassNames, ...classNamesFromClassName);\n const calculatedStrokeWidth = params.absoluteStrokeWidth ? Number(params.strokeWidth ?? defaultAttributes[\"stroke-width\"]) * Number(icon.size ?? icon.width ?? defaultAttributes[\"width\"]) / Number(params.size ?? params.width ?? defaultAttributes[\"width\"]) : params.strokeWidth ?? defaultAttributes[\"stroke-width\"];\n const attributes = {\n ...Object.entries(defaultAttributes).reduce((attrs, [attrName, value]) => {\n attrs[getAttributeName(attrName)] = value;\n return attrs;\n }, {}),\n ...\"color\" in params && params.color && {\n [getAttributeName(\"stroke\")]: params.color\n },\n ...\"size\" in params && isDefined(params.size) && {\n [getAttributeName(\"width\")]: params.size,\n [getAttributeName(\"height\")]: params.size\n },\n ...\"width\" in params && isDefined(params.width) && {\n [getAttributeName(\"width\")]: params.width\n },\n ...\"height\" in params && isDefined(params.height) && {\n [getAttributeName(\"height\")]: params.height\n },\n [getAttributeName(\"stroke-width\")]: calculatedStrokeWidth,\n ...className && {\n [getAttributeName(\"class\")]: className\n },\n [getAttributeName(\"viewBox\")]: `0 0 ${viewBoxWidth} ${viewBoxHeight}`,\n ...params.hasA11yProp === false ? {\n [getAttributeName(\"aria-hidden\")]: \"true\"\n } : {},\n ...\"attributes\" in params && params.attributes\n };\n return [\n \"svg\",\n attributes,\n icon.node.map((child) => {\n const [name, attrs, children] = child;\n const nextAttrs = params.nonScalingStroke ? { [getAttributeName(\"vector-effect\")]: \"non-scaling-stroke\", ...attrs } : attrs;\n return children ? [name, nextAttrs, children] : [name, nextAttrs];\n })\n ];\n}\n\nexport { buildLucideIconNode as default };\n//# sourceMappingURL=buildLucideIconNode.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport buildLucideIconNode from './buildLucideIconNode.mjs';\n\nfunction buildLucideIconForReact(icon, params = {}) {\n return buildLucideIconNode(icon, {\n ...params,\n attributeNames: {\n ...params.attributeNames,\n class: \"className\",\n \"stroke-width\": \"strokeWidth\",\n \"stroke-linecap\": \"strokeLinecap\",\n \"stroke-linejoin\": \"strokeLinejoin\",\n \"vector-effect\": \"vectorEffect\"\n }\n });\n}\n\nexport { buildLucideIconForReact as default };\n//# sourceMappingURL=buildLucideIconForReact.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst hasA11yProp = (props) => {\n for (const prop in props) {\n if (prop.startsWith(\"aria-\") || prop === \"role\" || prop === \"title\") {\n return true;\n }\n }\n return false;\n};\n\nexport { hasA11yProp };\n//# sourceMappingURL=hasA11yProp.mjs.map\n","\"use strict\";\n\"use client\";\n/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { createContext, useContext, useMemo, createElement } from 'react';\n\nconst LucideContext = createContext({});\nfunction LucideProvider({\n children,\n size,\n color,\n strokeWidth,\n absoluteStrokeWidth,\n nonScalingStroke,\n className\n}) {\n const value = useMemo(\n () => ({\n size,\n color,\n strokeWidth,\n absoluteStrokeWidth,\n nonScalingStroke,\n className\n }),\n [size, color, strokeWidth, absoluteStrokeWidth, nonScalingStroke, className]\n );\n return createElement(LucideContext.Provider, { value }, children);\n}\nconst useLucideContext = () => useContext(LucideContext);\n\nexport { LucideProvider, useLucideContext };\n//# sourceMappingURL=context.mjs.map\n","\"use strict\";\n\"use client\";\n/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { forwardRef, createElement } from 'react';\nimport { mergeClasses } from './shared/src/utils/mergeClasses.mjs';\nimport buildLucideIconForReact from './shared/src/build/buildLucideIconForReact.mjs';\nimport { hasA11yProp } from './shared/src/utils/hasA11yProp.mjs';\nimport { useLucideContext } from './context.mjs';\n\nconst Icon = forwardRef(\n ({\n color,\n size,\n width,\n height,\n strokeWidth,\n absoluteStrokeWidth,\n nonScalingStroke,\n className = \"\",\n children,\n iconNode = [],\n icon = {\n node: iconNode,\n aliases: [],\n size: 24\n },\n ...rest\n }, ref) => {\n const {\n size: contextSize = 24,\n strokeWidth: contextStrokeWidth = 2,\n absoluteStrokeWidth: contextAbsoluteStrokeWidth = false,\n nonScalingStroke: contextNonScalingStroke = false,\n color: contextColor = \"currentColor\",\n className: contextClass = \"\"\n } = useLucideContext() ?? {};\n const hasAccessibleProp = Boolean(children) || hasA11yProp(rest);\n const [name, svgAttributes, builtIconNode = []] = buildLucideIconForReact(icon, {\n color: color ?? contextColor,\n width: width ?? size ?? contextSize,\n height: height ?? size ?? contextSize,\n strokeWidth: strokeWidth ?? contextStrokeWidth,\n absoluteStrokeWidth: absoluteStrokeWidth ?? contextAbsoluteStrokeWidth,\n nonScalingStroke: nonScalingStroke ?? contextNonScalingStroke,\n className: mergeClasses(contextClass, className),\n hasA11yProp: hasAccessibleProp,\n attributes: rest\n });\n return createElement(\n name,\n {\n ref,\n ...svgAttributes\n },\n [\n ...builtIconNode.map(([tag, attrs]) => createElement(tag, attrs)),\n ...Array.isArray(children) ? children : [children]\n ]\n );\n }\n);\n\nexport { Icon as default };\n//# sourceMappingURL=Icon.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { forwardRef, createElement } from 'react';\nimport { toLucideIconData } from './shared/src/utils/toLucideIconData.mjs';\nimport { toPascalCase } from './shared/src/utils/toPascalCase.mjs';\nimport Icon from './Icon.mjs';\n\nfunction createLucideIcon(iconDataOrName, iconNode = [], aliases = []) {\n const iconData = typeof iconDataOrName === \"string\" ? toLucideIconData(iconDataOrName, iconNode, aliases) : iconDataOrName;\n const Component = forwardRef(\n ({ className, ...props }, ref) => createElement(Icon, {\n ref,\n icon: iconData,\n className,\n ...props\n })\n );\n if (iconData.name) {\n Component.displayName = toPascalCase(iconData.name);\n }\n return Component;\n}\n\nexport { createLucideIcon as default };\n//# sourceMappingURL=createLucideIcon.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconData = {\n name: \"check\",\n size: 24,\n node: [[\"path\", { d: \"M20 6 9 17l-5-5\", key: \"1gmf2c\" }]]\n};\n__iconData.node;\nconst Check = createLucideIcon(__iconData);\n\nexport { __iconData, Check as default };\n//# sourceMappingURL=check.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconData = {\n name: \"chevron-down\",\n size: 24,\n node: [[\"path\", { d: \"m6 9 6 6 6-6\", key: \"qrunsl\" }]]\n};\n__iconData.node;\nconst ChevronDown = createLucideIcon(__iconData);\n\nexport { __iconData, ChevronDown as default };\n//# sourceMappingURL=chevron-down.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconData = {\n name: \"search\",\n size: 24,\n node: [\n [\"path\", { d: \"m21 21-4.34-4.34\", key: \"14j7rj\" }],\n [\"circle\", { cx: \"11\", cy: \"11\", r: \"8\", key: \"4ej97u\" }]\n ]\n};\n__iconData.node;\nconst Search = createLucideIcon(__iconData);\n\nexport { __iconData, Search as default };\n//# sourceMappingURL=search.mjs.map\n",".toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n padding: 0 8px;\n background: var(--card-surface);\n border-radius: 16px;\n box-shadow:\n inset 0 0 0 1px var(--border),\n 0 1px 2px rgba(16, 24, 32, 0.04),\n 0 2px 8px rgba(16, 24, 32, 0.06);\n}\n.searchWrap {\n position: relative;\n flex: 1;\n min-width: 0;\n}\n.searchWrap::after {\n content: '';\n position: absolute;\n left: 36px;\n right: 0;\n bottom: 0;\n height: 2px;\n background: var(--brand-main);\n opacity: 0;\n pointer-events: none;\n}\n.searchWrap:focus-within::after {\n opacity: 1;\n}\n.searchIcon {\n position: absolute;\n top: 50%;\n left: 12px;\n width: 16px;\n height: 16px;\n transform: translateY(-53%);\n color: var(--text-tertiary);\n pointer-events: none;\n}\n.searchIcon svg {\n width: 100%;\n height: 100%;\n}\n.search {\n width: 100%;\n box-sizing: border-box;\n border: none;\n padding: 16px 52px 16px 36px;\n font-family: inherit;\n font-size: 1rem;\n color: var(--text-primary);\n background: none;\n box-shadow: inset -1px 0 0 var(--border);\n}\n.search:focus {\n outline: none;\n}\n.searchShortcut {\n position: absolute;\n top: 50%;\n right: 8px;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 2px 6px;\n border-radius: 6px;\n background: var(--bg);\n color: var(--text-tertiary);\n font-size: 0.75rem;\n font-weight: 600;\n letter-spacing: 0.02em;\n pointer-events: none;\n}\n.controls {\n display: flex;\n align-items: center;\n flex: none;\n}\n","import { useEffect, useRef, type ChangeEvent, type ReactNode } from 'react';\nimport { Search } from 'lucide-react';\nimport styles from './Toolbar.module.css';\n\ninterface ToolbarProps {\n searchValue?: string;\n onSearchChange?: (value: string) => void;\n placeholder?: string;\n /** Text shown in the keyboard-shortcut badge, e.g. \"⌘K\". Omit to hide the badge. */\n shortcutLabel?: string;\n /** Focuses the search input when Cmd/Ctrl + the shortcut key is pressed. */\n shortcutKey?: string;\n /** Right-side content — filter/sort controls, actions, etc. */\n children?: ReactNode;\n}\n\nexport function Toolbar({\n searchValue,\n onSearchChange,\n placeholder = 'Search…',\n shortcutLabel = '⌘K',\n shortcutKey = 'k',\n children,\n}: ToolbarProps) {\n const searchRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n function onKeyDown(e: KeyboardEvent) {\n if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === shortcutKey.toLowerCase()) {\n e.preventDefault();\n searchRef.current?.focus();\n }\n }\n window.addEventListener('keydown', onKeyDown);\n return () => window.removeEventListener('keydown', onKeyDown);\n }, [shortcutKey]);\n\n return (\n <div className={styles.toolbar}>\n <div className={styles.searchWrap}>\n <span className={styles.searchIcon}>\n <Search />\n </span>\n <input\n ref={searchRef}\n type=\"text\"\n className={styles.search}\n placeholder={placeholder}\n autoComplete=\"off\"\n value={searchValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => onSearchChange?.(e.target.value)}\n />\n {shortcutLabel && (\n <span className={styles.searchShortcut} aria-hidden=\"true\">\n {shortcutLabel}\n </span>\n )}\n </div>\n {children && <div className={styles.controls}>{children}</div>}\n </div>\n );\n}\n",".checkbox {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n cursor: pointer;\n}\n.input {\n position: absolute;\n inset: 0;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n}\n.box {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n border-radius: 6px;\n background: var(--surface-sunken);\n box-shadow: inset 0 0 0 1px var(--border);\n transition:\n background-color 0.2s cubic-bezier(0, 0, 0.2, 1),\n box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1),\n transform 0.1s cubic-bezier(0, 0, 0.2, 1);\n}\n.input:hover + .box {\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.input:focus-visible + .box {\n outline: 2px solid var(--brand-main);\n outline-offset: 2px;\n}\n.input:active + .box {\n transform: scale(0.88);\n}\n.input:checked + .box {\n background: var(--brand-main);\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.icon {\n width: 10px;\n height: 10px;\n overflow: visible;\n}\n.icon polyline {\n fill: none;\n stroke: #fff;\n stroke-width: 2.5px;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-dasharray: 22px;\n stroke-dashoffset: 22px;\n transition: stroke-dashoffset 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.input:checked + .box .icon polyline {\n stroke-dashoffset: 0px;\n}\n","import type { ChangeEvent } from 'react';\nimport styles from './Checkbox.module.css';\n\ninterface CheckboxProps {\n checked: boolean;\n onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n ariaLabel?: string;\n className?: string;\n}\n\nexport function Checkbox({ checked, onChange, ariaLabel, className }: CheckboxProps) {\n return (\n <label className={`${styles.checkbox} ${className ?? ''}`}>\n <input\n type=\"checkbox\"\n className={styles.input}\n checked={checked}\n onChange={onChange}\n aria-label={ariaLabel}\n />\n <span className={styles.box}>\n <svg className={styles.icon} viewBox=\"0 0 17 18\" aria-hidden=\"true\">\n <polyline points=\"1 9 7 14 15 4\" />\n </svg>\n </span>\n </label>\n );\n}\n",".radio {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n cursor: pointer;\n}\n.input {\n position: absolute;\n inset: 0;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n}\n.circle {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n background: var(--surface-sunken);\n box-shadow: inset 0 0 0 1px var(--border);\n transition:\n background-color 0.2s cubic-bezier(0, 0, 0.2, 1),\n box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1),\n transform 0.1s cubic-bezier(0, 0, 0.2, 1);\n}\n.input:hover + .circle {\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.input:focus-visible + .circle {\n outline: 2px solid var(--brand-main);\n outline-offset: 2px;\n}\n.input:active + .circle {\n transform: scale(0.88);\n}\n.input:checked + .circle {\n background: var(--brand-main);\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.dot {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: #fff;\n transform: scale(0);\n transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.input:checked + .circle .dot {\n transform: scale(1);\n}\n","import type { ChangeEvent } from 'react';\nimport styles from './RadioButton.module.css';\n\ninterface RadioButtonProps {\n checked: boolean;\n onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n name?: string;\n value?: string;\n ariaLabel?: string;\n className?: string;\n}\n\nexport function RadioButton({ checked, onChange, name, value, ariaLabel, className }: RadioButtonProps) {\n return (\n <label className={`${styles.radio} ${className ?? ''}`}>\n <input\n type=\"radio\"\n className={styles.input}\n checked={checked}\n onChange={onChange}\n name={name}\n value={value}\n aria-label={ariaLabel}\n />\n <span className={styles.circle}>\n <span className={styles.dot} />\n </span>\n </label>\n );\n}\n",".field {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.label {\n font-size: 0.85rem;\n font-weight: 550;\n color: var(--text-primary);\n padding-left: 8px;\n}\n.inputWrap {\n position: relative;\n display: flex;\n align-items: center;\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border-input);\n transition: box-shadow 0.2s ease-out;\n}\n.inputWrap:focus-within {\n box-shadow:\n inset 0 0 0 0 var(--border-input),\n 0 0 0 2px var(--brand-main);\n}\n.errorWrap,\n.errorWrap:focus-within {\n box-shadow: inset 0 0 0 1px var(--danger-text);\n}\n.inputWrap:has(.input:disabled) {\n background: var(--surface-muted);\n}\n\n.sm {\n border-radius: 10px;\n}\n.sm .input {\n padding: 8px 12px;\n font-size: 0.8rem;\n}\n.base {\n border-radius: 12px;\n}\n.base .input {\n padding: 12px 14px;\n font-size: 0.9rem;\n}\n.lg {\n border-radius: 14px;\n}\n.lg .input {\n padding: 16px 16px;\n font-size: 1rem;\n}\n.inputWrap:has(.icon) .input {\n padding-left: 8px;\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-left: 12px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n.input {\n flex: 1;\n min-width: 0;\n box-sizing: border-box;\n border: none;\n background: none;\n font-family: inherit;\n color: var(--text-primary);\n font-weight: 450;\n}\n.input:focus {\n outline: none;\n}\n.input::placeholder {\n color: var(--text-tertiary);\n}\n.input:disabled {\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.helperText {\n font-size: 0.78rem;\n color: var(--text-tertiary);\n padding-left: 8px;\n}\n.errorText {\n font-size: 0.78rem;\n color: var(--danger-text);\n}\n","import { useId, type InputHTMLAttributes, type ReactNode } from 'react';\nimport styles from './TextField.module.css';\n\ntype TextFieldSize = 'sm' | 'base' | 'lg';\n\ninterface TextFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size'> {\n label?: string;\n helperText?: string;\n error?: string;\n size?: TextFieldSize;\n leadingIcon?: ReactNode;\n}\n\nexport function TextField({\n label,\n helperText,\n error,\n size = 'base',\n leadingIcon,\n id,\n ...rest\n}: TextFieldProps) {\n const generatedId = useId();\n const inputId = id ?? generatedId;\n\n return (\n <div className={styles.field}>\n {label && (\n <label className={styles.label} htmlFor={inputId}>\n {label}\n </label>\n )}\n <div className={`${styles.inputWrap} ${styles[size]} ${error ? styles.errorWrap : ''}`}>\n {leadingIcon && <span className={styles.icon}>{leadingIcon}</span>}\n <input id={inputId} className={styles.input} {...rest} />\n </div>\n {error ? (\n <span className={styles.errorText}>{error}</span>\n ) : helperText ? (\n <span className={styles.helperText}>{helperText}</span>\n ) : null}\n </div>\n );\n}\n",".menu {\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 180px;\n width: fit-content;\n padding: 4px;\n box-sizing: border-box;\n background: var(--card-surface);\n border-radius: 12px;\n box-shadow:\n inset 0 0 0 1px var(--border),\n 0 8px 24px rgba(0, 0, 0, 0.12);\n}\n.divider {\n height: 1px;\n background: var(--border);\n margin: 4px 6px;\n}\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './Menu.module.css';\n\ninterface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, 'className'> {\n children: ReactNode;\n}\n\nexport function Menu({ children, ...rest }: MenuProps) {\n return (\n <div role=\"menu\" className={styles.menu} {...rest}>\n {children}\n </div>\n );\n}\n\nexport function MenuDivider() {\n return <div className={styles.divider} role=\"separator\" />;\n}\n",".item {\n display: flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n box-sizing: border-box;\n border: none;\n background: none;\n border-radius: 8px;\n padding: 8px 10px;\n font-family: inherit;\n font-size: 0.9rem;\n color: var(--text-primary);\n text-align: left;\n cursor: pointer;\n transition:\n background 0.15s ease-out,\n color 0.15s ease-out;\n}\n.item:hover:not(:disabled) {\n background: var(--brand-bg);\n color: var(--brand-dark);\n}\n.item:hover:not(:disabled) .icon,\n.item:hover:not(:disabled) .check {\n color: var(--brand-dark);\n}\n.item:active:not(:disabled) {\n background: var(--brand-main-20);\n}\n.item:focus-visible {\n outline: 2px solid var(--brand-main);\n outline-offset: -2px;\n}\n.item:disabled {\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n.label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.trailing {\n color: var(--text-tertiary);\n font-size: 0.8rem;\n flex-shrink: 0;\n}\n.selected {\n color: var(--text-primary);\n font-weight: 550;\n}\n.selected .icon {\n color: var(--text-primary);\n}\n.check {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-left: 8px;\n color: var(--text-primary);\n flex-shrink: 0;\n}\n.check svg {\n width: 100%;\n height: 100%;\n}\n.destructive {\n color: var(--danger-text);\n}\n.destructive .icon {\n color: var(--danger-text);\n}\n.destructive:hover:not(:disabled) {\n background: var(--danger-bg);\n color: var(--danger-text);\n}\n.destructive:hover:not(:disabled) .icon {\n color: var(--danger-text);\n}\n","import type { ButtonHTMLAttributes, ReactNode } from 'react';\nimport { Check } from 'lucide-react';\nimport styles from './MenuItem.module.css';\n\ninterface MenuItemProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className'> {\n icon?: ReactNode;\n trailing?: ReactNode;\n selected?: boolean;\n destructive?: boolean;\n children: ReactNode;\n}\n\nexport function MenuItem({ icon, trailing, selected, destructive, children, ...rest }: MenuItemProps) {\n const classes = [styles.item, selected && styles.selected, destructive && styles.destructive]\n .filter(Boolean)\n .join(' ');\n\n return (\n <button type=\"button\" role=\"menuitem\" className={classes} {...rest}>\n {icon && <span className={styles.icon}>{icon}</span>}\n <span className={styles.label}>{children}</span>\n {trailing && <span className={styles.trailing}>{trailing}</span>}\n {selected && (\n <span className={styles.check}>\n <Check />\n </span>\n )}\n </button>\n );\n}\n",".field {\n position: relative;\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.label {\n font-size: 0.85rem;\n font-weight: 550;\n color: var(--text-primary);\n padding-left: 8px;\n}\n.trigger {\n display: flex;\n align-items: center;\n width: 100%;\n box-sizing: border-box;\n border: none;\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border-input);\n font-family: inherit;\n color: var(--text-primary);\n cursor: pointer;\n transition: box-shadow 0.2s ease-out;\n}\n.trigger:focus-visible {\n box-shadow:\n inset 0 0 0 0 var(--border-input),\n 0 0 0 2px var(--brand-main);\n}\n.errorWrap {\n box-shadow: inset 0 0 0 1px var(--danger-text);\n}\n.trigger:disabled {\n background: var(--surface-muted);\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n\n.sm {\n border-radius: 10px;\n}\n.sm.trigger {\n padding: 8px 12px;\n font-size: 0.8rem;\n}\n.base {\n border-radius: 12px;\n}\n.base.trigger {\n padding: 12px 14px;\n font-size: 0.9rem;\n}\n.lg {\n border-radius: 14px;\n}\n.lg.trigger {\n padding: 16px 16px;\n font-size: 1rem;\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-right: 8px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n.value {\n flex: 1;\n min-width: 0;\n text-align: left;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.placeholder {\n color: var(--text-tertiary);\n}\n.chevron {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-left: 8px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n transition: transform 0.15s ease-out;\n}\n.chevron svg {\n width: 100%;\n height: 100%;\n}\n.chevronOpen {\n transform: rotate(180deg);\n}\n\n.menuWrap {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n right: 0;\n z-index: 10;\n}\n.helperText {\n font-size: 0.78rem;\n color: var(--text-tertiary);\n padding-left: 8px;\n}\n.errorText {\n font-size: 0.78rem;\n color: var(--danger-text);\n}\n","import { useEffect, useId, useRef, useState, type KeyboardEvent, type ReactNode } from 'react';\nimport { ChevronDown } from 'lucide-react';\nimport { Menu } from './Menu';\nimport { MenuItem } from './MenuItem';\nimport styles from './Dropdown.module.css';\n\ntype DropdownSize = 'sm' | 'base' | 'lg';\n\ninterface DropdownOption<T extends string> {\n value: T;\n label: ReactNode;\n icon?: ReactNode;\n disabled?: boolean;\n}\n\ninterface DropdownProps<T extends string> {\n label?: string;\n helperText?: string;\n error?: string;\n size?: DropdownSize;\n placeholder?: string;\n options: DropdownOption<T>[];\n value?: T;\n onChange: (value: T) => void;\n disabled?: boolean;\n}\n\nexport function Dropdown<T extends string>({\n label,\n helperText,\n error,\n size = 'base',\n placeholder = 'Select…',\n options,\n value,\n onChange,\n disabled,\n}: DropdownProps<T>) {\n const [open, setOpen] = useState(false);\n const rootRef = useRef<HTMLDivElement>(null);\n const triggerId = useId();\n\n const selected = options.find((opt) => opt.value === value);\n const enabledValues = options.filter((opt) => !opt.disabled).map((opt) => opt.value);\n\n useEffect(() => {\n if (!open) return;\n const focusValue = value ?? enabledValues[0];\n const el = rootRef.current?.querySelector<HTMLButtonElement>(`[data-value=\"${focusValue}\"]`);\n el?.focus();\n }, [open]);\n\n useEffect(() => {\n if (!open) return;\n function onPointerDown(e: PointerEvent) {\n if (!rootRef.current?.contains(e.target as Node)) setOpen(false);\n }\n function onKeyDown(e: globalThis.KeyboardEvent) {\n if (e.key === 'Escape') setOpen(false);\n }\n window.addEventListener('pointerdown', onPointerDown);\n window.addEventListener('keydown', onKeyDown);\n return () => {\n window.removeEventListener('pointerdown', onPointerDown);\n window.removeEventListener('keydown', onKeyDown);\n };\n }, [open]);\n\n function handleTriggerKeyDown(e: KeyboardEvent<HTMLButtonElement>) {\n if (e.key === 'ArrowDown' || e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setOpen(true);\n return;\n }\n if (e.key === 'Escape') setOpen(false);\n }\n\n function handleOptionKeyDown(e: KeyboardEvent<HTMLButtonElement>, currentValue: T) {\n const currentIndex = enabledValues.indexOf(currentValue);\n if (currentIndex === -1) return;\n\n let nextIndex: number | null = null;\n if (e.key === 'ArrowDown') nextIndex = (currentIndex + 1) % enabledValues.length;\n if (e.key === 'ArrowUp') nextIndex = (currentIndex - 1 + enabledValues.length) % enabledValues.length;\n if (e.key === 'Home') nextIndex = 0;\n if (e.key === 'End') nextIndex = enabledValues.length - 1;\n\n if (nextIndex !== null) {\n e.preventDefault();\n const nextValue = enabledValues[nextIndex];\n const el = rootRef.current?.querySelector<HTMLButtonElement>(`[data-value=\"${nextValue}\"]`);\n el?.focus();\n return;\n }\n if (e.key === 'Escape') setOpen(false);\n }\n\n return (\n <div className={styles.field} ref={rootRef}>\n {label && (\n <label className={styles.label} htmlFor={triggerId}>\n {label}\n </label>\n )}\n <button\n id={triggerId}\n type=\"button\"\n className={`${styles.trigger} ${styles[size]} ${error ? styles.errorWrap : ''}`}\n aria-haspopup=\"listbox\"\n aria-expanded={open}\n disabled={disabled}\n onClick={() => setOpen((v) => !v)}\n onKeyDown={handleTriggerKeyDown}\n >\n {selected?.icon && <span className={styles.icon}>{selected.icon}</span>}\n <span className={`${styles.value} ${!selected ? styles.placeholder : ''}`}>\n {selected ? selected.label : placeholder}\n </span>\n <span className={`${styles.chevron} ${open ? styles.chevronOpen : ''}`}>\n <ChevronDown />\n </span>\n </button>\n {open && (\n <div className={styles.menuWrap}>\n <Menu role=\"listbox\" style={{ width: '100%' }}>\n {options.map((opt) => (\n <MenuItem\n key={opt.value}\n data-value={opt.value}\n role=\"option\"\n aria-selected={opt.value === value}\n icon={opt.icon}\n selected={opt.value === value}\n disabled={opt.disabled}\n onClick={() => {\n onChange(opt.value);\n setOpen(false);\n }}\n onKeyDown={(e) => handleOptionKeyDown(e, opt.value)}\n >\n {opt.label}\n </MenuItem>\n ))}\n </Menu>\n </div>\n )}\n {error ? (\n <span className={styles.errorText}>{error}</span>\n ) : helperText ? (\n <span className={styles.helperText}>{helperText}</span>\n ) : null}\n </div>\n );\n}\n",".highlight {\n background: var(--brand-bg);\n color: var(--brand-dark);\n border-radius: 3px;\n padding: 0 1px;\n}\n","import { Fragment } from 'react';\nimport styles from './HighlightText.module.css';\n\nfunction escapeRegExp(value: string): string {\n return value.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&');\n}\n\nexport function HighlightText({ text, query }: { text: string; query: string }) {\n if (!query) return <>{text}</>;\n\n const parts = text.split(new RegExp(`(${escapeRegExp(query)})`, 'ig'));\n return (\n <>\n {parts.map((part, i) =>\n part.toLowerCase() === query.toLowerCase() ? (\n <mark key={i} className={styles.highlight}>\n {part}\n </mark>\n ) : (\n <Fragment key={i}>{part}</Fragment>\n ),\n )}\n </>\n );\n}\n",".group {\n position: relative;\n}\n.btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: none;\n border: none;\n border-radius: 12px;\n padding: 12px;\n font-family: inherit;\n font-size: 1rem;\n color: var(--text-primary);\n cursor: pointer;\n transition:\n background 0.2s ease-out,\n box-shadow 0.2s ease-out,\n transform 0.2s ease-out;\n}\n.btn:hover {\n background: rgba(10, 10, 11, 0.04);\n}\n.btn:active {\n background: var(--brand-bg);\n box-shadow: inset 0 2px 1px 0 rgba(0, 140, 216, 0.25);\n transform: scale(0.95);\n}\n.caret {\n color: var(--text-tertiary);\n display: flex;\n align-items: center;\n}\n.caret svg {\n width: 14px;\n height: 14px;\n}\n.label {\n color: var(--text-secondary);\n}\n.badge {\n position: absolute;\n top: 2px;\n right: 2px;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 999px;\n background: var(--brand-main, #0a84d8);\n color: #fff;\n font-size: 0.65rem;\n font-weight: 600;\n line-height: 16px;\n text-align: center;\n}\n.value {\n color: var(--text-primary);\n font-weight: 500;\n}\n.panel {\n display: none;\n position: absolute;\n top: calc(100% + 6px);\n left: 0;\n background: #fff;\n border-radius: 12px;\n min-width: 220px;\n width: fit-content;\n max-height: 280px;\n overflow-y: auto;\n box-shadow:\n inset 0 0 0 1px var(--border),\n 0 8px 24px rgba(0, 0, 0, 0.12);\n z-index: 50;\n}\n.panel.open {\n display: block;\n}\n.panelRight {\n left: auto;\n right: 0;\n}\n.panelWide {\n min-width: 260px;\n padding-bottom: 4px;\n}\n.sectionHeader {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n padding: 12px 14px 4px;\n}\n.sectionLabel {\n font-size: 0.75rem;\n font-weight: 600;\n color: var(--text-tertiary);\n text-transform: uppercase;\n letter-spacing: 0.02em;\n}\n.allToggle {\n background: none;\n border: none;\n padding: 0;\n font-family: inherit;\n font-size: 0.75rem;\n font-weight: 600;\n color: var(--brand-main, #0a84d8);\n cursor: pointer;\n}\n.allToggle:hover {\n text-decoration: underline;\n}\n.divider {\n height: 1px;\n background: var(--border);\n margin: 4px 0;\n}\n.option {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px;\n border-radius: 8px;\n font-size: 1rem;\n cursor: pointer;\n}\n.option:hover {\n background: var(--bg);\n}\n.search {\n width: calc(100% - 16px);\n box-sizing: border-box;\n border: none;\n box-shadow: inset 0 0 0 1px var(--border-input);\n border-radius: 8px;\n padding: 8px 12px;\n margin: 8px;\n font-family: inherit;\n font-size: 1rem;\n margin-bottom: 0;\n}\n.search:focus {\n outline: none;\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.optionsList {\n padding: 4px 4px;\n}\n.empty {\n padding: 7px 8px;\n color: var(--text-tertiary);\n font-size: 0.85rem;\n}\n","import { useState } from 'react';\nimport { Checkbox } from './Checkbox';\nimport styles from './FilterSection.module.css';\n\ninterface FilterSectionProps<T extends string> {\n label: string;\n options: T[];\n optionLabel: (opt: T) => string;\n activeSet: Set<T>;\n onToggle: (opt: T) => void;\n onSetAll?: (opts: T[]) => void;\n searchable?: boolean;\n}\n\nexport function FilterSection<T extends string>({\n label,\n options,\n optionLabel,\n activeSet,\n onToggle,\n onSetAll,\n searchable,\n}: FilterSectionProps<T>) {\n const [query, setQuery] = useState('');\n\n const q = query.trim().toLowerCase();\n const matches = q ? options.filter((opt) => optionLabel(opt).toLowerCase().includes(q)) : options;\n const allSelected = options.length > 0 && activeSet.size === options.length;\n\n return (\n <div>\n <div className={styles.sectionHeader}>\n <div className={styles.sectionLabel}>{label}</div>\n {onSetAll && (\n <button\n type=\"button\"\n className={styles.allToggle}\n onClick={() => onSetAll(allSelected ? [] : options)}\n >\n {allSelected ? 'Deselect all' : 'Select all'}\n </button>\n )}\n </div>\n {searchable && (\n <input\n type=\"text\"\n className={styles.search}\n placeholder={`Search ${label.toLowerCase()}…`}\n autoComplete=\"off\"\n value={query}\n onClick={(e) => e.stopPropagation()}\n onChange={(e) => setQuery(e.target.value)}\n />\n )}\n <div className={styles.optionsList}>\n {matches.length === 0 && <div className={styles.empty}>No match</div>}\n {matches.map((opt) => (\n <label key={opt} className={styles.option}>\n <Checkbox checked={activeSet.has(opt)} onChange={() => onToggle(opt)} />\n <span>{optionLabel(opt)}</span>\n </label>\n ))}\n </div>\n </div>\n );\n}\n",".sidebar {\n width: 256px;\n flex: 0 0 256px;\n border-radius: 16px 16px 0 0;\n box-shadow:\n 1px 0 0 rgba(10, 10, 11, 0.03),\n 0 -1px 0 rgba(10, 10, 11, 0.05);\n background: var(--surface-sunken);\n padding: 24px 16px 24px 24px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n gap: 4px;\n overflow-y: auto;\n}\n.title {\n font-weight: 500;\n font-size: 1.15rem;\n letter-spacing: -0.01em;\n margin: 0 0 16px 8px;\n}\n.navLink {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n padding: 8px 8px;\n border-radius: 8px;\n color: var(--text-secondary);\n text-decoration: none;\n font-size: 0.9rem;\n font-weight: 500;\n}\n.navLink:hover {\n background: var(--card-surface);\n color: var(--text-primary);\n}\n.count {\n color: var(--text-tertiary);\n font-size: 0.78rem;\n font-weight: 500;\n}\n","import styles from './UiElementsSidebar.module.css';\n\ninterface UiElementsSidebarProps {\n sections: { id: string; label: string; count: number }[];\n}\n\nexport function UiElementsSidebar({ sections }: UiElementsSidebarProps) {\n return (\n <aside className={styles.sidebar}>\n <div className={styles.title}>UI Elements</div>\n {sections.map((section) => (\n <a key={section.id} href={`#${section.id}`} className={styles.navLink}>\n <span>{section.label}</span>\n <span className={styles.count}>{section.count}</span>\n </a>\n ))}\n </aside>\n );\n}\n",".line,\n.box {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n}\n\n.indicator {\n position: absolute;\n left: 0;\n pointer-events: none;\n transition: translate 0.25s cubic-bezier(0.39, 0.575, 0.565, 1), width 0.25s ease,\n scale 0.125s cubic-bezier(0.39, 0.575, 0.565, 1);\n}\n\n.indicator.settling {\n transition: scale 0.1s linear;\n}\n\n.indicatorLine {\n bottom: 0;\n height: 2px;\n background: var(--brand-main);\n}\n\n.indicatorBox {\n top: 4px;\n bottom: 4px;\n border-radius: 8px;\n background: var(--card-surface);\n box-shadow: 0 0 1px 0.5px var(--border);\n}\n\n.tab {\n position: relative;\n isolation: isolate;\n overflow: hidden;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n border: none;\n border-radius: 8px 8px 0 0;\n font-family: inherit;\n font-weight: 450;\n cursor: pointer;\n white-space: nowrap;\n transition: color 0.15s ease-out, background 0.15s ease-out, box-shadow 0.15s ease-out;\n}\n\n.tab::before {\n content: '';\n position: absolute;\n left: 50%;\n bottom: 0;\n width: 40%;\n aspect-ratio: 1;\n border-radius: 50%;\n transform: translate(-50%, 100%) scale(1);\n transition: transform 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);\n z-index: -1;\n pointer-events: none;\n background: rgba(var(--brand-main-rgb), 0.08);\n}\n.tab:hover:not(:disabled)::before {\n transform: translate(-50%, 15%) scale(4);\n}\n.tab:active:not(:disabled)::before {\n background: rgba(var(--brand-main-rgb), 0.28);\n}\n\n.tab:disabled {\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.tab:disabled::before {\n display: none;\n}\n\n.tab.selected:hover::before {\n display: none;\n}\n\n.tab:focus-visible {\n outline: 2px solid var(--brand-main);\n outline-offset: 2px;\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n\n/* Line variant */\n\n.line {\n box-shadow: inset 0 -1px 0 0 var(--border);\n}\n\n.line .tab {\n background: transparent;\n padding: 12px 6px;\n font-size: 1rem;\n color: var(--text-secondary);\n}\n.line .tab:hover:not(:disabled) {\n color: var(--brand-main);\n}\n.line .tab.selected {\n color: var(--text-primary);\n font-weight: 550;\n}\n\n/* Box variant */\n\n.box {\n background: rgba(16, 24, 32, 0.04);\n border-radius: 10px;\n padding: 4px;\n gap: 4px;\n box-shadow: inset 0 0 0.5px 1px #e3e3e3;\n}\n\n.box .tab {\n border-radius: 8px;\n padding: 8px 14px;\n font-size: 0.9rem;\n background: transparent;\n color: var(--text-secondary);\n}\n.box .tab:hover:not(:disabled) {\n color: var(--brand-main);\n /* box-shadow: 0 0 0px 1px var(--brand-main-30); */\n}\n.box .tab.selected {\n color: var(--text-primary);\n font-weight: 550;\n}\n\n.box.sm .tab {\n border-radius: 8px;\n padding: 4px 14px;\n}\n","import {\n useLayoutEffect,\n useRef,\n useState,\n type KeyboardEvent,\n type ReactNode,\n type TransitionEvent,\n} from 'react';\nimport styles from './Tabs.module.css';\n\ntype TabsVariant = 'line' | 'box';\ntype TabsSize = 'base' | 'sm';\n\ninterface TabItem {\n value: string;\n label: ReactNode;\n icon?: ReactNode;\n disabled?: boolean;\n}\n\ninterface TabsProps {\n items: TabItem[];\n value: string;\n onChange: (value: string) => void;\n variant?: TabsVariant;\n size?: TabsSize;\n 'aria-label'?: string;\n}\n\nexport function Tabs({ items, value, onChange, variant = 'line', size = 'base', ...rest }: TabsProps) {\n const enabledValues = items.filter((item) => !item.disabled).map((item) => item.value);\n\n const containerRef = useRef<HTMLDivElement | null>(null);\n const tabRefs = useRef<Map<string, HTMLButtonElement>>(new Map());\n const prevValueRef = useRef(value);\n const [indicatorStyle, setIndicatorStyle] = useState<{ left: number; width: number } | null>(\n null,\n );\n const [pillPhase, setPillPhase] = useState<'idle' | 'moving' | 'settling'>('idle');\n\n useLayoutEffect(() => {\n const selectedTab = tabRefs.current.get(value);\n if (!selectedTab) return;\n setIndicatorStyle({ left: selectedTab.offsetLeft, width: selectedTab.offsetWidth });\n\n if (variant === 'box' && prevValueRef.current !== value) {\n setPillPhase('moving');\n }\n prevValueRef.current = value;\n }, [value, items, variant, size]);\n\n function handlePillTransitionEnd(event: TransitionEvent<HTMLSpanElement>) {\n if (event.propertyName !== 'scale') return;\n if (pillPhase === 'moving') setPillPhase('settling');\n else if (pillPhase === 'settling') setPillPhase('idle');\n }\n\n useLayoutEffect(() => {\n const container = containerRef.current;\n if (!container) return;\n const observer = new ResizeObserver(() => {\n const selectedTab = tabRefs.current.get(value);\n if (!selectedTab) return;\n setIndicatorStyle({ left: selectedTab.offsetLeft, width: selectedTab.offsetWidth });\n });\n observer.observe(container);\n return () => observer.disconnect();\n }, [value]);\n\n function handleKeyDown(event: KeyboardEvent<HTMLDivElement>) {\n const currentIndex = enabledValues.indexOf(value);\n if (currentIndex === -1) return;\n\n let nextIndex: number | null = null;\n if (event.key === 'ArrowRight') nextIndex = (currentIndex + 1) % enabledValues.length;\n if (event.key === 'ArrowLeft') {\n nextIndex = (currentIndex - 1 + enabledValues.length) % enabledValues.length;\n }\n if (event.key === 'Home') nextIndex = 0;\n if (event.key === 'End') nextIndex = enabledValues.length - 1;\n\n if (nextIndex !== null) {\n event.preventDefault();\n onChange(enabledValues[nextIndex]);\n }\n }\n\n return (\n <div\n ref={containerRef}\n role=\"tablist\"\n className={[styles[variant], variant === 'box' && size === 'sm' && styles.sm]\n .filter(Boolean)\n .join(' ')}\n onKeyDown={handleKeyDown}\n {...rest}\n >\n {indicatorStyle && (\n <span\n aria-hidden\n className={[\n styles.indicator,\n variant === 'line' ? styles.indicatorLine : styles.indicatorBox,\n pillPhase === 'settling' && styles.settling,\n ]\n .filter(Boolean)\n .join(' ')}\n onTransitionEnd={handlePillTransitionEnd}\n style={{\n translate: `${indicatorStyle.left}px 0`,\n scale: variant === 'box' && pillPhase === 'moving' ? 0.92 : 1,\n width: indicatorStyle.width,\n }}\n />\n )}\n {items.map((item) => {\n const selected = item.value === value;\n return (\n <button\n key={item.value}\n ref={(node) => {\n if (node) tabRefs.current.set(item.value, node);\n else tabRefs.current.delete(item.value);\n }}\n type=\"button\"\n role=\"tab\"\n aria-selected={selected}\n disabled={item.disabled}\n tabIndex={selected ? 0 : -1}\n className={[styles.tab, selected && styles.selected].filter(Boolean).join(' ')}\n onClick={() => !item.disabled && onChange(item.value)}\n >\n {item.icon && <span className={styles.icon}>{item.icon}</span>}\n {item.label}\n </button>\n );\n })}\n </div>\n );\n}\n","export function formatDuration(mins: number): string {\n const h = Math.floor(mins / 60);\n const m = mins % 60;\n return `${h}h:${String(m).padStart(2, '0')}m`;\n}\n\n/** HH:MM:SS — seconds are a stable per-video display detail, not tracked in the data model. */\nexport function formatDurationHMS(mins: number, seconds: number): string {\n const h = Math.floor(mins / 60);\n const m = mins % 60;\n const pad = (n: number) => String(n).padStart(2, '0');\n return `${pad(h)}:${pad(m)}:${pad(seconds)}`;\n}\n"],"x_google_ignoreList":[6,7,8,9,10,11,12,13,14,15,16,17,18,19,20],"mappings":";;;;;;;;;;;;;;;ACgBA,SAAgB,EAAO,EACrB,aAAU,WACV,UAAO,QACP,gBACA,iBACA,aACA,GAAG,KACW;CACd,IAAM,IAAW,CAAC,KAAY,EAAQ;CACtC,OACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW,GAAG,EAAO,GAAS,GAAG,EAAO,KAAQ,IAAW,IAAI,EAAO,aAAa;EACnF,GAAI;EAHN,UAAA;GAKG,KAAe,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAO,UAAA;GAAkB,CAAA;GAChE;GACA,KAAgB,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAO,UAAA;GAAmB,CAAA;EAC7D;;AAEZ;;;;;;;;;;;;;AEjBA,SAAgB,EAAK,EACnB,YACA,cACA,gBACA,cACA,aACA,UACA,aACA,GAAG,KACS;CACZ,OACE,kBAAC,OAAD;EAAK,WAAW,GAAG,EAAO,KAAK,GAAG,IAAQ,EAAO,QAAQ;EAAzD,UAAA,CACG,KAAW,kBAAC,OAAD,EAAK,WAAW,GAAG,EAAO,QAAQ,GAAG,IAAY,EAAO,YAAY,KAAO,CAAA,GACvF,kBAAC,OAAD;GACE,WAAW;IACT,EAAO;IACP,IAAY,EAAO,YAAY;IAC/B,IAAc,EAAO,cAAc;IACnC,IAAY,EAAO,YAAY;IAC/B,IAAW,EAAO,WAAW;GAC/B,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;GACX,GAAI;GAEH;EACE,CAAA,CACF;;AAET;;;;;;;;;;;AEtCA,SAAgB,EAAI,EAAE,aAAU,WAAW,aAAU,GAAG,KAAkB;CACxE,OACE,kBAAC,QAAD;EAAM,WAAW,EAAO;EAAU,GAAI;EACnC;CACG,CAAA;AAEV;;;ACTA,IAAM,KAAe,MAAW,GAAQ,QAAQ,sBAAsB,OAAO,CAAC,CAAC,YAAY;;;ACE3F,SAAS,EAAiB,GAAU,GAAU,IAAU,CAAC,GAAG;CAC1D,IAAI,KAAY,MACd,MAAU,MAAM,uDAAuD;CAEzE,OAAO;EACL,MAAM,EAAY,CAAQ;EAC1B,MAAM;EACN,MAAM;EACN,GAAG,EAAQ,SAAS,IAAI,EAAE,WAAQ,IAAI,CAAC;CACzC;AACF;;;ACZA,IAAM,KAAe,MAAW;CAC9B,IAAI,IAAM,IACN,IAAY;CAChB,KAAK,IAAM,KAAM,GAAQ;EACvB,IAAI,MAAO,OAAO,MAAO,OAAO,KAAM,KAAK;GACzC,IAAY,EAAI,SAAS;GACzB;EACF;EAMA,AALI,EAAI,WAAW,IACjB,KAAO,EAAG,YAAY,IAEtB,KAAO,IAAY,EAAG,YAAY,IAAI,GAExC,IAAY;CACd;CACA,OAAO;AACT,GCdM,KAAgB,MAAW;CAC/B,IAAM,IAAY,EAAY,CAAM;CACpC,OAAO,EAAU,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAU,MAAM,CAAC;AAC9D,GCLM,KAAgB,GAAG,MAAY,EAAQ,QAAQ,GAAW,GAAO,MAC9D,EAAQ,KAAc,EAAU,KAAK,MAAM,MAAM,EAAM,QAAQ,CAAS,MAAM,CACtF,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,GCFZ,IAAoB;CACxB,OAAO;CACP,OAAO;CACP,QAAQ;CACR,SAAS;CACT,MAAM;CACN,QAAQ;CACR,gBAAgB;CAChB,kBAAkB;CAClB,mBAAmB;AACrB;;;ACPA,SAAS,EAAU,GAAO;CACxB,OAAO,KAAU;AACnB;AACA,SAAS,EAAoB,GAAM,IAAS,CAAC,GAAG;CAC9C,IAAM,IAAiB,EAAO,kBAAkB,CAAC,GAC3C,KAAoB,MAAkB,EAAe,MAAkB,GACvE,IAAe,EAAK,QAAQ,EAAK,SAAS,EAAkB,OAC5D,IAAgB,EAAK,QAAQ,EAAK,UAAU,EAAkB,QAC9D,IAAkB,EAAK,SAAS,QAAQ,MAAU,OAAO,KAAU,YAAY,EAAM,KAAK,MAAM,EAAE,CAAC,CAAC,KAAK,MAAU,UAAU,GAAO,KAAK,CAAC,GAC1I,IAAiB,CAAC,GAAG,EAAK,OAAO,CAAC,UAAU,EAAK,MAAM,IAAI,CAAC,GAAG,GAAG,CAAe,GACjF,IAA0B,EAAO,WAAW,MAAM,GAAG,CAAC,CAAC,OAAO,OAAO,KAAK,CAAC,GAC3E,IAAY,EAAO,0BAA0B,KAAQ,EAAa,GAAG,CAAuB,IAAI,EAAa,UAAU,GAAG,GAAgB,GAAG,CAAuB,GACpK,IAAwB,EAAO,sBAAsB,OAAO,EAAO,eAAe,EAAkB,eAAe,IAAI,OAAO,EAAK,QAAQ,EAAK,SAAS,EAAkB,KAAQ,IAAI,OAAO,EAAO,QAAQ,EAAO,SAAS,EAAkB,KAAQ,IAAI,EAAO,eAAe,EAAkB;CA6BzS,OAAO;EACL;EACA;GA7BA,GAAG,OAAO,QAAQ,CAAiB,CAAC,CAAC,QAAQ,GAAO,CAAC,GAAU,QAC7D,EAAM,EAAiB,CAAQ,KAAK,GAC7B,IACN,CAAC,CAAC;GACL,GAAG,WAAW,KAAU,EAAO,SAAS,GACrC,EAAiB,QAAQ,IAAI,EAAO,MACvC;GACA,GAAG,UAAU,KAAU,EAAU,EAAO,IAAI,KAAK;KAC9C,EAAiB,OAAO,IAAI,EAAO;KACnC,EAAiB,QAAQ,IAAI,EAAO;GACvC;GACA,GAAG,WAAW,KAAU,EAAU,EAAO,KAAK,KAAK,GAChD,EAAiB,OAAO,IAAI,EAAO,MACtC;GACA,GAAG,YAAY,KAAU,EAAU,EAAO,MAAM,KAAK,GAClD,EAAiB,QAAQ,IAAI,EAAO,OACvC;IACC,EAAiB,cAAc,IAAI;GACpC,GAAG,KAAa,GACb,EAAiB,OAAO,IAAI,EAC/B;IACC,EAAiB,SAAS,IAAI,OAAO,EAAa,GAAG;GACtD,GAAG,EAAO,gBAAgB,KAAQ,GAC/B,EAAiB,aAAa,IAAI,OACrC,IAAI,CAAC;GACL,GAAG,gBAAgB,KAAU,EAAO;EAI3B;EACT,EAAK,KAAK,KAAK,MAAU;GACvB,IAAM,CAAC,GAAM,GAAO,KAAY,GAC1B,IAAY,EAAO,mBAAmB;KAAG,EAAiB,eAAe,IAAI;IAAsB,GAAG;GAAM,IAAI;GACtH,OAAO,IAAW;IAAC;IAAM;IAAW;GAAQ,IAAI,CAAC,GAAM,CAAS;EAClE,CAAC;CACH;AACF;;;ACnDA,SAAS,EAAwB,GAAM,IAAS,CAAC,GAAG;CAClD,OAAO,EAAoB,GAAM;EAC/B,GAAG;EACH,gBAAgB;GACd,GAAG,EAAO;GACV,OAAO;GACP,gBAAgB;GAChB,kBAAkB;GAClB,mBAAmB;GACnB,iBAAiB;EACnB;CACF,CAAC;AACH;;;ACdA,IAAM,KAAe,MAAU;CAC7B,KAAK,IAAM,KAAQ,GACjB,IAAI,EAAK,WAAW,OAAO,KAAK,MAAS,UAAU,MAAS,SAC1D,OAAO;CAGX,OAAO;AACT,GCHM,KAAgB,EAAc,CAAC,CAAC,GAuBhC,WAAyB,EAAW,EAAa,GCnBjD,KAAO,GACV,EACC,UACA,SACA,UACA,WACA,gBACA,wBACA,qBACA,eAAY,IACZ,aACA,cAAW,CAAC,GACZ,UAAO;CACL,MAAM;CACN,SAAS,CAAC;CACV,MAAM;AACR,GACA,GAAG,KACF,MAAQ;CACT,IAAM,EACJ,MAAM,IAAc,IACpB,aAAa,IAAqB,GAClC,qBAAqB,IAA6B,IAClD,kBAAkB,IAA0B,IAC5C,OAAO,IAAe,gBACtB,WAAW,IAAe,OACxB,GAAiB,KAAK,CAAC,GACrB,IAAoB,EAAQ,KAAa,EAAY,CAAI,GACzD,CAAC,GAAM,GAAe,IAAgB,CAAC,KAAK,EAAwB,GAAM;EAC9E,OAAO,KAAS;EAChB,OAAO,KAAS,KAAQ;EACxB,QAAQ,KAAU,KAAQ;EAC1B,aAAa,KAAe;EAC5B,qBAAqB,KAAuB;EAC5C,kBAAkB,KAAoB;EACtC,WAAW,EAAa,GAAc,CAAS;EAC/C,aAAa;EACb,YAAY;CACd,CAAC;CACD,OAAO,EACL,GACA;EACE;EACA,GAAG;CACL,GACA,CACE,GAAG,EAAc,KAAK,CAAC,GAAK,OAAW,EAAc,GAAK,CAAK,CAAC,GAChE,GAAG,MAAM,QAAQ,CAAQ,IAAI,IAAW,CAAC,CAAQ,CACnD,CACF;AACF,CACF;;;ACtDA,SAAS,EAAiB,GAAgB,IAAW,CAAC,GAAG,IAAU,CAAC,GAAG;CACrE,IAAM,IAAW,OAAO,KAAmB,WAAW,EAAiB,GAAgB,GAAU,CAAO,IAAI,GACtG,IAAY,GACf,EAAE,cAAW,GAAG,KAAS,MAAQ,EAAc,IAAM;EACpD;EACA,MAAM;EACN;EACA,GAAG;CACL,CAAC,CACH;CAIA,OAHI,EAAS,SACX,EAAU,cAAc,EAAa,EAAS,IAAI,IAE7C;AACT;;;ACjBA,IAAMA,IAAa;CACjB,MAAM;CACN,MAAM;CACN,MAAM,CAAC,CAAC,QAAQ;EAAE,GAAG;EAAmB,KAAK;CAAS,CAAC,CAAC;AAC1D;AACAA,EAAW;AACX,IAAM,IAAQ,EAAiBA,CAAU,GCNnCC,IAAa;CACjB,MAAM;CACN,MAAM;CACN,MAAM,CAAC,CAAC,QAAQ;EAAE,GAAG;EAAgB,KAAK;CAAS,CAAC,CAAC;AACvD;AACAA,EAAW;AACX,IAAM,IAAc,EAAiBA,CAAU,GCNzC,IAAa;CACjB,MAAM;CACN,MAAM;CACN,MAAM,CACJ,CAAC,QAAQ;EAAE,GAAG;EAAoB,KAAK;CAAS,CAAC,GACjD,CAAC,UAAU;EAAE,IAAI;EAAM,IAAI;EAAM,GAAG;EAAK,KAAK;CAAS,CAAC,CAC1D;AACF;AACA,EAAW;AACX,IAAM,IAAS,EAAiB,CAAU;;;;;;;;;;AEF1C,SAAgB,EAAQ,EACtB,gBACA,mBACA,iBAAc,WACd,mBAAgB,MAChB,iBAAc,KACd,eACe;CACf,IAAM,IAAY,EAAyB,IAAI;CAa/C,OAXA,QAAgB;EACd,SAAS,EAAU,GAAkB;GACnC,CAAK,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,YAAY,MAAM,EAAY,YAAY,MAC9E,EAAE,eAAe,GACjB,EAAU,SAAS,MAAM;EAE7B;EAEA,OADA,OAAO,iBAAiB,WAAW,CAAS,SAC/B,OAAO,oBAAoB,WAAW,CAAS;CAC9D,GAAG,CAAC,CAAW,CAAC,GAGd,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAvB,UAAA,CACE,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAvB,UAAA;IACE,kBAAC,QAAD;KAAM,WAAW,EAAO;KACtB,UAAA,kBAAC,GAAD,CAAS,CAAA;IACL,CAAA;IACN,kBAAC,SAAD;KACE,KAAK;KACL,MAAK;KACL,WAAW,EAAO;KACL;KACb,cAAa;KACb,OAAO;KACP,WAAW,MAAqC,IAAiB,EAAE,OAAO,KAAK;IAChF,CAAA;IACA,KACC,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAgB,eAAY;KACjD,UAAA;IACG,CAAA;GAEL;EACJ,CAAA,GAAA,KAAY,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAW;EAAc,CAAA,CAC1D;;AAET;;;;;;;;;AEnDA,SAAgB,EAAS,EAAE,YAAS,aAAU,cAAW,gBAA4B;CACnF,OACE,kBAAC,SAAD;EAAO,WAAW,GAAG,EAAO,SAAS,GAAG,KAAa;EAArD,UAAA,CACE,kBAAC,SAAD;GACE,MAAK;GACL,WAAW,EAAO;GACT;GACC;GACV,cAAY;EACb,CAAA,GACD,kBAAC,QAAD;GAAM,WAAW,EAAO;GACtB,UAAA,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAM,SAAQ;IAAY,eAAY;IAC3D,UAAA,kBAAC,YAAD,EAAU,QAAO,gBAAiB,CAAA;GAC/B,CAAA;EACD,CAAA,CACD;;AAEX;;;;;;;;;AEfA,SAAgB,EAAY,EAAE,YAAS,aAAU,SAAM,UAAO,cAAW,gBAA+B;CACtG,OACE,kBAAC,SAAD;EAAO,WAAW,GAAG,EAAO,MAAM,GAAG,KAAa;EAAlD,UAAA,CACE,kBAAC,SAAD;GACE,MAAK;GACL,WAAW,EAAO;GACT;GACC;GACJ;GACC;GACP,cAAY;EACb,CAAA,GACD,kBAAC,QAAD;GAAM,WAAW,EAAO;GACtB,UAAA,kBAAC,QAAD,EAAM,WAAW,EAAO,IAAM,CAAA;EAC1B,CAAA,CACD;;AAEX;;;;;;;;;;;;;;;;AEhBA,SAAgB,EAAU,EACxB,UACA,eACA,UACA,UAAO,QACP,gBACA,OACA,GAAG,KACc;CACjB,IAAM,IAAc,EAAM,GACpB,IAAU,KAAM;CAEtB,OACE,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAvB,UAAA;GACG,KACC,kBAAC,SAAD;IAAO,WAAW,EAAO;IAAO,SAAS;IACtC,UAAA;GACI,CAAA;GAET,kBAAC,OAAD;IAAK,WAAW,GAAG,EAAO,UAAU,GAAG,EAAO,GAAM,GAAG,IAAQ,EAAO,YAAY;IAAlF,UAAA,CACG,KAAe,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAO,UAAA;IAAkB,CAAA,GACjE,kBAAC,SAAD;KAAO,IAAI;KAAS,WAAW,EAAO;KAAO,GAAI;IAAO,CAAA,CACrD;;GACJ,IACC,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAY,UAAA;GAAY,CAAA,IAC9C,IACF,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAa,UAAA;GAAiB,CAAA,IACpD;EACD;;AAET;;;;;;;AEpCA,SAAgB,EAAK,EAAE,aAAU,GAAG,KAAmB;CACrD,OACE,kBAAC,OAAD;EAAK,MAAK;EAAO,WAAW,EAAO;EAAM,GAAI;EAC1C;CACE,CAAA;AAET;AAEA,SAAgB,IAAc;CAC5B,OAAO,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAS,MAAK;CAAa,CAAA;AAC3D;;;;;;;;;;;;AELA,SAAgB,EAAS,EAAE,SAAM,aAAU,aAAU,gBAAa,aAAU,GAAG,KAAuB;CACpG,IAAM,IAAU;EAAC,EAAO;EAAM,KAAY,EAAO;EAAU,KAAe,EAAO;CAAW,CAAC,CAC1F,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CAEX,OACE,kBAAC,UAAD;EAAQ,MAAK;EAAS,MAAK;EAAW,WAAW;EAAS,GAAI;EAA9D,UAAA;GACG,KAAQ,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAO,UAAA;GAAW,CAAA;GACnD,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAQ;GAAe,CAAA;GAC9C,KAAY,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAW,UAAA;GAAe,CAAA;GAC9D,KACC,kBAAC,QAAD;IAAM,WAAW,EAAO;IACtB,UAAA,kBAAC,GAAD,CAAQ,CAAA;GACJ,CAAA;EAEF;;AAEZ;;;;;;;;;;;;;;;;;;;;AEFA,SAAgB,EAA2B,EACzC,UACA,eACA,UACA,UAAO,QACP,iBAAc,WACd,YACA,UACA,aACA,eACmB;CACnB,IAAM,CAAC,GAAM,KAAW,EAAS,EAAK,GAChC,IAAU,EAAuB,IAAI,GACrC,IAAY,EAAM,GAElB,IAAW,EAAQ,MAAM,MAAQ,EAAI,UAAU,CAAK,GACpD,IAAgB,EAAQ,QAAQ,MAAQ,CAAC,EAAI,QAAQ,CAAC,CAAC,KAAK,MAAQ,EAAI,KAAK;CASnF,AAPA,QAAgB;EACd,IAAI,CAAC,GAAM;EACX,IAAM,IAAa,KAAS,EAAc;EAE1C,CADW,EAAQ,SAAS,cAAiC,gBAAgB,EAAW,GAAG,EAAA,EACvF,MAAM;CACZ,GAAG,CAAC,CAAI,CAAC,GAET,QAAgB;EACd,IAAI,CAAC,GAAM;EACX,SAAS,EAAc,GAAiB;GACtC,AAAK,EAAQ,SAAS,SAAS,EAAE,MAAc,KAAG,EAAQ,EAAK;EACjE;EACA,SAAS,EAAU,GAA6B;GAC9C,AAAI,EAAE,QAAQ,YAAU,EAAQ,EAAK;EACvC;EAGA,OAFA,OAAO,iBAAiB,eAAe,CAAa,GACpD,OAAO,iBAAiB,WAAW,CAAS,SAC/B;GAEX,AADA,OAAO,oBAAoB,eAAe,CAAa,GACvD,OAAO,oBAAoB,WAAW,CAAS;EACjD;CACF,GAAG,CAAC,CAAI,CAAC;CAET,SAAS,EAAqB,GAAqC;EACjE,IAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;GAE/D,AADA,EAAE,eAAe,GACjB,EAAQ,EAAI;GACZ;EACF;EACA,AAAI,EAAE,QAAQ,YAAU,EAAQ,EAAK;CACvC;CAEA,SAAS,EAAoB,GAAqC,GAAiB;EACjF,IAAM,IAAe,EAAc,QAAQ,CAAY;EACvD,IAAI,MAAiB,IAAI;EAEzB,IAAI,IAA2B;EAM/B,IALI,EAAE,QAAQ,gBAAa,KAAa,IAAe,KAAK,EAAc,SACtE,EAAE,QAAQ,cAAW,KAAa,IAAe,IAAI,EAAc,UAAU,EAAc,SAC3F,EAAE,QAAQ,WAAQ,IAAY,IAC9B,EAAE,QAAQ,UAAO,IAAY,EAAc,SAAS,IAEpD,MAAc,MAAM;GACtB,EAAE,eAAe;GACjB,IAAM,IAAY,EAAc;GAEhC,CADW,EAAQ,SAAS,cAAiC,gBAAgB,EAAU,GAAG,EAAA,EACtF,MAAM;GACV;EACF;EACA,AAAI,EAAE,QAAQ,YAAU,EAAQ,EAAK;CACvC;CAEA,OACE,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAO,KAAK;EAAnC,UAAA;GACG,KACC,kBAAC,SAAD;IAAO,WAAW,EAAO;IAAO,SAAS;IACtC,UAAA;GACI,CAAA;GAET,kBAAC,UAAD;IACE,IAAI;IACJ,MAAK;IACL,WAAW,GAAG,EAAO,QAAQ,GAAG,EAAO,GAAM,GAAG,IAAQ,EAAO,YAAY;IAC3E,iBAAc;IACd,iBAAe;IACL;IACV,eAAe,GAAS,MAAM,CAAC,CAAC;IAChC,WAAW;IARb,UAAA;KAUG,GAAU,QAAQ,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAO,UAAA,EAAS;KAAW,CAAA;KACtE,kBAAC,QAAD;MAAM,WAAW,GAAG,EAAO,MAAM,GAAI,IAAgC,KAArB,EAAO;MACpD,UAAA,IAAW,EAAS,QAAQ;KACzB,CAAA;KACN,kBAAC,QAAD;MAAM,WAAW,GAAG,EAAO,QAAQ,GAAG,IAAO,EAAO,cAAc;MAChE,UAAA,kBAAC,GAAD,CAAc,CAAA;KACV,CAAA;IACA;;GACP,KACC,kBAAC,OAAD;IAAK,WAAW,EAAO;IACrB,UAAA,kBAAC,GAAD;KAAM,MAAK;KAAU,OAAO,EAAE,OAAO,OAAO;KACzC,UAAA,EAAQ,KAAK,MACZ,kBAAC,GAAD;MAEE,cAAY,EAAI;MAChB,MAAK;MACL,iBAAe,EAAI,UAAU;MAC7B,MAAM,EAAI;MACV,UAAU,EAAI,UAAU;MACxB,UAAU,EAAI;MACd,eAAe;OAEb,AADA,EAAS,EAAI,KAAK,GAClB,EAAQ,EAAK;MACf;MACA,YAAY,MAAM,EAAoB,GAAG,EAAI,KAAK;MAEjD,UAAA,EAAI;KACG,GAdH,EAAI,KAcD,CACX;IACG,CAAA;GACH,CAAA;GAEN,IACC,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAY,UAAA;GAAY,CAAA,IAC9C,IACF,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAa,UAAA;GAAiB,CAAA,IACpD;EACD;;AAET;;;;AEtJA,SAAS,GAAa,GAAuB;CAC3C,OAAO,EAAM,QAAQ,uBAAuB,MAAM;AACpD;AAEA,SAAgB,GAAc,EAAE,SAAM,YAA0C;CAC9E,IAAI,CAAC,GAAO,OAAO,kBAAA,GAAA,EAAA,UAAG,EAAO,CAAA;CAE7B,IAAM,IAAQ,EAAK,MAAU,OAAO,IAAI,GAAa,CAAK,EAAE,IAAI,IAAI,CAAC;CACrE,OACE,kBAAA,GAAA,EAAA,UACG,EAAM,KAAK,GAAM,MAChB,EAAK,YAAY,MAAM,EAAM,YAAY,IACvC,kBAAC,QAAD;EAAc,WAAW,GAAO;EAC7B,UAAA;CACG,GAFK,CAEL,IAEN,kBAAC,GAAD,EAAA,UAAmB,EAAe,GAAnB,CAAmB,CAEtC,EACA,CAAA;AAEN;;;;;;;;;;;;;;;;;;;;;;;AEVA,SAAgB,GAAgC,EAC9C,UACA,YACA,gBACA,cACA,aACA,aACA,iBACwB;CACxB,IAAM,CAAC,GAAO,KAAY,EAAS,EAAE,GAE/B,IAAI,EAAM,KAAK,CAAC,CAAC,YAAY,GAC7B,IAAU,IAAI,EAAQ,QAAQ,MAAQ,EAAY,CAAG,CAAC,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,GACpF,IAAc,EAAQ,SAAS,KAAK,EAAU,SAAS,EAAQ;CAErE,OACE,kBAAC,OAAD,EAAA,UAAA;EACE,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAvB,UAAA,CACE,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAe,UAAA;GAAW,CAAA,GAChD,KACC,kBAAC,UAAD;IACE,MAAK;IACL,WAAW,EAAO;IAClB,eAAe,EAAS,IAAc,CAAC,IAAI,CAAO;IAEjD,UAAA,IAAc,iBAAiB;GAC1B,CAAA,CAEP;;EACJ,KACC,kBAAC,SAAD;GACE,MAAK;GACL,WAAW,EAAO;GAClB,aAAa,UAAU,EAAM,YAAY,EAAE;GAC3C,cAAa;GACb,OAAO;GACP,UAAU,MAAM,EAAE,gBAAgB;GAClC,WAAW,MAAM,EAAS,EAAE,OAAO,KAAK;EACzC,CAAA;EAEH,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAvB,UAAA,CACG,EAAQ,WAAW,KAAK,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAO,UAAA;GAAa,CAAA,GACnE,EAAQ,KAAK,MACZ,kBAAC,SAAD;IAAiB,WAAW,EAAO;IAAnC,UAAA,CACE,kBAAC,GAAD;KAAU,SAAS,EAAU,IAAI,CAAG;KAAG,gBAAgB,EAAS,CAAG;IAAI,CAAA,GACvE,kBAAC,QAAD,EAAA,UAAO,EAAY,CAAG,EAAQ,CAAA,CACzB;GAHK,GAAA,CAGL,CACR,CACE;;CACF,EAAA,CAAA;AAET;;;;;;;;;AE3DA,SAAgB,GAAkB,EAAE,eAAoC;CACtE,OACE,kBAAC,SAAD;EAAO,WAAW,EAAO;EAAzB,UAAA,CACE,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAO,UAAA;EAAgB,CAAA,GAC7C,EAAS,KAAK,MACb,kBAAC,KAAD;GAAoB,MAAM,IAAI,EAAQ;GAAM,WAAW,EAAO;GAA9D,UAAA,CACE,kBAAC,QAAD,EAAA,UAAO,EAAQ,MAAY,CAAA,GAC3B,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAQ,UAAA,EAAQ;GAAY,CAAA,CACnD;EAHK,GAAA,EAAQ,EAGb,CACJ,CACI;;AAEX;;;;;;;;;;;;;;;AEWA,SAAgB,GAAK,EAAE,UAAO,UAAO,aAAU,aAAU,QAAQ,UAAO,QAAQ,GAAG,KAAmB;CACpG,IAAM,IAAgB,EAAM,QAAQ,MAAS,CAAC,EAAK,QAAQ,CAAC,CAAC,KAAK,MAAS,EAAK,KAAK,GAE/E,IAAe,EAA8B,IAAI,GACjD,IAAU,kBAAuC,IAAI,IAAI,CAAC,GAC1D,IAAe,EAAO,CAAK,GAC3B,CAAC,GAAgB,KAAqB,EAC1C,IACF,GACM,CAAC,GAAW,KAAgB,EAAyC,MAAM;CAEjF,QAAsB;EACpB,IAAM,IAAc,EAAQ,QAAQ,IAAI,CAAK;EACxC,MACL,EAAkB;GAAE,MAAM,EAAY;GAAY,OAAO,EAAY;EAAY,CAAC,GAE9E,MAAY,SAAS,EAAa,YAAY,KAChD,EAAa,QAAQ,GAEvB,EAAa,UAAU;CACzB,GAAG;EAAC;EAAO;EAAO;EAAS;CAAI,CAAC;CAEhC,SAAS,EAAwB,GAAyC;EACpE,EAAM,iBAAiB,YACvB,MAAc,WAAU,EAAa,UAAU,IAC1C,MAAc,cAAY,EAAa,MAAM;CACxD;CAEA,QAAsB;EACpB,IAAM,IAAY,EAAa;EAC/B,IAAI,CAAC,GAAW;EAChB,IAAM,IAAW,IAAI,qBAAqB;GACxC,IAAM,IAAc,EAAQ,QAAQ,IAAI,CAAK;GACxC,KACL,EAAkB;IAAE,MAAM,EAAY;IAAY,OAAO,EAAY;GAAY,CAAC;EACpF,CAAC;EAED,OADA,EAAS,QAAQ,CAAS,SACb,EAAS,WAAW;CACnC,GAAG,CAAC,CAAK,CAAC;CAEV,SAAS,EAAc,GAAsC;EAC3D,IAAM,IAAe,EAAc,QAAQ,CAAK;EAChD,IAAI,MAAiB,IAAI;EAEzB,IAAI,IAA2B;EAQ/B,AAPI,EAAM,QAAQ,iBAAc,KAAa,IAAe,KAAK,EAAc,SAC3E,EAAM,QAAQ,gBAChB,KAAa,IAAe,IAAI,EAAc,UAAU,EAAc,SAEpE,EAAM,QAAQ,WAAQ,IAAY,IAClC,EAAM,QAAQ,UAAO,IAAY,EAAc,SAAS,IAExD,MAAc,SAChB,EAAM,eAAe,GACrB,EAAS,EAAc,EAAU;CAErC;CAEA,OACE,kBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,WAAW,CAAC,EAAO,IAAU,MAAY,SAAS,MAAS,QAAQ,EAAO,EAAE,CAAC,CAC1E,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;EACX,WAAW;EACX,GAAI;EAPN,UAAA,CASG,KACC,kBAAC,QAAD;GACE,eAAA;GACA,WAAW;IACT,EAAO;IACP,MAAY,SAAS,EAAO,gBAAgB,EAAO;IACnD,MAAc,cAAc,EAAO;GACrC,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;GACX,iBAAiB;GACjB,OAAO;IACL,WAAW,GAAG,EAAe,KAAK;IAClC,OAAO,MAAY,SAAS,MAAc,WAAW,MAAO;IAC5D,OAAO,EAAe;GACxB;EACD,CAAA,GAEF,EAAM,KAAK,MAAS;GACnB,IAAM,IAAW,EAAK,UAAU;GAChC,OACE,kBAAC,UAAD;IAEE,MAAM,MAAS;KACb,AAAI,IAAM,EAAQ,QAAQ,IAAI,EAAK,OAAO,CAAI,IACzC,EAAQ,QAAQ,OAAO,EAAK,KAAK;IACxC;IACA,MAAK;IACL,MAAK;IACL,iBAAe;IACf,UAAU,EAAK;IACf,UAAU,IAAW,IAAI;IACzB,WAAW,CAAC,EAAO,KAAK,KAAY,EAAO,QAAQ,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;IAC7E,eAAe,CAAC,EAAK,YAAY,EAAS,EAAK,KAAK;IAZtD,UAAA,CAcG,EAAK,QAAQ,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAO,UAAA,EAAK;IAAW,CAAA,GAC5D,EAAK,KACA;GAfD,GAAA,EAAK,KAeJ;EAEZ,CAAC,CACE;;AAET;;;AC3IA,SAAgB,GAAe,GAAsB;CACnD,IAAM,IAAI,KAAK,MAAM,IAAO,EAAE,GACxB,IAAI,IAAO;CACjB,OAAO,GAAG,EAAE,IAAI,OAAO,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG,EAAE;AAC7C;AAGA,SAAgB,GAAkB,GAAc,GAAyB;CACvE,IAAM,IAAI,KAAK,MAAM,IAAO,EAAE,GACxB,IAAI,IAAO,IACX,KAAO,MAAc,OAAO,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG;CACpD,OAAO,GAAG,EAAI,CAAC,EAAE,GAAG,EAAI,CAAC,EAAE,GAAG,EAAI,CAAO;AAC3C"}
1
+ {"version":3,"file":"index.js","names":["__iconData","__iconData"],"sources":["../src/components/Button.module.css","../src/components/Button.tsx","../src/components/Card.module.css","../src/components/Card.tsx","../src/components/Tag.module.css","../src/components/Tag.tsx","../node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/toLucideIconData.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.mjs","../node_modules/lucide-react/dist/esm/shared/src/build/defaultAttributes.mjs","../node_modules/lucide-react/dist/esm/shared/src/build/buildLucideIconNode.mjs","../node_modules/lucide-react/dist/esm/shared/src/build/buildLucideIconForReact.mjs","../node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.mjs","../node_modules/lucide-react/dist/esm/context.mjs","../node_modules/lucide-react/dist/esm/Icon.mjs","../node_modules/lucide-react/dist/esm/createLucideIcon.mjs","../node_modules/lucide-react/dist/esm/icons/check.mjs","../node_modules/lucide-react/dist/esm/icons/chevron-down.mjs","../node_modules/lucide-react/dist/esm/icons/search.mjs","../src/components/Toolbar.module.css","../src/components/Toolbar.tsx","../src/components/Checkbox.module.css","../src/components/Checkbox.tsx","../src/components/RadioButton.module.css","../src/components/RadioButton.tsx","../src/components/Switch.module.css","../src/components/Switch.tsx","../src/components/TextField.module.css","../src/components/TextField.tsx","../src/components/Menu.module.css","../src/components/Menu.tsx","../src/components/MenuItem.module.css","../src/components/MenuItem.tsx","../src/components/Dropdown.module.css","../src/components/Dropdown.tsx","../src/components/HighlightText.module.css","../src/components/HighlightText.tsx","../src/components/FilterSection.module.css","../src/components/FilterSection.tsx","../src/components/Tabs.module.css","../src/components/Tabs.tsx","../src/utils/format.ts"],"sourcesContent":[".primary,\n.secondary,\n.tertiary,\n.dangerous {\n position: relative;\n isolation: isolate;\n overflow: hidden;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n border: none;\n font-family: inherit;\n font-weight: 450;\n letter-spacing: 0.01em;\n cursor: pointer;\n transition:\n color 0.2s ease,\n transform 0.2s ease-out;\n}\n.primary:active:not(:disabled),\n.secondary:active:not(:disabled),\n.tertiary:active:not(:disabled),\n.dangerous:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n.sm {\n height: var(--control-height-sm);\n border-radius: var(--radius-sm);\n padding: 0 12px;\n font-size: 0.9rem;\n}\n.base {\n height: var(--control-height-base);\n border-radius: var(--radius-base);\n padding: 0 16px;\n font-size: 0.9rem;\n}\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n\n.iconOnly {\n box-sizing: border-box;\n padding: 0;\n}\n.iconOnly.sm {\n width: var(--control-height-sm);\n}\n.iconOnly.base {\n width: var(--control-height-base);\n}\n.primary::before,\n.secondary::before,\n.tertiary::before,\n.dangerous::before {\n content: '';\n position: absolute;\n left: 50%;\n bottom: 0;\n width: 24%;\n aspect-ratio: 1;\n border-radius: 50%;\n transform: translate(-50%, 100%) scale(1);\n transition: transform 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);\n z-index: -1;\n pointer-events: none;\n}\n.primary:hover::before,\n.secondary:hover::before,\n.tertiary:hover::before,\n.dangerous:hover::before {\n transform: translate(-50%, 15%) scale(8);\n}\n\n.primary {\n background: var(--brand-dark);\n color: #fff;\n font-weight: 400;\n letter-spacing: 0.02em;\n}\n.primary::before {\n background: rgba(255, 255, 255, 0.08);\n}\n.primary:active:not(:disabled)::before {\n background: rgba(0, 0, 0, 0.08);\n}\n\n.secondary {\n background: var(--surface-muted);\n color: var(--text-primary);\n}\n.secondary .icon {\n color: var(--text-secondary);\n}\n.secondary::before {\n background: rgba(var(--brand-main-rgb), 0.08);\n}\n.secondary:active:not(:disabled)::before {\n background: rgba(var(--brand-main-rgb), 0.28);\n}\n.secondary:hover .icon {\n color: var(--brand-main);\n}\n.secondary:hover {\n color: var(--brand-main);\n}\n\n.tertiary {\n background: transparent;\n color: var(--text-secondary);\n}\n.tertiary::before {\n background: rgba(var(--brand-main-rgb), 0.16);\n}\n.tertiary:active:not(:disabled)::before {\n background: rgba(var(--brand-main-rgb), 0.28);\n}\n.tertiary:hover,\n.tertiary:active:not(:disabled) {\n background: var(--bg);\n}\n.tertiary:hover {\n color: var(--brand-main);\n}\n\n.dangerous {\n background: var(--danger-bg);\n color: var(--danger-text-dark);\n}\n.dangerous::before {\n background: rgba(var(--danger-rgb), 0.16);\n}\n.dangerous:active:not(:disabled)::before {\n background: rgba(var(--danger-rgb), 0.28);\n}\n\n.primary:disabled,\n.secondary:disabled,\n.tertiary:disabled,\n.dangerous:disabled {\n background: var(--disabled-bg);\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.primary:disabled:hover,\n.secondary:disabled:hover,\n.tertiary:disabled:hover,\n.dangerous:disabled:hover {\n color: var(--disabled-text);\n}\n.primary:disabled::before,\n.secondary:disabled::before,\n.tertiary:disabled::before,\n.dangerous:disabled::before {\n display: none;\n}\n","import type { ButtonHTMLAttributes, ReactNode } from 'react';\nimport styles from './Button.module.css';\n\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'dangerous';\ntype ButtonSize = 'sm' | 'base';\n\ninterface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className'> {\n variant?: ButtonVariant;\n size?: ButtonSize;\n /** Icon shown before the label. Omit `children` to render an icon-only square button — pass `aria-label` in that case. */\n leadingIcon?: ReactNode;\n /** Icon shown after the label. */\n trailingIcon?: ReactNode;\n children?: ReactNode;\n}\n\nexport function Button({\n variant = 'primary',\n size = 'base',\n leadingIcon,\n trailingIcon,\n children,\n ...rest\n}: ButtonProps) {\n const iconOnly = !children && Boolean(leadingIcon);\n return (\n <button\n type=\"button\"\n className={`${styles[variant]} ${styles[size]}${iconOnly ? ` ${styles.iconOnly}` : ''}`}\n {...rest}\n >\n {leadingIcon && <span className={styles.icon}>{leadingIcon}</span>}\n {children}\n {trailingIcon && <span className={styles.icon}>{trailingIcon}</span>}\n </button>\n );\n}\n",".wrap {\n position: relative;\n width: 220px;\n flex: 0 0 220px;\n}\n.wrap:hover {\n z-index: 10;\n}\n.fluid {\n width: 100%;\n flex: none;\n}\n\n.backing {\n position: absolute;\n left: 6px;\n right: 6px;\n bottom: -4px;\n height: 10px;\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border);\n border-radius: 0 0 14px 14px;\n z-index: 0;\n}\n.backing.completed {\n background: var(--success-bg);\n box-shadow: inset 0 0 0 1px #bfe3cc;\n}\n\n.card {\n position: relative;\n z-index: 1;\n width: 100%;\n box-sizing: border-box;\n background: var(--card-surface);\n box-shadow:\n inset 0 0 0 1px #efefef,\n 0 1px 2px rgba(16, 24, 32, 0.04);\n border-radius: 16px;\n padding: 12px 14px;\n cursor: default;\n transition: box-shadow 0.2s;\n}\n.card.interactive {\n cursor: pointer;\n}\n.card.grabbable {\n cursor: grab;\n}\n.card.grabbable:active {\n cursor: grabbing;\n}\n.card.dragging,\n.card.dragging:hover {\n box-shadow:\n inset 0 0 0 1px #efefef,\n 0 1px 2px rgba(16, 24, 32, 0.04);\n}\n.card.interactive:hover {\n box-shadow:\n inset 0 0 0 1px #efefef,\n 0 0 0 2px var(--brand-main);\n}\n.card.completed {\n background: var(--success-bg);\n box-shadow:\n inset 0 0 0 1px #bfe3cc,\n 0 1px 2px rgba(16, 24, 32, 0.04),\n 0 2px 8px rgba(16, 24, 32, 0.06);\n}\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './Card.module.css';\n\ninterface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'className'> {\n /** Shows a second sheet behind the card, for representing a stack/batch. */\n stacked?: boolean;\n /** Success-tinted surface, e.g. a completed task. */\n completed?: boolean;\n /** Adds pointer cursor + accent hover ring. */\n interactive?: boolean;\n /** Grab cursor, for drag sources — pair with `interactive`. */\n draggable?: boolean;\n /** Suppresses the hover ring while a drag is in progress. */\n dragging?: boolean;\n /** Card fills its container width instead of a fixed width. */\n fluid?: boolean;\n children: ReactNode;\n}\n\nexport function Card({\n stacked,\n completed,\n interactive,\n draggable,\n dragging,\n fluid,\n children,\n ...rest\n}: CardProps) {\n return (\n <div className={`${styles.wrap} ${fluid ? styles.fluid : ''}`}>\n {stacked && <div className={`${styles.backing} ${completed ? styles.completed : ''}`} />}\n <div\n className={[\n styles.card,\n completed ? styles.completed : '',\n interactive ? styles.interactive : '',\n draggable ? styles.grabbable : '',\n dragging ? styles.dragging : '',\n ]\n .filter(Boolean)\n .join(' ')}\n {...rest}\n >\n {children}\n </div>\n </div>\n );\n}\n",".neutral,\n.pill,\n.accent,\n.success,\n.danger,\n.count {\n display: inline-flex;\n align-items: center;\n font-weight: 500;\n white-space: nowrap;\n}\n\n/* Square tags — e.g. day badges, worker names, video panel tags */\n.neutral {\n color: var(--text-tertiary);\n font-size: 0.75rem;\n background: var(--bg);\n border-radius: 6px;\n padding: 2px 7px;\n}\n\n/* Pill tags — e.g. BPO group labels, total-duration tags */\n.pill {\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border);\n color: var(--text-tertiary);\n font-size: 0.8rem;\n padding: 3px 11px;\n border-radius: 999px;\n}\n\n/* Accent pill — e.g. \"current\" stat, read-only banner badge */\n.accent {\n background: var(--brand-bg);\n color: var(--brand-dark);\n font-size: 0.8rem;\n padding: 3px 11px;\n border-radius: 999px;\n}\n\n/* Success pill — e.g. \"time spent\" stat */\n.success {\n background: var(--success-bg);\n color: var(--success-text);\n font-size: 0.8rem;\n padding: 3px 11px;\n border-radius: 999px;\n}\n\n/* Danger — square (e.g. ASAP tag) reuses the same token pair as the\n pill-shaped status variant; only the shape differs by context. */\n.danger {\n color: var(--danger-text);\n font-size: 0.75rem;\n background: var(--danger-bg);\n border-radius: 6px;\n padding: 2px 7px;\n}\n\n/* Count badge — small solid circle, e.g. active-filter count */\n.count {\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 999px;\n background: var(--brand-main);\n color: #fff;\n font-size: 0.65rem;\n line-height: 16px;\n text-align: center;\n}\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './Tag.module.css';\n\ntype TagVariant = 'neutral' | 'pill' | 'accent' | 'success' | 'danger' | 'count';\n\ninterface TagProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'className'> {\n variant?: TagVariant;\n children: ReactNode;\n}\n\nexport function Tag({ variant = 'neutral', children, ...rest }: TagProps) {\n return (\n <span className={styles[variant]} {...rest}>\n {children}\n </span>\n );\n}\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst toKebabCase = (string) => string?.replace(/([a-z0-9])([A-Z])/g, \"$1-$2\").toLowerCase();\n\nexport { toKebabCase };\n//# sourceMappingURL=toKebabCase.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { toKebabCase } from './toKebabCase.mjs';\n\nfunction toLucideIconData(iconName, iconNode, aliases = []) {\n if (iconNode == null) {\n throw new Error(\"[lucide]: iconNode is required when icon name is used\");\n }\n return {\n name: toKebabCase(iconName),\n size: 24,\n node: iconNode,\n ...aliases.length > 0 ? { aliases } : {}\n };\n}\n\nexport { toLucideIconData };\n//# sourceMappingURL=toLucideIconData.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst toCamelCase = (string) => {\n let out = \"\";\n let upperNext = false;\n for (const ch of string) {\n if (ch === \"-\" || ch === \"_\" || ch <= \" \") {\n upperNext = out.length > 0;\n continue;\n }\n if (out.length === 0) {\n out += ch.toLowerCase();\n } else {\n out += upperNext ? ch.toUpperCase() : ch;\n }\n upperNext = false;\n }\n return out;\n};\n\nexport { toCamelCase };\n//# sourceMappingURL=toCamelCase.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { toCamelCase } from './toCamelCase.mjs';\n\nconst toPascalCase = (string) => {\n const camelCase = toCamelCase(string);\n return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);\n};\n\nexport { toPascalCase };\n//# sourceMappingURL=toPascalCase.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst mergeClasses = (...classes) => classes.filter((className, index, array) => {\n return Boolean(className) && className.trim() !== \"\" && array.indexOf(className) === index;\n}).join(\" \").trim();\n\nexport { mergeClasses };\n//# sourceMappingURL=mergeClasses.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst defaultAttributes = {\n xmlns: \"http://www.w3.org/2000/svg\",\n width: 24,\n height: 24,\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n stroke: \"currentColor\",\n \"stroke-width\": 2,\n \"stroke-linecap\": \"round\",\n \"stroke-linejoin\": \"round\"\n};\n\nexport { defaultAttributes as default };\n//# sourceMappingURL=defaultAttributes.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport defaultAttributes from './defaultAttributes.mjs';\nimport { mergeClasses } from '../utils/mergeClasses.mjs';\n\nfunction isDefined(value) {\n return value !== null && value !== void 0;\n}\nfunction buildLucideIconNode(icon, params = {}) {\n const attributeNames = params.attributeNames ?? {};\n const getAttributeName = (attributeName) => attributeNames[attributeName] ?? attributeName;\n const viewBoxWidth = icon.size ?? icon.width ?? defaultAttributes[\"width\"];\n const viewBoxHeight = icon.size ?? icon.height ?? defaultAttributes[\"height\"];\n const aliasClassNames = icon.aliases?.filter((alias) => typeof alias === \"string\" && alias.trim() !== \"\").map((alias) => `lucide-${alias}`) ?? [];\n const iconClassNames = [...icon.name ? [`lucide-${icon.name}`] : [], ...aliasClassNames];\n const classNamesFromClassName = params.className?.split(\" \").filter(Boolean) ?? [];\n const className = params.includeDefaultClasses === false ? mergeClasses(...classNamesFromClassName) : mergeClasses(\"lucide\", ...iconClassNames, ...classNamesFromClassName);\n const calculatedStrokeWidth = params.absoluteStrokeWidth ? Number(params.strokeWidth ?? defaultAttributes[\"stroke-width\"]) * Number(icon.size ?? icon.width ?? defaultAttributes[\"width\"]) / Number(params.size ?? params.width ?? defaultAttributes[\"width\"]) : params.strokeWidth ?? defaultAttributes[\"stroke-width\"];\n const attributes = {\n ...Object.entries(defaultAttributes).reduce((attrs, [attrName, value]) => {\n attrs[getAttributeName(attrName)] = value;\n return attrs;\n }, {}),\n ...\"color\" in params && params.color && {\n [getAttributeName(\"stroke\")]: params.color\n },\n ...\"size\" in params && isDefined(params.size) && {\n [getAttributeName(\"width\")]: params.size,\n [getAttributeName(\"height\")]: params.size\n },\n ...\"width\" in params && isDefined(params.width) && {\n [getAttributeName(\"width\")]: params.width\n },\n ...\"height\" in params && isDefined(params.height) && {\n [getAttributeName(\"height\")]: params.height\n },\n [getAttributeName(\"stroke-width\")]: calculatedStrokeWidth,\n ...className && {\n [getAttributeName(\"class\")]: className\n },\n [getAttributeName(\"viewBox\")]: `0 0 ${viewBoxWidth} ${viewBoxHeight}`,\n ...params.hasA11yProp === false ? {\n [getAttributeName(\"aria-hidden\")]: \"true\"\n } : {},\n ...\"attributes\" in params && params.attributes\n };\n return [\n \"svg\",\n attributes,\n icon.node.map((child) => {\n const [name, attrs, children] = child;\n const nextAttrs = params.nonScalingStroke ? { [getAttributeName(\"vector-effect\")]: \"non-scaling-stroke\", ...attrs } : attrs;\n return children ? [name, nextAttrs, children] : [name, nextAttrs];\n })\n ];\n}\n\nexport { buildLucideIconNode as default };\n//# sourceMappingURL=buildLucideIconNode.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport buildLucideIconNode from './buildLucideIconNode.mjs';\n\nfunction buildLucideIconForReact(icon, params = {}) {\n return buildLucideIconNode(icon, {\n ...params,\n attributeNames: {\n ...params.attributeNames,\n class: \"className\",\n \"stroke-width\": \"strokeWidth\",\n \"stroke-linecap\": \"strokeLinecap\",\n \"stroke-linejoin\": \"strokeLinejoin\",\n \"vector-effect\": \"vectorEffect\"\n }\n });\n}\n\nexport { buildLucideIconForReact as default };\n//# sourceMappingURL=buildLucideIconForReact.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nconst hasA11yProp = (props) => {\n for (const prop in props) {\n if (prop.startsWith(\"aria-\") || prop === \"role\" || prop === \"title\") {\n return true;\n }\n }\n return false;\n};\n\nexport { hasA11yProp };\n//# sourceMappingURL=hasA11yProp.mjs.map\n","\"use strict\";\n\"use client\";\n/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { createContext, useContext, useMemo, createElement } from 'react';\n\nconst LucideContext = createContext({});\nfunction LucideProvider({\n children,\n size,\n color,\n strokeWidth,\n absoluteStrokeWidth,\n nonScalingStroke,\n className\n}) {\n const value = useMemo(\n () => ({\n size,\n color,\n strokeWidth,\n absoluteStrokeWidth,\n nonScalingStroke,\n className\n }),\n [size, color, strokeWidth, absoluteStrokeWidth, nonScalingStroke, className]\n );\n return createElement(LucideContext.Provider, { value }, children);\n}\nconst useLucideContext = () => useContext(LucideContext);\n\nexport { LucideProvider, useLucideContext };\n//# sourceMappingURL=context.mjs.map\n","\"use strict\";\n\"use client\";\n/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { forwardRef, createElement } from 'react';\nimport { mergeClasses } from './shared/src/utils/mergeClasses.mjs';\nimport buildLucideIconForReact from './shared/src/build/buildLucideIconForReact.mjs';\nimport { hasA11yProp } from './shared/src/utils/hasA11yProp.mjs';\nimport { useLucideContext } from './context.mjs';\n\nconst Icon = forwardRef(\n ({\n color,\n size,\n width,\n height,\n strokeWidth,\n absoluteStrokeWidth,\n nonScalingStroke,\n className = \"\",\n children,\n iconNode = [],\n icon = {\n node: iconNode,\n aliases: [],\n size: 24\n },\n ...rest\n }, ref) => {\n const {\n size: contextSize = 24,\n strokeWidth: contextStrokeWidth = 2,\n absoluteStrokeWidth: contextAbsoluteStrokeWidth = false,\n nonScalingStroke: contextNonScalingStroke = false,\n color: contextColor = \"currentColor\",\n className: contextClass = \"\"\n } = useLucideContext() ?? {};\n const hasAccessibleProp = Boolean(children) || hasA11yProp(rest);\n const [name, svgAttributes, builtIconNode = []] = buildLucideIconForReact(icon, {\n color: color ?? contextColor,\n width: width ?? size ?? contextSize,\n height: height ?? size ?? contextSize,\n strokeWidth: strokeWidth ?? contextStrokeWidth,\n absoluteStrokeWidth: absoluteStrokeWidth ?? contextAbsoluteStrokeWidth,\n nonScalingStroke: nonScalingStroke ?? contextNonScalingStroke,\n className: mergeClasses(contextClass, className),\n hasA11yProp: hasAccessibleProp,\n attributes: rest\n });\n return createElement(\n name,\n {\n ref,\n ...svgAttributes\n },\n [\n ...builtIconNode.map(([tag, attrs]) => createElement(tag, attrs)),\n ...Array.isArray(children) ? children : [children]\n ]\n );\n }\n);\n\nexport { Icon as default };\n//# sourceMappingURL=Icon.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport { forwardRef, createElement } from 'react';\nimport { toLucideIconData } from './shared/src/utils/toLucideIconData.mjs';\nimport { toPascalCase } from './shared/src/utils/toPascalCase.mjs';\nimport Icon from './Icon.mjs';\n\nfunction createLucideIcon(iconDataOrName, iconNode = [], aliases = []) {\n const iconData = typeof iconDataOrName === \"string\" ? toLucideIconData(iconDataOrName, iconNode, aliases) : iconDataOrName;\n const Component = forwardRef(\n ({ className, ...props }, ref) => createElement(Icon, {\n ref,\n icon: iconData,\n className,\n ...props\n })\n );\n if (iconData.name) {\n Component.displayName = toPascalCase(iconData.name);\n }\n return Component;\n}\n\nexport { createLucideIcon as default };\n//# sourceMappingURL=createLucideIcon.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconData = {\n name: \"check\",\n size: 24,\n node: [[\"path\", { d: \"M20 6 9 17l-5-5\", key: \"1gmf2c\" }]]\n};\n__iconData.node;\nconst Check = createLucideIcon(__iconData);\n\nexport { __iconData, Check as default };\n//# sourceMappingURL=check.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconData = {\n name: \"chevron-down\",\n size: 24,\n node: [[\"path\", { d: \"m6 9 6 6 6-6\", key: \"qrunsl\" }]]\n};\n__iconData.node;\nconst ChevronDown = createLucideIcon(__iconData);\n\nexport { __iconData, ChevronDown as default };\n//# sourceMappingURL=chevron-down.mjs.map\n","/**\n * @license lucide-react v1.46.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconData = {\n name: \"search\",\n size: 24,\n node: [\n [\"path\", { d: \"m21 21-4.34-4.34\", key: \"14j7rj\" }],\n [\"circle\", { cx: \"11\", cy: \"11\", r: \"8\", key: \"4ej97u\" }]\n ]\n};\n__iconData.node;\nconst Search = createLucideIcon(__iconData);\n\nexport { __iconData, Search as default };\n//# sourceMappingURL=search.mjs.map\n",".toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n padding: 0 8px;\n background: var(--card-surface);\n border-radius: 16px;\n box-shadow:\n inset 0 0 0 1px var(--border),\n 0 1px 2px rgba(16, 24, 32, 0.04),\n 0 2px 8px rgba(16, 24, 32, 0.06);\n}\n.searchWrap {\n position: relative;\n flex: 1;\n min-width: 0;\n}\n.searchWrap::after {\n content: '';\n position: absolute;\n left: 36px;\n right: 0;\n bottom: 0;\n height: 2px;\n background: var(--brand-main);\n opacity: 0;\n pointer-events: none;\n}\n.searchWrap:focus-within::after {\n opacity: 1;\n}\n.searchIcon {\n position: absolute;\n top: 50%;\n left: 12px;\n width: 16px;\n height: 16px;\n transform: translateY(-53%);\n color: var(--text-tertiary);\n pointer-events: none;\n}\n.searchIcon svg {\n width: 100%;\n height: 100%;\n}\n.search {\n width: 100%;\n box-sizing: border-box;\n border: none;\n padding: 16px 52px 16px 36px;\n font-family: inherit;\n font-size: 1rem;\n color: var(--text-primary);\n background: none;\n box-shadow: inset -1px 0 0 var(--border);\n}\n.search:focus {\n outline: none;\n}\n.searchShortcut {\n position: absolute;\n top: 50%;\n right: 8px;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 2px 6px;\n border-radius: 6px;\n background: var(--bg);\n color: var(--text-tertiary);\n font-size: 0.75rem;\n font-weight: 600;\n letter-spacing: 0.02em;\n pointer-events: none;\n}\n.controls {\n display: flex;\n align-items: center;\n flex: none;\n}\n","import { useEffect, useRef, type ChangeEvent, type ReactNode } from 'react';\nimport { Search } from 'lucide-react';\nimport styles from './Toolbar.module.css';\n\ninterface ToolbarProps {\n searchValue?: string;\n onSearchChange?: (value: string) => void;\n placeholder?: string;\n /** Text shown in the keyboard-shortcut badge, e.g. \"⌘K\". Omit to hide the badge. */\n shortcutLabel?: string;\n /** Focuses the search input when Cmd/Ctrl + the shortcut key is pressed. */\n shortcutKey?: string;\n /** Right-side content — filter/sort controls, actions, etc. */\n children?: ReactNode;\n}\n\nexport function Toolbar({\n searchValue,\n onSearchChange,\n placeholder = 'Search…',\n shortcutLabel = '⌘K',\n shortcutKey = 'k',\n children,\n}: ToolbarProps) {\n const searchRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n function onKeyDown(e: KeyboardEvent) {\n if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === shortcutKey.toLowerCase()) {\n e.preventDefault();\n searchRef.current?.focus();\n }\n }\n window.addEventListener('keydown', onKeyDown);\n return () => window.removeEventListener('keydown', onKeyDown);\n }, [shortcutKey]);\n\n return (\n <div className={styles.toolbar}>\n <div className={styles.searchWrap}>\n <span className={styles.searchIcon}>\n <Search />\n </span>\n <input\n ref={searchRef}\n type=\"text\"\n className={styles.search}\n placeholder={placeholder}\n autoComplete=\"off\"\n value={searchValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => onSearchChange?.(e.target.value)}\n />\n {shortcutLabel && (\n <span className={styles.searchShortcut} aria-hidden=\"true\">\n {shortcutLabel}\n </span>\n )}\n </div>\n {children && <div className={styles.controls}>{children}</div>}\n </div>\n );\n}\n",".checkbox {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n}\n.control {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.labelText {\n font-size: 0.85rem;\n color: var(--text-primary);\n transition: color 0.2s ease-out;\n}\n.checkbox:hover .labelText {\n color: var(--brand-main);\n}\n.input {\n position: absolute;\n inset: 0;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n}\n.box {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n border-radius: 6px;\n background: var(--surface-sunken);\n box-shadow: inset 0 0 0 1px var(--border);\n transition:\n background-color 0.2s cubic-bezier(0, 0, 0.2, 1),\n box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1),\n transform 0.1s cubic-bezier(0, 0, 0.2, 1);\n}\n.checkbox:hover .box {\n box-shadow: 0 0 0 1px var(--brand-main);\n}\n.input:focus-visible + .box {\n outline: 2px solid var(--brand-main);\n outline-offset: 2px;\n}\n.input:active + .box {\n transform: scale(0.88);\n}\n.input:checked + .box {\n background: var(--brand-main);\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.checkbox:hover .input:checked + .box {\n box-shadow: 0 0 0 1px var(--brand-main);\n}\n.icon {\n width: 10px;\n height: 10px;\n overflow: visible;\n}\n.icon polyline {\n fill: none;\n stroke: #fff;\n stroke-width: 2.5px;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-dasharray: 22px;\n stroke-dashoffset: 22px;\n transition: stroke-dashoffset 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.input:checked + .box .icon polyline {\n stroke-dashoffset: 0px;\n}\n","import type { ChangeEvent, ReactNode } from 'react';\nimport styles from './Checkbox.module.css';\n\ninterface CheckboxProps {\n checked: boolean;\n onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n label?: ReactNode;\n ariaLabel?: string;\n className?: string;\n}\n\nexport function Checkbox({ checked, onChange, label, ariaLabel, className }: CheckboxProps) {\n return (\n <label className={`${styles.checkbox} ${className ?? ''}`}>\n <span className={styles.control}>\n <input\n type=\"checkbox\"\n className={styles.input}\n checked={checked}\n onChange={onChange}\n aria-label={ariaLabel}\n />\n <span className={styles.box}>\n <svg className={styles.icon} viewBox=\"0 0 17 18\" aria-hidden=\"true\">\n <polyline points=\"1 9 7 14 15 4\" />\n </svg>\n </span>\n </span>\n {label && <span className={styles.labelText}>{label}</span>}\n </label>\n );\n}\n",".radio {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n}\n.control {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.labelText {\n font-size: 0.85rem;\n color: var(--text-primary);\n transition: color 0.2s ease-out;\n}\n.radio:hover .labelText {\n color: var(--brand-main);\n}\n.input {\n position: absolute;\n inset: 0;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n}\n.circle {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n background: var(--surface-sunken);\n box-shadow: inset 0 0 0 1px var(--border);\n transition:\n background-color 0.2s cubic-bezier(0, 0, 0.2, 1),\n box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1),\n transform 0.1s cubic-bezier(0, 0, 0.2, 1);\n}\n.radio:hover .circle {\n box-shadow: 0 0 0 1px var(--brand-main);\n}\n.input:focus-visible + .circle {\n outline: 2px solid var(--brand-main);\n outline-offset: 2px;\n}\n.input:active + .circle {\n transform: scale(0.88);\n}\n.input:checked + .circle {\n background: var(--brand-main);\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.radio:hover .input:checked + .circle {\n box-shadow: 0 0 0 1px var(--brand-main);\n}\n.dot {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: #fff;\n transform: scale(0);\n transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.input:checked + .circle .dot {\n transform: scale(1);\n}\n","import type { ChangeEvent, ReactNode } from 'react';\nimport styles from './RadioButton.module.css';\n\ninterface RadioButtonProps {\n checked: boolean;\n onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n name?: string;\n value?: string;\n label?: ReactNode;\n ariaLabel?: string;\n className?: string;\n}\n\nexport function RadioButton({\n checked,\n onChange,\n name,\n value,\n label,\n ariaLabel,\n className,\n}: RadioButtonProps) {\n return (\n <label className={`${styles.radio} ${className ?? ''}`}>\n <span className={styles.control}>\n <input\n type=\"radio\"\n className={styles.input}\n checked={checked}\n onChange={onChange}\n name={name}\n value={value}\n aria-label={ariaLabel}\n />\n <span className={styles.circle}>\n <span className={styles.dot} />\n </span>\n </span>\n {label && <span className={styles.labelText}>{label}</span>}\n </label>\n );\n}\n",".switch {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n}\n.switch:has(.input:disabled) {\n cursor: not-allowed;\n}\n.control {\n position: relative;\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n}\n.input {\n position: absolute;\n inset: 0;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n}\n.input:disabled {\n cursor: not-allowed;\n}\n.track {\n position: relative;\n width: 100%;\n height: 100%;\n border-radius: 999px;\n background: var(--surface-sunken);\n box-shadow: inset 0 0 0 1px var(--border);\n transition:\n background-color 0.2s cubic-bezier(0, 0, 0.2, 1),\n box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1);\n}\n.switch:hover .track {\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.input:focus-visible + .track {\n outline: 2px solid var(--brand-main);\n outline-offset: 2px;\n}\n.input:checked + .track {\n background: var(--brand-main);\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.input:disabled + .track {\n background: var(--surface-muted);\n box-shadow: inset 0 0 0 1px var(--border);\n}\n.thumb {\n position: absolute;\n top: 50%;\n left: 2px;\n border-radius: 50%;\n background: #fff;\n transform: translateY(-50%);\n transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.input:checked + .track .thumb {\n transform: translateY(-50%) translateX(var(--switch-thumb-travel));\n}\n\n.sm {\n width: 32px;\n height: 18px;\n --switch-thumb-travel: 14px;\n}\n.sm .thumb {\n width: 14px;\n height: 14px;\n}\n.base {\n width: 40px;\n height: 22px;\n --switch-thumb-travel: 18px;\n}\n.base .thumb {\n width: 18px;\n height: 18px;\n}\n\n.labelText {\n font-size: 0.85rem;\n color: var(--text-primary);\n transition: color 0.2s ease-out;\n}\n.switch:hover .labelText {\n color: var(--brand-main);\n}\n.switch:has(.input:disabled) .labelText {\n color: var(--disabled-text);\n}\n","import type { ChangeEvent, ReactNode } from 'react';\nimport styles from './Switch.module.css';\n\ntype SwitchSize = 'sm' | 'base';\n\ninterface SwitchProps {\n checked: boolean;\n onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n size?: SwitchSize;\n label?: ReactNode;\n ariaLabel?: string;\n disabled?: boolean;\n className?: string;\n}\n\nexport function Switch({\n checked,\n onChange,\n size = 'base',\n label,\n ariaLabel,\n disabled,\n className,\n}: SwitchProps) {\n return (\n <label className={`${styles.switch} ${className ?? ''}`}>\n <span className={`${styles.control} ${styles[size]}`}>\n <input\n type=\"checkbox\"\n role=\"switch\"\n className={styles.input}\n checked={checked}\n onChange={onChange}\n aria-label={ariaLabel}\n disabled={disabled}\n />\n <span className={styles.track}>\n <span className={styles.thumb} />\n </span>\n </span>\n {label && <span className={styles.labelText}>{label}</span>}\n </label>\n );\n}\n",".field {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.label {\n font-size: 0.85rem;\n font-weight: 550;\n color: var(--text-primary);\n padding-left: 8px;\n}\n.inputWrap {\n position: relative;\n display: flex;\n align-items: center;\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border-input);\n transition: box-shadow 0.2s ease-out;\n}\n.inputWrap:focus-within {\n box-shadow:\n inset 0 0 0 0 var(--border-input),\n 0 0 0 2px var(--brand-main);\n}\n.errorWrap,\n.errorWrap:focus-within {\n box-shadow: inset 0 0 0 1px var(--danger-text);\n}\n.inputWrap:has(.input:disabled) {\n background: var(--surface-muted);\n}\n\n.toolbar {\n background: none;\n box-shadow: none;\n}\n.toolbar::after {\n content: '';\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n height: 2px;\n background: var(--brand-main);\n opacity: 0;\n transition: opacity 0.2s ease-out;\n}\n.toolbar:focus-within {\n box-shadow: none;\n}\n.toolbar:focus-within::after {\n opacity: 1;\n}\n.toolbar.errorWrap,\n.toolbar.errorWrap:focus-within {\n box-shadow: none;\n}\n.toolbar.errorWrap::after {\n background: var(--danger-text);\n opacity: 1;\n}\n\n.sm {\n height: var(--control-height-sm);\n border-radius: var(--radius-sm);\n}\n.sm .input {\n padding: 0 12px;\n font-size: 0.9rem;\n}\n.base {\n height: var(--control-height-base);\n border-radius: var(--radius-base);\n}\n.base .input {\n padding: 0 14px;\n font-size: 0.9rem;\n}\n.inputWrap:has(.icon) .input {\n padding-left: 8px;\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-left: 12px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n.input {\n flex: 1;\n min-width: 0;\n box-sizing: border-box;\n border: none;\n background: none;\n font-family: inherit;\n color: var(--text-primary);\n font-weight: 450;\n}\n.input:focus {\n outline: none;\n}\n.input::placeholder {\n color: var(--text-tertiary);\n}\n.input:disabled {\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.helperText {\n font-size: 0.78rem;\n color: var(--text-tertiary);\n padding-left: 8px;\n}\n.errorText {\n font-size: 0.78rem;\n color: var(--danger-text);\n}\n","import { useId, type InputHTMLAttributes, type ReactNode } from 'react';\nimport styles from './TextField.module.css';\n\ntype TextFieldSize = 'sm' | 'base';\ntype TextFieldVariant = 'default' | 'toolbar';\n\ninterface TextFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size'> {\n label?: string;\n helperText?: string;\n error?: string;\n size?: TextFieldSize;\n variant?: TextFieldVariant;\n leadingIcon?: ReactNode;\n}\n\nexport function TextField({\n label,\n helperText,\n error,\n size = 'base',\n variant = 'default',\n leadingIcon,\n id,\n ...rest\n}: TextFieldProps) {\n const generatedId = useId();\n const inputId = id ?? generatedId;\n\n return (\n <div className={styles.field}>\n {label && (\n <label className={styles.label} htmlFor={inputId}>\n {label}\n </label>\n )}\n <div\n className={`${styles.inputWrap} ${styles[variant]} ${styles[size]} ${error ? styles.errorWrap : ''}`}\n >\n {leadingIcon && <span className={styles.icon}>{leadingIcon}</span>}\n <input id={inputId} className={styles.input} {...rest} />\n </div>\n {error ? (\n <span className={styles.errorText}>{error}</span>\n ) : helperText ? (\n <span className={styles.helperText}>{helperText}</span>\n ) : null}\n </div>\n );\n}\n",".menu {\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 180px;\n width: fit-content;\n padding: 4px;\n box-sizing: border-box;\n background: var(--card-surface);\n border-radius: 12px;\n box-shadow:\n inset 0 0 0 1px var(--border),\n 0 8px 24px rgba(0, 0, 0, 0.12);\n}\n.divider {\n height: 1px;\n background: var(--border);\n margin: 4px 6px;\n}\n","import type { HTMLAttributes, ReactNode } from 'react';\nimport styles from './Menu.module.css';\n\ninterface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, 'className'> {\n children: ReactNode;\n}\n\nexport function Menu({ children, ...rest }: MenuProps) {\n return (\n <div role=\"menu\" className={styles.menu} {...rest}>\n {children}\n </div>\n );\n}\n\nexport function MenuDivider() {\n return <div className={styles.divider} role=\"separator\" />;\n}\n",".item {\n display: flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n box-sizing: border-box;\n border: none;\n background: none;\n border-radius: 8px;\n padding: 8px 10px;\n font-family: inherit;\n font-size: 0.9rem;\n color: var(--text-primary);\n text-align: left;\n cursor: pointer;\n transition:\n background 0.15s ease-out,\n color 0.15s ease-out;\n}\n.item:hover:not(:disabled) {\n background: var(--brand-bg);\n color: var(--brand-dark);\n}\n.item:hover:not(:disabled) .icon,\n.item:hover:not(:disabled) .check {\n color: var(--brand-dark);\n}\n.item:active:not(:disabled) {\n background: var(--brand-main-20);\n}\n.item:focus-visible {\n outline: 2px solid var(--brand-main);\n outline-offset: -2px;\n}\n.item:disabled {\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n.label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.trailing {\n color: var(--text-tertiary);\n font-size: 0.8rem;\n flex-shrink: 0;\n}\n.selected {\n color: var(--text-primary);\n font-weight: 550;\n}\n.selected .icon {\n color: var(--text-primary);\n}\n.check {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-left: 8px;\n color: var(--text-primary);\n flex-shrink: 0;\n}\n.check svg {\n width: 100%;\n height: 100%;\n}\n.destructive {\n color: var(--danger-text);\n}\n.destructive .icon {\n color: var(--danger-text);\n}\n.destructive:hover:not(:disabled) {\n background: var(--danger-bg);\n color: var(--danger-text);\n}\n.destructive:hover:not(:disabled) .icon {\n color: var(--danger-text);\n}\n","import type { ButtonHTMLAttributes, ReactNode } from 'react';\nimport { Check } from 'lucide-react';\nimport styles from './MenuItem.module.css';\n\ninterface MenuItemProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className'> {\n icon?: ReactNode;\n trailing?: ReactNode;\n selected?: boolean;\n destructive?: boolean;\n children: ReactNode;\n}\n\nexport function MenuItem({ icon, trailing, selected, destructive, children, ...rest }: MenuItemProps) {\n const classes = [styles.item, selected && styles.selected, destructive && styles.destructive]\n .filter(Boolean)\n .join(' ');\n\n return (\n <button type=\"button\" role=\"menuitem\" className={classes} {...rest}>\n {icon && <span className={styles.icon}>{icon}</span>}\n <span className={styles.label}>{children}</span>\n {trailing && <span className={styles.trailing}>{trailing}</span>}\n {selected && (\n <span className={styles.check}>\n <Check />\n </span>\n )}\n </button>\n );\n}\n",".field {\n position: relative;\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.label {\n font-size: 0.85rem;\n font-weight: 550;\n color: var(--text-primary);\n padding-left: 8px;\n}\n.trigger {\n display: flex;\n align-items: center;\n width: 100%;\n box-sizing: border-box;\n border: none;\n background: var(--card-surface);\n box-shadow: inset 0 0 0 1px var(--border-input);\n font-family: inherit;\n color: var(--text-primary);\n cursor: pointer;\n transition: box-shadow 0.2s ease-out;\n}\n.trigger:focus-visible {\n box-shadow:\n inset 0 0 0 0 var(--border-input),\n 0 0 0 2px var(--brand-main);\n}\n.errorWrap {\n box-shadow: inset 0 0 0 1px var(--danger-text);\n}\n.trigger:disabled {\n background: var(--surface-muted);\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n\n.sm {\n border-radius: var(--radius-sm);\n}\n.sm.trigger {\n height: var(--control-height-sm);\n padding: 0 12px;\n font-size: 0.9rem;\n}\n.base {\n border-radius: var(--radius-base);\n}\n.base.trigger {\n height: var(--control-height-base);\n padding: 0 14px;\n font-size: 0.9rem;\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-right: 8px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n.value {\n flex: 1;\n min-width: 0;\n text-align: left;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.placeholder {\n color: var(--text-tertiary);\n}\n.chevron {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n margin-left: 8px;\n color: var(--text-tertiary);\n flex-shrink: 0;\n transition: transform 0.15s ease-out;\n}\n.chevron svg {\n width: 100%;\n height: 100%;\n}\n.chevronOpen {\n transform: rotate(180deg);\n}\n\n.menuWrap {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n right: 0;\n z-index: 10;\n}\n.helperText {\n font-size: 0.78rem;\n color: var(--text-tertiary);\n padding-left: 8px;\n}\n.errorText {\n font-size: 0.78rem;\n color: var(--danger-text);\n}\n","import { useEffect, useId, useRef, useState, type KeyboardEvent, type ReactNode } from 'react';\nimport { ChevronDown } from 'lucide-react';\nimport { Menu } from './Menu';\nimport { MenuItem } from './MenuItem';\nimport styles from './Dropdown.module.css';\n\ntype DropdownSize = 'sm' | 'base';\n\ninterface DropdownOption<T extends string> {\n value: T;\n label: ReactNode;\n icon?: ReactNode;\n disabled?: boolean;\n}\n\ninterface DropdownProps<T extends string> {\n label?: string;\n helperText?: string;\n error?: string;\n size?: DropdownSize;\n placeholder?: string;\n options: DropdownOption<T>[];\n value?: T;\n onChange: (value: T) => void;\n disabled?: boolean;\n}\n\nexport function Dropdown<T extends string>({\n label,\n helperText,\n error,\n size = 'base',\n placeholder = 'Select…',\n options,\n value,\n onChange,\n disabled,\n}: DropdownProps<T>) {\n const [open, setOpen] = useState(false);\n const rootRef = useRef<HTMLDivElement>(null);\n const triggerId = useId();\n\n const selected = options.find((opt) => opt.value === value);\n const enabledValues = options.filter((opt) => !opt.disabled).map((opt) => opt.value);\n\n useEffect(() => {\n if (!open) return;\n const focusValue = value ?? enabledValues[0];\n const el = rootRef.current?.querySelector<HTMLButtonElement>(`[data-value=\"${focusValue}\"]`);\n el?.focus();\n }, [open]);\n\n useEffect(() => {\n if (!open) return;\n function onPointerDown(e: PointerEvent) {\n if (!rootRef.current?.contains(e.target as Node)) setOpen(false);\n }\n function onKeyDown(e: globalThis.KeyboardEvent) {\n if (e.key === 'Escape') setOpen(false);\n }\n window.addEventListener('pointerdown', onPointerDown);\n window.addEventListener('keydown', onKeyDown);\n return () => {\n window.removeEventListener('pointerdown', onPointerDown);\n window.removeEventListener('keydown', onKeyDown);\n };\n }, [open]);\n\n function handleTriggerKeyDown(e: KeyboardEvent<HTMLButtonElement>) {\n if (e.key === 'ArrowDown' || e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setOpen(true);\n return;\n }\n if (e.key === 'Escape') setOpen(false);\n }\n\n function handleOptionKeyDown(e: KeyboardEvent<HTMLButtonElement>, currentValue: T) {\n const currentIndex = enabledValues.indexOf(currentValue);\n if (currentIndex === -1) return;\n\n let nextIndex: number | null = null;\n if (e.key === 'ArrowDown') nextIndex = (currentIndex + 1) % enabledValues.length;\n if (e.key === 'ArrowUp') nextIndex = (currentIndex - 1 + enabledValues.length) % enabledValues.length;\n if (e.key === 'Home') nextIndex = 0;\n if (e.key === 'End') nextIndex = enabledValues.length - 1;\n\n if (nextIndex !== null) {\n e.preventDefault();\n const nextValue = enabledValues[nextIndex];\n const el = rootRef.current?.querySelector<HTMLButtonElement>(`[data-value=\"${nextValue}\"]`);\n el?.focus();\n return;\n }\n if (e.key === 'Escape') setOpen(false);\n }\n\n return (\n <div className={styles.field} ref={rootRef}>\n {label && (\n <label className={styles.label} htmlFor={triggerId}>\n {label}\n </label>\n )}\n <button\n id={triggerId}\n type=\"button\"\n className={`${styles.trigger} ${styles[size]} ${error ? styles.errorWrap : ''}`}\n aria-haspopup=\"listbox\"\n aria-expanded={open}\n disabled={disabled}\n onClick={() => setOpen((v) => !v)}\n onKeyDown={handleTriggerKeyDown}\n >\n {selected?.icon && <span className={styles.icon}>{selected.icon}</span>}\n <span className={`${styles.value} ${!selected ? styles.placeholder : ''}`}>\n {selected ? selected.label : placeholder}\n </span>\n <span className={`${styles.chevron} ${open ? styles.chevronOpen : ''}`}>\n <ChevronDown />\n </span>\n </button>\n {open && (\n <div className={styles.menuWrap}>\n <Menu role=\"listbox\" style={{ width: '100%' }}>\n {options.map((opt) => (\n <MenuItem\n key={opt.value}\n data-value={opt.value}\n role=\"option\"\n aria-selected={opt.value === value}\n icon={opt.icon}\n selected={opt.value === value}\n disabled={opt.disabled}\n onClick={() => {\n onChange(opt.value);\n setOpen(false);\n }}\n onKeyDown={(e) => handleOptionKeyDown(e, opt.value)}\n >\n {opt.label}\n </MenuItem>\n ))}\n </Menu>\n </div>\n )}\n {error ? (\n <span className={styles.errorText}>{error}</span>\n ) : helperText ? (\n <span className={styles.helperText}>{helperText}</span>\n ) : null}\n </div>\n );\n}\n",".highlight {\n background: var(--brand-bg);\n color: var(--brand-dark);\n border-radius: 3px;\n padding: 0 1px;\n}\n","import { Fragment } from 'react';\nimport styles from './HighlightText.module.css';\n\nfunction escapeRegExp(value: string): string {\n return value.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&');\n}\n\nexport function HighlightText({ text, query }: { text: string; query: string }) {\n if (!query) return <>{text}</>;\n\n const parts = text.split(new RegExp(`(${escapeRegExp(query)})`, 'ig'));\n return (\n <>\n {parts.map((part, i) =>\n part.toLowerCase() === query.toLowerCase() ? (\n <mark key={i} className={styles.highlight}>\n {part}\n </mark>\n ) : (\n <Fragment key={i}>{part}</Fragment>\n ),\n )}\n </>\n );\n}\n",".group {\n position: relative;\n}\n.btn {\n display: flex;\n align-items: center;\n gap: 6px;\n background: none;\n border: none;\n border-radius: 12px;\n padding: 12px;\n font-family: inherit;\n font-size: 1rem;\n color: var(--text-primary);\n cursor: pointer;\n transition:\n background 0.2s ease-out,\n box-shadow 0.2s ease-out,\n transform 0.2s ease-out;\n}\n.btn:hover {\n background: rgba(10, 10, 11, 0.04);\n}\n.btn:active {\n background: var(--brand-bg);\n box-shadow: inset 0 2px 1px 0 rgba(0, 140, 216, 0.25);\n transform: scale(0.95);\n}\n.caret {\n color: var(--text-tertiary);\n display: flex;\n align-items: center;\n}\n.caret svg {\n width: 14px;\n height: 14px;\n}\n.label {\n color: var(--text-secondary);\n}\n.badge {\n position: absolute;\n top: 2px;\n right: 2px;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 999px;\n background: var(--brand-main, #0a84d8);\n color: #fff;\n font-size: 0.65rem;\n font-weight: 600;\n line-height: 16px;\n text-align: center;\n}\n.value {\n color: var(--text-primary);\n font-weight: 500;\n}\n.panel {\n display: none;\n position: absolute;\n top: calc(100% + 6px);\n left: 0;\n background: #fff;\n border-radius: 12px;\n min-width: 220px;\n width: fit-content;\n max-height: 280px;\n overflow-y: auto;\n box-shadow:\n inset 0 0 0 1px var(--border),\n 0 8px 24px rgba(0, 0, 0, 0.12);\n z-index: 50;\n}\n.panel.open {\n display: block;\n}\n.panelRight {\n left: auto;\n right: 0;\n}\n.panelWide {\n min-width: 260px;\n padding-bottom: 4px;\n}\n.sectionHeader {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n padding: 12px 14px 4px;\n}\n.sectionLabel {\n font-size: 0.75rem;\n font-weight: 600;\n color: var(--text-tertiary);\n text-transform: uppercase;\n letter-spacing: 0.02em;\n}\n.allToggle {\n background: none;\n border: none;\n padding: 0;\n font-family: inherit;\n font-size: 0.75rem;\n font-weight: 600;\n color: var(--brand-main, #0a84d8);\n cursor: pointer;\n}\n.allToggle:hover {\n text-decoration: underline;\n}\n.divider {\n height: 1px;\n background: var(--border);\n margin: 4px 0;\n}\n.option {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px;\n border-radius: 8px;\n font-size: 1rem;\n cursor: pointer;\n}\n.option:hover {\n background: var(--bg);\n}\n.search {\n width: calc(100% - 16px);\n box-sizing: border-box;\n border: none;\n box-shadow: inset 0 0 0 1px var(--border-input);\n border-radius: 8px;\n padding: 8px 12px;\n margin: 8px;\n font-family: inherit;\n font-size: 1rem;\n margin-bottom: 0;\n}\n.search:focus {\n outline: none;\n box-shadow: inset 0 0 0 1px var(--brand-main);\n}\n.optionsList {\n padding: 4px 4px;\n}\n.empty {\n padding: 7px 8px;\n color: var(--text-tertiary);\n font-size: 0.85rem;\n}\n","import { useState } from 'react';\nimport { Checkbox } from './Checkbox';\nimport styles from './FilterSection.module.css';\n\ninterface FilterSectionProps<T extends string> {\n label: string;\n options: T[];\n optionLabel: (opt: T) => string;\n activeSet: Set<T>;\n onToggle: (opt: T) => void;\n onSetAll?: (opts: T[]) => void;\n searchable?: boolean;\n}\n\nexport function FilterSection<T extends string>({\n label,\n options,\n optionLabel,\n activeSet,\n onToggle,\n onSetAll,\n searchable,\n}: FilterSectionProps<T>) {\n const [query, setQuery] = useState('');\n\n const q = query.trim().toLowerCase();\n const matches = q ? options.filter((opt) => optionLabel(opt).toLowerCase().includes(q)) : options;\n const allSelected = options.length > 0 && activeSet.size === options.length;\n\n return (\n <div>\n <div className={styles.sectionHeader}>\n <div className={styles.sectionLabel}>{label}</div>\n {onSetAll && (\n <button\n type=\"button\"\n className={styles.allToggle}\n onClick={() => onSetAll(allSelected ? [] : options)}\n >\n {allSelected ? 'Deselect all' : 'Select all'}\n </button>\n )}\n </div>\n {searchable && (\n <input\n type=\"text\"\n className={styles.search}\n placeholder={`Search ${label.toLowerCase()}…`}\n autoComplete=\"off\"\n value={query}\n onClick={(e) => e.stopPropagation()}\n onChange={(e) => setQuery(e.target.value)}\n />\n )}\n <div className={styles.optionsList}>\n {matches.length === 0 && <div className={styles.empty}>No match</div>}\n {matches.map((opt) => (\n <Checkbox\n key={opt}\n className={styles.option}\n checked={activeSet.has(opt)}\n onChange={() => onToggle(opt)}\n label={optionLabel(opt)}\n />\n ))}\n </div>\n </div>\n );\n}\n",".line,\n.box {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n}\n\n.indicator {\n position: absolute;\n left: 0;\n pointer-events: none;\n transition: translate 0.25s cubic-bezier(0.39, 0.575, 0.565, 1), width 0.25s ease,\n scale 0.125s cubic-bezier(0.39, 0.575, 0.565, 1);\n}\n\n.indicator.settling {\n transition: scale 0.1s linear;\n}\n\n.indicatorLine {\n bottom: 0;\n height: 2px;\n background: var(--brand-main);\n}\n\n.indicatorBox {\n top: 4px;\n bottom: 4px;\n border-radius: 8px;\n background: var(--card-surface);\n box-shadow: 0 0 1px 0.5px var(--border);\n}\n\n.tab {\n position: relative;\n isolation: isolate;\n overflow: hidden;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n border: none;\n border-radius: 8px 8px 0 0;\n font-family: inherit;\n font-weight: 450;\n cursor: pointer;\n white-space: nowrap;\n transition: color 0.15s ease-out, background 0.15s ease-out, box-shadow 0.15s ease-out;\n}\n\n.tab::before {\n content: '';\n position: absolute;\n left: 50%;\n bottom: 0;\n width: 40%;\n aspect-ratio: 1;\n border-radius: 50%;\n transform: translate(-50%, 100%) scale(1);\n transition: transform 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);\n z-index: -1;\n pointer-events: none;\n background: rgba(var(--brand-main-rgb), 0.08);\n}\n.tab:hover:not(:disabled)::before {\n transform: translate(-50%, 15%) scale(4);\n}\n.tab:active:not(:disabled)::before {\n background: rgba(var(--brand-main-rgb), 0.28);\n}\n\n.tab:disabled {\n color: var(--disabled-text);\n cursor: not-allowed;\n}\n.tab:disabled::before {\n display: none;\n}\n\n.tab.selected:hover::before {\n display: none;\n}\n\n.tab:focus-visible {\n outline: 2px solid var(--brand-main);\n outline-offset: 2px;\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n}\n.icon svg {\n width: 100%;\n height: 100%;\n}\n\n/* Line variant */\n\n.line {\n box-shadow: inset 0 -1px 0 0 var(--border);\n}\n\n.line .tab {\n background: transparent;\n padding: 12px 6px;\n font-size: 1rem;\n color: var(--text-secondary);\n}\n.line .tab:hover:not(:disabled) {\n color: var(--brand-main);\n}\n.line .tab.selected {\n color: var(--text-primary);\n font-weight: 550;\n}\n\n/* Box variant */\n\n.box {\n background: rgba(16, 24, 32, 0.04);\n border-radius: var(--radius-base);\n padding: 4px;\n gap: 4px;\n box-shadow: inset 0 0 0.5px 1px #e3e3e3;\n}\n\n.box .tab {\n border-radius: 8px;\n padding: 8px 14px;\n font-size: 0.9rem;\n background: transparent;\n color: var(--text-secondary);\n}\n.box .tab:hover:not(:disabled) {\n color: var(--brand-main);\n /* box-shadow: 0 0 0px 1px var(--brand-main-30); */\n}\n.box .tab.selected {\n color: var(--text-primary);\n font-weight: 550;\n}\n\n.box.sm {\n border-radius: var(--radius-sm);\n}\n.box.sm .tab {\n border-radius: 6px;\n padding: 4px 14px;\n}\n.box.sm .indicatorBox {\n border-radius: 6px;\n}\n","import {\n useLayoutEffect,\n useRef,\n useState,\n type KeyboardEvent,\n type ReactNode,\n type TransitionEvent,\n} from 'react';\nimport styles from './Tabs.module.css';\n\ntype TabsVariant = 'line' | 'box';\ntype TabsSize = 'base' | 'sm';\n\ninterface TabItem {\n value: string;\n label: ReactNode;\n icon?: ReactNode;\n disabled?: boolean;\n}\n\ninterface TabsProps {\n items: TabItem[];\n value: string;\n onChange: (value: string) => void;\n variant?: TabsVariant;\n size?: TabsSize;\n 'aria-label'?: string;\n}\n\nexport function Tabs({ items, value, onChange, variant = 'line', size = 'base', ...rest }: TabsProps) {\n const enabledValues = items.filter((item) => !item.disabled).map((item) => item.value);\n\n const containerRef = useRef<HTMLDivElement | null>(null);\n const tabRefs = useRef<Map<string, HTMLButtonElement>>(new Map());\n const prevValueRef = useRef(value);\n const [indicatorStyle, setIndicatorStyle] = useState<{ left: number; width: number } | null>(\n null,\n );\n const [pillPhase, setPillPhase] = useState<'idle' | 'moving' | 'settling'>('idle');\n\n useLayoutEffect(() => {\n const selectedTab = tabRefs.current.get(value);\n if (!selectedTab) return;\n setIndicatorStyle({ left: selectedTab.offsetLeft, width: selectedTab.offsetWidth });\n\n if (variant === 'box' && prevValueRef.current !== value) {\n setPillPhase('moving');\n }\n prevValueRef.current = value;\n }, [value, items, variant, size]);\n\n function handlePillTransitionEnd(event: TransitionEvent<HTMLSpanElement>) {\n if (event.propertyName !== 'scale') return;\n if (pillPhase === 'moving') setPillPhase('settling');\n else if (pillPhase === 'settling') setPillPhase('idle');\n }\n\n useLayoutEffect(() => {\n const container = containerRef.current;\n if (!container) return;\n const observer = new ResizeObserver(() => {\n const selectedTab = tabRefs.current.get(value);\n if (!selectedTab) return;\n setIndicatorStyle({ left: selectedTab.offsetLeft, width: selectedTab.offsetWidth });\n });\n observer.observe(container);\n return () => observer.disconnect();\n }, [value]);\n\n function handleKeyDown(event: KeyboardEvent<HTMLDivElement>) {\n const currentIndex = enabledValues.indexOf(value);\n if (currentIndex === -1) return;\n\n let nextIndex: number | null = null;\n if (event.key === 'ArrowRight') nextIndex = (currentIndex + 1) % enabledValues.length;\n if (event.key === 'ArrowLeft') {\n nextIndex = (currentIndex - 1 + enabledValues.length) % enabledValues.length;\n }\n if (event.key === 'Home') nextIndex = 0;\n if (event.key === 'End') nextIndex = enabledValues.length - 1;\n\n if (nextIndex !== null) {\n event.preventDefault();\n onChange(enabledValues[nextIndex]);\n }\n }\n\n return (\n <div\n ref={containerRef}\n role=\"tablist\"\n className={[styles[variant], variant === 'box' && size === 'sm' && styles.sm]\n .filter(Boolean)\n .join(' ')}\n onKeyDown={handleKeyDown}\n {...rest}\n >\n {indicatorStyle && (\n <span\n aria-hidden\n className={[\n styles.indicator,\n variant === 'line' ? styles.indicatorLine : styles.indicatorBox,\n pillPhase === 'settling' && styles.settling,\n ]\n .filter(Boolean)\n .join(' ')}\n onTransitionEnd={handlePillTransitionEnd}\n style={{\n translate: `${indicatorStyle.left}px 0`,\n scale: variant === 'box' && pillPhase === 'moving' ? 0.92 : 1,\n width: indicatorStyle.width,\n }}\n />\n )}\n {items.map((item) => {\n const selected = item.value === value;\n return (\n <button\n key={item.value}\n ref={(node) => {\n if (node) tabRefs.current.set(item.value, node);\n else tabRefs.current.delete(item.value);\n }}\n type=\"button\"\n role=\"tab\"\n aria-selected={selected}\n disabled={item.disabled}\n tabIndex={selected ? 0 : -1}\n className={[styles.tab, selected && styles.selected].filter(Boolean).join(' ')}\n onClick={() => !item.disabled && onChange(item.value)}\n >\n {item.icon && <span className={styles.icon}>{item.icon}</span>}\n {item.label}\n </button>\n );\n })}\n </div>\n );\n}\n","export function formatDuration(mins: number): string {\n const h = Math.floor(mins / 60);\n const m = mins % 60;\n return `${h}h:${String(m).padStart(2, '0')}m`;\n}\n\n/** HH:MM:SS — seconds are a stable per-video display detail, not tracked in the data model. */\nexport function formatDurationHMS(mins: number, seconds: number): string {\n const h = Math.floor(mins / 60);\n const m = mins % 60;\n const pad = (n: number) => String(n).padStart(2, '0');\n return `${pad(h)}:${pad(m)}:${pad(seconds)}`;\n}\n"],"x_google_ignoreList":[6,7,8,9,10,11,12,13,14,15,16,17,18,19,20],"mappings":";;;;;;;;;;;;;;ACgBA,SAAgB,EAAO,EACrB,aAAU,WACV,UAAO,QACP,gBACA,iBACA,aACA,GAAG,KACW;CACd,IAAM,IAAW,CAAC,KAAY,EAAQ;CACtC,OACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW,GAAG,EAAO,GAAS,GAAG,EAAO,KAAQ,IAAW,IAAI,EAAO,aAAa;EACnF,GAAI;EAHN,UAAA;GAKG,KAAe,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAO,UAAA;GAAkB,CAAA;GAChE;GACA,KAAgB,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAO,UAAA;GAAmB,CAAA;EAC7D;;AAEZ;;;;;;;;;;;;;AEjBA,SAAgB,EAAK,EACnB,YACA,cACA,gBACA,cACA,aACA,UACA,aACA,GAAG,KACS;CACZ,OACE,kBAAC,OAAD;EAAK,WAAW,GAAG,EAAO,KAAK,GAAG,IAAQ,EAAO,QAAQ;EAAzD,UAAA,CACG,KAAW,kBAAC,OAAD,EAAK,WAAW,GAAG,EAAO,QAAQ,GAAG,IAAY,EAAO,YAAY,KAAO,CAAA,GACvF,kBAAC,OAAD;GACE,WAAW;IACT,EAAO;IACP,IAAY,EAAO,YAAY;IAC/B,IAAc,EAAO,cAAc;IACnC,IAAY,EAAO,YAAY;IAC/B,IAAW,EAAO,WAAW;GAC/B,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;GACX,GAAI;GAEH;EACE,CAAA,CACF;;AAET;;;;;;;;;;;AEtCA,SAAgB,EAAI,EAAE,aAAU,WAAW,aAAU,GAAG,KAAkB;CACxE,OACE,kBAAC,QAAD;EAAM,WAAW,EAAO;EAAU,GAAI;EACnC;CACG,CAAA;AAEV;;;ACTA,IAAM,KAAe,MAAW,GAAQ,QAAQ,sBAAsB,OAAO,CAAC,CAAC,YAAY;;;ACE3F,SAAS,EAAiB,GAAU,GAAU,IAAU,CAAC,GAAG;CAC1D,IAAI,KAAY,MACd,MAAU,MAAM,uDAAuD;CAEzE,OAAO;EACL,MAAM,EAAY,CAAQ;EAC1B,MAAM;EACN,MAAM;EACN,GAAG,EAAQ,SAAS,IAAI,EAAE,WAAQ,IAAI,CAAC;CACzC;AACF;;;ACZA,IAAM,KAAe,MAAW;CAC9B,IAAI,IAAM,IACN,IAAY;CAChB,KAAK,IAAM,KAAM,GAAQ;EACvB,IAAI,MAAO,OAAO,MAAO,OAAO,KAAM,KAAK;GACzC,IAAY,EAAI,SAAS;GACzB;EACF;EAMA,AALI,EAAI,WAAW,IACjB,KAAO,EAAG,YAAY,IAEtB,KAAO,IAAY,EAAG,YAAY,IAAI,GAExC,IAAY;CACd;CACA,OAAO;AACT,GCdM,KAAgB,MAAW;CAC/B,IAAM,IAAY,EAAY,CAAM;CACpC,OAAO,EAAU,OAAO,CAAC,CAAC,CAAC,YAAY,IAAI,EAAU,MAAM,CAAC;AAC9D,GCLM,KAAgB,GAAG,MAAY,EAAQ,QAAQ,GAAW,GAAO,MAC9D,EAAQ,KAAc,EAAU,KAAK,MAAM,MAAM,EAAM,QAAQ,CAAS,MAAM,CACtF,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,GCFZ,IAAoB;CACxB,OAAO;CACP,OAAO;CACP,QAAQ;CACR,SAAS;CACT,MAAM;CACN,QAAQ;CACR,gBAAgB;CAChB,kBAAkB;CAClB,mBAAmB;AACrB;;;ACPA,SAAS,EAAU,GAAO;CACxB,OAAO,KAAU;AACnB;AACA,SAAS,EAAoB,GAAM,IAAS,CAAC,GAAG;CAC9C,IAAM,IAAiB,EAAO,kBAAkB,CAAC,GAC3C,KAAoB,MAAkB,EAAe,MAAkB,GACvE,IAAe,EAAK,QAAQ,EAAK,SAAS,EAAkB,OAC5D,IAAgB,EAAK,QAAQ,EAAK,UAAU,EAAkB,QAC9D,IAAkB,EAAK,SAAS,QAAQ,MAAU,OAAO,KAAU,YAAY,EAAM,KAAK,MAAM,EAAE,CAAC,CAAC,KAAK,MAAU,UAAU,GAAO,KAAK,CAAC,GAC1I,IAAiB,CAAC,GAAG,EAAK,OAAO,CAAC,UAAU,EAAK,MAAM,IAAI,CAAC,GAAG,GAAG,CAAe,GACjF,IAA0B,EAAO,WAAW,MAAM,GAAG,CAAC,CAAC,OAAO,OAAO,KAAK,CAAC,GAC3E,IAAY,EAAO,0BAA0B,KAAQ,EAAa,GAAG,CAAuB,IAAI,EAAa,UAAU,GAAG,GAAgB,GAAG,CAAuB,GACpK,IAAwB,EAAO,sBAAsB,OAAO,EAAO,eAAe,EAAkB,eAAe,IAAI,OAAO,EAAK,QAAQ,EAAK,SAAS,EAAkB,KAAQ,IAAI,OAAO,EAAO,QAAQ,EAAO,SAAS,EAAkB,KAAQ,IAAI,EAAO,eAAe,EAAkB;CA6BzS,OAAO;EACL;EACA;GA7BA,GAAG,OAAO,QAAQ,CAAiB,CAAC,CAAC,QAAQ,GAAO,CAAC,GAAU,QAC7D,EAAM,EAAiB,CAAQ,KAAK,GAC7B,IACN,CAAC,CAAC;GACL,GAAG,WAAW,KAAU,EAAO,SAAS,GACrC,EAAiB,QAAQ,IAAI,EAAO,MACvC;GACA,GAAG,UAAU,KAAU,EAAU,EAAO,IAAI,KAAK;KAC9C,EAAiB,OAAO,IAAI,EAAO;KACnC,EAAiB,QAAQ,IAAI,EAAO;GACvC;GACA,GAAG,WAAW,KAAU,EAAU,EAAO,KAAK,KAAK,GAChD,EAAiB,OAAO,IAAI,EAAO,MACtC;GACA,GAAG,YAAY,KAAU,EAAU,EAAO,MAAM,KAAK,GAClD,EAAiB,QAAQ,IAAI,EAAO,OACvC;IACC,EAAiB,cAAc,IAAI;GACpC,GAAG,KAAa,GACb,EAAiB,OAAO,IAAI,EAC/B;IACC,EAAiB,SAAS,IAAI,OAAO,EAAa,GAAG;GACtD,GAAG,EAAO,gBAAgB,KAAQ,GAC/B,EAAiB,aAAa,IAAI,OACrC,IAAI,CAAC;GACL,GAAG,gBAAgB,KAAU,EAAO;EAI3B;EACT,EAAK,KAAK,KAAK,MAAU;GACvB,IAAM,CAAC,GAAM,GAAO,KAAY,GAC1B,IAAY,EAAO,mBAAmB;KAAG,EAAiB,eAAe,IAAI;IAAsB,GAAG;GAAM,IAAI;GACtH,OAAO,IAAW;IAAC;IAAM;IAAW;GAAQ,IAAI,CAAC,GAAM,CAAS;EAClE,CAAC;CACH;AACF;;;ACnDA,SAAS,EAAwB,GAAM,IAAS,CAAC,GAAG;CAClD,OAAO,EAAoB,GAAM;EAC/B,GAAG;EACH,gBAAgB;GACd,GAAG,EAAO;GACV,OAAO;GACP,gBAAgB;GAChB,kBAAkB;GAClB,mBAAmB;GACnB,iBAAiB;EACnB;CACF,CAAC;AACH;;;ACdA,IAAM,KAAe,MAAU;CAC7B,KAAK,IAAM,KAAQ,GACjB,IAAI,EAAK,WAAW,OAAO,KAAK,MAAS,UAAU,MAAS,SAC1D,OAAO;CAGX,OAAO;AACT,GCHM,KAAgB,EAAc,CAAC,CAAC,GAuBhC,WAAyB,EAAW,EAAa,GCnBjD,KAAO,GACV,EACC,UACA,SACA,UACA,WACA,gBACA,wBACA,qBACA,eAAY,IACZ,aACA,cAAW,CAAC,GACZ,UAAO;CACL,MAAM;CACN,SAAS,CAAC;CACV,MAAM;AACR,GACA,GAAG,KACF,MAAQ;CACT,IAAM,EACJ,MAAM,IAAc,IACpB,aAAa,IAAqB,GAClC,qBAAqB,IAA6B,IAClD,kBAAkB,IAA0B,IAC5C,OAAO,IAAe,gBACtB,WAAW,IAAe,OACxB,GAAiB,KAAK,CAAC,GACrB,IAAoB,EAAQ,KAAa,EAAY,CAAI,GACzD,CAAC,GAAM,GAAe,IAAgB,CAAC,KAAK,EAAwB,GAAM;EAC9E,OAAO,KAAS;EAChB,OAAO,KAAS,KAAQ;EACxB,QAAQ,KAAU,KAAQ;EAC1B,aAAa,KAAe;EAC5B,qBAAqB,KAAuB;EAC5C,kBAAkB,KAAoB;EACtC,WAAW,EAAa,GAAc,CAAS;EAC/C,aAAa;EACb,YAAY;CACd,CAAC;CACD,OAAO,EACL,GACA;EACE;EACA,GAAG;CACL,GACA,CACE,GAAG,EAAc,KAAK,CAAC,GAAK,OAAW,EAAc,GAAK,CAAK,CAAC,GAChE,GAAG,MAAM,QAAQ,CAAQ,IAAI,IAAW,CAAC,CAAQ,CACnD,CACF;AACF,CACF;;;ACtDA,SAAS,EAAiB,GAAgB,IAAW,CAAC,GAAG,IAAU,CAAC,GAAG;CACrE,IAAM,IAAW,OAAO,KAAmB,WAAW,EAAiB,GAAgB,GAAU,CAAO,IAAI,GACtG,IAAY,GACf,EAAE,cAAW,GAAG,KAAS,MAAQ,EAAc,IAAM;EACpD;EACA,MAAM;EACN;EACA,GAAG;CACL,CAAC,CACH;CAIA,OAHI,EAAS,SACX,EAAU,cAAc,EAAa,EAAS,IAAI,IAE7C;AACT;;;ACjBA,IAAMA,IAAa;CACjB,MAAM;CACN,MAAM;CACN,MAAM,CAAC,CAAC,QAAQ;EAAE,GAAG;EAAmB,KAAK;CAAS,CAAC,CAAC;AAC1D;AACAA,EAAW;AACX,IAAM,IAAQ,EAAiBA,CAAU,GCNnCC,IAAa;CACjB,MAAM;CACN,MAAM;CACN,MAAM,CAAC,CAAC,QAAQ;EAAE,GAAG;EAAgB,KAAK;CAAS,CAAC,CAAC;AACvD;AACAA,EAAW;AACX,IAAM,KAAc,EAAiBA,CAAU,GCNzC,IAAa;CACjB,MAAM;CACN,MAAM;CACN,MAAM,CACJ,CAAC,QAAQ;EAAE,GAAG;EAAoB,KAAK;CAAS,CAAC,GACjD,CAAC,UAAU;EAAE,IAAI;EAAM,IAAI;EAAM,GAAG;EAAK,KAAK;CAAS,CAAC,CAC1D;AACF;AACA,EAAW;AACX,IAAM,IAAS,EAAiB,CAAU;;;;;;;;;;AEF1C,SAAgB,EAAQ,EACtB,gBACA,mBACA,iBAAc,WACd,mBAAgB,MAChB,iBAAc,KACd,eACe;CACf,IAAM,IAAY,EAAyB,IAAI;CAa/C,OAXA,QAAgB;EACd,SAAS,EAAU,GAAkB;GACnC,CAAK,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,YAAY,MAAM,EAAY,YAAY,MAC9E,EAAE,eAAe,GACjB,EAAU,SAAS,MAAM;EAE7B;EAEA,OADA,OAAO,iBAAiB,WAAW,CAAS,SAC/B,OAAO,oBAAoB,WAAW,CAAS;CAC9D,GAAG,CAAC,CAAW,CAAC,GAGd,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAvB,UAAA,CACE,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAvB,UAAA;IACE,kBAAC,QAAD;KAAM,WAAW,EAAO;KACtB,UAAA,kBAAC,GAAD,CAAS,CAAA;IACL,CAAA;IACN,kBAAC,SAAD;KACE,KAAK;KACL,MAAK;KACL,WAAW,EAAO;KACL;KACb,cAAa;KACb,OAAO;KACP,WAAW,MAAqC,IAAiB,EAAE,OAAO,KAAK;IAChF,CAAA;IACA,KACC,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAgB,eAAY;KACjD,UAAA;IACG,CAAA;GAEL;EACJ,CAAA,GAAA,KAAY,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAW;EAAc,CAAA,CAC1D;;AAET;;;;;;;;;;;AElDA,SAAgB,EAAS,EAAE,YAAS,aAAU,UAAO,cAAW,gBAA4B;CAC1F,OACE,kBAAC,SAAD;EAAO,WAAW,GAAG,EAAO,SAAS,GAAG,KAAa;EAArD,UAAA,CACE,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAxB,UAAA,CACE,kBAAC,SAAD;IACE,MAAK;IACL,WAAW,EAAO;IACT;IACC;IACV,cAAY;GACb,CAAA,GACD,kBAAC,QAAD;IAAM,WAAW,EAAO;IACtB,UAAA,kBAAC,OAAD;KAAK,WAAW,EAAO;KAAM,SAAQ;KAAY,eAAY;KAC3D,UAAA,kBAAC,YAAD,EAAU,QAAO,gBAAiB,CAAA;IAC/B,CAAA;GACD,CAAA,CACF;EACL,CAAA,GAAA,KAAS,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAY,UAAA;EAAY,CAAA,CACrD;;AAEX;;;;;;;;;;;AElBA,SAAgB,EAAY,EAC1B,YACA,aACA,SACA,UACA,UACA,cACA,gBACmB;CACnB,OACE,kBAAC,SAAD;EAAO,WAAW,GAAG,EAAO,MAAM,GAAG,KAAa;EAAlD,UAAA,CACE,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAxB,UAAA,CACE,kBAAC,SAAD;IACE,MAAK;IACL,WAAW,EAAO;IACT;IACC;IACJ;IACC;IACP,cAAY;GACb,CAAA,GACD,kBAAC,QAAD;IAAM,WAAW,EAAO;IACtB,UAAA,kBAAC,QAAD,EAAM,WAAW,EAAO,IAAM,CAAA;GAC1B,CAAA,CACF;EACL,CAAA,GAAA,KAAS,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAY,UAAA;EAAY,CAAA,CACrD;;AAEX;;;;;;;;;;;;;AE1BA,SAAgB,EAAO,EACrB,YACA,aACA,UAAO,QACP,UACA,cACA,aACA,gBACc;CACd,OACE,kBAAC,SAAD;EAAO,WAAW,GAAG,EAAO,OAAO,GAAG,KAAa;EAAnD,UAAA,CACE,kBAAC,QAAD;GAAM,WAAW,GAAG,EAAO,QAAQ,GAAG,EAAO;GAA7C,UAAA,CACE,kBAAC,SAAD;IACE,MAAK;IACL,MAAK;IACL,WAAW,EAAO;IACT;IACC;IACV,cAAY;IACF;GACX,CAAA,GACD,kBAAC,QAAD;IAAM,WAAW,EAAO;IACtB,UAAA,kBAAC,QAAD,EAAM,WAAW,EAAO,MAAQ,CAAA;GAC5B,CAAA,CACF;EACL,CAAA,GAAA,KAAS,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAY,UAAA;EAAY,CAAA,CACrD;;AAEX;;;;;;;;;;;;;;;;AE5BA,SAAgB,EAAU,EACxB,UACA,eACA,UACA,UAAO,QACP,aAAU,WACV,gBACA,OACA,GAAG,KACc;CACjB,IAAM,IAAc,EAAM,GACpB,IAAU,KAAM;CAEtB,OACE,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAvB,UAAA;GACG,KACC,kBAAC,SAAD;IAAO,WAAW,EAAO;IAAO,SAAS;IACtC,UAAA;GACI,CAAA;GAET,kBAAC,OAAD;IACE,WAAW,GAAG,EAAO,UAAU,GAAG,EAAO,GAAS,GAAG,EAAO,GAAM,GAAG,IAAQ,EAAO,YAAY;IADlG,UAAA,CAGG,KAAe,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAO,UAAA;IAAkB,CAAA,GACjE,kBAAC,SAAD;KAAO,IAAI;KAAS,WAAW,EAAO;KAAO,GAAI;IAAO,CAAA,CACrD;;GACJ,IACC,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAY,UAAA;GAAY,CAAA,IAC9C,IACF,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAa,UAAA;GAAiB,CAAA,IACpD;EACD;;AAET;;;;;;;AEzCA,SAAgB,EAAK,EAAE,aAAU,GAAG,KAAmB;CACrD,OACE,kBAAC,OAAD;EAAK,MAAK;EAAO,WAAW,EAAO;EAAM,GAAI;EAC1C;CACE,CAAA;AAET;AAEA,SAAgB,IAAc;CAC5B,OAAO,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAS,MAAK;CAAa,CAAA;AAC3D;;;;;;;;;;;;AELA,SAAgB,EAAS,EAAE,SAAM,aAAU,aAAU,gBAAa,aAAU,GAAG,KAAuB;CACpG,IAAM,IAAU;EAAC,EAAO;EAAM,KAAY,EAAO;EAAU,KAAe,EAAO;CAAW,CAAC,CAC1F,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;CAEX,OACE,kBAAC,UAAD;EAAQ,MAAK;EAAS,MAAK;EAAW,WAAW;EAAS,GAAI;EAA9D,UAAA;GACG,KAAQ,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAO,UAAA;GAAW,CAAA;GACnD,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAQ;GAAe,CAAA;GAC9C,KAAY,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAW,UAAA;GAAe,CAAA;GAC9D,KACC,kBAAC,QAAD;IAAM,WAAW,EAAO;IACtB,UAAA,kBAAC,GAAD,CAAQ,CAAA;GACJ,CAAA;EAEF;;AAEZ;;;;;;;;;;;;;;;;;;;AEFA,SAAgB,GAA2B,EACzC,UACA,eACA,UACA,UAAO,QACP,iBAAc,WACd,YACA,UACA,aACA,eACmB;CACnB,IAAM,CAAC,GAAM,KAAW,EAAS,EAAK,GAChC,IAAU,EAAuB,IAAI,GACrC,IAAY,EAAM,GAElB,IAAW,EAAQ,MAAM,MAAQ,EAAI,UAAU,CAAK,GACpD,IAAgB,EAAQ,QAAQ,MAAQ,CAAC,EAAI,QAAQ,CAAC,CAAC,KAAK,MAAQ,EAAI,KAAK;CASnF,AAPA,QAAgB;EACd,IAAI,CAAC,GAAM;EACX,IAAM,IAAa,KAAS,EAAc;EAE1C,CADW,EAAQ,SAAS,cAAiC,gBAAgB,EAAW,GAAG,EAAA,EACvF,MAAM;CACZ,GAAG,CAAC,CAAI,CAAC,GAET,QAAgB;EACd,IAAI,CAAC,GAAM;EACX,SAAS,EAAc,GAAiB;GACtC,AAAK,EAAQ,SAAS,SAAS,EAAE,MAAc,KAAG,EAAQ,EAAK;EACjE;EACA,SAAS,EAAU,GAA6B;GAC9C,AAAI,EAAE,QAAQ,YAAU,EAAQ,EAAK;EACvC;EAGA,OAFA,OAAO,iBAAiB,eAAe,CAAa,GACpD,OAAO,iBAAiB,WAAW,CAAS,SAC/B;GAEX,AADA,OAAO,oBAAoB,eAAe,CAAa,GACvD,OAAO,oBAAoB,WAAW,CAAS;EACjD;CACF,GAAG,CAAC,CAAI,CAAC;CAET,SAAS,EAAqB,GAAqC;EACjE,IAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;GAE/D,AADA,EAAE,eAAe,GACjB,EAAQ,EAAI;GACZ;EACF;EACA,AAAI,EAAE,QAAQ,YAAU,EAAQ,EAAK;CACvC;CAEA,SAAS,EAAoB,GAAqC,GAAiB;EACjF,IAAM,IAAe,EAAc,QAAQ,CAAY;EACvD,IAAI,MAAiB,IAAI;EAEzB,IAAI,IAA2B;EAM/B,IALI,EAAE,QAAQ,gBAAa,KAAa,IAAe,KAAK,EAAc,SACtE,EAAE,QAAQ,cAAW,KAAa,IAAe,IAAI,EAAc,UAAU,EAAc,SAC3F,EAAE,QAAQ,WAAQ,IAAY,IAC9B,EAAE,QAAQ,UAAO,IAAY,EAAc,SAAS,IAEpD,MAAc,MAAM;GACtB,EAAE,eAAe;GACjB,IAAM,IAAY,EAAc;GAEhC,CADW,EAAQ,SAAS,cAAiC,gBAAgB,EAAU,GAAG,EAAA,EACtF,MAAM;GACV;EACF;EACA,AAAI,EAAE,QAAQ,YAAU,EAAQ,EAAK;CACvC;CAEA,OACE,kBAAC,OAAD;EAAK,WAAW,EAAO;EAAO,KAAK;EAAnC,UAAA;GACG,KACC,kBAAC,SAAD;IAAO,WAAW,EAAO;IAAO,SAAS;IACtC,UAAA;GACI,CAAA;GAET,kBAAC,UAAD;IACE,IAAI;IACJ,MAAK;IACL,WAAW,GAAG,EAAO,QAAQ,GAAG,EAAO,GAAM,GAAG,IAAQ,EAAO,YAAY;IAC3E,iBAAc;IACd,iBAAe;IACL;IACV,eAAe,GAAS,MAAM,CAAC,CAAC;IAChC,WAAW;IARb,UAAA;KAUG,GAAU,QAAQ,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAO,UAAA,EAAS;KAAW,CAAA;KACtE,kBAAC,QAAD;MAAM,WAAW,GAAG,EAAO,MAAM,GAAI,IAAgC,KAArB,EAAO;MACpD,UAAA,IAAW,EAAS,QAAQ;KACzB,CAAA;KACN,kBAAC,QAAD;MAAM,WAAW,GAAG,EAAO,QAAQ,GAAG,IAAO,EAAO,cAAc;MAChE,UAAA,kBAAC,IAAD,CAAc,CAAA;KACV,CAAA;IACA;;GACP,KACC,kBAAC,OAAD;IAAK,WAAW,EAAO;IACrB,UAAA,kBAAC,GAAD;KAAM,MAAK;KAAU,OAAO,EAAE,OAAO,OAAO;KACzC,UAAA,EAAQ,KAAK,MACZ,kBAAC,GAAD;MAEE,cAAY,EAAI;MAChB,MAAK;MACL,iBAAe,EAAI,UAAU;MAC7B,MAAM,EAAI;MACV,UAAU,EAAI,UAAU;MACxB,UAAU,EAAI;MACd,eAAe;OAEb,AADA,EAAS,EAAI,KAAK,GAClB,EAAQ,EAAK;MACf;MACA,YAAY,MAAM,EAAoB,GAAG,EAAI,KAAK;MAEjD,UAAA,EAAI;KACG,GAdH,EAAI,KAcD,CACX;IACG,CAAA;GACH,CAAA;GAEN,IACC,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAY,UAAA;GAAY,CAAA,IAC9C,IACF,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAa,UAAA;GAAiB,CAAA,IACpD;EACD;;AAET;;;;AEtJA,SAAS,GAAa,GAAuB;CAC3C,OAAO,EAAM,QAAQ,uBAAuB,MAAM;AACpD;AAEA,SAAgB,GAAc,EAAE,SAAM,YAA0C;CAC9E,IAAI,CAAC,GAAO,OAAO,kBAAA,GAAA,EAAA,UAAG,EAAO,CAAA;CAE7B,IAAM,IAAQ,EAAK,MAAU,OAAO,IAAI,GAAa,CAAK,EAAE,IAAI,IAAI,CAAC;CACrE,OACE,kBAAA,GAAA,EAAA,UACG,EAAM,KAAK,GAAM,MAChB,EAAK,YAAY,MAAM,EAAM,YAAY,IACvC,kBAAC,QAAD;EAAc,WAAW,GAAO;EAC7B,UAAA;CACG,GAFK,CAEL,IAEN,kBAAC,GAAD,EAAA,UAAmB,EAAe,GAAnB,CAAmB,CAEtC,EACA,CAAA;AAEN;;;;;;;;;;;;;;;;;;;;;;;AEVA,SAAgB,EAAgC,EAC9C,UACA,YACA,gBACA,cACA,aACA,aACA,iBACwB;CACxB,IAAM,CAAC,GAAO,KAAY,EAAS,EAAE,GAE/B,IAAI,EAAM,KAAK,CAAC,CAAC,YAAY,GAC7B,IAAU,IAAI,EAAQ,QAAQ,MAAQ,EAAY,CAAG,CAAC,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,GACpF,IAAc,EAAQ,SAAS,KAAK,EAAU,SAAS,EAAQ;CAErE,OACE,kBAAC,OAAD,EAAA,UAAA;EACE,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAvB,UAAA,CACE,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAe,UAAA;GAAW,CAAA,GAChD,KACC,kBAAC,UAAD;IACE,MAAK;IACL,WAAW,EAAO;IAClB,eAAe,EAAS,IAAc,CAAC,IAAI,CAAO;IAEjD,UAAA,IAAc,iBAAiB;GAC1B,CAAA,CAEP;;EACJ,KACC,kBAAC,SAAD;GACE,MAAK;GACL,WAAW,EAAO;GAClB,aAAa,UAAU,EAAM,YAAY,EAAE;GAC3C,cAAa;GACb,OAAO;GACP,UAAU,MAAM,EAAE,gBAAgB;GAClC,WAAW,MAAM,EAAS,EAAE,OAAO,KAAK;EACzC,CAAA;EAEH,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAvB,UAAA,CACG,EAAQ,WAAW,KAAK,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAO,UAAA;GAAa,CAAA,GACnE,EAAQ,KAAK,MACZ,kBAAC,GAAD;IAEE,WAAW,EAAO;IAClB,SAAS,EAAU,IAAI,CAAG;IAC1B,gBAAgB,EAAS,CAAG;IAC5B,OAAO,EAAY,CAAG;GACvB,GALM,CAKN,CACF,CACE;;CACF,EAAA,CAAA;AAET;;;;;;;;;;;;;;;AEvCA,SAAgB,GAAK,EAAE,UAAO,UAAO,aAAU,aAAU,QAAQ,UAAO,QAAQ,GAAG,KAAmB;CACpG,IAAM,IAAgB,EAAM,QAAQ,MAAS,CAAC,EAAK,QAAQ,CAAC,CAAC,KAAK,MAAS,EAAK,KAAK,GAE/E,IAAe,EAA8B,IAAI,GACjD,IAAU,kBAAuC,IAAI,IAAI,CAAC,GAC1D,IAAe,EAAO,CAAK,GAC3B,CAAC,GAAgB,KAAqB,EAC1C,IACF,GACM,CAAC,GAAW,KAAgB,EAAyC,MAAM;CAEjF,QAAsB;EACpB,IAAM,IAAc,EAAQ,QAAQ,IAAI,CAAK;EACxC,MACL,EAAkB;GAAE,MAAM,EAAY;GAAY,OAAO,EAAY;EAAY,CAAC,GAE9E,MAAY,SAAS,EAAa,YAAY,KAChD,EAAa,QAAQ,GAEvB,EAAa,UAAU;CACzB,GAAG;EAAC;EAAO;EAAO;EAAS;CAAI,CAAC;CAEhC,SAAS,EAAwB,GAAyC;EACpE,EAAM,iBAAiB,YACvB,MAAc,WAAU,EAAa,UAAU,IAC1C,MAAc,cAAY,EAAa,MAAM;CACxD;CAEA,QAAsB;EACpB,IAAM,IAAY,EAAa;EAC/B,IAAI,CAAC,GAAW;EAChB,IAAM,IAAW,IAAI,qBAAqB;GACxC,IAAM,IAAc,EAAQ,QAAQ,IAAI,CAAK;GACxC,KACL,EAAkB;IAAE,MAAM,EAAY;IAAY,OAAO,EAAY;GAAY,CAAC;EACpF,CAAC;EAED,OADA,EAAS,QAAQ,CAAS,SACb,EAAS,WAAW;CACnC,GAAG,CAAC,CAAK,CAAC;CAEV,SAAS,EAAc,GAAsC;EAC3D,IAAM,IAAe,EAAc,QAAQ,CAAK;EAChD,IAAI,MAAiB,IAAI;EAEzB,IAAI,IAA2B;EAQ/B,AAPI,EAAM,QAAQ,iBAAc,KAAa,IAAe,KAAK,EAAc,SAC3E,EAAM,QAAQ,gBAChB,KAAa,IAAe,IAAI,EAAc,UAAU,EAAc,SAEpE,EAAM,QAAQ,WAAQ,IAAY,IAClC,EAAM,QAAQ,UAAO,IAAY,EAAc,SAAS,IAExD,MAAc,SAChB,EAAM,eAAe,GACrB,EAAS,EAAc,EAAU;CAErC;CAEA,OACE,kBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,WAAW,CAAC,EAAO,IAAU,MAAY,SAAS,MAAS,QAAQ,EAAO,EAAE,CAAC,CAC1E,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;EACX,WAAW;EACX,GAAI;EAPN,UAAA,CASG,KACC,kBAAC,QAAD;GACE,eAAA;GACA,WAAW;IACT,EAAO;IACP,MAAY,SAAS,EAAO,gBAAgB,EAAO;IACnD,MAAc,cAAc,EAAO;GACrC,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;GACX,iBAAiB;GACjB,OAAO;IACL,WAAW,GAAG,EAAe,KAAK;IAClC,OAAO,MAAY,SAAS,MAAc,WAAW,MAAO;IAC5D,OAAO,EAAe;GACxB;EACD,CAAA,GAEF,EAAM,KAAK,MAAS;GACnB,IAAM,IAAW,EAAK,UAAU;GAChC,OACE,kBAAC,UAAD;IAEE,MAAM,MAAS;KACb,AAAI,IAAM,EAAQ,QAAQ,IAAI,EAAK,OAAO,CAAI,IACzC,EAAQ,QAAQ,OAAO,EAAK,KAAK;IACxC;IACA,MAAK;IACL,MAAK;IACL,iBAAe;IACf,UAAU,EAAK;IACf,UAAU,IAAW,IAAI;IACzB,WAAW,CAAC,EAAO,KAAK,KAAY,EAAO,QAAQ,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;IAC7E,eAAe,CAAC,EAAK,YAAY,EAAS,EAAK,KAAK;IAZtD,UAAA,CAcG,EAAK,QAAQ,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAO,UAAA,EAAK;IAAW,CAAA,GAC5D,EAAK,KACA;GAfD,GAAA,EAAK,KAeJ;EAEZ,CAAC,CACE;;AAET;;;AC3IA,SAAgB,GAAe,GAAsB;CACnD,IAAM,IAAI,KAAK,MAAM,IAAO,EAAE,GACxB,IAAI,IAAO;CACjB,OAAO,GAAG,EAAE,IAAI,OAAO,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG,EAAE;AAC7C;AAGA,SAAgB,GAAkB,GAAc,GAAyB;CACvE,IAAM,IAAI,KAAK,MAAM,IAAO,EAAE,GACxB,IAAI,IAAO,IACX,KAAO,MAAc,OAAO,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG;CACpD,OAAO,GAAG,EAAI,CAAC,EAAE,GAAG,EAAI,CAAC,EAAE,GAAG,EAAI,CAAO;AAC3C"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cattle-care-ui",
3
- "version": "0.1.5",
3
+ "version": "0.1.6",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1,9 +0,0 @@
1
- interface UiElementsSidebarProps {
2
- sections: {
3
- id: string;
4
- label: string;
5
- count: number;
6
- }[];
7
- }
8
- export declare function UiElementsSidebar({ sections }: UiElementsSidebarProps): import("react").JSX.Element;
9
- export {};