@stonecrop/aform 0.26.0 → 0.28.0

package/dist/assets/index.css

@@ -1 +1 @@
-.aform_checkbox[data-v-ca06741d]{cursor:pointer;width:auto;margin-top:0;display:block}.aform_checkbox[data-v-ca06741d]:checked{accent-color:var(--sc-primary-color);border:1px solid black}.aform_checkbox-container[data-v-ca06741d]{width:100%;display:inline-block;text-align:left}.aform_checkbox-container input[data-v-ca06741d]{width:auto}.aform_checkbox-container:hover+.aform_field-label[data-v-ca06741d]{color:var(--sc-input-active-label-color)}.aform_form-link-wrapper[data-v-154d79c9]{position:relative}.input-group[data-v-154d79c9]{display:flex;align-items:stretch}.aform_input-field[data-v-154d79c9]{flex:1;min-width:0}.aform_form-element--embedded[data-v-154d79c9]{min-width:0;flex-grow:0}.aform_input-field--embedded[data-v-154d79c9]{outline:none;background:transparent;padding:.5ch 1ch}.aform_form-element--embedded .autocomplete-results[data-v-154d79c9]{min-width:100%;width:max-content}.aform_form-btn[data-v-154d79c9]{appearance:none;border:none;outline:1px solid var(--sc-input-border-color);outline-offset:-1px;margin-left:-2px;background:var(--sc-input-field-background, white);padding:0 .75rem;cursor:pointer}.aform_form-btn[data-v-154d79c9]:focus,.input-group:focus-within .aform_form-btn[data-v-154d79c9]{outline-color:var(--sc-input-active-border-color)}.autocomplete-results[data-v-154d79c9]{position:absolute;width:100%;z-index:100;padding:0;margin:0;list-style:none;border:1px solid var(--sc-input-active-border-color);border-top:none;border-radius:0 0 .25rem .25rem;background:#fff}.autocomplete-result[data-v-154d79c9]{padding:4px 6px;cursor:pointer;border-bottom:.5px solid lightgray}.autocomplete-result.is-active[data-v-154d79c9],.autocomplete-result[data-v-154d79c9]:hover{background-color:var(--sc-row-color-zebra-light);color:var(--sc-input-active-border-color)}.acurrency__row[data-v-15bec6ef]{display:flex;gap:1ch}.acurrency__row--base[data-v-15bec6ef]{margin-top:1.5rem}.acurrency__field[data-v-15bec6ef]{position:relative;flex:1;min-width:0}.acurrency__group[data-v-15bec6ef]{display:flex;align-items:stretch;width:100%;border:1px solid var(--sc-input-border-color);border-radius:.25rem}.acurrency__group[data-v-15bec6ef]:focus-within{border-color:var(--sc-input-active-border-color)}.acurrency__amount-wrap[data-v-15bec6ef]{position:relative;flex:1;min-width:0}.acurrency__amount-wrap .aform_field-label[data-v-15bec6ef]{font-size:.85rem}.acurrency__amount[data-v-15bec6ef]{width:100%;box-sizing:border-box;border:none;outline:none;padding:.5ch 1ch;background:transparent;border-radius:0 .25rem .25rem 0;text-align:right;appearance:textfield;-moz-appearance:textfield}.acurrency__amount[data-v-15bec6ef]::-webkit-outer-spin-button,.acurrency__amount[data-v-15bec6ef]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}.acurrency__currency[data-v-15bec6ef]{position:relative;flex:0 0 auto;min-width:4.5rem;background:var(--sc-gray-5);border-right:1px solid var(--sc-input-border-color);border-radius:.25rem 0 0 .25rem}.acurrency__base-field[data-v-15bec6ef]{width:100%;box-sizing:border-box;font-size:1rem;padding:.5ch 1ch;border:1px solid var(--sc-input-border-color);border-radius:.25rem;outline:none;appearance:textfield;-moz-appearance:textfield}.acurrency__base-field[data-v-15bec6ef]:disabled{color:var(--sc-gray-50, #888)}.acurrency__base-field[data-v-15bec6ef]::-webkit-outer-spin-button,.acurrency__base-field[data-v-15bec6ef]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}.adatepicker[data-v-322c2ceb],.adatepicker table[data-v-322c2ceb],.adatepicker tr[data-v-322c2ceb],.adatepicker td[data-v-322c2ceb],.adatepicker th[data-v-322c2ceb]{-webkit-user-select:none;-moz-user-select:none;user-select:none}.adatepicker[data-v-322c2ceb]{font-size:var(--sc-table-font-size);display:inline-table;color:var(--sc-cell-text-color);outline:none;border-collapse:collapse;margin-bottom:10px}.adatepicker tr[data-v-322c2ceb]{height:1.15rem;text-align:center;vertical-align:middle}.adatepicker td[data-v-322c2ceb]{border:2px solid transparent;outline:2px solid transparent;min-width:3ch;max-width:3ch;cursor:pointer}.adatepicker td.date-cell[data-v-322c2ceb]:hover{background:var(--sc-gray-10)}.adatepicker td[data-v-322c2ceb]:focus,.adatepicker td[data-v-322c2ceb]:focus-within{box-shadow:none;min-height:1.15em;max-height:1.15em;overflow:hidden}.adatepicker .selectedDate[data-v-322c2ceb],.adatepicker .startDate[data-v-322c2ceb],.adatepicker .endDate[data-v-322c2ceb]{background:var(--sc-gray-20);font-weight:bolder}.adatepicker .startDate[data-v-322c2ceb]{border-left:1px solid var(--sc-gray-50);background:var(--sc-gray-20)!important}.adatepicker .endDate[data-v-322c2ceb]{border-right:1px solid var(--sc-gray-50);background:var(--sc-gray-20)!important}.adatepicker .withinRange[data-v-322c2ceb]{background:var(--sc-gray-5)}.adatepicker .todaysDate[data-v-322c2ceb]{font-weight:bolder;color:#000}.days-header>td[data-v-322c2ceb]{font-weight:700}.prev-date[data-v-322c2ceb]{color:var(--sc-gray-20)}.adatepicker .date-input[data-v-322c2ceb]{display:flex;width:100%;gap:5px;align-items:center}.adatepicker .date-input>input[data-v-322c2ceb]{width:50%;padding:2px}p.aform_error[data-v-322c2ceb]{position:static;display:block;color:var(--sc-brand-danger, red);font-size:.7rem;margin:.25rem 0 0}.adate_time[data-v-95ad0aa4]{width:auto;padding:10px;box-sizing:border-box;font-size:1rem;background:var(--sc-gray-10)}.adate_time_fields[data-v-95ad0aa4]{display:flex;align-items:stretch;gap:5px;justify-content:flex-start}.adate_time_fields>input[data-v-95ad0aa4]{min-width:30px;padding:2px;text-align:center;display:inline-block;flex-basis:0}.meridiem-selector[data-v-95ad0aa4]{cursor:pointer;display:inline-block;flex-basis:0;padding:5px;-webkit-user-select:none;user-select:none}.meridiem-selector[data-v-95ad0aa4]:focus{outline:2px solid black;outline-offset:-2px}.adate_time_segment[data-v-95ad0aa4]{display:flex;flex-direction:column;width:40px}.colon[data-v-95ad0aa4]{display:flex;align-items:normal}.aform_form-btn[data-v-95ad0aa4]{cursor:pointer}.aform-select[data-v-95ad0aa4]{border:1px solid rgb(118,118,118);font-size:1rem;padding:0rem;margin:0;border-radius:0;box-sizing:border-box;min-height:auto;position:relative;color:var(--sc-cell-text-color)}.meridiem-selector[data-v-95ad0aa4]{margin-left:6px}.adate-selection[data-v-602dfd69]{display:inline-block;border:1px solid var(--sc-gray-80);padding:10px;background:var(--sc-form-background)}.adate-selection__end-label[data-v-602dfd69]{font-size:.8em;font-weight:700;color:var(--sc-input-active-label-color, #555);margin-top:8px;margin-bottom:2px;padding-left:2px}.empty[data-v-602dfd69]{color:#ccc;padding:10px;text-align:center;border:1px solid #ccc}.adate-picker[data-v-5de3fe7a]{position:absolute;top:100%;left:0;z-index:1000;margin-top:.25rem}.autocomplete[data-v-11fc3569]{position:relative}.autocomplete-results[data-v-11fc3569]{position:absolute;left:0;right:0;z-index:100;padding:0;margin:0;color:var(--sc-input-active-border-color);border:1px solid var(--sc-input-active-border-color);border-radius:0;border-top:none;background-color:var(--sc-input-field-background, #fff);list-style:none}.autocomplete-result[data-v-11fc3569]{text-align:left;padding:4px 6px;cursor:pointer;border-bottom:.5px solid lightgray}.autocomplete-result.is-active[data-v-11fc3569],.autocomplete-result[data-v-11fc3569]:hover{background-color:var(--sc-row-color-zebra-light);color:var(--sc-input-active-border-color)}.abadge[data-v-4f364f5f]{display:block;box-sizing:border-box;font:inherit;line-height:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.abadge--cell-fill[data-v-4f364f5f]{display:block;box-sizing:border-box;width:100%;min-height:calc(var(--sc-atable-row-height, 1.5em) + 2 * var(--sc-atable-row-padding, .125rem));line-height:calc(var(--sc-atable-row-height, 1.5em) + 2 * var(--sc-atable-row-padding, .125rem));margin:0;padding:0 .5ch;border-radius:0;text-align:inherit;background:var(--sc-badge-bg);color:var(--sc-badge-text)}.abadge--cell-fill.abadge--neutral[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-neutral-bg);--sc-badge-text: var(--sc-badge-neutral-text)}.abadge--cell-fill.abadge--success[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-success-bg);--sc-badge-text: var(--sc-badge-success-text)}.abadge--cell-fill.abadge--warning[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-warning-bg);--sc-badge-text: var(--sc-badge-warning-text)}.abadge--cell-fill.abadge--danger[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-danger-bg);--sc-badge-text: var(--sc-badge-danger-text)}.abadge--cell-fill.abadge--brand[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-brand-bg);--sc-badge-text: var(--sc-badge-brand-text)}.abadge--input-accent[data-v-4f364f5f]{background:var(--sc-input-field-background, #ffffff);color:inherit;border-left:4px solid var(--sc-badge-accent);padding-left:calc(1ch - 4px)}.abadge--input-accent.abadge--neutral[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-neutral-accent)}.abadge--input-accent.abadge--success[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-success-accent)}.abadge--input-accent.abadge--warning[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-warning-accent)}.abadge--input-accent.abadge--danger[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-danger-accent)}.abadge--input-accent.abadge--brand[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-brand-accent)}.adatetime-picker[data-v-b0fa488b]{position:absolute;top:100%;left:0;z-index:1000;margin-top:.25rem}.aduration[data-v-2e4dd7dd]{position:relative;min-width:40ch;width:100%}.aduration__summary[data-v-2e4dd7dd]{display:flex;gap:6px;align-items:baseline;margin-top:6px;font-size:.9em}.aduration__label[data-v-2e4dd7dd]{font-weight:700;color:var(--sc-input-active-label-color, #555)}.aduration__value[data-v-2e4dd7dd]{color:var(--sc-cell-text-color, #000)}.aduration__ms[data-v-2e4dd7dd]{color:var(--sc-gray-50, #888);font-size:.85em}.aduration__footer[data-v-2e4dd7dd]{margin-top:8px}.adaterange-picker[data-v-f8dad4d3]{position:absolute;top:100%;left:0;z-index:1000;margin-top:.25rem}.aform input{font-family:var(--sc-font-family);border:none}.aform_form-element{padding:0;margin:0;position:relative;box-sizing:border-box;flex-grow:1;min-width:20ch}.aform__grid--full{flex-basis:100%;width:100%}.aform_input-field{outline:1px solid var(--sc-input-border-color);outline-offset:-1px;font-size:1rem;padding:.5rem;margin:0;border-radius:0;box-sizing:border-box;width:100%;min-height:auto;position:relative;color:var(--sc-cell-text-color);background:var(--sc-input-field-background);font-family:var(--sc-font-family)}.aform_input-field:focus{outline:1px solid var(--sc-input-active-border-color)}.aform_display-value{display:block;padding:.5rem;min-height:2rem;color:var(--sc-cell-text-color);word-break:break-word}.aform_input-field:focus+.aform_field-label{color:var(--sc-input-active-label-color)}.aform_field-label{color:var(--sc-input-label-color);display:inline-block;position:absolute;padding:0 .25rem;margin:0rem;z-index:1;font-size:.7rem;font-weight:300;letter-spacing:.05rem;background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-background) 50%);width:auto;box-sizing:border-box;background:#fff;margin:0;grid-row:1;top:0;left:10px;border:none;line-height:0;transform:translateY(-50%)}.aform_input-field:disabled,.aform_checkbox-container:has(.aform_checkbox:disabled){background:var(--sc-input-field-disabled-background)}.aform_input-field:disabled+.aform_field-label,.aform_checkbox-container:has(.aform_checkbox:disabled)+.aform_field-label{background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-disabled-background) 50%)}.aform_input-field:disabled~p.aform_error,.aform_checkbox-container:has(.aform_checkbox:disabled)~p.aform_error{background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-disabled-background) 50%)}.aform_field-label:after{margin:0;padding:0;box-sizing:border-box;content:"";line-height:normal}p.aform_error{display:inline-block;background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-background) 50%);padding:0 .25rem;margin:0rem;width:auto;color:var(--sc-brand-danger);font-size:.7rem;position:absolute;right:0;top:0;line-height:0;background:#fff;padding:.25rem;transform:translate(-1rem,-50%);margin:0}.aform[data-v-bb17171c]{display:flex;flex-wrap:wrap;gap:1rem;padding:1rem;border:1px solid var(--sc-form-border);border-left:4px solid var(--sc-form-border);margin-bottom:1rem;max-width:100%}@media screen and (max-width:400px){.aform[data-v-bb17171c]{flex-direction:column}}.aform-nested-section[data-v-bb17171c]{width:100%;padding:.5rem 0}.aform-nested-label[data-v-bb17171c]{font-size:.9rem;font-weight:600;margin:0 0 .5rem;color:var(--sc-input-label-color, #666)}.aform-nested-section .aform[data-v-bb17171c]{border-left-width:2px;margin-left:.5rem}.collapse-button[data-v-6f1c1b45]{width:2ch;min-width:calc(66px - 4ch);background-color:transparent;font-size:150%;text-align:center;border:none;margin-top:-.5rem}.rotated[data-v-6f1c1b45]{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transition:transform .25s;transform-origin:center center}.unrotated[data-v-6f1c1b45]{transform:rotate(0);-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transition:transform .25s}fieldset[data-v-162e7317]{max-width:100%;width:100%;margin-right:2ch;border:1px solid transparent;border-bottom:1px solid var(--sc-gray-50)}legend[data-v-162e7317]{width:100%;height:1.15rem;border:1px solid transparent;padding-bottom:.5rem;font-size:110%;font-weight:600;-webkit-user-select:none;user-select:none}.collapse-button[data-v-162e7317]{float:right}.aform_file-attach[data-v-8eefd179]{padding:1rem;display:flex;flex-wrap:wrap;gap:1rem;flex-direction:row;justify-content:center;align-items:center;border:1px dashed var(--sc-input-border-color);width:100%}@media screen and (max-width:400px){.aform_file-attach>.aform_form-btn[data-v-8eefd179]{width:100%}}.aform_file-attach-feedback[data-v-8eefd179]{color:var(--sc-input-label-color);width:100%;padding:.5rem;text-align:center;align-self:center}.aform_file-attach-feedback>li[data-v-8eefd179]{list-style:none;font-style:italic}.aform_file-attach-feedback>p[data-v-8eefd179]{margin-top:0}.aform_form-btn[data-v-8eefd179]{padding:.5rem 2rem;width:auto;border:1px solid var(--sc-input-border-color);color:var(--sc-input-label-color);cursor:pointer;background-color:#fff}.aform_form-btn[data-v-8eefd179]:disabled{background-color:var(--sc-gray-5)}.aquantity__row[data-v-0b714861]{display:flex;gap:1ch}.aquantity__row--stock[data-v-0b714861]{margin-top:1.5rem}.aquantity__field[data-v-0b714861]{position:relative;flex:1;min-width:0}.aquantity__group[data-v-0b714861]{display:flex;align-items:stretch;width:100%;border:1px solid var(--sc-input-border-color);border-radius:.25rem}.aquantity__group[data-v-0b714861]:focus-within{border-color:var(--sc-input-active-border-color)}.aquantity__qty[data-v-0b714861]{flex:1;min-width:0;border:none;outline:none;padding:.5ch 1ch;background:transparent;border-radius:.25rem 0 0 .25rem;appearance:textfield;-moz-appearance:textfield}.aquantity__qty[data-v-0b714861]::-webkit-outer-spin-button,.aquantity__qty[data-v-0b714861]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}.aquantity__uom[data-v-0b714861]{position:relative;flex:0 0 auto;border-left:1px solid var(--sc-input-border-color)}.aquantity__uom-toggle[data-v-0b714861]{display:flex;align-items:center;gap:.75ch;height:100%;padding:.5ch 1ch;background:var(--sc-gray-5);border:none;border-radius:0 .25rem .25rem 0;white-space:nowrap;cursor:pointer}.aquantity__uom-toggle[data-v-0b714861]:disabled{cursor:not-allowed;color:var(--sc-gray-50, #888)}.aquantity__caret[data-v-0b714861]{display:inline-block;width:0;height:0;border-left:.3em solid transparent;border-right:.3em solid transparent;border-top:.3em solid currentColor}.aquantity__uom-menu[data-v-0b714861]{position:absolute;top:100%;right:0;z-index:100;min-width:100%;margin:.15rem 0 0;padding:.25rem 0;list-style:none;background:var(--sc-input-field-background, #fff);border:1px solid var(--sc-input-active-border-color);border-radius:.25rem}.aquantity__uom-option[data-v-0b714861]{padding:.4ch 1ch;white-space:nowrap;cursor:pointer}.aquantity__uom-option.is-active[data-v-0b714861],.aquantity__uom-option[data-v-0b714861]:hover{background-color:var(--sc-row-color-zebra-light)}.aquantity__stock-field[data-v-0b714861]{width:100%;font-size:1rem;padding:.5ch 1ch;border:1px solid var(--sc-input-border-color);border-radius:.25rem;outline:none}.aquantity__stock-field[data-v-0b714861]:disabled{color:var(--sc-gray-50, #888)}.aform_textbox[data-v-2a9c793b]{resize:vertical;line-height:1.5;min-height:4rem;font-family:inherit}.aform_textbox-display[data-v-2a9c793b]{white-space:pre-wrap}.login-container[data-v-2c0f0634]{width:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--sc-font-family)}.account-container[data-v-2c0f0634]{width:100%;margin-left:auto;margin-top:.5rem;margin-right:auto;display:flex;flex-direction:column;justify-content:center}.account-header[data-v-2c0f0634]{display:flex;flex-direction:column;text-align:center;margin-top:.5rem}#account-title[data-v-2c0f0634]{font-size:1.5rem;line-height:2rem;font-weight:600;letter-spacing:-.025em;margin:0}#account-subtitle[data-v-2c0f0634]{font-size:.875rem;line-height:1.25rem;margin:1rem}.login-form-container[data-v-2c0f0634]{display:grid;gap:.5rem}.login-form-element[data-v-2c0f0634]{display:grid;margin:.5rem 0;position:relative}.login-field[data-v-2c0f0634]{padding:.5rem .25rem .25rem .5rem;outline:1px solid transparent;border:1px solid var(--sc-input-border-color);border-radius:.25rem}.login-field[data-v-2c0f0634]:focus{border:1px solid black}.btn[data-v-2c0f0634]{background-color:var(--sc-btn-color);color:var(--sc-btn-label-color);border:1px solid var(--sc-btn-border);margin:.5rem 0;padding:.25rem;position:relative;cursor:pointer}.btn[data-v-2c0f0634]:hover{background-color:var(--sc-btn-hover)}.btn[data-v-2c0f0634]:disabled{background-color:var(--sc-input-field-disabled-background)}.disabled[data-v-2c0f0634]{opacity:.5}.loading-icon[data-v-2c0f0634]{animation:spin-2c0f0634 1s linear infinite forwards;display:inline-block;margin-right:.2rem;line-height:0;font-size:1rem;position:relative;top:.2rem}@keyframes spin-2c0f0634{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.aform-loading[data-v-274f5ba3]{width:100%;border:1px solid var(--sc-form-border);border-left:4px solid var(--sc-form-border);padding:1rem;margin-bottom:1rem;box-sizing:border-box;position:relative;overflow:hidden;background:var(--sc-input-field-background, #fff)}.aform-loading__label[data-v-274f5ba3]{font-size:.9rem;color:var(--sc-cell-text-color);z-index:1;position:relative}.aform-loading__label[data-v-274f5ba3]:not(:empty):after{content:"...";animation:ellipsis-274f5ba3 2s infinite}.aform-loading__bar[data-v-274f5ba3]{width:100%;height:100%;position:absolute;left:-100%;top:0;background:linear-gradient(90deg,rgba(var(--sc-table-loading-color),0),rgba(var(--sc-table-loading-color),1),rgba(var(--sc-table-loading-color),0));animation:bar-sweep-274f5ba3 2s infinite;z-index:0}@keyframes bar-sweep-274f5ba3{0%{left:-100%}to{left:100%}}@keyframes ellipsis-274f5ba3{0%,20%{content:""}40%{content:"."}60%{content:".."}80%,to{content:"..."}}
+.aform_checkbox[data-v-ca06741d]{cursor:pointer;width:auto;margin-top:0;display:block}.aform_checkbox[data-v-ca06741d]:checked{accent-color:var(--sc-primary-color);border:1px solid black}.aform_checkbox-container[data-v-ca06741d]{width:100%;display:inline-block;text-align:left}.aform_checkbox-container input[data-v-ca06741d]{width:auto}.aform_checkbox-container:hover+.aform_field-label[data-v-ca06741d]{color:var(--sc-input-active-label-color)}.aform_form-link-wrapper[data-v-154d79c9]{position:relative}.input-group[data-v-154d79c9]{display:flex;align-items:stretch}.aform_input-field[data-v-154d79c9]{flex:1;min-width:0}.aform_form-element--embedded[data-v-154d79c9]{min-width:0;flex-grow:0}.aform_input-field--embedded[data-v-154d79c9]{outline:none;background:transparent;padding:.5ch 1ch}.aform_form-element--embedded .autocomplete-results[data-v-154d79c9]{min-width:100%;width:max-content}.aform_form-btn[data-v-154d79c9]{appearance:none;border:none;outline:1px solid var(--sc-input-border-color);outline-offset:-1px;margin-left:-2px;background:var(--sc-input-field-background, white);padding:0 .75rem;cursor:pointer}.aform_form-btn[data-v-154d79c9]:focus,.input-group:focus-within .aform_form-btn[data-v-154d79c9]{outline-color:var(--sc-input-active-border-color)}.autocomplete-results[data-v-154d79c9]{position:absolute;width:100%;z-index:100;padding:0;margin:0;list-style:none;border:1px solid var(--sc-input-active-border-color);border-top:none;border-radius:0 0 .25rem .25rem;background:#fff}.autocomplete-result[data-v-154d79c9]{padding:4px 6px;cursor:pointer;border-bottom:.5px solid lightgray}.autocomplete-result.is-active[data-v-154d79c9],.autocomplete-result[data-v-154d79c9]:hover{background-color:var(--sc-row-color-zebra-light);color:var(--sc-input-active-border-color)}.acurrency__row[data-v-15bec6ef]{display:flex;gap:1ch}.acurrency__row--base[data-v-15bec6ef]{margin-top:1.5rem}.acurrency__field[data-v-15bec6ef]{position:relative;flex:1;min-width:0}.acurrency__group[data-v-15bec6ef]{display:flex;align-items:stretch;width:100%;border:1px solid var(--sc-input-border-color);border-radius:.25rem}.acurrency__group[data-v-15bec6ef]:focus-within{border-color:var(--sc-input-active-border-color)}.acurrency__amount-wrap[data-v-15bec6ef]{position:relative;flex:1;min-width:0}.acurrency__amount-wrap .aform_field-label[data-v-15bec6ef]{font-size:.85rem}.acurrency__amount[data-v-15bec6ef]{width:100%;box-sizing:border-box;border:none;outline:none;padding:.5ch 1ch;background:transparent;border-radius:0 .25rem .25rem 0;text-align:right;appearance:textfield;-moz-appearance:textfield}.acurrency__amount[data-v-15bec6ef]::-webkit-outer-spin-button,.acurrency__amount[data-v-15bec6ef]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}.acurrency__currency[data-v-15bec6ef]{position:relative;flex:0 0 auto;min-width:4.5rem;background:var(--sc-gray-5);border-right:1px solid var(--sc-input-border-color);border-radius:.25rem 0 0 .25rem}.acurrency__base-field[data-v-15bec6ef]{width:100%;box-sizing:border-box;font-size:1rem;padding:.5ch 1ch;border:1px solid var(--sc-input-border-color);border-radius:.25rem;outline:none;appearance:textfield;-moz-appearance:textfield}.acurrency__base-field[data-v-15bec6ef]:disabled{color:var(--sc-gray-50, #888)}.acurrency__base-field[data-v-15bec6ef]::-webkit-outer-spin-button,.acurrency__base-field[data-v-15bec6ef]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}.adatepicker[data-v-322c2ceb],.adatepicker table[data-v-322c2ceb],.adatepicker tr[data-v-322c2ceb],.adatepicker td[data-v-322c2ceb],.adatepicker th[data-v-322c2ceb]{-webkit-user-select:none;-moz-user-select:none;user-select:none}.adatepicker[data-v-322c2ceb]{font-size:var(--sc-table-font-size);display:inline-table;color:var(--sc-cell-text-color);outline:none;border-collapse:collapse;margin-bottom:10px}.adatepicker tr[data-v-322c2ceb]{height:1.15rem;text-align:center;vertical-align:middle}.adatepicker td[data-v-322c2ceb]{border:2px solid transparent;outline:2px solid transparent;min-width:3ch;max-width:3ch;cursor:pointer}.adatepicker td.date-cell[data-v-322c2ceb]:hover{background:var(--sc-gray-10)}.adatepicker td[data-v-322c2ceb]:focus,.adatepicker td[data-v-322c2ceb]:focus-within{box-shadow:none;min-height:1.15em;max-height:1.15em;overflow:hidden}.adatepicker .selectedDate[data-v-322c2ceb],.adatepicker .startDate[data-v-322c2ceb],.adatepicker .endDate[data-v-322c2ceb]{background:var(--sc-gray-20);font-weight:bolder}.adatepicker .startDate[data-v-322c2ceb]{border-left:1px solid var(--sc-gray-50);background:var(--sc-gray-20)!important}.adatepicker .endDate[data-v-322c2ceb]{border-right:1px solid var(--sc-gray-50);background:var(--sc-gray-20)!important}.adatepicker .withinRange[data-v-322c2ceb]{background:var(--sc-gray-5)}.adatepicker .todaysDate[data-v-322c2ceb]{font-weight:bolder;color:#000}.days-header>td[data-v-322c2ceb]{font-weight:700}.prev-date[data-v-322c2ceb]{color:var(--sc-gray-20)}.adatepicker .date-input[data-v-322c2ceb]{display:flex;width:100%;gap:5px;align-items:center}.adatepicker .date-input>input[data-v-322c2ceb]{width:50%;padding:2px}p.aform_error[data-v-322c2ceb]{position:static;display:block;color:var(--sc-brand-danger, red);font-size:.7rem;margin:.25rem 0 0}.adate_time[data-v-95ad0aa4]{width:auto;padding:10px;box-sizing:border-box;font-size:1rem;background:var(--sc-gray-10)}.adate_time_fields[data-v-95ad0aa4]{display:flex;align-items:stretch;gap:5px;justify-content:flex-start}.adate_time_fields>input[data-v-95ad0aa4]{min-width:30px;padding:2px;text-align:center;display:inline-block;flex-basis:0}.meridiem-selector[data-v-95ad0aa4]{cursor:pointer;display:inline-block;flex-basis:0;padding:5px;-webkit-user-select:none;user-select:none}.meridiem-selector[data-v-95ad0aa4]:focus{outline:2px solid black;outline-offset:-2px}.adate_time_segment[data-v-95ad0aa4]{display:flex;flex-direction:column;width:40px}.colon[data-v-95ad0aa4]{display:flex;align-items:normal}.aform_form-btn[data-v-95ad0aa4]{cursor:pointer}.aform-select[data-v-95ad0aa4]{border:1px solid rgb(118,118,118);font-size:1rem;padding:0rem;margin:0;border-radius:0;box-sizing:border-box;min-height:auto;position:relative;color:var(--sc-cell-text-color)}.meridiem-selector[data-v-95ad0aa4]{margin-left:6px}.adate-selection[data-v-602dfd69]{display:inline-block;border:1px solid var(--sc-gray-80);padding:10px;background:var(--sc-form-background)}.adate-selection__end-label[data-v-602dfd69]{font-size:.8em;font-weight:700;color:var(--sc-input-active-label-color, #555);margin-top:8px;margin-bottom:2px;padding-left:2px}.empty[data-v-602dfd69]{color:#ccc;padding:10px;text-align:center;border:1px solid #ccc}.adate-picker[data-v-5de3fe7a]{position:absolute;top:100%;left:0;z-index:1000;margin-top:.25rem}.autocomplete[data-v-11fc3569]{position:relative}.autocomplete-results[data-v-11fc3569]{position:absolute;left:0;right:0;z-index:100;padding:0;margin:0;color:var(--sc-input-active-border-color);border:1px solid var(--sc-input-active-border-color);border-radius:0;border-top:none;background-color:var(--sc-input-field-background, #fff);list-style:none}.autocomplete-result[data-v-11fc3569]{text-align:left;padding:4px 6px;cursor:pointer;border-bottom:.5px solid lightgray}.autocomplete-result.is-active[data-v-11fc3569],.autocomplete-result[data-v-11fc3569]:hover{background-color:var(--sc-row-color-zebra-light);color:var(--sc-input-active-border-color)}.abadge[data-v-4f364f5f]{display:block;box-sizing:border-box;font:inherit;line-height:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.abadge--cell-fill[data-v-4f364f5f]{display:block;box-sizing:border-box;width:100%;min-height:calc(var(--sc-atable-row-height, 1.5em) + 2 * var(--sc-atable-row-padding, .125rem));line-height:calc(var(--sc-atable-row-height, 1.5em) + 2 * var(--sc-atable-row-padding, .125rem));margin:0;padding:0 .5ch;border-radius:0;text-align:inherit;background:var(--sc-badge-bg);color:var(--sc-badge-text)}.abadge--cell-fill.abadge--neutral[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-neutral-bg);--sc-badge-text: var(--sc-badge-neutral-text)}.abadge--cell-fill.abadge--success[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-success-bg);--sc-badge-text: var(--sc-badge-success-text)}.abadge--cell-fill.abadge--warning[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-warning-bg);--sc-badge-text: var(--sc-badge-warning-text)}.abadge--cell-fill.abadge--danger[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-danger-bg);--sc-badge-text: var(--sc-badge-danger-text)}.abadge--cell-fill.abadge--brand[data-v-4f364f5f]{--sc-badge-bg: var(--sc-badge-brand-bg);--sc-badge-text: var(--sc-badge-brand-text)}.abadge--input-accent[data-v-4f364f5f]{background:var(--sc-input-field-background, #ffffff);color:inherit;border-left:4px solid var(--sc-badge-accent);padding-left:calc(1ch - 4px)}.abadge--input-accent.abadge--neutral[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-neutral-accent)}.abadge--input-accent.abadge--success[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-success-accent)}.abadge--input-accent.abadge--warning[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-warning-accent)}.abadge--input-accent.abadge--danger[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-danger-accent)}.abadge--input-accent.abadge--brand[data-v-4f364f5f]{--sc-badge-accent: var(--sc-badge-brand-accent)}.aform_segmented-control--xs.aform_form-element[data-v-23f09651]{min-width:0;padding-top:0;max-width:none}.aform_segmented-control--xs[data-v-23f09651]:not(:has(.aform_segmented-sr-label)){padding-top:.5rem}.aform_segmented-sr-label[data-v-23f09651]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.aform_segmented-track[data-v-23f09651]{display:inline-flex;flex-wrap:wrap;align-items:stretch;gap:.125rem;padding:.125rem;width:auto;min-width:0;min-height:2rem;outline:1px solid var(--sc-input-border-color);outline-offset:-1px;border-radius:0;box-sizing:border-box;background:var(--sc-input-field-disabled-background);font-family:var(--sc-font-family)}.aform_segmented-control--xs .aform_segmented-track[data-v-23f09651]{min-height:1.5rem;font-size:.875rem}.aform_segmented-control--equal .aform_segmented-track[data-v-23f09651]{display:flex;width:100%}.aform_segmented-segment[data-v-23f09651]{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;margin:0;padding:.125rem .5rem;min-height:1.5rem;border-radius:0;color:var(--sc-input-label-color);font-family:inherit;font-size:inherit;font-weight:400;line-height:1.25;cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box}.aform_segmented-control--sm .aform_segmented-segment[data-v-23f09651]{min-height:1.75rem;padding:.125rem .75rem;font-size:var(--sc-font-size)}.aform_segmented-control--equal .aform_segmented-segment[data-v-23f09651]{flex:1 1 0}.aform_segmented-input[data-v-23f09651]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.aform_segmented-label[data-v-23f09651]{pointer-events:none}.aform_segmented-segment[data-v-23f09651]:not(.aform_segmented-segment--badge):has(.aform_segmented-input:checked){background:var(--sc-input-field-background);color:var(--sc-cell-text-color);font-weight:500}.aform_segmented-segment--badge[data-v-23f09651]:has(.aform_segmented-input:checked){font-weight:500}.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--neutral[data-v-23f09651]{background:var(--sc-badge-neutral-bg);color:var(--sc-badge-neutral-text)}.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--success[data-v-23f09651]{background:var(--sc-badge-success-bg);color:var(--sc-badge-success-text)}.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--warning[data-v-23f09651]{background:var(--sc-badge-warning-bg);color:var(--sc-badge-warning-text)}.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--danger[data-v-23f09651]{background:var(--sc-badge-danger-bg);color:var(--sc-badge-danger-text)}.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--brand[data-v-23f09651]{background:var(--sc-badge-brand-bg);color:var(--sc-badge-brand-text)}.aform_segmented-segment--badge:has(.aform_segmented-input:checked)[style*=--sc-badge-bg][data-v-23f09651]{background:var(--sc-badge-bg);color:var(--sc-badge-text)}.aform_segmented-segment[data-v-23f09651]:has(.aform_segmented-input:focus-visible){outline:1px solid var(--sc-input-active-border-color);outline-offset:-1px}.aform_segmented-segment[data-v-23f09651]:hover:has(.aform_segmented-input:not(:disabled):not(:checked)){background:color-mix(in srgb,var(--sc-input-field-background) 50%,transparent)}.aform_segmented-segment[data-v-23f09651]:has(.aform_segmented-input:disabled){cursor:not-allowed;opacity:.5}.aform_segmented-track[data-v-23f09651]:has(.aform_segmented-input:focus-visible){outline-color:var(--sc-input-active-border-color)}.aform_segmented-display-badge[data-v-23f09651]{display:block;padding:.5rem;min-height:2rem;box-sizing:border-box}@media(prefers-reduced-motion:no-preference){.aform_segmented-segment[data-v-23f09651]{transition:background-color .1s ease-out,color .1s ease-out}}@media(prefers-reduced-motion:reduce){.aform_segmented-segment[data-v-23f09651]{transition:none}}.adatetime-picker[data-v-b0fa488b]{position:absolute;top:100%;left:0;z-index:1000;margin-top:.25rem}.aduration[data-v-2e4dd7dd]{position:relative;min-width:40ch;width:100%}.aduration__summary[data-v-2e4dd7dd]{display:flex;gap:6px;align-items:baseline;margin-top:6px;font-size:.9em}.aduration__label[data-v-2e4dd7dd]{font-weight:700;color:var(--sc-input-active-label-color, #555)}.aduration__value[data-v-2e4dd7dd]{color:var(--sc-cell-text-color, #000)}.aduration__ms[data-v-2e4dd7dd]{color:var(--sc-gray-50, #888);font-size:.85em}.aduration__footer[data-v-2e4dd7dd]{margin-top:8px}.adaterange-picker[data-v-f8dad4d3]{position:absolute;top:100%;left:0;z-index:1000;margin-top:.25rem}.aform input{font-family:var(--sc-font-family);border:none}.aform_form-element{padding:0;margin:0;position:relative;box-sizing:border-box;flex-grow:1;min-width:20ch}.aform__grid--full{flex-basis:100%;width:100%}.aform_input-field{outline:1px solid var(--sc-input-border-color);outline-offset:-1px;font-size:1rem;padding:.5rem;margin:0;border-radius:0;box-sizing:border-box;width:100%;min-height:auto;position:relative;color:var(--sc-cell-text-color);background:var(--sc-input-field-background);font-family:var(--sc-font-family)}.aform_input-field:focus{outline:1px solid var(--sc-input-active-border-color)}.aform_display-value{display:block;padding:.5rem;min-height:2rem;color:var(--sc-cell-text-color);word-break:break-word}.aform_input-field:focus+.aform_field-label{color:var(--sc-input-active-label-color)}.aform_field-label{color:var(--sc-input-label-color);display:inline-block;position:absolute;padding:0 .25rem;margin:0rem;z-index:1;font-size:.7rem;font-weight:300;letter-spacing:.05rem;background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-background) 50%);width:auto;box-sizing:border-box;background:#fff;margin:0;grid-row:1;top:0;left:10px;border:none;line-height:0;transform:translateY(-50%)}.aform_input-field:disabled,.aform_checkbox-container:has(.aform_checkbox:disabled){background:var(--sc-input-field-disabled-background)}.aform_input-field:disabled+.aform_field-label,.aform_checkbox-container:has(.aform_checkbox:disabled)+.aform_field-label{background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-disabled-background) 50%)}.aform_input-field:disabled~p.aform_error,.aform_checkbox-container:has(.aform_checkbox:disabled)~p.aform_error{background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-disabled-background) 50%)}.aform_field-label:after{margin:0;padding:0;box-sizing:border-box;content:"";line-height:normal}p.aform_error{display:inline-block;background:linear-gradient(var(--sc-form-background) 50%,var(--sc-input-field-background) 50%);padding:0 .25rem;margin:0rem;width:auto;color:var(--sc-brand-danger);font-size:.7rem;position:absolute;right:0;top:0;line-height:0;background:#fff;padding:.25rem;transform:translate(-1rem,-50%);margin:0}.aform[data-v-16a61857]{display:flex;flex-wrap:wrap;gap:1rem;padding:1rem;border:1px solid var(--sc-form-border);border-left:4px solid var(--sc-form-border);margin-bottom:1rem;max-width:100%}@media screen and (max-width:400px){.aform[data-v-16a61857]{flex-direction:column}}.aform-nested-section[data-v-16a61857]{width:100%;padding:.5rem 0}.aform-nested-label[data-v-16a61857]{font-size:.9rem;font-weight:600;margin:0 0 .5rem;color:var(--sc-input-label-color, #666)}.aform-nested-section .aform[data-v-16a61857]{border-left-width:2px;margin-left:.5rem}.collapse-button[data-v-6f1c1b45]{width:2ch;min-width:calc(66px - 4ch);background-color:transparent;font-size:150%;text-align:center;border:none;margin-top:-.5rem}.rotated[data-v-6f1c1b45]{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transition:transform .25s;transform-origin:center center}.unrotated[data-v-6f1c1b45]{transform:rotate(0);-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transition:transform .25s}fieldset[data-v-162e7317]{max-width:100%;width:100%;margin-right:2ch;border:1px solid transparent;border-bottom:1px solid var(--sc-gray-50)}legend[data-v-162e7317]{width:100%;height:1.15rem;border:1px solid transparent;padding-bottom:.5rem;font-size:110%;font-weight:600;-webkit-user-select:none;user-select:none}.collapse-button[data-v-162e7317]{float:right}.aform_file-attach[data-v-8eefd179]{padding:1rem;display:flex;flex-wrap:wrap;gap:1rem;flex-direction:row;justify-content:center;align-items:center;border:1px dashed var(--sc-input-border-color);width:100%}@media screen and (max-width:400px){.aform_file-attach>.aform_form-btn[data-v-8eefd179]{width:100%}}.aform_file-attach-feedback[data-v-8eefd179]{color:var(--sc-input-label-color);width:100%;padding:.5rem;text-align:center;align-self:center}.aform_file-attach-feedback>li[data-v-8eefd179]{list-style:none;font-style:italic}.aform_file-attach-feedback>p[data-v-8eefd179]{margin-top:0}.aform_form-btn[data-v-8eefd179]{padding:.5rem 2rem;width:auto;border:1px solid var(--sc-input-border-color);color:var(--sc-input-label-color);cursor:pointer;background-color:#fff}.aform_form-btn[data-v-8eefd179]:disabled{background-color:var(--sc-gray-5)}.aquantity__row[data-v-0b714861]{display:flex;gap:1ch}.aquantity__row--stock[data-v-0b714861]{margin-top:1.5rem}.aquantity__field[data-v-0b714861]{position:relative;flex:1;min-width:0}.aquantity__group[data-v-0b714861]{display:flex;align-items:stretch;width:100%;border:1px solid var(--sc-input-border-color);border-radius:.25rem}.aquantity__group[data-v-0b714861]:focus-within{border-color:var(--sc-input-active-border-color)}.aquantity__qty[data-v-0b714861]{flex:1;min-width:0;border:none;outline:none;padding:.5ch 1ch;background:transparent;border-radius:.25rem 0 0 .25rem;appearance:textfield;-moz-appearance:textfield}.aquantity__qty[data-v-0b714861]::-webkit-outer-spin-button,.aquantity__qty[data-v-0b714861]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}.aquantity__uom[data-v-0b714861]{position:relative;flex:0 0 auto;border-left:1px solid var(--sc-input-border-color)}.aquantity__uom-toggle[data-v-0b714861]{display:flex;align-items:center;gap:.75ch;height:100%;padding:.5ch 1ch;background:var(--sc-gray-5);border:none;border-radius:0 .25rem .25rem 0;white-space:nowrap;cursor:pointer}.aquantity__uom-toggle[data-v-0b714861]:disabled{cursor:not-allowed;color:var(--sc-gray-50, #888)}.aquantity__caret[data-v-0b714861]{display:inline-block;width:0;height:0;border-left:.3em solid transparent;border-right:.3em solid transparent;border-top:.3em solid currentColor}.aquantity__uom-menu[data-v-0b714861]{position:absolute;top:100%;right:0;z-index:100;min-width:100%;margin:.15rem 0 0;padding:.25rem 0;list-style:none;background:var(--sc-input-field-background, #fff);border:1px solid var(--sc-input-active-border-color);border-radius:.25rem}.aquantity__uom-option[data-v-0b714861]{padding:.4ch 1ch;white-space:nowrap;cursor:pointer}.aquantity__uom-option.is-active[data-v-0b714861],.aquantity__uom-option[data-v-0b714861]:hover{background-color:var(--sc-row-color-zebra-light)}.aquantity__stock-field[data-v-0b714861]{width:100%;font-size:1rem;padding:.5ch 1ch;border:1px solid var(--sc-input-border-color);border-radius:.25rem;outline:none}.aquantity__stock-field[data-v-0b714861]:disabled{color:var(--sc-gray-50, #888)}.aform_textbox[data-v-2a9c793b]{resize:vertical;line-height:1.5;min-height:4rem;font-family:inherit}.aform_textbox-display[data-v-2a9c793b]{white-space:pre-wrap}.login-container[data-v-2c0f0634]{width:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--sc-font-family)}.account-container[data-v-2c0f0634]{width:100%;margin-left:auto;margin-top:.5rem;margin-right:auto;display:flex;flex-direction:column;justify-content:center}.account-header[data-v-2c0f0634]{display:flex;flex-direction:column;text-align:center;margin-top:.5rem}#account-title[data-v-2c0f0634]{font-size:1.5rem;line-height:2rem;font-weight:600;letter-spacing:-.025em;margin:0}#account-subtitle[data-v-2c0f0634]{font-size:.875rem;line-height:1.25rem;margin:1rem}.login-form-container[data-v-2c0f0634]{display:grid;gap:.5rem}.login-form-element[data-v-2c0f0634]{display:grid;margin:.5rem 0;position:relative}.login-field[data-v-2c0f0634]{padding:.5rem .25rem .25rem .5rem;outline:1px solid transparent;border:1px solid var(--sc-input-border-color);border-radius:.25rem}.login-field[data-v-2c0f0634]:focus{border:1px solid black}.btn[data-v-2c0f0634]{background-color:var(--sc-btn-color);color:var(--sc-btn-label-color);border:1px solid var(--sc-btn-border);margin:.5rem 0;padding:.25rem;position:relative;cursor:pointer}.btn[data-v-2c0f0634]:hover{background-color:var(--sc-btn-hover)}.btn[data-v-2c0f0634]:disabled{background-color:var(--sc-input-field-disabled-background)}.disabled[data-v-2c0f0634]{opacity:.5}.loading-icon[data-v-2c0f0634]{animation:spin-2c0f0634 1s linear infinite forwards;display:inline-block;margin-right:.2rem;line-height:0;font-size:1rem;position:relative;top:.2rem}@keyframes spin-2c0f0634{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.aform-loading[data-v-274f5ba3]{width:100%;border:1px solid var(--sc-form-border);border-left:4px solid var(--sc-form-border);padding:1rem;margin-bottom:1rem;box-sizing:border-box;position:relative;overflow:hidden;background:var(--sc-input-field-background, #fff)}.aform-loading__label[data-v-274f5ba3]{font-size:.9rem;color:var(--sc-cell-text-color);z-index:1;position:relative}.aform-loading__label[data-v-274f5ba3]:not(:empty):after{content:"...";animation:ellipsis-274f5ba3 2s infinite}.aform-loading__bar[data-v-274f5ba3]{width:100%;height:100%;position:absolute;left:-100%;top:0;background:linear-gradient(90deg,rgba(var(--sc-table-loading-color),0),rgba(var(--sc-table-loading-color),1),rgba(var(--sc-table-loading-color),0));animation:bar-sweep-274f5ba3 2s infinite;z-index:0}@keyframes bar-sweep-274f5ba3{0%{left:-100%}to{left:100%}}@keyframes ellipsis-274f5ba3{0%,20%{content:""}40%{content:"."}60%{content:".."}80%,to{content:"..."}}.expansion-index[data-v-df191efe]{color:var(--sc-header-text-color, #333);font-weight:700;font-size:11px;line-height:1;text-align:center;-webkit-user-select:none;user-select:none;width:2ch;min-width:1.25rem;height:1.25rem;padding:0;border:none;background:transparent;cursor:pointer;box-sizing:border-box}

package/dist/src/index.d.ts

@@ -8,6 +8,7 @@ import ACheckbox from './components/form/ACheckbox.vue';
 import ACurrencyInput from './components/form/ACurrencyInput.vue';
 import ADate from './components/form/ADate.vue';
 import ADropdown from './components/form/ADropdown.vue';
+import ASegmentedControl from './components/form/ASegmentedControl.vue';
 import ABadge from './components/form/ABadge.vue';
 import ADatePicker from './components/form/ADatePicker.vue';
 import ADateTime from './components/form/ADateTime.vue';
@@ -25,6 +26,7 @@ import ATextInput from './components/form/ATextInput.vue';
 import ATextboxInput from './components/form/ATextboxInput.vue';
 import Login from './components/utilities/Login.vue';
 import AFormLoading from './components/AFormLoading.vue';
+import ExpandButton from './components/base/ExpandButton.vue';
 export type * from './types';
 /**
  * Install all AForm components
@@ -32,5 +34,5 @@ export type * from './types';
  * @public
  */
 declare function install(app: App): void;
-export { ACheckbox, ACurrencyInput, ADate, ADropdown, ABadge, ADatePicker, ADateRange, ADateSelection, ADuration, ADateTime, ADateTimeInput, AFieldset, AFileAttach, AForm, AFormLink, ANumericInput, AQuantityInput, ATextInput, ATextboxInput, Login, AFormLoading, install, };
+export { ACheckbox, ACurrencyInput, ADate, ADropdown, ASegmentedControl, ABadge, ADatePicker, ADateRange, ADateSelection, ADuration, ADateTime, ADateTimeInput, AFieldset, AFileAttach, AForm, AFormLink, ANumericInput, AQuantityInput, ATextInput, ATextboxInput, Login, AFormLoading, ExpandButton, install, };
 //# sourceMappingURL=index.d.ts.map

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,mBAAmB,yBAAyB,CAAA;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AACxE,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAA;AACzD,YAAY,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAEtE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,KAAK,MAAM,6BAA6B,CAAA;AAC/C,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,MAAM,MAAM,8BAA8B,CAAA;AACjD,OAAO,WAAW,MAAM,mCAAmC,CAAA;AAC3D,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,UAAU,MAAM,kCAAkC,CAAA;AACzD,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,WAAW,MAAM,mCAAmC,CAAA;AAC3D,OAAO,KAAK,MAAM,wBAAwB,CAAA;AAC1C,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,aAAa,MAAM,qCAAqC,CAAA;AAC/D,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,UAAU,MAAM,kCAAkC,CAAA;AACzD,OAAO,aAAa,MAAM,qCAAqC,CAAA;AAC/D,OAAO,KAAK,MAAM,kCAAkC,CAAA;AACpD,OAAO,YAAY,MAAM,+BAA+B,CAAA;AAExD,mBAAmB,SAAS,CAAA;AAE5B;;;;GAIG;AACH,iBAAS,OAAO,CAAC,GAAG,EAAE,GAAG,QAuBxB;AAED,OAAO,EACN,SAAS,EACT,cAAc,EACd,KAAK,EACL,SAAS,EACT,MAAM,EACN,WAAW,EACX,UAAU,EACV,cAAc,EACd,SAAS,EACT,SAAS,EACT,cAAc,EACd,SAAS,EACT,WAAW,EACX,KAAK,EACL,SAAS,EACT,aAAa,EACb,cAAc,EACd,UAAU,EACV,aAAa,EACb,KAAK,EACL,YAAY,EACZ,OAAO,GACP,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,mBAAmB,yBAAyB,CAAA;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AACxE,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAA;AACzD,YAAY,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAEtE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,KAAK,MAAM,6BAA6B,CAAA;AAC/C,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,iBAAiB,MAAM,yCAAyC,CAAA;AACvE,OAAO,MAAM,MAAM,8BAA8B,CAAA;AACjD,OAAO,WAAW,MAAM,mCAAmC,CAAA;AAC3D,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,UAAU,MAAM,kCAAkC,CAAA;AACzD,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,WAAW,MAAM,mCAAmC,CAAA;AAC3D,OAAO,KAAK,MAAM,wBAAwB,CAAA;AAC1C,OAAO,SAAS,MAAM,iCAAiC,CAAA;AACvD,OAAO,aAAa,MAAM,qCAAqC,CAAA;AAC/D,OAAO,cAAc,MAAM,sCAAsC,CAAA;AACjE,OAAO,UAAU,MAAM,kCAAkC,CAAA;AACzD,OAAO,aAAa,MAAM,qCAAqC,CAAA;AAC/D,OAAO,KAAK,MAAM,kCAAkC,CAAA;AACpD,OAAO,YAAY,MAAM,+BAA+B,CAAA;AACxD,OAAO,YAAY,MAAM,oCAAoC,CAAA;AAE7D,mBAAmB,SAAS,CAAA;AAE5B;;;;GAIG;AACH,iBAAS,OAAO,CAAC,GAAG,EAAE,GAAG,QAyBxB;AAED,OAAO,EACN,SAAS,EACT,cAAc,EACd,KAAK,EACL,SAAS,EACT,iBAAiB,EACjB,MAAM,EACN,WAAW,EACX,UAAU,EACV,cAAc,EACd,SAAS,EACT,SAAS,EACT,cAAc,EACd,SAAS,EACT,WAAW,EACX,KAAK,EACL,SAAS,EACT,aAAa,EACb,cAAc,EACd,UAAU,EACV,aAAa,EACb,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,OAAO,GACP,CAAA"}

package/dist/src/index.js

@@ -6,6 +6,7 @@ import ACheckbox from './components/form/ACheckbox.vue';
 import ACurrencyInput from './components/form/ACurrencyInput.vue';
 import ADate from './components/form/ADate.vue';
 import ADropdown from './components/form/ADropdown.vue';
+import ASegmentedControl from './components/form/ASegmentedControl.vue';
 import ABadge from './components/form/ABadge.vue';
 import ADatePicker from './components/form/ADatePicker.vue';
 import ADateTime from './components/form/ADateTime.vue';
@@ -23,6 +24,7 @@ import ATextInput from './components/form/ATextInput.vue';
 import ATextboxInput from './components/form/ATextboxInput.vue';
 import Login from './components/utilities/Login.vue';
 import AFormLoading from './components/AFormLoading.vue';
+import ExpandButton from './components/base/ExpandButton.vue';
 /**
  * Install all AForm components
  * @param app - Vue app instance
@@ -34,6 +36,7 @@ function install(app /* options */) {
     app.component('ACurrencyInput', ACurrencyInput);
     app.component('ADate', ADate);
     app.component('ADropdown', ADropdown);
+    app.component('ASegmentedControl', ASegmentedControl);
     app.component('ABadge', ABadge);
     app.component('ADatePicker', ADatePicker);
     app.component('ADateTime', ADateTime);
@@ -50,5 +53,6 @@ function install(app /* options */) {
     app.component('ATextboxInput', ATextboxInput);
     app.component('ADuration', ADuration);
     app.component('AFormLoading', AFormLoading);
+    app.component('ExpandButton', ExpandButton);
 }
-export { ACheckbox, ACurrencyInput, ADate, ADropdown, ABadge, ADatePicker, ADateRange, ADateSelection, ADuration, ADateTime, ADateTimeInput, AFieldset, AFileAttach, AForm, AFormLink, ANumericInput, AQuantityInput, ATextInput, ATextboxInput, Login, AFormLoading, install, };
+export { ACheckbox, ACurrencyInput, ADate, ADropdown, ASegmentedControl, ABadge, ADatePicker, ADateRange, ADateSelection, ADuration, ADateTime, ADateTimeInput, AFieldset, AFileAttach, AForm, AFormLink, ANumericInput, AQuantityInput, ATextInput, ATextboxInput, Login, AFormLoading, ExpandButton, install, };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stonecrop/aform",
-  "version": "0.26.0",
+  "version": "0.28.0",
   "description": "Schema-driven form components for Stonecrop",
   "bugs": {
     "url": "https://github.com/agritheory/stonecrop/issues"
@@ -35,10 +35,10 @@
   "dependencies": {
     "@vueuse/components": "^14.2.1",
     "@vueuse/core": "^14.2.1",
-    "@stonecrop/atable": "0.26.0",
-    "@stonecrop/schema": "0.26.0",
-    "@stonecrop/themes": "0.26.0",
-    "@stonecrop/utilities": "0.26.0"
+    "@stonecrop/atable": "0.28.0",
+    "@stonecrop/schema": "0.28.0",
+    "@stonecrop/themes": "0.28.0",
+    "@stonecrop/utilities": "0.28.0"
   },
   "devDependencies": {
     "@microsoft/api-documenter": "^7.30.5",

package/src/components/AForm.vue

@@ -94,7 +94,7 @@ const componentProps = (componentObj: ResolvedField) => {
 	for (const [key, value] of Object.entries(componentObj)) {
 		// 'mode' is excluded here because it is handled by resolvedMode()
 		// and passed explicitly via :mode to avoid conflicting with the form-level defaults.
-		if (!['component', 'primaryKey', 'computed', 'language', 'hidden', 'mode', 'width'].includes(key)) {
+		if (!['component', 'primaryKey', 'computed', 'language', 'hidden', 'mode', 'width', 'height'].includes(key)) {
 			propsToPass[key] = value
 		}
 	}
@@ -111,9 +111,18 @@ const componentProps = (componentObj: ResolvedField) => {
 
 const fieldStyle = (componentObj: ResolvedField): Record<string, string> => {
 	if (componentObj.kind !== 'field') return {}
-	const width = componentObj.width
-	if (!width) return {}
-	return { flexBasis: width, width }
+	const style: Record<string, string> = {}
+	if (componentObj.width) {
+		style.flexBasis = componentObj.width
+		style.width = componentObj.width
+	}
+	if (componentObj.height) {
+		style.height = componentObj.height
+		style.minHeight = '0'
+		style.flexGrow = '1'
+		style.alignSelf = 'stretch'
+	}
+	return style
 }
 
 const effectiveFormMode = computed(() => mode ?? 'edit')

package/src/components/base/ExpandButton.vue

@@ -0,0 +1,34 @@
+<template>
+	<button
+		type="button"
+		class="expansion-index"
+		:aria-expanded="expanded"
+		:aria-label="expanded ? 'Collapse' : 'Expand'">
+		{{ expanded ? '▼' : '►' }}
+	</button>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+	expanded: boolean
+}>()
+</script>
+
+<style scoped>
+.expansion-index {
+	color: var(--sc-header-text-color, #333);
+	font-weight: bold;
+	font-size: 11px;
+	line-height: 1;
+	text-align: center;
+	user-select: none;
+	width: 2ch;
+	min-width: 1.25rem;
+	height: 1.25rem;
+	padding: 0;
+	border: none;
+	background: transparent;
+	cursor: pointer;
+	box-sizing: border-box;
+}
+</style>

package/src/components/form/ASegmentedControl.vue

@@ -0,0 +1,342 @@
+<template>
+	<div
+		class="aform_form-element aform_segmented-control"
+		:class="{
+			'aform_segmented-control--xs': size === 'xs',
+			'aform_segmented-control--sm': size === 'sm',
+			'aform_segmented-control--equal': equal,
+		}">
+		<template v-if="mode === 'display'">
+			<label class="aform_field-label" :class="{ 'aform_segmented-sr-label': hideLabel }">{{ label }}</label>
+			<ABadge
+				v-if="displayBadge"
+				class="aform_display-value aform_segmented-display-badge"
+				:value="displayBadgeValue"
+				:options="options"
+				presentation="input-accent" />
+			<span v-else class="aform_display-value">{{ displayText }}</span>
+		</template>
+		<template v-else>
+			<label :id="labelId" class="aform_field-label" :class="{ 'aform_segmented-sr-label': hideLabel }">
+				{{ label }}
+			</label>
+			<div
+				:role="multiple ? 'group' : 'radiogroup'"
+				class="aform_segmented-track"
+				:aria-labelledby="groupAriaLabel ? undefined : labelId"
+				:aria-label="groupAriaLabel"
+				:aria-busy="busy || undefined">
+				<label
+					v-for="choice in choices"
+					:key="choice"
+					class="aform_segmented-segment"
+					:class="segmentClasses(choice)"
+					:style="segmentStyle(choice)"
+					:data-segment-value="choice">
+					<input
+						v-if="multiple"
+						v-model="selectedMany"
+						type="checkbox"
+						class="aform_segmented-input"
+						:name="groupName"
+						:value="choice"
+						:disabled="mode === 'read'" />
+					<input
+						v-else
+						v-model="selected"
+						type="radio"
+						class="aform_segmented-input"
+						:name="groupName"
+						:value="choice"
+						:disabled="mode === 'read'" />
+					<span class="aform_segmented-label">{{ segmentLabel(choice) }}</span>
+				</label>
+			</div>
+			<p v-show="errorText" class="aform_error" v-html="errorText"></p>
+		</template>
+	</div>
+</template>
+
+<script setup lang="ts">
+import type { BadgeVariant, FieldOptions } from '@stonecrop/schema'
+import { hasBadgeOptions, lookupBadge, selectChoices } from '@stonecrop/schema'
+import { computed, useId, type CSSProperties } from 'vue'
+
+import type { ComponentProps } from '../../types'
+import ABadge from './ABadge.vue'
+
+const {
+	label,
+	options = undefined,
+	mode,
+	uuid,
+	errors,
+	validation = { errorMessage: '' },
+	size = 'sm',
+	equal = false,
+	hideLabel = false,
+	ariaLabel = undefined,
+	busy = false,
+	multiple = false,
+} = defineProps<
+	ComponentProps & {
+		options?: FieldOptions
+		size?: 'xs' | 'sm'
+		equal?: boolean
+		hideLabel?: boolean
+		ariaLabel?: string
+		busy?: boolean
+		multiple?: boolean
+	}
+>()
+
+const selected = defineModel<string | string[]>({ default: '' })
+
+const selectedMany = computed({
+	get: () => (Array.isArray(selected.value) ? selected.value : []),
+	set: (value: string[]) => {
+		selected.value = value
+	},
+})
+
+const errorText = computed(() => (errors?.length ? errors.join('; ') : (validation.errorMessage ?? '')))
+
+const fallbackId = useId()
+const groupName = computed(() => uuid ?? `aform-segmented-${fallbackId}`)
+const labelId = computed(() => `${groupName.value}-label`)
+
+// aria-labelledby outranks aria-label in the accessible-name algorithm, so the two are mutually
+// exclusive here: emitting both would silently leave `ariaLabel` inert. It only applies while the
+// label element is visually hidden — overriding a *visible* label would break WCAG 2.5.3.
+const groupAriaLabel = computed(() => (hideLabel ? ariaLabel : undefined))
+
+const choices = computed(() => selectChoices(options))
+const badgeOptions = computed(() => hasBadgeOptions(options))
+
+function segmentLabel(choice: string): string {
+	return lookupBadge(options, choice)?.label ?? choice
+}
+
+function segmentVariant(choice: string): BadgeVariant {
+	return lookupBadge(options, choice)?.variant ?? 'neutral'
+}
+
+function isChoiceSelected(choice: string): boolean {
+	if (multiple) return selectedMany.value.includes(choice)
+	return selected.value === choice
+}
+
+function segmentClasses(choice: string): Record<string, boolean> {
+	if (!badgeOptions.value) return {}
+	return {
+		'aform_segmented-segment--badge': true,
+		[`aform_segmented-segment--${segmentVariant(choice)}`]: isChoiceSelected(choice),
+	}
+}
+
+function segmentStyle(choice: string): CSSProperties {
+	if (!badgeOptions.value || !isChoiceSelected(choice)) return {}
+	const color = lookupBadge(options, choice)?.color
+	if (!color) return {}
+	return {
+		'--sc-badge-bg': color,
+		'--sc-badge-text': color,
+	} as CSSProperties
+}
+
+const displayText = computed(() => {
+	if (multiple) {
+		return selectedMany.value.map(segmentLabel).filter(Boolean).join(', ')
+	}
+	const value = selected.value
+	if (typeof value !== 'string' || value === '') return ''
+	return segmentLabel(value)
+})
+
+const displayBadge = computed(() => {
+	if (!badgeOptions.value) return false
+	if (multiple) return selectedMany.value.length === 1
+	return typeof selected.value === 'string' && selected.value !== ''
+})
+
+const displayBadgeValue = computed(() => {
+	if (multiple) return selectedMany.value[0] ?? ''
+	return typeof selected.value === 'string' ? selected.value : ''
+})
+</script>
+
+<style scoped>
+.aform_segmented-control--xs.aform_form-element {
+	min-width: 0;
+	padding-top: 0;
+	max-width: none;
+}
+
+.aform_segmented-control--xs:not(:has(.aform_segmented-sr-label)) {
+	padding-top: 0.5rem;
+}
+
+.aform_segmented-sr-label {
+	position: absolute;
+	width: 1px;
+	height: 1px;
+	padding: 0;
+	margin: -1px;
+	overflow: hidden;
+	clip: rect(0, 0, 0, 0);
+	white-space: nowrap;
+	border: 0;
+}
+
+.aform_segmented-track {
+	display: inline-flex;
+	flex-wrap: wrap;
+	align-items: stretch;
+	gap: 0.125rem;
+	padding: 0.125rem;
+	width: auto;
+	min-width: 0;
+	min-height: 2rem;
+	outline: 1px solid var(--sc-input-border-color);
+	outline-offset: -1px;
+	border-radius: 0;
+	box-sizing: border-box;
+	background: var(--sc-input-field-disabled-background);
+	font-family: var(--sc-font-family);
+}
+
+.aform_segmented-control--xs .aform_segmented-track {
+	min-height: 1.5rem;
+	font-size: 0.875rem;
+}
+
+.aform_segmented-control--equal .aform_segmented-track {
+	display: flex;
+	width: 100%;
+}
+
+.aform_segmented-segment {
+	position: relative;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	flex: none;
+	margin: 0;
+	padding: 0.125rem 0.5rem;
+	min-height: 1.5rem;
+	border-radius: 0;
+	color: var(--sc-input-label-color);
+	font-family: inherit;
+	font-size: inherit;
+	font-weight: 400;
+	line-height: 1.25;
+	cursor: pointer;
+	user-select: none;
+	box-sizing: border-box;
+}
+
+.aform_segmented-control--sm .aform_segmented-segment {
+	min-height: 1.75rem;
+	padding: 0.125rem 0.75rem;
+	font-size: var(--sc-font-size);
+}
+
+.aform_segmented-control--equal .aform_segmented-segment {
+	flex: 1 1 0;
+}
+
+.aform_segmented-input {
+	position: absolute;
+	inline-size: 1px;
+	block-size: 1px;
+	padding: 0;
+	margin: -1px;
+	overflow: hidden;
+	clip: rect(0, 0, 0, 0);
+	white-space: nowrap;
+	border: 0;
+}
+
+.aform_segmented-label {
+	pointer-events: none;
+}
+
+.aform_segmented-segment:not(.aform_segmented-segment--badge):has(.aform_segmented-input:checked) {
+	background: var(--sc-input-field-background);
+	color: var(--sc-cell-text-color);
+	font-weight: 500;
+}
+
+.aform_segmented-segment--badge:has(.aform_segmented-input:checked) {
+	font-weight: 500;
+}
+
+.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--neutral {
+	background: var(--sc-badge-neutral-bg);
+	color: var(--sc-badge-neutral-text);
+}
+
+.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--success {
+	background: var(--sc-badge-success-bg);
+	color: var(--sc-badge-success-text);
+}
+
+.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--warning {
+	background: var(--sc-badge-warning-bg);
+	color: var(--sc-badge-warning-text);
+}
+
+.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--danger {
+	background: var(--sc-badge-danger-bg);
+	color: var(--sc-badge-danger-text);
+}
+
+.aform_segmented-segment--badge:has(.aform_segmented-input:checked).aform_segmented-segment--brand {
+	background: var(--sc-badge-brand-bg);
+	color: var(--sc-badge-brand-text);
+}
+
+.aform_segmented-segment--badge:has(.aform_segmented-input:checked)[style*='--sc-badge-bg'] {
+	background: var(--sc-badge-bg);
+	color: var(--sc-badge-text);
+}
+
+.aform_segmented-segment:has(.aform_segmented-input:focus-visible) {
+	outline: 1px solid var(--sc-input-active-border-color);
+	outline-offset: -1px;
+}
+
+.aform_segmented-segment:hover:has(.aform_segmented-input:not(:disabled):not(:checked)) {
+	background: color-mix(in srgb, var(--sc-input-field-background) 50%, transparent);
+}
+
+.aform_segmented-segment:has(.aform_segmented-input:disabled) {
+	cursor: not-allowed;
+	opacity: 0.5;
+}
+
+.aform_segmented-track:has(.aform_segmented-input:focus-visible) {
+	outline-color: var(--sc-input-active-border-color);
+}
+
+.aform_segmented-display-badge {
+	display: block;
+	padding: 0.5rem;
+	min-height: 2rem;
+	box-sizing: border-box;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+	.aform_segmented-segment {
+		transition:
+			background-color 0.1s ease-out,
+			color 0.1s ease-out;
+	}
+}
+
+@media (prefers-reduced-motion: reduce) {
+	.aform_segmented-segment {
+		transition: none;
+	}
+}
+</style>

package/src/index.ts

@@ -10,6 +10,7 @@ import ACheckbox from './components/form/ACheckbox.vue'
 import ACurrencyInput from './components/form/ACurrencyInput.vue'
 import ADate from './components/form/ADate.vue'
 import ADropdown from './components/form/ADropdown.vue'
+import ASegmentedControl from './components/form/ASegmentedControl.vue'
 import ABadge from './components/form/ABadge.vue'
 import ADatePicker from './components/form/ADatePicker.vue'
 import ADateTime from './components/form/ADateTime.vue'
@@ -27,6 +28,7 @@ import ATextInput from './components/form/ATextInput.vue'
 import ATextboxInput from './components/form/ATextboxInput.vue'
 import Login from './components/utilities/Login.vue'
 import AFormLoading from './components/AFormLoading.vue'
+import ExpandButton from './components/base/ExpandButton.vue'
 
 export type * from './types'
 
@@ -42,6 +44,7 @@ function install(app: App /* options */) {
 	app.component('ACurrencyInput', ACurrencyInput)
 	app.component('ADate', ADate)
 	app.component('ADropdown', ADropdown)
+	app.component('ASegmentedControl', ASegmentedControl)
 	app.component('ABadge', ABadge)
 	app.component('ADatePicker', ADatePicker)
 	app.component('ADateTime', ADateTime)
@@ -58,6 +61,7 @@ function install(app: App /* options */) {
 	app.component('ATextboxInput', ATextboxInput)
 	app.component('ADuration', ADuration)
 	app.component('AFormLoading', AFormLoading)
+	app.component('ExpandButton', ExpandButton)
 }
 
 export {
@@ -65,6 +69,7 @@ export {
 	ACurrencyInput,
 	ADate,
 	ADropdown,
+	ASegmentedControl,
 	ABadge,
 	ADatePicker,
 	ADateRange,
@@ -82,5 +87,6 @@ export {
 	ATextboxInput,
 	Login,
 	AFormLoading,
+	ExpandButton,
 	install,
 }