@stenajs-webui/forms 20.7.0 → 20.7.2

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.
package/dist/index.es.js CHANGED
@@ -1,9 +1,9 @@
1
1
  (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode('._switch_1d6s8_1{--swui-switch-width: 50px;--swui-switch-height: var(--swui-field-box-size-medium);--swui-switch-animation-time: var(--swui-animation-time-medium);--swui-switch-selected-highlight-color: var(--lhds-color-blue-500);--swui-switch-knob-width: calc(var(--swui-switch-height) - 2px);--swui-switch-knob-bg-color-enabled: var(--swui-handle-bg-enabled-color);--swui-switch-knob-bg-color-disabled: var(--swui-handle-bg-disabled-color);--swui-switch-container-bg-color-enabled: var(--swui-field-bg-enabled);--swui-switch-container-bg-color-disabled: var(--swui-field-bg-disabled);--swui-switch-knob-border-color-enabled: var(--swui-separator-color);--swui-switch-container-border-color: var(--swui-field-border-color);--swui-switch-container-border-color-hover: var( --swui-field-border-color-hover );--swui-switch-container-border-color-disabled: var( --swui-field-border-color-disabled );--swui-switch-knob-shadow-color: var(--swui-field-shadow-color);display:flex;flex-direction:row;border:1px solid var(--swui-switch-container-border-color);box-sizing:border-box;background-color:var(--swui-switch-container-bg-color-enabled);height:var(--swui-switch-height);width:var(--swui-switch-width);border-radius:calc(var(--swui-switch-height) / 2);padding:0;margin:0;cursor:pointer;transition:background-color var(--swui-switch-animation-time)}._switch_1d6s8_1:focus{outline:0}._switch_1d6s8_1:focus-visible{outline:var(--swui-focus-outline);outline-offset:2px;border:1px solid var(--swui-switch-selected-highlight-color)}._switch_1d6s8_1:hover{border:1px solid var(--swui-switch-selected-highlight-color)}._switch_1d6s8_1:disabled{cursor:default;background-color:var(--swui-switch-container-bg-color-disabled);border:1px solid var(--swui-switch-container-border-color-disabled)}._switch_1d6s8_1:disabled ._knob_1d6s8_56{background-color:var(--swui-switch-knob-bg-color-disabled)}._switch_1d6s8_1 ._filler_1d6s8_61{flex:none;transition:flex var(--swui-switch-animation-time)}._switch_1d6s8_1 ._knob_1d6s8_56{width:var(--swui-switch-knob-width);height:var(--swui-switch-knob-width);border-radius:50%;background-color:var(--swui-switch-knob-bg-color-enabled);box-shadow:var(--swui-switch-knob-shadow-color) 0 0 4px 1px}._checked_1d6s8_75{border:1px solid var(--swui-switch-selected-highlight-color);background-color:var(--swui-switch-selected-highlight-color)}._checked_1d6s8_75 ._filler_1d6s8_61{flex:1}._checkbox_1ndou_1{--swui-checkbox-height: var(--swui-field-box-size-medium);--swui-checkbox-height-small: var(--swui-field-box-size-small);--swui-checkbox-border-radius: var(--swui-field-border-radius);--swui-checkbox-animation-time: var(--swui-animation-time-medium);--swui-checkbox-icon-color: var(--swui-field-indicator-active-color);--swui-checkbox-disabled-icon-color: var(--swui-text-disabled-color);--swui-checkbox-unchecked-icon-color: var( --swui-field-indicator-inactive-color );--swui-checkbox-unchecked-bg-color: var(--swui-white);--swui-checkbox-checked-bg-color: var(--lhds-color-blue-500);--swui-checkbox-disabled-bg-color: var(--swui-field-bg-disabled);--swui-checkbox-disabled-checked-bg-color: var(--swui-field-bg-disabled);--swui-checkbox-border-color: var(--swui-field-border-color);--swui-checkbox-border-hover-color: var(--swui-field-border-color-hover);--swui-checkbox-disabled-border-color: var(--swui-checkbox-disabled-bg-color);-webkit-appearance:none;-moz-appearance:none;border-radius:var(--swui-checkbox-border-radius);outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:1px solid var(--current-border-color, var(--swui-checkbox-border-color));background:var(--current-bg-color, var(--swui-checkbox-unchecked-bg-color));transition:background var(--swui-checkbox-animation-time),border-color var(--swui-checkbox-animation-time);flex-shrink:0}._checkbox_1ndou_1._standard_1ndou_39{width:var(--swui-checkbox-height);height:var(--swui-checkbox-height)}._checkbox_1ndou_1._standard_1ndou_39:after{width:3px;height:6px;left:9px;top:6px}._checkbox_1ndou_1._small_1ndou_51{width:var(--swui-checkbox-height-small);height:var(--swui-checkbox-height-small)}._checkbox_1ndou_1._small_1ndou_51:after{width:3px;height:6px;left:5px;top:2px}._checkbox_1ndou_1:after{content:"";display:block;position:absolute;transition:transform var(--swui-checkbox-animation-time) var(--d-t-e, ease),opacity var(--swui-checkbox-animation-time),width var(--swui-checkbox-animation-time),top var(--swui-checkbox-animation-time);border:2px solid var( --current-checkbox-icon-color, var(--swui-checkbox-unchecked-icon-color) );border-top:0;border-left:0;transform:rotate(var(--current-check-rotation, 20deg));box-sizing:content-box}._checkbox_1ndou_1:checked{--current-check-rotation: 43deg;--current-bg-color: var(--swui-checkbox-checked-bg-color);--current-border-color: var(--swui-checkbox-checked-bg-color);--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}._checkbox_1ndou_1:checked:after{--current-checkbox-icon-color: var(--swui-checkbox-icon-color)}._checkbox_1ndou_1:disabled:not(:checked){--current-bg-color: var(--swui-checkbox-disabled-bg-color);--current-border-color: var(--swui-checkbox-disabled-border-color)}._checkbox_1ndou_1:disabled:not(:checked):after{--current-checkbox-icon-color: --swui-checkbox-unchecked-icon-color}._checkbox_1ndou_1:disabled:checked{--current-bg-color: var(--swui-checkbox-disabled-checked-bg-color);--current-border-color: var(--swui-checkbox-disabled-border-color)}._checkbox_1ndou_1:disabled:checked:after{--current-checkbox-icon-color: var(--swui-checkbox-disabled-icon-color)}._checkbox_1ndou_1:indeterminate{--current-check-rotation: 43deg;--current-bg-color: var(--swui-checkbox-checked-bg-color);--current-border-color: var(--swui-checkbox-checked-bg-color);--d-t-e: cubic-bezier(.2, .85, .32, 1.2)}._checkbox_1ndou_1:indeterminate:after{--current-checkbox-icon-color: var(--swui-checkbox-icon-color);border-right:0;transform:rotate(0);width:6px}._checkbox_1ndou_1:indeterminate._standard_1ndou_39:after{top:4px;left:8px}._checkbox_1ndou_1:indeterminate._small_1ndou_51:after{top:0;left:4px}._checkbox_1ndou_1:indeterminate:disabled:after{--current-checkbox-icon-color: var(--swui-checkbox-disabled-icon-color)}._checkbox_1ndou_1:hover:not(:checked):not(:disabled){--current-border-color: var(--swui-checkbox-border-hover-color)}._checkbox_1ndou_1:focus-visible{outline:var(--swui-focus-outline)}._checkbox_1ndou_1+label{font-size:1.4rem;line-height:var(--swui-checkbox-height);display:inline-block;vertical-align:top;cursor:pointer;margin-left:4px}._radiobutton_foy83_1{--swui-radiobutton-size-standard: var(--swui-field-box-size-medium);--swui-radiobutton-size-small: var(--swui-field-box-size-small);--swui-radiobutton-animation-time: var(--swui-animation-time-medium);--swui-radiobutton-icon-color: var(--swui-field-indicator-active-color);--swui-radiobutton-disabled-icon-color: var(--swui-field-text-color-disabled);--swui-radiobutton-unchecked-icon-color: var( --swui-field-indicator-inactive-color );--swui-radiobutton-checked-bg-color: var(--lhds-color-blue-500);--swui-radiobutton-checked-disabled-bg-color: var(--swui-field-bg-disabled);--swui-radiobutton-unchecked-bg-color: var(--swui-white);--swui-radiobutton-unchecked-disabled-bg-color: var(--swui-field-bg-disabled);--swui-radiobutton-unchecked-border-color: var(--swui-field-border-color);--swui-radiobutton-unchecked-hover-border-color: var( --swui-field-border-color-hover );--swui-radiobutton-disabled-border-color: var( --swui-radiobutton-checked-disabled-bg-color );-webkit-appearance:none;-moz-appearance:none;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;flex:none;cursor:pointer;border:1px solid var(--current-border-color, var(--swui-radiobutton-unchecked-border-color));border-radius:50%;background:var( --current-bg-color, var(--swui-radiobutton-unchecked-bg-color) );transition:background var(--swui-radiobutton-animation-time),border-color var(--swui-radiobutton-animation-time)}._radiobutton_foy83_1._standard_foy83_45{height:var(--swui-radiobutton-size-standard);width:var(--swui-radiobutton-size-standard)}._radiobutton_foy83_1._standard_foy83_45:after{left:7px;top:7px}._radiobutton_foy83_1._small_foy83_55{height:var(--swui-radiobutton-size-small);width:var(--swui-radiobutton-size-small)}._radiobutton_foy83_1._small_foy83_55:after{left:3px;top:3px}._radiobutton_foy83_1:after{content:"";display:block;position:absolute;transition:transform var(--current-transform-time, var(--swui-radiobutton-animation-time)) var(--current-transform-type, ease),opacity var(--current-opacity-time, var(--swui-radiobutton-animation-time)) var(--current-transform-type, ease);transform:scale(var(--current-scale, 0));width:8px;height:8px;border-radius:50%;background:var( --current-icon-color, var(--swui-radiobutton-unchecked-icon-color) );opacity:var(--current-opacity, 0)}._radiobutton_foy83_1:checked{--current-bg-color: var(--swui-radiobutton-checked-bg-color);--current-border-color: var(--swui-radiobutton-checked-bg-color);--current-opacity-time: var(--swui-radiobutton-animation-time);--current-transform-time: .6s;--current-transform-type: cubic-bezier(.2, .85, .32, 1.2);--current-opacity: 1;--current-scale: 1}._radiobutton_foy83_1:checked:after{--current-icon-color: var(--swui-radiobutton-icon-color)}._radiobutton_foy83_1:disabled{--current-bg-color: var(--swui-radiobutton-unchecked-disabled-bg-color);--current-border-color: var(--swui-radiobutton-disabled-border-color)}._radiobutton_foy83_1:disabled:checked{--current-bg-color: var(--swui-radiobutton-checked-disabled-bg-color)}._radiobutton_foy83_1:disabled:checked:after{--current-icon-color: var(--swui-radiobutton-disabled-icon-color)}._radiobutton_foy83_1:hover:not(:checked):not(:disabled){--current-border-color: var( --swui-radiobutton-unchecked-hover-border-color )}._radiobutton_foy83_1:focus-visible{outline:var(--swui-focus-outline)}._radiobutton_foy83_1+label{font-size:1.4rem;line-height:var(--swui-radiobutton-size-standard);display:inline-block;vertical-align:top;cursor:pointer;margin-left:4px}._radioButtonBox_vpn6v_1{box-sizing:border-box;background-color:var(--lhds-color-ui-200);position:relative;border:1px solid var(--silver-ui);width:100%;border-radius:16px;padding:var(--swui-metrics-space);font-size:var(--swui-font-size-inputs);align-items:center;display:flex;cursor:pointer;outline:none}._radioButtonBox_vpn6v_1:hover{border-color:var(--hav)}._radioButtonBox_vpn6v_1._danger_vpn6v_19{background-color:var(--snackskal-light);border-color:var(--snackskal-light)}._radioButtonBox_vpn6v_1._danger_vpn6v_19:hover{border-color:var(--lhds-color-red-500)}@media (max-width: 768px){._radioButtonWrapper_vpn6v_30{width:100%}}._textInput_1jb3g_1{display:flex;height:var(--swui-field-height);width:100%;align-items:center;background:var(--swui-field-bg-enabled);border:1px solid var(--swui-field-border-color);border-radius:var(--swui-field-border-radius);outline:none}._textInput_1jb3g_1._textInput_1jb3g_1:focus-within:not(._disabled_1jb3g_11){outline:var(--swui-focus-outline);border-color:transparent}._textInput_1jb3g_1 ._input_1jb3g_16{letter-spacing:var(--swui-field-letter-spacing);line-height:var(--swui-field-text-line-height);width:100%;padding:2px var(--swui-metrics-indent);color:var(--swui-field-text-color);font-size:var(--swui-font-size-inputs);font-family:var(--swui-font-input);font-weight:var(--swui-font-weight-inputs);background:var(--swui-hidden);border:none;min-width:0;margin:0;outline:none}._textInput_1jb3g_1 ._input_1jb3g_16:disabled{color:var(--swui-field-text-color-disabled)}._textInput_1jb3g_1 ._input_1jb3g_16::placeholder{color:var(--swui-field-placeholder-color);font-weight:var(--swui-field-placeholder-font-weight)}._textInput_1jb3g_1 ._input_1jb3g_16:focus::placeholder{opacity:0}._textInput_1jb3g_1 ._input_1jb3g_16::-webkit-calendar-picker-indicator{display:none}._textInput_1jb3g_1 ._icon_1jb3g_49{transition:color var(--swui-animation-time-medium);color:var(--swui-field-icon-color);font-size:var(--swui-field-icon-size)}._textInput_1jb3g_1._standard_1jb3g_59:hover:not(:focus-within):not(._disabled_1jb3g_11),._textInput_1jb3g_1._success_1jb3g_60:hover:not(:focus-within):not(._disabled_1jb3g_11){border-color:var(--swui-field-border-color-hover)}._textInput_1jb3g_1._success_1jb3g_60 ._icon_1jb3g_49{color:var(--swui-state-success-color)}._textInput_1jb3g_1._loading_1jb3g_72{background:var(--swui-state-loading-light-color);border-color:var(--swui-state-loading-color)}._textInput_1jb3g_1._modified_1jb3g_77{background:var(--swui-state-modified-light-color);border-color:var(--swui-state-modified-light-color)}._textInput_1jb3g_1._modified_1jb3g_77 ._icon_1jb3g_49{color:var(--lhds-color-blue-300)}._textInput_1jb3g_1._error_1jb3g_86{background:var(--swui-state-error-light-color);border-color:var(--swui-state-error-light-color)}._textInput_1jb3g_1._error_1jb3g_86 ._icon_1jb3g_49{color:var(--swui-state-error-light-color)}._textInput_1jb3g_1._warning_1jb3g_95{background:var(--swui-state-alert-light-color);border-color:var(--swui-state-alert-light-color)}._textInput_1jb3g_1._warning_1jb3g_95 ._icon_1jb3g_49{color:var(--swui-state-alert-light-color)}._textInput_1jb3g_1._disabled_1jb3g_11{background:var(--swui-field-bg-disabled);border-color:var(--swui-field-bg-disabled)}._textInput_1jb3g_1._textInput_1jb3g_1._hideBorder_1jb3g_109{border:none;box-shadow:none;background:none;outline:none}._textInput_1jb3g_1 ._clickable_1jb3g_116:hover{cursor:pointer}._textInput_1jb3g_1 ._clickable_1jb3g_116:hover ._icon_1jb3g_49{color:var(--swui-primary-action-color)}._numericTextInputInput_1tnr6_1{-moz-appearance:textfield}._numericTextInputInput_1tnr6_1::-webkit-outer-spin-button,._numericTextInputInput_1tnr6_1::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}._labelledSelect_1evxo_1{border:1px solid var(--swui-field-border-color);border-radius:var(--swui-border-radius-large);position:relative;overflow:hidden;cursor:pointer}._labelledSelect_1evxo_1._labelledSelect_1evxo_1._onlyTopBorder_1evxo_8{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-color:transparent}._labelledSelect_1evxo_1._onlyBottomBorder_1evxo_14{border-top-left-radius:0;border-top-right-radius:0}._labelledSelect_1evxo_1._error_1evxo_19{border-color:var(--snackskal);background-color:var(--snackskal)}._labelledSelect_1evxo_1._normal_1evxo_24{border-color:var(--swui-field-border-color);background-color:var(--moln)}._labelledSelect_1evxo_1._labelledSelect_1evxo_1:focus-within{border-color:var(--swui-field-border-color-hover);outline:var(--swui-focus-outline);outline-offset:0;z-index:10}._labelledSelect_1evxo_1._labelledSelect_1evxo_1:hover{border-color:var(--swui-field-border-color-hover)}._labelledSelect_1evxo_1 ._label_1evxo_1{display:flex;position:absolute;top:var(--swui-metrics-space);left:calc(var(--swui-metrics-space) * 2);cursor:pointer}._labelledSelect_1evxo_1 ._select_1evxo_48{color:var(--swui-text-primary-color);display:block;margin:0;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;font-size:var(--swui-font-size-inputs-large);line-height:1.5;box-sizing:border-box;cursor:pointer;padding:calc(var(--swui-metrics-space) * 5) calc(var(--swui-metrics-space) * 8) calc(var(--swui-metrics-space) * 2) calc(var(--swui-metrics-space) * 2)}._labelledSelect_1evxo_1 ._select_1evxo_48._error_1evxo_19{background-color:var(--snackskal)}._labelledSelect_1evxo_1 ._select_1evxo_48._normal_1evxo_24{background-color:var(--moln)}._labelledSelect_1evxo_1 ._iconWrapper_1evxo_73{border-radius:var(--swui-max-border-radius);width:40px;height:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;top:0;bottom:0;right:calc(var(--swui-metrics-space) * 2);margin-top:auto;margin-bottom:auto;padding:0;background:var(--silver-lighter);pointer-events:none}._labelledTextInput_lnht8_1{position:relative;background:var(--moln);overflow:hidden;cursor:text;border:1px solid var(--silver-light);border-radius:var(--swui-border-radius)}._labelledTextInput_lnht8_1 input{outline:none;border:none;margin:0;color:var(--swui-text-primary-color);background-color:transparent;line-height:var(--swui-line-height);width:100%;box-sizing:border-box;cursor:text}._labelledTextInput_lnht8_1._labelledTextInput_lnht8_1._onlyTop_lnht8_21{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-color:transparent}._labelledTextInput_lnht8_1._labelledTextInput_lnht8_1._onlyBottom_lnht8_27{border-top-left-radius:0;border-top-right-radius:0}._labelledTextInput_lnht8_1:focus-within{outline:var(--swui-focus-outline);outline-offset:-1px;border-color:transparent}._labelledTextInput_lnht8_1:hover:not(:focus-within){border-color:var(--hav)}._labelledTextInput_lnht8_1._disabled_lnht8_42{background-color:var(--silver-lighter)}._labelledTextInput_lnht8_1._disabled_lnht8_42 input{color:var(--silver)}._labelledTextInput_lnht8_1._medium_lnht8_50:focus-within{outline-width:2px}._labelledTextInput_lnht8_1._medium_lnht8_50 input{font-size:var(--swui-font-size-inputs);padding:calc(var(--swui-metrics-space) * 4) calc(var(--swui-metrics-space) * 2) calc(var(--swui-metrics-space) * 1)}._labelledTextInput_lnht8_1._large_lnht8_62{border-radius:var(--swui-border-radius-large)}._labelledTextInput_lnht8_1._large_lnht8_62:focus-within{outline-width:3px}._labelledTextInput_lnht8_1._large_lnht8_62 input{font-size:var(--swui-font-size-inputs-large);padding:calc(var(--swui-metrics-space) * 5) calc(var(--swui-metrics-space) * 2) calc(var(--swui-metrics-space) * 2)}._labelledTextInput_lnht8_1._error_lnht8_76{border-color:var(--swui-state-error-light-color)}._labelledTextInput_lnht8_1._error_lnht8_76:hover:not(:focus-within){border-color:var(--modern-red)}._labelledTextInput_lnht8_1._error_lnht8_76 input{background-color:var(--swui-state-error-light-color)}._labelledTextInput_lnht8_1 label{display:flex;position:absolute;top:var(--swui-metrics-space);left:calc(var(--swui-metrics-space) * 2);cursor:text}._textArea_6n6nc_1{--swui-textarea-text-color: var(--swui-field-text-color);--swui-textarea-text-color-disabled: var(--swui-field-text-color-disabled);--swui-textarea-letter-spacing: var(--swui-field-letter-spacing);--swui-textarea-line-height: var(--swui-field-text-line-height);--swui-textarea-indent: var(--swui-metrics-indent);--swui-textarea-font-size: var(--swui-font-size-inputs);--swui-textarea-font-family: var(--swui-font-input);--swui-textarea-font-weight: var(--swui-font-weight-inputs);--swui-textarea-placeholder-color: var(--swui-text-disabled-color);--swui-textarea-animation-time: var(--swui-animation-time-medium);--swui-textarea-icon-color: var(--swui-field-border-color-disabled);--swui-textarea-icon-size: var(--swui-field-icon-size);--swui-textarea-icon-color-success: var(--swui-state-success-color);--swui-textarea-bg-loading: var(--swui-state-loading-light-color);--swui-textarea-border-color-loading: var(--swui-state-loading-color);--swui-textarea-bg-modified: var(--swui-state-modified-light-color);--swui-textarea-border-color-modified: var(--swui-state-modified-color);--swui-textarea-bg-warning: var(--swui-state-alert-light-color);--swui-textarea-border-color-warning: var(--swui-state-alert-color);--swui-textarea-bg-error: var(--swui-state-error-light-color);--swui-textarea-border-color-error: var(--swui-state-error-color);--swui-textarea-bg-color: var(--swui-field-bg-enabled);--swui-textarea-bg-color-disabled: var(--swui-field-bg-disabled);--swui-textarea-border-radius: var(--swui-field-border-radius);--swui-textarea-border-color: var(--swui-field-border-color);--swui-textarea-border-color-hover: var(--swui-field-border-color-hover);--swui-textarea-border-color-disabled: var( --swui-field-border-color-disabled );max-width:100%;letter-spacing:var(--swui-textarea-letter-spacing);line-height:var(--swui-textarea-line-height);padding:2px var(--swui-textarea-indent);color:var(--swui-textarea-text-color);font-size:var(--swui-textarea-font-size);font-family:var(--swui-textarea-font-family);font-weight:var(--swui-textarea-font-weight);background:var(--current-bg, var(--swui-textarea-bg-color));border:1px solid var(--current-border-color, var(--swui-textarea-border-color));border-radius:var(--swui-textarea-border-radius);transition:border var(--swui-textarea-animation-time);--current-icon-color: var(--swui-textarea-icon-color)}._textArea_6n6nc_1:focus:not(:focus-visible){outline:none}._textArea_6n6nc_1:focus{--current-border-color: var(--swui-textarea-border-color-hover);--current-bg: var(--swui-textarea-bg-color)}._textArea_6n6nc_1:focus-visible{outline:var(--swui-focus-outline)}._textArea_6n6nc_1:disabled{color:var(--swui-textarea-text-color-disabled);--current-bg: var(--swui-textarea-bg-color-disabled);--current-border-color: var(--swui-textarea-border-color-disabled)}')),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
2
- import { jsx as o, jsxs as m, Fragment as S } from "react/jsx-runtime";
3
- import { Box as pt, Space as x, Text as R, Row as T, ScreenReaderOnlyText as P, parseFloatElseUndefined as H, getDataProps as ft } from "@stenajs-webui/core";
2
+ import { jsx as o, jsxs as b, Fragment as S } from "react/jsx-runtime";
3
+ import { Box as pt, Space as x, Text as N, Row as T, ScreenReaderOnlyText as M, parseFloatElseUndefined as H, getDataProps as ft } from "@stenajs-webui/core";
4
4
  import * as mt from "react";
5
- import { forwardRef as W, useRef as U, useCallback as g, useEffect as z, useMemo as ht, useState as bt, useId as O } from "react";
6
- import b from "classnames";
5
+ import { forwardRef as W, useRef as P, useCallback as g, useEffect as z, useMemo as bt, useState as ht, useId as O } from "react";
6
+ import h from "classnames";
7
7
  import { Icon as D, stenaCheck as E, stenaExclamationTriangle as G, InputSpinner as X, UpDownButtons as xt, TextInputButton as $, stenaEyeShow as yt, stenaEyeHide as It, stenaAngleDown as gt } from "@stenajs-webui/elements";
8
8
  import { FontAwesomeIcon as wt } from "@fortawesome/react-fontawesome";
9
9
  import { cssColor as q } from "@stenajs-webui/theme";
@@ -15,11 +15,11 @@ const Bt = "_knob_1d6s8_56", Tt = "_filler_1d6s8_61", kt = "_checked_1d6s8_75",
15
15
  }, St = `${v.switch} ${v.checked}`, vt = ({
16
16
  value: t,
17
17
  disabled: e,
18
- onValueChange: r,
19
- className: n,
18
+ onValueChange: n,
19
+ className: r,
20
20
  wrapperRef: c,
21
21
  ...s
22
- }) => /* @__PURE__ */ o("div", { className: n, ref: c, children: /* @__PURE__ */ m(
22
+ }) => /* @__PURE__ */ o("div", { className: r, ref: c, children: /* @__PURE__ */ b(
23
23
  "button",
24
24
  {
25
25
  type: "button",
@@ -27,72 +27,72 @@ const Bt = "_knob_1d6s8_56", Tt = "_filler_1d6s8_61", kt = "_checked_1d6s8_75",
27
27
  "aria-checked": t,
28
28
  className: t ? St : v.switch,
29
29
  disabled: e,
30
- onClick: () => r && r(!t),
30
+ onClick: () => n && n(!t),
31
31
  ...s,
32
32
  children: [
33
33
  /* @__PURE__ */ o("div", { className: v.filler }),
34
34
  /* @__PURE__ */ o("div", { className: v.knob })
35
35
  ]
36
36
  }
37
- ) }), Ne = ({
37
+ ) }), Re = ({
38
38
  label: t,
39
39
  disabled: e,
40
- textColor: r,
41
- wrapperRef: n,
40
+ textColor: n,
41
+ wrapperRef: r,
42
42
  ...c
43
- }) => /* @__PURE__ */ o("div", { ref: n, children: /* @__PURE__ */ o("label", { children: /* @__PURE__ */ m(pt, { row: !0, alignItems: "center", children: [
43
+ }) => /* @__PURE__ */ o("div", { ref: r, children: /* @__PURE__ */ o("label", { children: /* @__PURE__ */ b(pt, { row: !0, alignItems: "center", children: [
44
44
  /* @__PURE__ */ o(vt, { disabled: e, ...c }),
45
45
  /* @__PURE__ */ o(x, {}),
46
- /* @__PURE__ */ o(R, { userSelect: "none", color: r, children: t })
47
- ] }) }) }), Rt = "_checkbox_1ndou_1", Nt = "_standard_1ndou_39", jt = "_small_1ndou_51", L = {
48
- checkbox: Rt,
49
- standard: Nt,
46
+ /* @__PURE__ */ o(N, { userSelect: "none", color: n, children: t })
47
+ ] }) }) }), Nt = "_checkbox_1ndou_1", Rt = "_standard_1ndou_39", jt = "_small_1ndou_51", F = {
48
+ checkbox: Nt,
49
+ standard: Rt,
50
50
  small: jt
51
51
  }, $t = W(
52
52
  ({
53
53
  indeterminate: t = !1,
54
54
  onChange: e,
55
- onValueChange: r,
56
- value: n = !1,
55
+ onValueChange: n,
56
+ value: r = !1,
57
57
  size: c = "standard",
58
58
  className: s,
59
- ...l
60
- }, d) => {
61
- const i = U(), f = (u) => {
62
- i.current = u, i.current && (i.current.indeterminate = !!t), d && (typeof d == "function" ? d(u) : d.current = u);
59
+ ...i
60
+ }, a) => {
61
+ const l = P(), f = (u) => {
62
+ l.current = u, l.current && (l.current.indeterminate = !!t), a && (typeof a == "function" ? a(u) : a.current = u);
63
63
  }, _ = g(
64
64
  (u) => {
65
- e && e(u), r && r(u.target.checked);
65
+ e && e(u), n && n(u.target.checked);
66
66
  },
67
- [e, r]
67
+ [e, n]
68
68
  );
69
69
  return z(() => {
70
- i.current && (i.current.indeterminate = !!t);
71
- }, [t, i]), /* @__PURE__ */ o(
70
+ l.current && (l.current.indeterminate = !!t);
71
+ }, [t, l]), /* @__PURE__ */ o(
72
72
  "input",
73
73
  {
74
74
  type: "checkbox",
75
- className: b(L.checkbox, L[c], s),
76
- checked: n,
75
+ className: h(F.checkbox, F[c], s),
76
+ checked: r,
77
77
  onChange: _,
78
78
  ref: f,
79
- ...l
79
+ ...i
80
80
  }
81
81
  );
82
82
  }
83
83
  ), je = ({
84
84
  children: t,
85
85
  label: e,
86
- inputRef: r,
87
- wrapperRef: n,
86
+ inputRef: n,
87
+ wrapperRef: r,
88
88
  textColor: c,
89
89
  ...s
90
- }) => /* @__PURE__ */ o("div", { ref: n, children: /* @__PURE__ */ o("label", { children: /* @__PURE__ */ m(T, { alignItems: "center", children: [
91
- /* @__PURE__ */ o($t, { ...s, ref: r }),
90
+ }) => /* @__PURE__ */ o("div", { ref: r, children: /* @__PURE__ */ o("label", { children: /* @__PURE__ */ b(T, { alignItems: "center", children: [
91
+ /* @__PURE__ */ o($t, { ...s, ref: n }),
92
92
  /* @__PURE__ */ o(x, {}),
93
- e && /* @__PURE__ */ o(R, { userSelect: "none", color: c, children: e }),
93
+ e && /* @__PURE__ */ o(N, { userSelect: "none", color: c, children: e }),
94
94
  t
95
- ] }) }) }), At = "_radiobutton_foy83_1", Ht = "_standard_foy83_45", Wt = "_small_foy83_55", K = {
95
+ ] }) }) }), At = "_radiobutton_foy83_1", Ht = "_standard_foy83_45", Wt = "_small_foy83_55", L = {
96
96
  radiobutton: At,
97
97
  standard: Ht,
98
98
  small: Wt
@@ -100,14 +100,14 @@ const Bt = "_knob_1d6s8_56", Tt = "_filler_1d6s8_61", kt = "_checked_1d6s8_75",
100
100
  ({
101
101
  onChange: t,
102
102
  onValueChange: e,
103
- size: r = "standard",
104
- name: n,
103
+ size: n = "standard",
104
+ name: r,
105
105
  className: c,
106
106
  ...s
107
- }, l) => {
108
- const d = g(
109
- (i) => {
110
- t && t(i), e && e(i.target.value);
107
+ }, i) => {
108
+ const a = g(
109
+ (l) => {
110
+ t && t(l), e && e(l.target.value);
111
111
  },
112
112
  [t, e]
113
113
  );
@@ -115,128 +115,126 @@ const Bt = "_knob_1d6s8_56", Tt = "_filler_1d6s8_61", kt = "_checked_1d6s8_75",
115
115
  "input",
116
116
  {
117
117
  type: "radio",
118
- name: n,
119
- className: b(K.radiobutton, K[r], c),
120
- onChange: d,
121
- ref: l,
118
+ name: r,
119
+ className: h(L.radiobutton, L[n], c),
120
+ onChange: a,
121
+ ref: i,
122
122
  ...s
123
123
  }
124
124
  );
125
125
  }
126
- ), Ut = "_radioButtonBox_vpn6v_1", Ft = "_danger_vpn6v_19", Lt = "_radioButtonWrapper_vpn6v_30", M = {
127
- radioButtonBox: Ut,
128
- danger: Ft,
129
- radioButtonWrapper: Lt
126
+ ), Pt = "_radioButtonBox_vpn6v_1", Ut = "_danger_vpn6v_19", Ft = "_radioButtonWrapper_vpn6v_30", K = {
127
+ radioButtonBox: Pt,
128
+ danger: Ut,
129
+ radioButtonWrapper: Ft
130
130
  }, $e = ({
131
131
  label: t,
132
132
  screenReaderLabel: e,
133
- variant: r = "normal",
134
- className: n,
135
- style: c,
136
- radioButtonClassName: s,
133
+ variant: n = "normal",
134
+ className: r,
135
+ icon: c,
136
+ contentRight: s,
137
+ style: i,
138
+ radioButtonClassName: a,
137
139
  ...l
138
140
  }) => /* @__PURE__ */ o(
139
141
  "label",
140
142
  {
141
- className: b(M.radioButtonBox, M[r], n),
142
- style: c,
143
- children: /* @__PURE__ */ m(T, { justifyContent: "space-between", flexGrow: 1, children: [
144
- /* @__PURE__ */ m(T, { alignItems: "center", children: [
145
- /* @__PURE__ */ o(J, { ...l, className: s }),
146
- /* @__PURE__ */ o(x, {}),
147
- e ? /* @__PURE__ */ o(P, { children: e }) : null,
148
- /* @__PURE__ */ o(R, { "aria-hidden": !!e, children: t })
149
- ] }),
150
- /* @__PURE__ */ m(T, { alignItems: "center", width: "48px", justifyContent: "center", children: [
151
- "icon" in l && l.icon && /* @__PURE__ */ o(D, { icon: l.icon, size: 24 }),
152
- "contentRight" in l && l.contentRight
153
- ] })
154
- ] })
143
+ className: h(K.radioButtonBox, K[n], r),
144
+ style: i,
145
+ children: /* @__PURE__ */ o(T, { justifyContent: "space-between", flexGrow: 1, children: /* @__PURE__ */ b(T, { alignItems: "center", children: [
146
+ /* @__PURE__ */ o(J, { ...l, className: a }),
147
+ /* @__PURE__ */ o(x, {}),
148
+ e ? /* @__PURE__ */ o(M, { children: e }) : null,
149
+ /* @__PURE__ */ o(N, { "aria-hidden": !!e, children: t }),
150
+ c && /* @__PURE__ */ o(T, { alignItems: "center", width: "48px", justifyContent: "center", children: /* @__PURE__ */ o(D, { icon: c, size: 24 }) }),
151
+ s && /* @__PURE__ */ o(T, { alignItems: "center", justifyContent: "center", children: s })
152
+ ] }) })
155
153
  }
156
154
  ), Ae = ({
157
155
  label: t,
158
156
  inputRef: e,
159
- wrapperRef: r,
160
- textColor: n,
157
+ wrapperRef: n,
158
+ textColor: r,
161
159
  ...c
162
- }) => /* @__PURE__ */ o("div", { ref: r, children: /* @__PURE__ */ o("label", { children: /* @__PURE__ */ m(T, { alignItems: "center", children: [
160
+ }) => /* @__PURE__ */ o("div", { ref: n, children: /* @__PURE__ */ o("label", { children: /* @__PURE__ */ b(T, { alignItems: "center", children: [
163
161
  /* @__PURE__ */ o(J, { ref: e, ...c }),
164
162
  /* @__PURE__ */ o(x, {}),
165
- /* @__PURE__ */ o(R, { color: n, userSelect: "none", children: t })
166
- ] }) }) }), Kt = (t, e, r, n, c, s, l, d) => {
167
- const i = U(!1), f = (a) => {
168
- i.current || s == null || s(a.target.value ?? ""), l == null || l(a);
169
- }, _ = (a) => {
170
- i.current = !1, d == null || d(a);
163
+ /* @__PURE__ */ o(N, { color: r, userSelect: "none", children: t })
164
+ ] }) }) }), Lt = (t, e, n, r, c, s, i, a) => {
165
+ const l = P(!1), f = (d) => {
166
+ l.current || s == null || s(d.target.value ?? ""), i == null || i(d);
167
+ }, _ = (d) => {
168
+ l.current = !1, a == null || a(d);
171
169
  };
172
170
  return {
173
171
  onKeyDownHandler: g(
174
- (a) => {
175
- const { key: p } = a;
172
+ (d) => {
173
+ const { key: p } = d;
176
174
  if (p === "Enter")
177
- i.current = !0, r == null || r(), s == null || s(a.currentTarget.value ?? "");
175
+ l.current = !0, n == null || n(), s == null || s(d.currentTarget.value ?? "");
178
176
  else if (p === "Escape")
179
- i.current = !0, n == null || n(), a.preventDefault(), a.stopPropagation();
177
+ l.current = !0, r == null || r(), d.preventDefault(), d.stopPropagation();
180
178
  else if (c) {
181
- const h = (w, y) => {
182
- i.current = !0, t.current.blur(), c(w), y.preventDefault(), y.stopPropagation();
179
+ const m = (w, y) => {
180
+ l.current = !0, t.current.blur(), c(w), y.preventDefault(), y.stopPropagation();
183
181
  };
184
- a.shiftKey && p === "Tab" ? h("left", a) : p === "Tab" ? h("right", a) : p === "ArrowUp" ? h("up", a) : p === "ArrowDown" ? h("down", a) : p === "ArrowRight" ? t.current.value.length === t.current.selectionStart && h("right", a) : p === "ArrowLeft" && t.current.selectionStart === 0 && h("left", a);
182
+ d.shiftKey && p === "Tab" ? m("left", d) : p === "Tab" ? m("right", d) : p === "ArrowUp" ? m("up", d) : p === "ArrowDown" ? m("down", d) : p === "ArrowRight" ? t.current.value.length === t.current.selectionStart && m("right", d) : p === "ArrowLeft" && t.current.selectionStart === 0 && m("left", d);
185
183
  }
186
- e && e(a);
184
+ e && e(d);
187
185
  },
188
- [n, c, e, t, r, s]
186
+ [r, c, e, t, n, s]
189
187
  ),
190
188
  onBlurHandler: f,
191
189
  onFocusHandler: _
192
190
  };
193
191
  };
194
- function Mt(t) {
192
+ function Kt(t) {
195
193
  return t.tagName === "TEXTAREA" || t.tagName === "INPUT" && (t.type === "text" || t.type === "search" || t.type === "url" || t.type === "tel" || t.type === "password");
196
194
  }
197
- const Pt = (t, e, r) => {
195
+ const Mt = (t, e, n) => {
198
196
  z(() => {
199
- t.current && Mt(t.current) && (r ? t.current.setSelectionRange(0, t.current.value.length) : e && t.current.setSelectionRange(
197
+ t.current && Kt(t.current) && (n ? t.current.setSelectionRange(0, t.current.value.length) : e && t.current.setSelectionRange(
200
198
  t.current.value.length,
201
199
  t.current.value.length
202
200
  ));
203
- }, [e, t, r]);
201
+ }, [e, t, n]);
204
202
  }, zt = (t, {
205
203
  onEnter: e,
206
- onEsc: r,
207
- onChange: n,
204
+ onEsc: n,
205
+ onChange: r,
208
206
  onValueChange: c,
209
207
  selectAllOnMount: s,
210
- moveCursorToEndOnMount: l,
211
- onDone: d,
212
- onMove: i,
208
+ moveCursorToEndOnMount: i,
209
+ onDone: a,
210
+ onMove: l,
213
211
  onFocus: f,
214
212
  onBlur: _,
215
213
  onKeyDown: u,
216
- autoFocus: a
214
+ autoFocus: d
217
215
  }) => {
218
- Pt(t, !!l, !!s);
219
- const { onKeyDownHandler: p, onFocusHandler: h, onBlurHandler: w } = Kt(
216
+ Mt(t, !!i, !!s);
217
+ const { onKeyDownHandler: p, onFocusHandler: m, onBlurHandler: w } = Lt(
220
218
  t,
221
219
  u,
222
220
  e,
223
- r,
224
- i,
225
- d,
221
+ n,
222
+ l,
223
+ a,
226
224
  _,
227
225
  f
228
226
  ), y = g(
229
- (N) => {
230
- n == null || n(N), c == null || c(N.target.value);
227
+ (R) => {
228
+ r == null || r(R), c == null || c(R.target.value);
231
229
  },
232
- [n, c]
230
+ [r, c]
233
231
  );
234
232
  return {
235
233
  onBlur: w,
236
234
  onChange: y,
237
- onFocus: h,
235
+ onFocus: m,
238
236
  onKeyDown: p,
239
- autoFocus: s || a
237
+ autoFocus: s || d
240
238
  };
241
239
  }, Ot = "_textInput_1jb3g_1", Dt = "_disabled_1jb3g_11", Et = "_input_1jb3g_16", Gt = "_icon_1jb3g_49", Xt = "_standard_1jb3g_59", qt = "_success_1jb3g_60", Jt = "_loading_1jb3g_72", Qt = "_modified_1jb3g_77", Yt = "_error_1jb3g_86", Zt = "_warning_1jb3g_95", Ct = "_hideBorder_1jb3g_109", Vt = "_clickable_1jb3g_116", I = {
242
240
  textInput: Ot,
@@ -254,84 +252,84 @@ const Pt = (t, e, r) => {
254
252
  }, j = ({
255
253
  button: t,
256
254
  icon: e,
257
- iconClassName: r,
258
- content: n,
255
+ iconClassName: n,
256
+ content: r,
259
257
  spaceOnLeft: c,
260
258
  spaceOnRight: s,
261
- disableContentPadding: l,
262
- disableContentPaddingLeft: d,
263
- disableContentPaddingRight: i
264
- }) => !n && !e && !t ? null : t ? /* @__PURE__ */ m(S, { children: [
259
+ disableContentPadding: i,
260
+ disableContentPaddingLeft: a,
261
+ disableContentPaddingRight: l
262
+ }) => !r && !e && !t ? null : t ? /* @__PURE__ */ b(S, { children: [
265
263
  c ? /* @__PURE__ */ o(x, { num: 0.25 }) : null,
266
264
  t,
267
265
  s ? /* @__PURE__ */ o(x, { num: 0.25 }) : null
268
- ] }) : n ? /* @__PURE__ */ m(S, { children: [
269
- c && !(l || d) ? /* @__PURE__ */ o(x, {}) : null,
270
- n || null,
271
- s && !(l || i) ? /* @__PURE__ */ o(x, {}) : null
272
- ] }) : /* @__PURE__ */ m(S, { children: [
266
+ ] }) : r ? /* @__PURE__ */ b(S, { children: [
267
+ c && !(i || a) ? /* @__PURE__ */ o(x, {}) : null,
268
+ r || null,
269
+ s && !(i || l) ? /* @__PURE__ */ o(x, {}) : null
270
+ ] }) : /* @__PURE__ */ b(S, { children: [
273
271
  c ? /* @__PURE__ */ o(x, {}) : null,
274
272
  e && /* @__PURE__ */ o(
275
273
  wt,
276
274
  {
277
275
  icon: e,
278
- className: b(I.icon, r)
276
+ className: h(I.icon, n)
279
277
  }
280
278
  ),
281
279
  s ? /* @__PURE__ */ o(x, {}) : null
282
280
  ] }), Q = (t) => {
283
281
  const {
284
282
  variant: e = "standard",
285
- inputRef: r,
286
- disabled: n,
283
+ inputRef: n,
284
+ disabled: r,
287
285
  className: c,
288
286
  buttonLeft: s,
289
- buttonRight: l,
290
- contentLeft: d,
291
- contentRight: i,
287
+ buttonRight: i,
288
+ contentLeft: a,
289
+ contentRight: l,
292
290
  disableContentPadding: f,
293
291
  disableContentPaddingLeft: _,
294
292
  disableContentPaddingRight: u,
295
- iconLeft: a,
293
+ iconLeft: d,
296
294
  iconRight: p,
297
- moveCursorToEndOnMount: h,
295
+ moveCursorToEndOnMount: m,
298
296
  selectAllOnMount: w,
299
297
  autoFocus: y,
300
- onValueChange: N,
298
+ onValueChange: R,
301
299
  wrapperClassName: Z,
302
300
  wrapperStyle: C,
303
301
  onDone: V,
304
302
  onEnter: tt,
305
303
  onEsc: et,
306
- onMove: nt,
307
- onChange: rt,
304
+ onMove: rt,
305
+ onChange: nt,
308
306
  onKeyDown: ot,
309
307
  hideBorder: ct,
310
308
  onFocus: st,
311
309
  onBlur: lt,
312
310
  ...it
313
- } = t, at = U(null), F = r ?? at, dt = zt(F, {
311
+ } = t, at = P(null), U = n ?? at, dt = zt(U, {
314
312
  onEnter: tt,
315
313
  onEsc: et,
316
- onChange: rt,
317
- onValueChange: N,
314
+ onChange: nt,
315
+ onValueChange: R,
318
316
  selectAllOnMount: w,
319
- moveCursorToEndOnMount: h,
317
+ moveCursorToEndOnMount: m,
320
318
  onDone: V,
321
- onMove: nt,
319
+ onMove: rt,
322
320
  onFocus: st,
323
321
  onBlur: lt,
324
322
  onKeyDown: ot,
325
323
  autoFocus: y
326
- }), ut = e === "success" ? E : e === "warning" || e === "error" ? G : p, _t = e === "loading" ? /* @__PURE__ */ o(X, {}) : i;
327
- return /* @__PURE__ */ m(
324
+ }), ut = e === "success" ? E : e === "warning" || e === "error" ? G : p, _t = e === "loading" ? /* @__PURE__ */ o(X, {}) : l;
325
+ return /* @__PURE__ */ b(
328
326
  "div",
329
327
  {
330
- className: b(
328
+ className: h(
331
329
  I.textInput,
332
330
  I[e],
333
331
  {
334
- [I.disabled]: n
332
+ [I.disabled]: r
335
333
  },
336
334
  {
337
335
  [I.hideBorder]: ct
@@ -343,11 +341,11 @@ const Pt = (t, e, r) => {
343
341
  /* @__PURE__ */ o(
344
342
  j,
345
343
  {
346
- content: d,
344
+ content: a,
347
345
  disableContentPadding: f,
348
346
  disableContentPaddingLeft: _,
349
347
  disableContentPaddingRight: u,
350
- icon: a,
348
+ icon: d,
351
349
  spaceOnLeft: !0,
352
350
  button: s
353
351
  }
@@ -355,10 +353,10 @@ const Pt = (t, e, r) => {
355
353
  /* @__PURE__ */ o(
356
354
  "input",
357
355
  {
358
- className: b(I.input, c),
356
+ className: h(I.input, c),
359
357
  type: "text",
360
- disabled: n,
361
- ref: F,
358
+ disabled: r,
359
+ ref: U,
362
360
  autoFocus: y,
363
361
  ...it,
364
362
  ...dt
@@ -373,7 +371,7 @@ const Pt = (t, e, r) => {
373
371
  disableContentPaddingRight: u,
374
372
  icon: ut,
375
373
  spaceOnRight: !0,
376
- button: l
374
+ button: i
377
375
  }
378
376
  )
379
377
  ]
@@ -381,91 +379,91 @@ const Pt = (t, e, r) => {
381
379
  );
382
380
  }, te = "_numericTextInputInput_1tnr6_1", ee = {
383
381
  numericTextInputInput: te
384
- }, ne = ({
382
+ }, re = ({
385
383
  onValueChange: t,
386
384
  value: e,
387
- numSteps: r,
388
- min: n,
385
+ numSteps: n,
386
+ min: r,
389
387
  max: c
390
388
  }) => {
391
389
  if (t)
392
390
  if (!e)
393
- t(String(A(r, n, c)));
391
+ t(String(A(n, r, c)));
394
392
  else {
395
- const l = (H(e) || 0) + r;
396
- t(String(A(l, n, c)));
393
+ const i = (H(e) || 0) + n;
394
+ t(String(A(i, r, c)));
397
395
  }
398
- }, re = ({
396
+ }, ne = ({
399
397
  onValueChange: t,
400
398
  newValue: e,
401
- min: r,
402
- max: n
399
+ min: n,
400
+ max: r
403
401
  }) => {
404
402
  if (t)
405
403
  if (e === "")
406
404
  t("");
407
405
  else {
408
406
  const s = H(e) || 0;
409
- t(String(A(s, r, n)));
407
+ t(String(A(s, n, r)));
410
408
  }
411
- }, A = (t, e, r) => {
412
- let n = t;
413
- return e != null && (n = Math.max(e, n)), r != null && (n = Math.min(r, n)), n;
409
+ }, A = (t, e, n) => {
410
+ let r = t;
411
+ return e != null && (r = Math.max(e, r)), n != null && (r = Math.min(n, r)), r;
414
412
  }, He = ({
415
413
  value: t,
416
414
  onValueChange: e,
417
- max: r,
418
- min: n,
415
+ max: n,
416
+ min: r,
419
417
  step: c = 1,
420
418
  contentRight: s,
421
- disabled: l,
422
- className: d,
423
- hideButtons: i,
419
+ disabled: i,
420
+ className: a,
421
+ hideButtons: l,
424
422
  ...f
425
423
  }) => {
426
424
  const _ = g(
427
425
  (p) => {
428
- ne({ onValueChange: e, value: t, numSteps: p, min: n, max: r });
426
+ re({ onValueChange: e, value: t, numSteps: p, min: r, max: n });
429
427
  },
430
- [t, r, n, e]
428
+ [t, n, r, e]
431
429
  ), u = g(
432
430
  (p) => {
433
- re({ onValueChange: e, newValue: p, min: n, max: r });
431
+ ne({ onValueChange: e, newValue: p, min: r, max: n });
434
432
  },
435
- [r, n, e]
433
+ [n, r, e]
436
434
  );
437
435
  return /* @__PURE__ */ o(
438
436
  Q,
439
437
  {
440
- contentRight: i ? s : /* @__PURE__ */ m(S, { children: [
441
- s && /* @__PURE__ */ m(S, { children: [
438
+ contentRight: l ? s : /* @__PURE__ */ b(S, { children: [
439
+ s && /* @__PURE__ */ b(S, { children: [
442
440
  s,
443
441
  /* @__PURE__ */ o(x, {})
444
442
  ] }),
445
443
  /* @__PURE__ */ o(
446
444
  xt,
447
445
  {
448
- onClickUp: l ? void 0 : () => _(c),
449
- onClickDown: l ? void 0 : () => _(-c),
446
+ onClickUp: i ? void 0 : () => _(c),
447
+ onClickDown: i ? void 0 : () => _(-c),
450
448
  iconColor: "var(--swui-textinput-text-color)",
451
- disabled: l
449
+ disabled: i
452
450
  }
453
451
  )
454
452
  ] }),
455
453
  value: t,
456
454
  onValueChange: u,
457
- disableContentPaddingRight: !i,
455
+ disableContentPaddingRight: !l,
458
456
  type: "number",
459
- min: n,
460
- max: r,
457
+ min: r,
458
+ max: n,
461
459
  step: c,
462
- className: b(ee.numericTextInputInput, d),
463
- disabled: l,
460
+ className: h(ee.numericTextInputInput, a),
461
+ disabled: i,
464
462
  ...f
465
463
  }
466
464
  );
467
465
  }, We = (t, e) => {
468
- const r = g(
466
+ const n = g(
469
467
  (c) => {
470
468
  if (e)
471
469
  if (!c)
@@ -476,58 +474,58 @@ const Pt = (t, e, r) => {
476
474
  }
477
475
  },
478
476
  [e]
479
- ), n = ht(() => t === void 0 ? "" : String(t), [t]);
477
+ ), r = bt(() => t === void 0 ? "" : String(t), [t]);
480
478
  return {
481
- onValueChange: r,
482
- value: n
479
+ onValueChange: n,
480
+ value: r
483
481
  };
484
- }, Ue = ({
482
+ }, Pe = ({
485
483
  hiddenIcon: t = yt,
486
484
  visibleIcon: e = It,
487
- ...r
485
+ ...n
488
486
  }) => {
489
- const [n, c] = bt(!0);
487
+ const [r, c] = ht(!0);
490
488
  return /* @__PURE__ */ o(
491
489
  Q,
492
490
  {
493
491
  buttonRight: /* @__PURE__ */ o(
494
492
  $,
495
493
  {
496
- icon: n ? t : e,
494
+ icon: r ? t : e,
497
495
  onClick: () => c((s) => !s)
498
496
  }
499
497
  ),
500
- type: n ? "password" : "text",
501
- ...r
498
+ type: r ? "password" : "text",
499
+ ...n
502
500
  }
503
501
  );
504
502
  }, oe = ({
505
503
  disabled: t,
506
504
  text: e,
507
- ...r
505
+ ...n
508
506
  }) => /* @__PURE__ */ o(
509
- R,
507
+ N,
510
508
  {
511
509
  variant: "bold",
512
510
  color: q(t ? "--silver" : "--tjara"),
513
511
  size: "small",
514
- ...ft(r),
512
+ ...ft(n),
515
513
  children: e
516
514
  }
517
515
  ), Y = ({
518
516
  htmlFor: t,
519
517
  screenReaderLabel: e,
520
- label: r,
521
- disabled: n,
518
+ label: n,
519
+ disabled: r,
522
520
  className: c
523
- }) => /* @__PURE__ */ m("label", { htmlFor: t, className: c, children: [
524
- e ? /* @__PURE__ */ o(P, { children: e }) : null,
521
+ }) => /* @__PURE__ */ b("label", { htmlFor: t, className: c, children: [
522
+ e ? /* @__PURE__ */ o(M, { children: e }) : null,
525
523
  /* @__PURE__ */ o(
526
524
  oe,
527
525
  {
528
526
  "aria-hidden": !!e,
529
- text: r,
530
- disabled: n
527
+ text: n,
528
+ disabled: r
531
529
  }
532
530
  )
533
531
  ] }), ce = "_labelledSelect_1evxo_1", se = "_onlyTopBorder_1evxo_8", le = "_onlyBottomBorder_1evxo_14", ie = "_error_1evxo_19", ae = "_normal_1evxo_24", de = "_label_1evxo_1", ue = "_select_1evxo_48", _e = "_iconWrapper_1evxo_73", B = {
@@ -539,29 +537,29 @@ const Pt = (t, e, r) => {
539
537
  label: de,
540
538
  select: ue,
541
539
  iconWrapper: _e
542
- }, Fe = ({
540
+ }, Ue = ({
543
541
  onChange: t,
544
542
  onValueChange: e,
545
- id: r,
546
- label: n,
543
+ id: n,
544
+ label: r,
547
545
  screenReaderLabel: c,
548
546
  borderVariant: s = "normalBorder",
549
- variant: l = "normal",
550
- children: d,
551
- ...i
547
+ variant: i = "normal",
548
+ children: a,
549
+ ...l
552
550
  }) => {
553
- const f = O(), _ = r ?? f, u = g(
554
- (a) => {
555
- t == null || t(a), e == null || e(a.target.value);
551
+ const f = O(), _ = n ?? f, u = g(
552
+ (d) => {
553
+ t == null || t(d), e == null || e(d.target.value);
556
554
  },
557
555
  [t, e]
558
556
  );
559
- return /* @__PURE__ */ m(
557
+ return /* @__PURE__ */ b(
560
558
  "div",
561
559
  {
562
- className: b(
560
+ className: h(
563
561
  B.labelledSelect,
564
- B[l],
562
+ B[i],
565
563
  B[s]
566
564
  ),
567
565
  children: [
@@ -570,7 +568,7 @@ const Pt = (t, e, r) => {
570
568
  {
571
569
  htmlFor: _,
572
570
  className: B.label,
573
- label: n,
571
+ label: r,
574
572
  screenReaderLabel: c
575
573
  }
576
574
  ),
@@ -579,12 +577,12 @@ const Pt = (t, e, r) => {
579
577
  {
580
578
  id: _,
581
579
  onChange: u,
582
- className: b(B.select, B[l]),
583
- ...i,
584
- children: d
580
+ className: h(B.select, B[i]),
581
+ ...l,
582
+ children: a
585
583
  }
586
584
  ),
587
- /* @__PURE__ */ o("div", { className: b(B.iconWrapper), children: /* @__PURE__ */ o(
585
+ /* @__PURE__ */ o("div", { className: h(B.iconWrapper), children: /* @__PURE__ */ o(
588
586
  D,
589
587
  {
590
588
  icon: gt,
@@ -595,64 +593,64 @@ const Pt = (t, e, r) => {
595
593
  ]
596
594
  }
597
595
  );
598
- }, pe = "_labelledTextInput_lnht8_1", fe = "_onlyTop_lnht8_21", me = "_onlyBottom_lnht8_27", he = "_disabled_lnht8_42", be = "_medium_lnht8_50", xe = "_large_lnht8_62", ye = "_error_lnht8_76", k = {
596
+ }, pe = "_labelledTextInput_lnht8_1", fe = "_onlyTop_lnht8_21", me = "_onlyBottom_lnht8_27", be = "_disabled_lnht8_42", he = "_medium_lnht8_50", xe = "_large_lnht8_62", ye = "_error_lnht8_76", k = {
599
597
  labelledTextInput: pe,
600
598
  onlyTop: fe,
601
599
  onlyBottom: me,
602
- disabled: he,
603
- medium: be,
600
+ disabled: be,
601
+ medium: he,
604
602
  large: xe,
605
603
  error: ye
606
- }, Le = mt.forwardRef(
604
+ }, Fe = mt.forwardRef(
607
605
  ({
608
606
  autoComplete: t = "off",
609
607
  label: e,
610
- id: r,
611
- screenReaderLabel: n,
608
+ id: n,
609
+ screenReaderLabel: r,
612
610
  size: c = "medium",
613
611
  value: s,
614
- onChange: l,
615
- disabled: d,
616
- onValueChange: i,
612
+ onChange: i,
613
+ disabled: a,
614
+ onValueChange: l,
617
615
  borderRadiusVariant: f = "normalBorder",
618
616
  variant: _ = "normal",
619
617
  ...u
620
- }, a) => {
621
- const p = O(), h = r ?? p, w = g(
618
+ }, d) => {
619
+ const p = O(), m = n ?? p, w = g(
622
620
  (y) => {
623
- l == null || l(y), i == null || i(y.target.value);
621
+ i == null || i(y), l == null || l(y.target.value);
624
622
  },
625
- [l, i]
623
+ [i, l]
626
624
  );
627
- return /* @__PURE__ */ m(
625
+ return /* @__PURE__ */ b(
628
626
  "div",
629
627
  {
630
- className: b(
628
+ className: h(
631
629
  k.labelledTextInput,
632
630
  k[_],
633
631
  k[f],
634
632
  k[c],
635
- d && k.disabled
633
+ a && k.disabled
636
634
  ),
637
635
  children: [
638
636
  /* @__PURE__ */ o(
639
637
  Y,
640
638
  {
641
- htmlFor: h,
642
- screenReaderLabel: n,
639
+ htmlFor: m,
640
+ screenReaderLabel: r,
643
641
  label: e
644
642
  }
645
643
  ),
646
644
  /* @__PURE__ */ o(
647
645
  "input",
648
646
  {
649
- ref: a,
650
- id: h,
647
+ ref: d,
648
+ id: m,
651
649
  autoComplete: t,
652
650
  type: "text",
653
651
  value: s,
654
652
  onChange: w,
655
- disabled: d,
653
+ disabled: a,
656
654
  ...u
657
655
  }
658
656
  )
@@ -660,44 +658,44 @@ const Pt = (t, e, r) => {
660
658
  }
661
659
  );
662
660
  }
663
- ), Ke = ({
661
+ ), Le = ({
664
662
  variant: t = "standard",
665
663
  disabled: e,
666
- wrapperClassName: r,
667
- wrapperStyle: n,
664
+ wrapperClassName: n,
665
+ wrapperStyle: r,
668
666
  contentLeft: c,
669
667
  contentRight: s,
670
- disableContentPadding: l,
671
- disableContentPaddingLeft: d,
672
- disableContentPaddingRight: i,
668
+ disableContentPadding: i,
669
+ disableContentPaddingLeft: a,
670
+ disableContentPaddingRight: l,
673
671
  iconRight: f,
674
672
  iconLeft: _,
675
673
  onClickLeft: u,
676
- onClickRight: a,
674
+ onClickRight: d,
677
675
  children: p
678
676
  }) => {
679
- const h = t === "success" ? E : t === "warning" || t === "error" ? G : f, w = t === "loading" ? /* @__PURE__ */ o(X, {}) : s;
680
- return /* @__PURE__ */ m(
677
+ const m = t === "success" ? E : t === "warning" || t === "error" ? G : f, w = t === "loading" ? /* @__PURE__ */ o(X, {}) : s;
678
+ return /* @__PURE__ */ b(
681
679
  "div",
682
680
  {
683
- className: b(
681
+ className: h(
684
682
  I.textInput,
685
683
  I.inputContainer,
686
684
  I[t],
687
685
  {
688
686
  [I.disabled]: e
689
687
  },
690
- r
688
+ n
691
689
  ),
692
- style: n,
690
+ style: r,
693
691
  children: [
694
692
  /* @__PURE__ */ o(
695
693
  j,
696
694
  {
697
695
  content: c,
698
- disableContentPadding: l,
699
- disableContentPaddingLeft: d,
700
- disableContentPaddingRight: i,
696
+ disableContentPadding: i,
697
+ disableContentPaddingLeft: a,
698
+ disableContentPaddingRight: l,
701
699
  spaceOnLeft: !0,
702
700
  button: _ ? /* @__PURE__ */ o($, { onClick: u, icon: _ }) : void 0
703
701
  }
@@ -707,11 +705,11 @@ const Pt = (t, e, r) => {
707
705
  j,
708
706
  {
709
707
  content: w,
710
- disableContentPadding: l,
711
- disableContentPaddingLeft: d,
712
- disableContentPaddingRight: i,
708
+ disableContentPadding: i,
709
+ disableContentPaddingLeft: a,
710
+ disableContentPaddingRight: l,
713
711
  spaceOnRight: !0,
714
- button: h ? /* @__PURE__ */ o($, { onClick: a, icon: h }) : void 0
712
+ button: m ? /* @__PURE__ */ o($, { onClick: d, icon: m }) : void 0
715
713
  }
716
714
  )
717
715
  ]
@@ -719,36 +717,36 @@ const Pt = (t, e, r) => {
719
717
  );
720
718
  }, Ie = "_textArea_6n6nc_1", ge = {
721
719
  textArea: Ie
722
- }, Me = W(
720
+ }, Ke = W(
723
721
  ({
724
722
  className: t,
725
723
  value: e,
726
- onValueChange: r,
727
- onChange: n,
724
+ onValueChange: n,
725
+ onChange: r,
728
726
  resize: c = "none",
729
727
  readOnly: s = !1,
730
- rows: l,
731
- disabled: d,
732
- ...i
728
+ rows: i,
729
+ disabled: a,
730
+ ...l
733
731
  }, f) => {
734
732
  const _ = g(
735
733
  (u) => {
736
- n && n(u), r && r(u.target.value);
734
+ r && r(u), n && n(u.target.value);
737
735
  },
738
- [n, r]
736
+ [r, n]
739
737
  );
740
738
  return /* @__PURE__ */ o(
741
739
  "textarea",
742
740
  {
743
- disabled: d,
744
- rows: l,
741
+ disabled: a,
742
+ rows: i,
745
743
  readOnly: s,
746
- className: b(ge.textArea, t),
744
+ className: h(ge.textArea, t),
747
745
  style: { resize: c },
748
746
  onChange: _,
749
747
  value: e,
750
748
  ref: f,
751
- ...i
749
+ ...l
752
750
  }
753
751
  );
754
752
  }
@@ -758,24 +756,24 @@ export {
758
756
  je as CheckboxWithLabel,
759
757
  Y as InputLabel,
760
758
  oe as InputLabelText,
761
- Fe as LabelledSelect,
762
- Le as LabelledTextInput,
759
+ Ue as LabelledSelect,
760
+ Fe as LabelledTextInput,
763
761
  He as NumericTextInput,
764
- Ue as PasswordInput,
762
+ Pe as PasswordInput,
765
763
  J as RadioButton,
766
764
  $e as RadioButtonBox,
767
765
  Ae as RadioButtonWithLabel,
768
766
  vt as Switch,
769
- Ne as SwitchWithLabel,
770
- Me as TextArea,
767
+ Re as SwitchWithLabel,
768
+ Ke as TextArea,
771
769
  Q as TextInput,
772
- Ke as TextInputBox,
773
- Mt as elementHasSelectionRange,
774
- ne as onStepValueChange,
775
- re as onTextValueChange,
776
- Kt as useKeyboardNavigation,
770
+ Le as TextInputBox,
771
+ Kt as elementHasSelectionRange,
772
+ re as onStepValueChange,
773
+ ne as onTextValueChange,
774
+ Lt as useKeyboardNavigation,
777
775
  We as useNumericInputValue,
778
- Pt as useSelectAllOnMount,
776
+ Mt as useSelectAllOnMount,
779
777
  zt as useTextInput
780
778
  };
781
779
  //# sourceMappingURL=index.es.js.map