@smwb/ui-solid 0.11.0 → 0.11.2

package/dist/assets/styles/less/components/chip/chip.entry.css

@@ -1 +1 @@
-.smwb-chip{position:relative;user-select:none;height:32px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 12px;border-radius:6px;cursor:pointer;transition:all .15s ease-in-out;color:var(--smui-primaryTextColor)}.smwb-chip.smwb-disabled{opacity:.8;pointer-events:none;background-color:var(--smui-disabledBgColor);border-color:var(--smui-disabledBgColor);color:var(--smui-disabledTextColor)}.smwb-chip.smwb-disabled.smwb-outlined{border:1px solid var(--smui-disabledBgColor);background:none}.smwb-chip.smwb-disabled i{color:var(--smui-disabledTextColor)}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled){background-color:var(--smui-chipsBg);box-shadow:0 3px 5px -1px #0000001c,0 1px 1px #00000024,0 2px 3px #0000001f}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled):hover{background-color:var(--smui-chipsHoverBg)}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled):active{background-color:var(--smui-chipsActiveBg);box-shadow:0 3px 5px -1px #00000029,0 1px 1px #00000024,0 2px 3px #0000001f}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled).smwb-selected{background-color:var(--smui-chipsSelectedBg)}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled){border:1px solid var(--smui-chipsOutlinedBorder)}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled):hover{background-color:var(--smui-chipsHoverBg)}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled):active{background-color:var(--smui-chipsActiveBg);box-shadow:0 3px 5px -1px #0000001c,0 1px 1px #00000024,0 2px 3px #0000001f}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled).smwb-selected{background-color:var(--smui-chipsSelectedBg)}.smwb-chip__delete-icon{display:inline-flex;align-items:center;justify-content:center}.smwb-chip__delete-icon svg{fill:var(--smui-chipsIconColor);transition:all .15s ease-in-out}.smwb-chip__delete-icon svg:hover{fill:var(--smui-chipsIconColorHover)}.smwb-chip__icon{display:inline-flex;align-items:center;justify-content:center}.smwb-chip__delete-icon{background:transparent;border:0;margin:0;padding:0;font:inherit;color:inherit;cursor:pointer}.smwb-chip_size-small{height:24px;padding:0 8px;font-size:.75rem}.smwb-chip.smwb-chip_color-primary.smwb-filled{background-color:var(--smui-primaryColor);color:var(--smui-onPrimaryColor)}.smwb-chip.smwb-chip_color-primary.smwb-filled:hover{background-color:var(--smui-primaryColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-primary.smwb-filled:active{background-color:var(--smui-primaryColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-primary.smwb-outlined{color:var(--smui-primaryColor);border:1px solid var(--smui-primaryColor);background:transparent}.smwb-chip.smwb-chip_color-secondary.smwb-filled{background-color:var(--smui-secondaryColor);color:var(--smui-onSecondaryColor)}.smwb-chip.smwb-chip_color-secondary.smwb-filled:hover{background-color:var(--smui-secondaryColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-secondary.smwb-filled:active{background-color:var(--smui-secondaryColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-secondary.smwb-outlined{color:var(--smui-secondaryColor);border:1px solid var(--smui-secondaryColor);background:transparent}.smwb-chip.smwb-chip_color-error.smwb-filled{background-color:var(--smui-errorColor);color:var(--smui-onErrorColor)}.smwb-chip.smwb-chip_color-error.smwb-filled:hover{background-color:var(--smui-errorColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-error.smwb-filled:active{background-color:var(--smui-errorColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-error.smwb-outlined{color:var(--smui-errorColor);border:1px solid var(--smui-errorColor);background:transparent}.smwb-chip.smwb-chip_color-success.smwb-filled{background-color:var(--smui-successColor);color:var(--smui-onSuccessColor)}.smwb-chip.smwb-chip_color-success.smwb-filled:hover{background-color:var(--smui-successColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-success.smwb-filled:active{background-color:var(--smui-successColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-success.smwb-outlined{color:var(--smui-successColor);border:1px solid var(--smui-successColor);background:transparent}.smwb-chip.smwb-chip_color-warning.smwb-filled{background-color:var(--smui-warningColor);color:var(--smui-onWarningColor)}.smwb-chip.smwb-chip_color-warning.smwb-filled:hover{background-color:var(--smui-warningColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-warning.smwb-filled:active{background-color:var(--smui-warningColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-warning.smwb-outlined{color:var(--smui-warningColor);border:1px solid var(--smui-warningColor);background:transparent}.smwb-chip.smwb-chip_color-info.smwb-filled{background-color:var(--smui-infoColor);color:var(--smui-onInfoColor)}.smwb-chip.smwb-chip_color-info.smwb-filled:hover{background-color:var(--smui-infoColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-info.smwb-filled:active{background-color:var(--smui-infoColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-info.smwb-outlined{color:var(--smui-infoColor);border:1px solid var(--smui-infoColor);background:transparent}
+.smwb-chip{position:relative;user-select:none;height:32px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 12px;border-radius:6px;cursor:pointer;transition:all .15s ease-in-out;color:var(--smui-primaryTextColor)}.smwb-chip.smwb-disabled{opacity:.8;pointer-events:none;background-color:var(--smui-disabledBgColor);border-color:var(--smui-disabledBgColor);color:var(--smui-disabledTextColor)}.smwb-chip.smwb-disabled.smwb-outlined{border:1px solid var(--smui-disabledBgColor);background:none}.smwb-chip.smwb-disabled i{color:var(--smui-disabledTextColor)}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled){background-color:var(--smui-chipsBg);box-shadow:0 3px 5px -1px #0000001c,0 1px 1px #00000024,0 2px 3px #0000001f}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled):hover{background-color:var(--smui-chipsHoverBg)}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled):active{background-color:var(--smui-chipsActiveBg);box-shadow:0 3px 5px -1px #00000029,0 1px 1px #00000024,0 2px 3px #0000001f}.smwb-chip.smwb-filled:not(.smwb-chip.smwb-disabled).smwb-selected{background-color:var(--smui-chipsSelectedBg)}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled){border:1px solid var(--smui-chipsOutlinedBorder)}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled):hover{background-color:var(--smui-chipsHoverBg)}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled):active{background-color:var(--smui-chipsActiveBg);box-shadow:0 3px 5px -1px #0000001c,0 1px 1px #00000024,0 2px 3px #0000001f}.smwb-chip.smwb-outlined:not(.smwb-chip.smwb-disabled).smwb-selected{background-color:var(--smui-chipsSelectedBg)}.smwb-chip__delete-icon{display:inline-flex;align-items:center;justify-content:center}.smwb-chip__delete-icon svg{fill:var(--smui-chipsIconColor);transition:all .15s ease-in-out}.smwb-chip__delete-icon svg:hover{fill:var(--smui-chipsIconColorHover)}.smwb-chip__icon{display:inline-flex;align-items:center;justify-content:center}.smwb-chip__delete-icon{background:transparent;border:0;margin:0;padding:0;font:inherit;color:inherit;cursor:pointer}.smwb-chip_size-small{height:24px;padding:0 8px;font-size:.75rem}.smwb-chip.smwb-chip_color-primary:not(.smwb-chip.smwb-disabled).smwb-filled{background-color:var(--smui-primaryColor);color:var(--smui-onPrimaryColor)}.smwb-chip.smwb-chip_color-primary:not(.smwb-chip.smwb-disabled).smwb-filled:hover{background-color:var(--smui-primaryColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-primary:not(.smwb-chip.smwb-disabled).smwb-filled:active{background-color:var(--smui-primaryColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-primary:not(.smwb-chip.smwb-disabled).smwb-outlined{color:var(--smui-primaryColor);border-color:var(--smui-primaryColor)}.smwb-chip.smwb-chip_color-secondary:not(.smwb-chip.smwb-disabled).smwb-filled{background-color:var(--smui-secondaryColor);color:var(--smui-onSecondaryColor)}.smwb-chip.smwb-chip_color-secondary:not(.smwb-chip.smwb-disabled).smwb-filled:hover{background-color:var(--smui-secondaryColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-secondary:not(.smwb-chip.smwb-disabled).smwb-filled:active{background-color:var(--smui-secondaryColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-secondary:not(.smwb-chip.smwb-disabled).smwb-outlined{color:var(--smui-secondaryColor);border-color:var(--smui-secondaryColor)}.smwb-chip.smwb-chip_color-error:not(.smwb-chip.smwb-disabled).smwb-filled{background-color:var(--smui-errorColor);color:var(--smui-onErrorColor)}.smwb-chip.smwb-chip_color-error:not(.smwb-chip.smwb-disabled).smwb-filled:hover{background-color:var(--smui-errorColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-error:not(.smwb-chip.smwb-disabled).smwb-filled:active{background-color:var(--smui-errorColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-error:not(.smwb-chip.smwb-disabled).smwb-outlined{color:var(--smui-errorColor);border-color:var(--smui-errorColor)}.smwb-chip.smwb-chip_color-success:not(.smwb-chip.smwb-disabled).smwb-filled{background-color:var(--smui-successColor);color:var(--smui-onSuccessColor)}.smwb-chip.smwb-chip_color-success:not(.smwb-chip.smwb-disabled).smwb-filled:hover{background-color:var(--smui-successColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-success:not(.smwb-chip.smwb-disabled).smwb-filled:active{background-color:var(--smui-successColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-success:not(.smwb-chip.smwb-disabled).smwb-outlined{color:var(--smui-successColor);border-color:var(--smui-successColor)}.smwb-chip.smwb-chip_color-warning:not(.smwb-chip.smwb-disabled).smwb-filled{background-color:var(--smui-warningColor);color:var(--smui-onWarningColor)}.smwb-chip.smwb-chip_color-warning:not(.smwb-chip.smwb-disabled).smwb-filled:hover{background-color:var(--smui-warningColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-warning:not(.smwb-chip.smwb-disabled).smwb-filled:active{background-color:var(--smui-warningColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-warning:not(.smwb-chip.smwb-disabled).smwb-outlined{color:var(--smui-warningColor);border-color:var(--smui-warningColor)}.smwb-chip.smwb-chip_color-info:not(.smwb-chip.smwb-disabled).smwb-filled{background-color:var(--smui-infoColor);color:var(--smui-onInfoColor)}.smwb-chip.smwb-chip_color-info:not(.smwb-chip.smwb-disabled).smwb-filled:hover{background-color:var(--smui-infoColor);filter:brightness(.94)}.smwb-chip.smwb-chip_color-info:not(.smwb-chip.smwb-disabled).smwb-filled:active{background-color:var(--smui-infoColor);filter:brightness(.88)}.smwb-chip.smwb-chip_color-info:not(.smwb-chip.smwb-disabled).smwb-outlined{color:var(--smui-infoColor);border-color:var(--smui-infoColor)}

package/dist/assets/styles/less/components/modal/modal.entry.css

@@ -1 +1 @@
-.smwb-modal{display:flex;flex-direction:column;min-height:150px;border-radius:16px;line-height:1.5;overflow-y:auto;color:var(--smui-onSurfaceColor);background-color:var(--smui-surfaceBackground);box-shadow:0 11px 15px -7px #0003,0 24px 38px 3px #00000024,0 9px 46px 8px #0000001f}.smwb-modal__header{padding:20px 20px 10px}.smwb-modal__content{padding:10px 20px;flex-grow:1;overflow:hidden auto}.smwb-modal__footer{padding:10px 20px 20px}.smwb-modal.smwb-small{width:25%;height:25%}.smwb-modal.smwb-medium{width:min(480px,90vw);height:auto;max-height:min(560px,90vh)}.smwb-modal.smwb-large{width:50%;height:50%}.smwb-modal.smwb-fullscreen{width:100%;height:100%;border-radius:0}.smwb-modal__overlay{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;min-width:100%;min-height:100%;z-index:1001;overflow:hidden}.smwb-modal__overlay-appear .smwb-modal.smwb-fade,.smwb-modal__overlay-enter .smwb-modal.smwb-fade{opacity:0}.smwb-modal__overlay-appear .smwb-modal.smwb-scale,.smwb-modal__overlay-enter .smwb-modal.smwb-scale{opacity:0;transform:scale(0)}.smwb-modal__overlay-appear .smwb-modal.smwb-drop,.smwb-modal__overlay-enter .smwb-modal.smwb-drop{opacity:0;transform:translateY(-100%)}@media(min-width:800px){.smwb-modal__overlay-appear-active:not(.smwb-fullscreen).smwb-dark,.smwb-modal__overlay-enter-active:not(.smwb-fullscreen).smwb-dark{background-color:#00000080;transition:background-color 225ms ease-in-out}.smwb-modal__overlay-appear-active:not(.smwb-fullscreen).smwb-blured,.smwb-modal__overlay-enter-active:not(.smwb-fullscreen).smwb-blured{backdrop-filter:blur(5px);transition:backdrop-filter 225ms ease-in-out}.smwb-modal__overlay-appear-active:not(.smwb-fullscreen).smwb-darkBlured,.smwb-modal__overlay-enter-active:not(.smwb-fullscreen).smwb-darkBlured{background-color:#00000080;backdrop-filter:blur(5px);transition:backdrop-filter 225ms ease-in-out,background-color 225ms ease-in-out}}.smwb-modal__overlay-appear-active .smwb-modal.smwb-fade,.smwb-modal__overlay-enter-active .smwb-modal.smwb-fade{opacity:1;transition:opacity 225ms ease-in-out}.smwb-modal__overlay-appear-active .smwb-modal.smwb-scale,.smwb-modal__overlay-enter-active .smwb-modal.smwb-scale{opacity:1;transform:scale(1);transition:opacity 225ms ease-in-out,transform 225ms ease-in-out}.smwb-modal__overlay-appear-active .smwb-modal.smwb-drop,.smwb-modal__overlay-enter-active .smwb-modal.smwb-drop{opacity:1;transform:translateY(0);transition:opacity 225ms ease-in-out,transform 225ms ease-in-out}@media(min-width:800px){.smwb-modal__overlay-appear-done:not(.smwb-fullscreen).smwb-dark,.smwb-modal__overlay-enter-done:not(.smwb-fullscreen).smwb-dark,.smwb-modal__overlay-exit:not(.smwb-fullscreen).smwb-dark{background-color:#00000080}.smwb-modal__overlay-appear-done:not(.smwb-fullscreen).smwb-blured,.smwb-modal__overlay-enter-done:not(.smwb-fullscreen).smwb-blured,.smwb-modal__overlay-exit:not(.smwb-fullscreen).smwb-blured{backdrop-filter:blur(5px)}.smwb-modal__overlay-appear-done:not(.smwb-fullscreen).smwb-darkBlured,.smwb-modal__overlay-enter-done:not(.smwb-fullscreen).smwb-darkBlured,.smwb-modal__overlay-exit:not(.smwb-fullscreen).smwb-darkBlured{background-color:#00000080;backdrop-filter:blur(5px)}}@media(min-width:800px){.smwb-modal__overlay-exit-active:not(.smwb-fullscreen).smwb-dark{background-color:transparent;transition:background-color .15s ease-in-out}.smwb-modal__overlay-exit-active:not(.smwb-fullscreen).smwb-blured{backdrop-filter:blur(0);transition:backdrop-filter .15s ease-in-out}.smwb-modal__overlay-exit-active:not(.smwb-fullscreen).smwb-darkBlured{background-color:transparent;backdrop-filter:blur(0);transition:backdrop-filter .15s ease-in-out,background-color .15s ease-in-out}}.smwb-modal__overlay-exit-active .smwb-modal.smwb-fade{opacity:0;transition:opacity .15s ease-in-out}.smwb-modal__overlay-exit-active .smwb-modal.smwb-scale{opacity:0;transform:scale(0);transition:opacity .15s ease-in-out,transform .15s ease-in-out}.smwb-modal__overlay-exit-active .smwb-modal.smwb-drop{opacity:0;transform:translateY(-100%);transition:opacity .15s ease-in-out,transform .15s ease-in-out}@media(max-width:800px){.smwb-modal.smwb-small,.smwb-modal.smwb-medium,.smwb-modal.smwb-large,.smwb-modal.smwb-fullscreen{width:100%;height:100%;border-radius:0}}@media(max-height:600px){.smwb-modal{min-height:250px;min-width:280px}}.smwb-scrollbar::-webkit-scrollbar-thumb{background-color:var(--smui-scrollThumbColor);border-radius:999px}.smwb-scrollbar::-webkit-scrollbar{width:6px;height:6px}.smwb-scrollbar::-webkit-scrollbar-track{background-color:transparent}
+.smwb-modal{display:flex;flex-direction:column;min-height:150px;border-radius:16px;line-height:1.5;overflow-y:auto;color:var(--smui-onSurfaceColor);background-color:var(--smui-surfaceBackground);box-shadow:0 11px 15px -7px #0003,0 24px 38px 3px #00000024,0 9px 46px 8px #0000001f}.smwb-modal__header{padding:20px 20px 10px}.smwb-modal__content{padding:10px 20px;flex-grow:1;overflow:hidden auto}.smwb-modal__footer{padding:10px 20px 20px}.smwb-modal.smwb-small{width:25%;height:25%}.smwb-modal.smwb-medium{width:min(480px,90vw);height:auto;max-height:min(560px,90vh)}.smwb-modal.smwb-large{width:50%;height:50%}.smwb-modal.smwb-fullscreen{width:100%;height:100%;border-radius:0}.smwb-modal__overlay{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;min-width:100%;min-height:100%;z-index:1001;overflow:hidden}.smwb-modal__overlay-appear .smwb-modal.smwb-fade,.smwb-modal__overlay-enter .smwb-modal.smwb-fade{opacity:0}.smwb-modal__overlay-appear .smwb-modal.smwb-scale,.smwb-modal__overlay-enter .smwb-modal.smwb-scale{opacity:0;transform:scale(0)}.smwb-modal__overlay-appear .smwb-modal.smwb-drop,.smwb-modal__overlay-enter .smwb-modal.smwb-drop{opacity:0;transform:translateY(-100%)}@media(min-width:800px){.smwb-modal__overlay-appear-active:not(.smwb-fullscreen).smwb-dark,.smwb-modal__overlay-enter-active:not(.smwb-fullscreen).smwb-dark{background-color:#00000080;transition:background-color 225ms ease-in-out}.smwb-modal__overlay-appear-active:not(.smwb-fullscreen).smwb-blured,.smwb-modal__overlay-enter-active:not(.smwb-fullscreen).smwb-blured{backdrop-filter:blur(5px);transition:backdrop-filter 225ms ease-in-out}.smwb-modal__overlay-appear-active:not(.smwb-fullscreen).smwb-darkBlured,.smwb-modal__overlay-enter-active:not(.smwb-fullscreen).smwb-darkBlured{background-color:#00000080;backdrop-filter:blur(5px);transition:backdrop-filter 225ms ease-in-out,background-color 225ms ease-in-out}}.smwb-modal__overlay-appear-active .smwb-modal.smwb-fade,.smwb-modal__overlay-enter-active .smwb-modal.smwb-fade{opacity:1;transition:opacity 225ms ease-in-out}.smwb-modal__overlay-appear-active .smwb-modal.smwb-scale,.smwb-modal__overlay-enter-active .smwb-modal.smwb-scale{opacity:1;transform:scale(1);transition:opacity 225ms ease-in-out,transform 225ms ease-in-out}.smwb-modal__overlay-appear-active .smwb-modal.smwb-drop,.smwb-modal__overlay-enter-active .smwb-modal.smwb-drop{opacity:1;transform:translateY(0);transition:opacity 225ms ease-in-out,transform 225ms ease-in-out}@media(min-width:800px){.smwb-modal__overlay-appear-done:not(.smwb-fullscreen).smwb-dark,.smwb-modal__overlay-enter-done:not(.smwb-fullscreen).smwb-dark,.smwb-modal__overlay-exit:not(.smwb-fullscreen).smwb-dark{background-color:#00000080}.smwb-modal__overlay-appear-done:not(.smwb-fullscreen).smwb-blured,.smwb-modal__overlay-enter-done:not(.smwb-fullscreen).smwb-blured,.smwb-modal__overlay-exit:not(.smwb-fullscreen).smwb-blured{backdrop-filter:blur(5px)}.smwb-modal__overlay-appear-done:not(.smwb-fullscreen).smwb-darkBlured,.smwb-modal__overlay-enter-done:not(.smwb-fullscreen).smwb-darkBlured,.smwb-modal__overlay-exit:not(.smwb-fullscreen).smwb-darkBlured{background-color:#00000080;backdrop-filter:blur(5px)}}@media(min-width:800px){.smwb-modal__overlay-exit-active:not(.smwb-fullscreen).smwb-dark{background-color:transparent;transition:background-color .15s ease-in-out}.smwb-modal__overlay-exit-active:not(.smwb-fullscreen).smwb-blured{backdrop-filter:blur(0);transition:backdrop-filter .15s ease-in-out}.smwb-modal__overlay-exit-active:not(.smwb-fullscreen).smwb-darkBlured{background-color:transparent;backdrop-filter:blur(0);transition:backdrop-filter .15s ease-in-out,background-color .15s ease-in-out}}.smwb-modal__overlay-exit-active .smwb-modal.smwb-fade{opacity:0;transition:opacity .15s ease-in-out}.smwb-modal__overlay-exit-active .smwb-modal.smwb-scale{opacity:0;transform:scale(0);transition:opacity .15s ease-in-out,transform .15s ease-in-out}.smwb-modal__overlay-exit-active .smwb-modal.smwb-drop{opacity:0;transform:translateY(-100%);transition:opacity .15s ease-in-out,transform .15s ease-in-out}@media(max-width:800px){.smwb-modal.smwb-small,.smwb-modal.smwb-medium,.smwb-modal.smwb-large,.smwb-modal.smwb-fullscreen{width:100%;height:100%;max-height:none;border-radius:0}}@media(max-height:600px){.smwb-modal{min-height:250px;min-width:280px}}.smwb-scrollbar::-webkit-scrollbar-thumb{background-color:var(--smui-scrollThumbColor);border-radius:999px}.smwb-scrollbar::-webkit-scrollbar{width:6px;height:6px}.smwb-scrollbar::-webkit-scrollbar-track{background-color:transparent}

package/dist/assets/styles/less/components/overflowMenu/overflowMenu.entry.css

@@ -1 +1 @@
-.smwb-overflow-menu{display:inline-flex}.smwb-overflow-menu__item--danger{color:var(--smui-errorColor)}
+.smwb-overflow-menu{display:inline-flex}.smwb-overflow-menu__item--danger:not(.smwb-menu__item--disabled){color:var(--smui-errorColor)}

package/dist/assets/styles/less/components/table/table.entry.css

@@ -1 +1 @@
-.smwb-table{width:100%;white-space:nowrap;border-collapse:collapse;overflow:scroll}.smwb-table.smwb-hovered tbody tr:hover{background:var(--smui-onSurfaceHover);cursor:pointer}.smwb-table__error{margin-bottom:10px}.smwb-table__container{display:flex;overflow-x:auto;border:1px solid var(--smui-tableBorderColor);border-radius:4px;flex-direction:column}.smwb-table__container.smwb-withPagination{border-radius:4px 4px 0 0}.smwb-table__wrapper{display:flex;flex-direction:column;background-color:var(--smui-surfaceBackground)}.smwb-table__wrapper_loading{pointer-events:none}.smwb-table__cell{position:relative;-webkit-line-clamp:1;-webkit-box-orient:vertical;text-overflow:ellipsis;white-space:nowrap;padding:0 16px;height:52px;vertical-align:middle;overflow:hidden;word-wrap:break-word}.smwb-table__cell.smwb-head-cell{height:56px;text-align:left;font-weight:500}.smwb-table__cell.smwb-head-cell.smwb-sortable{cursor:pointer}.smwb-table__cell.smwb-head-cell .smwb-head-cell__content{align-items:center;display:inline-flex;vertical-align:middle;gap:5px;user-select:none}.smwb-table__cell.smwb-head-cell .smwb-head-cell__content input{font-weight:500}.smwb-table__cell.smwb-head-cell.smwb-align_left{text-align:left}.smwb-table__cell.smwb-head-cell.smwb-align_center{text-align:center}.smwb-table__cell.smwb-head-cell.smwb-align_right{text-align:right}.smwb-table__cell.smwb-head-cell .smwb-head-cell__icon{flex-shrink:0;display:none;transition:all .15s ease-in-out;fill:var(--smui-primaryTextColor)}.smwb-table__cell.smwb-head-cell.smwb-sorted_asc .smwb-head-cell__icon{display:inline-flex;transform:rotate(0)}.smwb-table__cell.smwb-head-cell.smwb-sorted_desc .smwb-head-cell__icon{display:inline-flex;transform:rotate(180deg)}.smwb-table__head .smwb-table__row{border-top:none}.smwb-table__row{border-top:1px solid var(--smui-tableBorderColor)}.smwb-table.smwb-dense .smwb-table__cell{padding:0 16px;height:36px;vertical-align:middle}.smwb-table.smwb-dense .smwb-table__cell.smwb-head-cell{height:40px}.smwb-table.smwb-dense .smwb-table__row{border-top:1px solid var(--smui-tableBorderColor)}.smwb-table__loader{width:100%;display:flex;align-items:center;justify-content:center;position:absolute;height:100%;top:50%;left:50%;transform:translate(-50%,-50%)}.smwb-table__loader__row{height:100px;position:relative}.smwb-scrollbar::-webkit-scrollbar-thumb{background-color:var(--smui-scrollThumbColor);border-radius:999px}.smwb-scrollbar::-webkit-scrollbar{width:6px;height:6px}.smwb-scrollbar::-webkit-scrollbar-track{background-color:transparent}.smwb-head-cell_sortable .smwb-head-cell__content{cursor:pointer;user-select:none;outline:none}.smwb-head-cell_sortable .smwb-head-cell__content:focus-visible{outline:2px solid var(--smui-primaryColor);outline-offset:2px}.smwb-table__row_selected{background-color:var(--smui-onSurfaceHover)}.smwb-table__caption{caption-side:top;text-align:left;padding:8px 12px;color:var(--smui-onSurfaceVariant)}.smwb-table_sticky-header{overflow:visible}.smwb-table__container:has(.smwb-table_sticky-header){overflow:visible}.smwb-table_sticky-header .smwb-table__head .smwb-table__cell{position:sticky;top:0;z-index:2;background-color:var(--smui-surfaceBackground)}
+.smwb-table{width:100%;white-space:nowrap;border-collapse:collapse;overflow:scroll}.smwb-table.smwb-hovered tbody tr:hover{background:var(--smui-onSurfaceHover);cursor:pointer}.smwb-table__error{margin-bottom:10px}.smwb-table__container{display:flex;overflow-x:auto;border:1px solid var(--smui-tableBorderColor);border-radius:4px;flex-direction:column}.smwb-table__container.smwb-withPagination{border-radius:4px 4px 0 0}.smwb-table__wrapper{display:flex;flex-direction:column;background-color:var(--smui-surfaceBackground)}.smwb-table__wrapper_loading{pointer-events:none}.smwb-table__cell{position:relative;-webkit-line-clamp:1;-webkit-box-orient:vertical;text-overflow:ellipsis;white-space:nowrap;padding:0 16px;height:52px;vertical-align:middle;overflow:hidden;word-wrap:break-word}.smwb-table__cell.smwb-head-cell{height:56px;text-align:left;font-weight:500}.smwb-table__cell.smwb-head-cell.smwb-sortable,.smwb-table__cell.smwb-head-cell.smwb-head-cell_sortable{cursor:pointer}.smwb-table__cell.smwb-head-cell .smwb-head-cell__content{align-items:center;display:inline-flex;vertical-align:middle;gap:5px;user-select:none}.smwb-table__cell.smwb-head-cell .smwb-head-cell__content input{font-weight:500}.smwb-table__cell.smwb-head-cell.smwb-align_left{text-align:left}.smwb-table__cell.smwb-head-cell.smwb-align_center{text-align:center}.smwb-table__cell.smwb-head-cell.smwb-align_right{text-align:right}.smwb-table__cell.smwb-head-cell .smwb-head-cell__icon{flex-shrink:0;transition:opacity .15s ease-in-out;opacity:.4}.smwb-table__cell.smwb-head-cell.smwb-head-cell_sorted .smwb-head-cell__icon,.smwb-table__cell.smwb-head-cell.smwb-head-cell_sortable:hover .smwb-head-cell__icon,.smwb-table__cell.smwb-head-cell .smwb-head-cell__content:focus-visible .smwb-head-cell__icon{opacity:1}.smwb-table__cell.smwb-head-cell.smwb-sorted_asc .smwb-head-cell__icon{opacity:1;transform:rotate(0)}.smwb-table__cell.smwb-head-cell.smwb-sorted_desc .smwb-head-cell__icon{opacity:1;transform:rotate(180deg)}.smwb-table__head .smwb-table__row{border-top:none}.smwb-table__row{border-top:1px solid var(--smui-tableBorderColor)}.smwb-table.smwb-dense .smwb-table__cell{padding:0 16px;height:36px;vertical-align:middle}.smwb-table.smwb-dense .smwb-table__cell.smwb-head-cell{height:40px}.smwb-table.smwb-dense .smwb-table__row{border-top:1px solid var(--smui-tableBorderColor)}.smwb-table__loader{width:100%;display:flex;align-items:center;justify-content:center;position:absolute;height:100%;top:50%;left:50%;transform:translate(-50%,-50%)}.smwb-table__loader__row{height:100px;position:relative}.smwb-scrollbar::-webkit-scrollbar-thumb{background-color:var(--smui-scrollThumbColor);border-radius:999px}.smwb-scrollbar::-webkit-scrollbar{width:6px;height:6px}.smwb-scrollbar::-webkit-scrollbar-track{background-color:transparent}.smwb-head-cell_sortable .smwb-head-cell__content{cursor:pointer;user-select:none;outline:none}.smwb-head-cell_sortable .smwb-head-cell__content:focus-visible{outline:2px solid var(--smui-primaryColor);outline-offset:2px}.smwb-table__row_selected{background-color:var(--smui-onSurfaceHover)}.smwb-table__caption{caption-side:top;text-align:left;padding:8px 12px;color:var(--smui-onSurfaceVariant)}.smwb-table_sticky-header{overflow:visible}.smwb-table__container:has(.smwb-table_sticky-header){overflow:visible}.smwb-table_sticky-header .smwb-table__head .smwb-table__cell{position:sticky;top:0;z-index:2;background-color:var(--smui-surfaceBackground)}

package/dist/components/dataDisplay/table/tableHeadCell.js

@@ -1,44 +1,53 @@
-import { use as v, spread as y, mergeProps as _, addEventListener as c, insert as a, createComponent as w, effect as S, setAttribute as d, template as h, delegateEvents as A } from "solid-js/web";
-import { mergeProps as D, splitProps as k } from "solid-js";
-import x from "clsx";
-import { mergeRefs as B } from "../../../primitives/mergeRefs.js";
-import { Icon as P } from "../../base/icon/icon.js";
-var $ = /* @__PURE__ */ h("<th><span class=smwb-head-cell__content>");
-function K(m) {
+import { use as _, spread as h, mergeProps as w, addEventListener as c, insert as i, createComponent as d, effect as y, setAttribute as m, template as S, delegateEvents as A } from "solid-js/web";
+import { mergeProps as D, splitProps as k, Show as x } from "solid-js";
+import B from "clsx";
+import { mergeRefs as P } from "../../../primitives/mergeRefs.js";
+import { Icon as $ } from "../../base/icon/icon.js";
+var C = /* @__PURE__ */ S("<th><span class=smwb-head-cell__content>");
+function L(b) {
   const f = D({
     cellAlign: "left"
-  }, m), [e, b] = k(f, ["children", "class", "cellAlign", "isSortedByAsc", "isSortedByDesc", "sortable", "sortDirection", "onSort", "ref"]), s = () => e.sortDirection !== void 0 ? e.sortDirection : e.isSortedByAsc ? "asc" : e.isSortedByDesc ? "desc" : !1, g = () => e.sortable ? s() === "asc" ? "ascending" : s() === "desc" ? "descending" : "none" : void 0, u = () => s() === "asc" ? "expand_more" : s() === "desc" ? "expand_less" : "", p = (t) => {
-    e.sortable && e.onSort && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), e.onSort());
+  }, b), [e, u] = k(f, ["children", "class", "cellAlign", "isSortedByAsc", "isSortedByDesc", "sortable", "sortDirection", "onSort", "ref"]), o = () => e.sortDirection !== void 0 ? e.sortDirection : e.isSortedByAsc ? "asc" : e.isSortedByDesc ? "desc" : !1, g = () => e.sortable ? o() === "asc" ? "ascending" : o() === "desc" ? "descending" : "none" : void 0, p = () => o() === "asc" ? "expand_more" : o() === "desc" ? "expand_less" : "unfold_more", v = (r) => {
+    e.sortable && e.onSort && (r.key === "Enter" || r.key === " ") && (r.preventDefault(), e.onSort());
   };
   return (() => {
-    var t = $(), r = t.firstChild, l = B(e.ref);
-    return typeof l == "function" && v(l, t), y(t, _(b, {
+    var r = C(), t = r.firstChild, l = P(e.ref);
+    return typeof l == "function" && _(l, r), h(r, w(u, {
       get "aria-sort"() {
         return g();
       },
       get class() {
-        return x("smwb-table__cell", "smwb-head-cell", e.class, {
+        return B("smwb-table__cell", "smwb-head-cell", e.class, {
           [`smwb-align_${e.cellAlign}`]: !!e.cellAlign,
-          "smwb-head-cell_sortable": e.sortable
+          "smwb-head-cell_sortable": e.sortable,
+          "smwb-head-cell_sorted": !!e.sortable && o() !== !1
         });
       }
-    }), !1, !0), c(r, "keydown", e.sortable ? p : void 0, !0), c(r, "click", e.sortable ? () => e.onSort?.() : void 0, !0), a(r, () => e.children, null), a(r, w(P, {
-      get name() {
-        return u();
+    }), !1, !0), c(t, "keydown", e.sortable ? v : void 0, !0), c(t, "click", e.sortable ? () => e.onSort?.() : void 0, !0), i(t, () => e.children, null), i(t, d(x, {
+      get when() {
+        return e.sortable;
       },
-      size: 18,
-      weight: 800
-    }), null), S((o) => {
-      var n = e.sortable ? "button" : void 0, i = e.sortable ? 0 : void 0;
-      return n !== o.e && d(r, "role", o.e = n), i !== o.t && d(r, "tabindex", o.t = i), o;
+      get children() {
+        return d($, {
+          class: "smwb-head-cell__icon",
+          get name() {
+            return p();
+          },
+          size: 18,
+          weight: 800
+        });
+      }
+    }), null), y((s) => {
+      var n = e.sortable ? "button" : void 0, a = e.sortable ? 0 : void 0;
+      return n !== s.e && m(t, "role", s.e = n), a !== s.t && m(t, "tabindex", s.t = a), s;
     }, {
       e: void 0,
       t: void 0
-    }), t;
+    }), r;
   })();
 }
 A(["click", "keydown"]);
 export {
-  K as TableHeadCell
+  L as TableHeadCell
 };
 //# sourceMappingURL=tableHeadCell.js.map

package/dist/components/dataDisplay/table/tableHeadCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"tableHeadCell.js","sources":["../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  const iconName = (): string => (direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"\");\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Icon name={iconName()} size={18} weight={800} />\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"names":["TableHeadCell","props","merged","mergeProps","cellAlign","local","rest","splitProps","direction","sortDirection","undefined","isSortedByAsc","isSortedByDesc","ariaSort","sortable","iconName","onKeyDown","event","onSort","key","preventDefault","_el$","_tmpl$","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$addEventListener","_$insert","children","_$createComponent","Icon","name","size","weight","_$effect","_p$","_v$","_v$2","e","_$setAttribute","t","_$delegateEvents"],"mappings":";;;;;;AAsBO,SAASA,EAAcC,GAAqD;AACjF,QAAMC,IAASC,EAAW;AAAA,IAAEC,WAAW;AAAA,EAAA,GAAmBH,CAAK,GACzD,CAACI,GAAOC,CAAI,IAAIC,EAAWL,GAAQ,CACvC,YACA,SACA,aACA,iBACA,kBACA,YACA,iBACA,UACA,KAAK,CACN,GAEKM,IAAYA,MAChBH,EAAMI,kBAAkBC,SAAYL,EAAMI,gBAAgBJ,EAAMM,gBAAgB,QAAQN,EAAMO,iBAAiB,SAAS,IAEpHC,IAAWA,MACfR,EAAMS,WAAYN,EAAAA,MAAgB,QAAQ,cAAcA,EAAAA,MAAgB,SAAS,eAAe,SAAUE,QAEtGK,IAAWA,MAAeP,EAAAA,MAAgB,QAAQ,gBAAgBA,EAAAA,MAAgB,SAAS,gBAAgB,IAE3GQ,IAA+DC,CAAAA,MAAU;AAC7E,IAAIZ,EAAMS,YAAYT,EAAMa,WAAWD,EAAME,QAAQ,WAAWF,EAAME,QAAQ,SAC5EF,EAAMG,eAAAA,GACNf,EAAMa,OAAAA;AAAAA,EAEV;AAEA,UAAA,MAAA;AAAA,QAAAG,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAGSC,EAAUrB,EAAMsB,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAJ,CAAA,GAAAQ,EAAAR,GAAAS,EADrBxB,GAAI;AAAA,MAAA,IAAA,cAAA;AAAA,eAEGO,EAAAA;AAAAA,MAAU;AAAA,MAAA,IAAA,QAAA;AAAA,eACdkB,EAAG,oBAAoB,kBAAkB1B,EAAM2B,OAAO;AAAA,UAC3D,CAAC,cAAc3B,EAAMD,SAAS,EAAE,GAAG,CAAC,CAACC,EAAMD;AAAAA,UAC3C,2BAA2BC,EAAMS;AAAAA,QAAAA,CAClC;AAAA,MAAC;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAmB,EAAAV,GAAA,WAKWlB,EAAMS,WAAWE,IAAYN,QAAS,EAAA,GAAAuB,EAAAV,GAAA,SADxClB,EAAMS,WAAW,MAAMT,EAAMa,SAAAA,IAAaR,QAAS,EAAA,GAAAwB,EAAAX,GAAA,MAK3DlB,EAAM8B,UAAQ,IAAA,GAAAD,EAAAX,GAAAa,EACdC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEvB,EAAAA;AAAAA,MAAU;AAAA,MAAEwB,MAAM;AAAA,MAAIC,QAAQ;AAAA,IAAA,CAAG,GAAA,IAAA,GAAAC,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IAJvCtC,EAAMS,WAAW,WAAWJ,QAASkC,IACjCvC,EAAMS,WAAW,IAAIJ;AAASiC,aAAAA,MAAAD,EAAAG,KAAAC,EAAAvB,GAAA,QAAAmB,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAK,KAAAD,EAAAvB,GAAA,YAAAmB,EAAAK,IAAAH,CAAA,GAAAF;AAAAA,IAAA,GAAA;AAAA,MAAAG,GAAAnC;AAAAA,MAAAqC,GAAArC;AAAAA,IAAAA,CAAA,GAAAW;AAAAA,EAAA,GAAA;AAOhD;AAE6B2B,EAAA,CAAA,SAAA,SAAA,CAAA;"}
+{"version":3,"file":"tableHeadCell.js","sources":["../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  /**\n   * A sortable column always shows a marker: the current direction once sorted,\n   * and `unfold_more` before that — otherwise nothing tells the reader the column\n   * can be sorted at all. A cell that is not sortable shows nothing; it used to\n   * render an `<Icon name=\"\">`, which reserved a gap and warned about a missing\n   * icon under `source: \"smwb\"`.\n   */\n  const iconName = (): string =>\n    direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"unfold_more\";\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n        \"smwb-head-cell_sorted\": !!local.sortable && direction() !== false,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Show when={local.sortable}>\n          <Icon class=\"smwb-head-cell__icon\" name={iconName()} size={18} weight={800} />\n        </Show>\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"names":["TableHeadCell","props","merged","mergeProps","cellAlign","local","rest","splitProps","direction","sortDirection","undefined","isSortedByAsc","isSortedByDesc","ariaSort","sortable","iconName","onKeyDown","event","onSort","key","preventDefault","_el$","_tmpl$","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$addEventListener","_$insert","children","_$createComponent","Show","when","Icon","name","size","weight","_$effect","_p$","_v$","_v$2","e","_$setAttribute","t","_$delegateEvents"],"mappings":";;;;;;AAsBO,SAASA,EAAcC,GAAqD;AACjF,QAAMC,IAASC,EAAW;AAAA,IAAEC,WAAW;AAAA,EAAA,GAAmBH,CAAK,GACzD,CAACI,GAAOC,CAAI,IAAIC,EAAWL,GAAQ,CACvC,YACA,SACA,aACA,iBACA,kBACA,YACA,iBACA,UACA,KAAK,CACN,GAEKM,IAAYA,MAChBH,EAAMI,kBAAkBC,SAAYL,EAAMI,gBAAgBJ,EAAMM,gBAAgB,QAAQN,EAAMO,iBAAiB,SAAS,IAEpHC,IAAWA,MACfR,EAAMS,WAAYN,EAAAA,MAAgB,QAAQ,cAAcA,EAAAA,MAAgB,SAAS,eAAe,SAAUE,QAStGK,IAAWA,MACfP,EAAAA,MAAgB,QAAQ,gBAAgBA,EAAAA,MAAgB,SAAS,gBAAgB,eAE7EQ,IAA+DC,CAAAA,MAAU;AAC7E,IAAIZ,EAAMS,YAAYT,EAAMa,WAAWD,EAAME,QAAQ,WAAWF,EAAME,QAAQ,SAC5EF,EAAMG,eAAAA,GACNf,EAAMa,OAAAA;AAAAA,EAEV;AAEA,UAAA,MAAA;AAAA,QAAAG,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAGSC,EAAUrB,EAAMsB,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAJ,CAAA,GAAAQ,EAAAR,GAAAS,EADrBxB,GAAI;AAAA,MAAA,IAAA,cAAA;AAAA,eAEGO,EAAAA;AAAAA,MAAU;AAAA,MAAA,IAAA,QAAA;AAAA,eACdkB,EAAG,oBAAoB,kBAAkB1B,EAAM2B,OAAO;AAAA,UAC3D,CAAC,cAAc3B,EAAMD,SAAS,EAAE,GAAG,CAAC,CAACC,EAAMD;AAAAA,UAC3C,2BAA2BC,EAAMS;AAAAA,UACjC,yBAAyB,CAAC,CAACT,EAAMS,YAAYN,QAAgB;AAAA,QAAA,CAC9D;AAAA,MAAC;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAyB,EAAAV,GAAA,WAKWlB,EAAMS,WAAWE,IAAYN,QAAS,EAAA,GAAAuB,EAAAV,GAAA,SADxClB,EAAMS,WAAW,MAAMT,EAAMa,SAAAA,IAAaR,QAAS,EAAA,GAAAwB,EAAAX,GAAA,MAK3DlB,EAAM8B,UAAQ,IAAA,GAAAD,EAAAX,GAAAa,EACdC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEjC,EAAMS;AAAAA,MAAQ;AAAA,MAAA,IAAAqB,WAAA;AAAA,eAAAC,EACvBG,GAAI;AAAA,UAAA,OAAA;AAAA,UAAA,IAA8BC,OAAI;AAAA,mBAAEzB,EAAAA;AAAAA,UAAU;AAAA,UAAE0B,MAAM;AAAA,UAAIC,QAAQ;AAAA,QAAA,CAAG;AAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAC,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IALtExC,EAAMS,WAAW,WAAWJ,QAASoC,IACjCzC,EAAMS,WAAW,IAAIJ;AAASmC,aAAAA,MAAAD,EAAAG,KAAAC,EAAAzB,GAAA,QAAAqB,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAK,KAAAD,EAAAzB,GAAA,YAAAqB,EAAAK,IAAAH,CAAA,GAAAF;AAAAA,IAAA,GAAA;AAAA,MAAAG,GAAArC;AAAAA,MAAAuC,GAAAvC;AAAAA,IAAAA,CAAA,GAAAW;AAAAA,EAAA,GAAA;AAShD;AAE6B6B,EAAA,CAAA,SAAA,SAAA,CAAA;"}

package/dist/components/feedBack/confirmDialog/confirmDialog.js

@@ -13,7 +13,7 @@ function z(u) {
       return e.open;
     },
     onClose: () => e.onCancel(),
-    size: "small",
+    size: "medium",
     role: "alertdialog",
     backdrop: "dark",
     get closeOnEsc() {

package/dist/components/feedBack/confirmDialog/confirmDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"confirmDialog.js","sources":["../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"small\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"names":["ConfirmDialog","props","local","splitProps","subjectId","createUniqueId","messageId","_$createComponent","Modal","_$mergeProps","open","onClose","onCancel","size","role","backdrop","closeOnEsc","busy","closeOnOutsideClick","title","ariaDescribed","ids","subject","message","filter","Boolean","join","children","Header","Content","_el$","_tmpl$","_$insert","Show","when","Typography","id","variant","color","component","_$effect","_$className","cn","class","Footer","Button","disabled","onClick","label","cancelLabel","danger","onConfirm","confirmLabel"],"mappings":"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"}
+{"version":3,"file":"confirmDialog.js","sources":["../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"medium\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"names":["ConfirmDialog","props","local","splitProps","subjectId","createUniqueId","messageId","_$createComponent","Modal","_$mergeProps","open","onClose","onCancel","size","role","backdrop","closeOnEsc","busy","closeOnOutsideClick","title","ariaDescribed","ids","subject","message","filter","Boolean","join","children","Header","Content","_el$","_tmpl$","_$insert","Show","when","Typography","id","variant","color","component","_$effect","_$className","cn","class","Footer","Button","disabled","onClick","label","cancelLabel","danger","onConfirm","confirmLabel"],"mappings":"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"}

package/dist/components/feedBack/saveAssetDialog/saveAssetDialog.js

@@ -1,11 +1,11 @@
-import { createComponent as r, insert as l, effect as s, setAttribute as g, className as p, template as u } from "solid-js/web";
+import { createComponent as r, insert as l, effect as u, setAttribute as g, className as p, template as s } from "solid-js/web";
 import '../../../assets/styles/less/components/saveAssetDialog/saveAssetDialog.entry.css';/* empty css                                                                         */
 import { splitProps as b, Show as o } from "solid-js";
 import v from "clsx";
 import { Modal as a } from "../modal/modal.js";
 import { TextField as C } from "../../inputs/textField/textField.js";
 import { Button as i } from "../../inputs/button/button.js";
-var h = /* @__PURE__ */ u("<div class=smwb-save-asset-dialog__preview><img alt>"), f = /* @__PURE__ */ u("<div>");
+var h = /* @__PURE__ */ s("<div class=smwb-save-asset-dialog__preview><img alt>"), f = /* @__PURE__ */ s("<div>");
 function k(c) {
   const [e] = b(c, ["open", "title", "nameLabel", "name", "onNameChange", "previewSrc", "onCapture", "captureLabel", "busy", "confirmLabel", "cancelLabel", "onConfirm", "onClose", "children", "class"]), m = () => e.onNameChange !== void 0 || e.name !== void 0;
   return r(a, {
@@ -15,7 +15,7 @@ function k(c) {
     get onClose() {
       return e.onClose;
     },
-    size: "small",
+    size: "medium",
     get children() {
       return [r(a.Header, {
         get children() {
@@ -36,6 +36,7 @@ function k(c) {
                 get value() {
                   return e.name ?? "";
                 },
+                fullWidth: !0,
                 get disabled() {
                   return !!e.busy;
                 },
@@ -48,7 +49,7 @@ function k(c) {
             },
             get children() {
               var n = h(), d = n.firstChild;
-              return s(() => g(d, "src", e.previewSrc)), n;
+              return u(() => g(d, "src", e.previewSrc)), n;
             }
           }), null), l(t, r(o, {
             get when() {
@@ -67,7 +68,7 @@ function k(c) {
                 }
               });
             }
-          }), null), l(t, () => e.children, null), s(() => p(t, v("smwb-save-asset-dialog__body", e.class))), t;
+          }), null), l(t, () => e.children, null), u(() => p(t, v("smwb-save-asset-dialog__body", e.class))), t;
         }
       }), r(a.Footer, {
         get children() {

package/dist/components/feedBack/saveAssetDialog/saveAssetDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"saveAssetDialog.js","sources":["../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"small\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"names":["SaveAssetDialog","props","local","splitProps","showNameField","onNameChange","undefined","name","_$createComponent","Modal","open","onClose","size","children","Header","title","Content","_el$","_tmpl$2","_$insert","Show","when","TextField","label","nameLabel","value","disabled","busy","onChange","event","currentTarget","previewSrc","_el$2","_tmpl$","_el$3","firstChild","_$effect","_$setAttribute","onCapture","Button","variant","onClick","captureLabel","_$className","cn","class","Footer","cancelLabel","onConfirm","confirmLabel"],"mappings":"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"}
+{"version":3,"file":"saveAssetDialog.js","sources":["../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"medium\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              fullWidth\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"names":["SaveAssetDialog","props","local","splitProps","showNameField","onNameChange","undefined","name","_$createComponent","Modal","open","onClose","size","children","Header","title","Content","_el$","_tmpl$2","_$insert","Show","when","TextField","label","nameLabel","value","fullWidth","disabled","busy","onChange","event","currentTarget","previewSrc","_el$2","_tmpl$","_el$3","firstChild","_$effect","_$setAttribute","onCapture","Button","variant","onClick","captureLabel","_$className","cn","class","Footer","cancelLabel","onConfirm","confirmLabel"],"mappings":"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"}

package/dist/headless/components/dataDisplay/table/tableHeadCell.js

@@ -1,44 +1,53 @@
-import { use as v, spread as y, mergeProps as _, addEventListener as c, insert as a, createComponent as w, effect as S, setAttribute as d, template as h, delegateEvents as A } from "solid-js/web";
-import { mergeProps as D, splitProps as k } from "solid-js";
-import x from "clsx";
-import { mergeRefs as B } from "../../../primitives/mergeRefs.js";
-import { Icon as P } from "../../base/icon/icon.js";
-var $ = /* @__PURE__ */ h("<th><span class=smwb-head-cell__content>");
-function K(m) {
+import { use as _, spread as h, mergeProps as w, addEventListener as c, insert as i, createComponent as d, effect as y, setAttribute as m, template as S, delegateEvents as A } from "solid-js/web";
+import { mergeProps as D, splitProps as k, Show as x } from "solid-js";
+import B from "clsx";
+import { mergeRefs as P } from "../../../primitives/mergeRefs.js";
+import { Icon as $ } from "../../base/icon/icon.js";
+var C = /* @__PURE__ */ S("<th><span class=smwb-head-cell__content>");
+function L(b) {
   const f = D({
     cellAlign: "left"
-  }, m), [e, b] = k(f, ["children", "class", "cellAlign", "isSortedByAsc", "isSortedByDesc", "sortable", "sortDirection", "onSort", "ref"]), s = () => e.sortDirection !== void 0 ? e.sortDirection : e.isSortedByAsc ? "asc" : e.isSortedByDesc ? "desc" : !1, g = () => e.sortable ? s() === "asc" ? "ascending" : s() === "desc" ? "descending" : "none" : void 0, u = () => s() === "asc" ? "expand_more" : s() === "desc" ? "expand_less" : "", p = (t) => {
-    e.sortable && e.onSort && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), e.onSort());
+  }, b), [e, u] = k(f, ["children", "class", "cellAlign", "isSortedByAsc", "isSortedByDesc", "sortable", "sortDirection", "onSort", "ref"]), o = () => e.sortDirection !== void 0 ? e.sortDirection : e.isSortedByAsc ? "asc" : e.isSortedByDesc ? "desc" : !1, g = () => e.sortable ? o() === "asc" ? "ascending" : o() === "desc" ? "descending" : "none" : void 0, p = () => o() === "asc" ? "expand_more" : o() === "desc" ? "expand_less" : "unfold_more", v = (r) => {
+    e.sortable && e.onSort && (r.key === "Enter" || r.key === " ") && (r.preventDefault(), e.onSort());
   };
   return (() => {
-    var t = $(), r = t.firstChild, l = B(e.ref);
-    return typeof l == "function" && v(l, t), y(t, _(b, {
+    var r = C(), t = r.firstChild, l = P(e.ref);
+    return typeof l == "function" && _(l, r), h(r, w(u, {
       get "aria-sort"() {
         return g();
       },
       get class() {
-        return x("smwb-table__cell", "smwb-head-cell", e.class, {
+        return B("smwb-table__cell", "smwb-head-cell", e.class, {
           [`smwb-align_${e.cellAlign}`]: !!e.cellAlign,
-          "smwb-head-cell_sortable": e.sortable
+          "smwb-head-cell_sortable": e.sortable,
+          "smwb-head-cell_sorted": !!e.sortable && o() !== !1
         });
       }
-    }), !1, !0), c(r, "keydown", e.sortable ? p : void 0, !0), c(r, "click", e.sortable ? () => e.onSort?.() : void 0, !0), a(r, () => e.children, null), a(r, w(P, {
-      get name() {
-        return u();
+    }), !1, !0), c(t, "keydown", e.sortable ? v : void 0, !0), c(t, "click", e.sortable ? () => e.onSort?.() : void 0, !0), i(t, () => e.children, null), i(t, d(x, {
+      get when() {
+        return e.sortable;
       },
-      size: 18,
-      weight: 800
-    }), null), S((o) => {
-      var n = e.sortable ? "button" : void 0, i = e.sortable ? 0 : void 0;
-      return n !== o.e && d(r, "role", o.e = n), i !== o.t && d(r, "tabindex", o.t = i), o;
+      get children() {
+        return d($, {
+          class: "smwb-head-cell__icon",
+          get name() {
+            return p();
+          },
+          size: 18,
+          weight: 800
+        });
+      }
+    }), null), y((s) => {
+      var n = e.sortable ? "button" : void 0, a = e.sortable ? 0 : void 0;
+      return n !== s.e && m(t, "role", s.e = n), a !== s.t && m(t, "tabindex", s.t = a), s;
     }, {
       e: void 0,
       t: void 0
-    }), t;
+    }), r;
   })();
 }
 A(["click", "keydown"]);
 export {
-  K as TableHeadCell
+  L as TableHeadCell
 };
 //# sourceMappingURL=tableHeadCell.js.map

package/dist/headless/components/dataDisplay/table/tableHeadCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"tableHeadCell.js","sources":["../../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  const iconName = (): string => (direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"\");\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Icon name={iconName()} size={18} weight={800} />\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"names":["TableHeadCell","props","merged","mergeProps","cellAlign","local","rest","splitProps","direction","sortDirection","undefined","isSortedByAsc","isSortedByDesc","ariaSort","sortable","iconName","onKeyDown","event","onSort","key","preventDefault","_el$","_tmpl$","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$addEventListener","_$insert","children","_$createComponent","Icon","name","size","weight","_$effect","_p$","_v$","_v$2","e","_$setAttribute","t","_$delegateEvents"],"mappings":";;;;;;AAsBO,SAASA,EAAcC,GAAqD;AACjF,QAAMC,IAASC,EAAW;AAAA,IAAEC,WAAW;AAAA,EAAA,GAAmBH,CAAK,GACzD,CAACI,GAAOC,CAAI,IAAIC,EAAWL,GAAQ,CACvC,YACA,SACA,aACA,iBACA,kBACA,YACA,iBACA,UACA,KAAK,CACN,GAEKM,IAAYA,MAChBH,EAAMI,kBAAkBC,SAAYL,EAAMI,gBAAgBJ,EAAMM,gBAAgB,QAAQN,EAAMO,iBAAiB,SAAS,IAEpHC,IAAWA,MACfR,EAAMS,WAAYN,EAAAA,MAAgB,QAAQ,cAAcA,EAAAA,MAAgB,SAAS,eAAe,SAAUE,QAEtGK,IAAWA,MAAeP,EAAAA,MAAgB,QAAQ,gBAAgBA,EAAAA,MAAgB,SAAS,gBAAgB,IAE3GQ,IAA+DC,CAAAA,MAAU;AAC7E,IAAIZ,EAAMS,YAAYT,EAAMa,WAAWD,EAAME,QAAQ,WAAWF,EAAME,QAAQ,SAC5EF,EAAMG,eAAAA,GACNf,EAAMa,OAAAA;AAAAA,EAEV;AAEA,UAAA,MAAA;AAAA,QAAAG,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAGSC,EAAUrB,EAAMsB,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAJ,CAAA,GAAAQ,EAAAR,GAAAS,EADrBxB,GAAI;AAAA,MAAA,IAAA,cAAA;AAAA,eAEGO,EAAAA;AAAAA,MAAU;AAAA,MAAA,IAAA,QAAA;AAAA,eACdkB,EAAG,oBAAoB,kBAAkB1B,EAAM2B,OAAO;AAAA,UAC3D,CAAC,cAAc3B,EAAMD,SAAS,EAAE,GAAG,CAAC,CAACC,EAAMD;AAAAA,UAC3C,2BAA2BC,EAAMS;AAAAA,QAAAA,CAClC;AAAA,MAAC;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAmB,EAAAV,GAAA,WAKWlB,EAAMS,WAAWE,IAAYN,QAAS,EAAA,GAAAuB,EAAAV,GAAA,SADxClB,EAAMS,WAAW,MAAMT,EAAMa,SAAAA,IAAaR,QAAS,EAAA,GAAAwB,EAAAX,GAAA,MAK3DlB,EAAM8B,UAAQ,IAAA,GAAAD,EAAAX,GAAAa,EACdC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEvB,EAAAA;AAAAA,MAAU;AAAA,MAAEwB,MAAM;AAAA,MAAIC,QAAQ;AAAA,IAAA,CAAG,GAAA,IAAA,GAAAC,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IAJvCtC,EAAMS,WAAW,WAAWJ,QAASkC,IACjCvC,EAAMS,WAAW,IAAIJ;AAASiC,aAAAA,MAAAD,EAAAG,KAAAC,EAAAvB,GAAA,QAAAmB,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAK,KAAAD,EAAAvB,GAAA,YAAAmB,EAAAK,IAAAH,CAAA,GAAAF;AAAAA,IAAA,GAAA;AAAA,MAAAG,GAAAnC;AAAAA,MAAAqC,GAAArC;AAAAA,IAAAA,CAAA,GAAAW;AAAAA,EAAA,GAAA;AAOhD;AAE6B2B,EAAA,CAAA,SAAA,SAAA,CAAA;"}
+{"version":3,"file":"tableHeadCell.js","sources":["../../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  /**\n   * A sortable column always shows a marker: the current direction once sorted,\n   * and `unfold_more` before that — otherwise nothing tells the reader the column\n   * can be sorted at all. A cell that is not sortable shows nothing; it used to\n   * render an `<Icon name=\"\">`, which reserved a gap and warned about a missing\n   * icon under `source: \"smwb\"`.\n   */\n  const iconName = (): string =>\n    direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"unfold_more\";\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n        \"smwb-head-cell_sorted\": !!local.sortable && direction() !== false,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Show when={local.sortable}>\n          <Icon class=\"smwb-head-cell__icon\" name={iconName()} size={18} weight={800} />\n        </Show>\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"names":["TableHeadCell","props","merged","mergeProps","cellAlign","local","rest","splitProps","direction","sortDirection","undefined","isSortedByAsc","isSortedByDesc","ariaSort","sortable","iconName","onKeyDown","event","onSort","key","preventDefault","_el$","_tmpl$","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$addEventListener","_$insert","children","_$createComponent","Show","when","Icon","name","size","weight","_$effect","_p$","_v$","_v$2","e","_$setAttribute","t","_$delegateEvents"],"mappings":";;;;;;AAsBO,SAASA,EAAcC,GAAqD;AACjF,QAAMC,IAASC,EAAW;AAAA,IAAEC,WAAW;AAAA,EAAA,GAAmBH,CAAK,GACzD,CAACI,GAAOC,CAAI,IAAIC,EAAWL,GAAQ,CACvC,YACA,SACA,aACA,iBACA,kBACA,YACA,iBACA,UACA,KAAK,CACN,GAEKM,IAAYA,MAChBH,EAAMI,kBAAkBC,SAAYL,EAAMI,gBAAgBJ,EAAMM,gBAAgB,QAAQN,EAAMO,iBAAiB,SAAS,IAEpHC,IAAWA,MACfR,EAAMS,WAAYN,EAAAA,MAAgB,QAAQ,cAAcA,EAAAA,MAAgB,SAAS,eAAe,SAAUE,QAStGK,IAAWA,MACfP,EAAAA,MAAgB,QAAQ,gBAAgBA,EAAAA,MAAgB,SAAS,gBAAgB,eAE7EQ,IAA+DC,CAAAA,MAAU;AAC7E,IAAIZ,EAAMS,YAAYT,EAAMa,WAAWD,EAAME,QAAQ,WAAWF,EAAME,QAAQ,SAC5EF,EAAMG,eAAAA,GACNf,EAAMa,OAAAA;AAAAA,EAEV;AAEA,UAAA,MAAA;AAAA,QAAAG,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAGSC,EAAUrB,EAAMsB,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAJ,CAAA,GAAAQ,EAAAR,GAAAS,EADrBxB,GAAI;AAAA,MAAA,IAAA,cAAA;AAAA,eAEGO,EAAAA;AAAAA,MAAU;AAAA,MAAA,IAAA,QAAA;AAAA,eACdkB,EAAG,oBAAoB,kBAAkB1B,EAAM2B,OAAO;AAAA,UAC3D,CAAC,cAAc3B,EAAMD,SAAS,EAAE,GAAG,CAAC,CAACC,EAAMD;AAAAA,UAC3C,2BAA2BC,EAAMS;AAAAA,UACjC,yBAAyB,CAAC,CAACT,EAAMS,YAAYN,QAAgB;AAAA,QAAA,CAC9D;AAAA,MAAC;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAyB,EAAAV,GAAA,WAKWlB,EAAMS,WAAWE,IAAYN,QAAS,EAAA,GAAAuB,EAAAV,GAAA,SADxClB,EAAMS,WAAW,MAAMT,EAAMa,SAAAA,IAAaR,QAAS,EAAA,GAAAwB,EAAAX,GAAA,MAK3DlB,EAAM8B,UAAQ,IAAA,GAAAD,EAAAX,GAAAa,EACdC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEjC,EAAMS;AAAAA,MAAQ;AAAA,MAAA,IAAAqB,WAAA;AAAA,eAAAC,EACvBG,GAAI;AAAA,UAAA,OAAA;AAAA,UAAA,IAA8BC,OAAI;AAAA,mBAAEzB,EAAAA;AAAAA,UAAU;AAAA,UAAE0B,MAAM;AAAA,UAAIC,QAAQ;AAAA,QAAA,CAAG;AAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAC,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IALtExC,EAAMS,WAAW,WAAWJ,QAASoC,IACjCzC,EAAMS,WAAW,IAAIJ;AAASmC,aAAAA,MAAAD,EAAAG,KAAAC,EAAAzB,GAAA,QAAAqB,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAK,KAAAD,EAAAzB,GAAA,YAAAqB,EAAAK,IAAAH,CAAA,GAAAF;AAAAA,IAAA,GAAA;AAAA,MAAAG,GAAArC;AAAAA,MAAAuC,GAAAvC;AAAAA,IAAAA,CAAA,GAAAW;AAAAA,EAAA,GAAA;AAShD;AAE6B6B,EAAA,CAAA,SAAA,SAAA,CAAA;"}

package/dist/headless/components/feedBack/confirmDialog/confirmDialog.js

@@ -12,7 +12,7 @@ function _(d) {
       return e.open;
     },
     onClose: () => e.onCancel(),
-    size: "small",
+    size: "medium",
     role: "alertdialog",
     backdrop: "dark",
     get closeOnEsc() {

package/dist/headless/components/feedBack/confirmDialog/confirmDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"confirmDialog.js","sources":["../../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"small\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"names":["ConfirmDialog","props","local","splitProps","subjectId","createUniqueId","messageId","_$createComponent","Modal","_$mergeProps","open","onClose","onCancel","size","role","backdrop","closeOnEsc","busy","closeOnOutsideClick","title","ariaDescribed","ids","subject","message","filter","Boolean","join","children","Header","Content","_el$","_tmpl$","_$insert","Show","when","Typography","id","variant","color","component","_$effect","_$className","cn","class","Footer","Button","disabled","onClick","label","cancelLabel","danger","onConfirm","confirmLabel"],"mappings":"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"}
+{"version":3,"file":"confirmDialog.js","sources":["../../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"medium\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"names":["ConfirmDialog","props","local","splitProps","subjectId","createUniqueId","messageId","_$createComponent","Modal","_$mergeProps","open","onClose","onCancel","size","role","backdrop","closeOnEsc","busy","closeOnOutsideClick","title","ariaDescribed","ids","subject","message","filter","Boolean","join","children","Header","Content","_el$","_tmpl$","_$insert","Show","when","Typography","id","variant","color","component","_$effect","_$className","cn","class","Footer","Button","disabled","onClick","label","cancelLabel","danger","onConfirm","confirmLabel"],"mappings":"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"}

package/dist/headless/components/feedBack/saveAssetDialog/saveAssetDialog.js

@@ -1,10 +1,10 @@
-import { createComponent as r, insert as l, effect as s, setAttribute as g, className as p, template as u } from "solid-js/web";
+import { createComponent as r, insert as l, effect as u, setAttribute as g, className as p, template as s } from "solid-js/web";
 import { splitProps as b, Show as o } from "solid-js";
 import v from "clsx";
 import { Modal as a } from "../modal/modal.js";
 import { TextField as C } from "../../inputs/textField/textField.js";
 import { Button as i } from "../../inputs/button/button.js";
-var h = /* @__PURE__ */ u("<div class=smwb-save-asset-dialog__preview><img alt>"), f = /* @__PURE__ */ u("<div>");
+var h = /* @__PURE__ */ s("<div class=smwb-save-asset-dialog__preview><img alt>"), f = /* @__PURE__ */ s("<div>");
 function $(c) {
   const [e] = b(c, ["open", "title", "nameLabel", "name", "onNameChange", "previewSrc", "onCapture", "captureLabel", "busy", "confirmLabel", "cancelLabel", "onConfirm", "onClose", "children", "class"]), m = () => e.onNameChange !== void 0 || e.name !== void 0;
   return r(a, {
@@ -14,7 +14,7 @@ function $(c) {
     get onClose() {
       return e.onClose;
     },
-    size: "small",
+    size: "medium",
     get children() {
       return [r(a.Header, {
         get children() {
@@ -35,6 +35,7 @@ function $(c) {
                 get value() {
                   return e.name ?? "";
                 },
+                fullWidth: !0,
                 get disabled() {
                   return !!e.busy;
                 },
@@ -47,7 +48,7 @@ function $(c) {
             },
             get children() {
               var n = h(), d = n.firstChild;
-              return s(() => g(d, "src", e.previewSrc)), n;
+              return u(() => g(d, "src", e.previewSrc)), n;
             }
           }), null), l(t, r(o, {
             get when() {
@@ -66,7 +67,7 @@ function $(c) {
                 }
               });
             }
-          }), null), l(t, () => e.children, null), s(() => p(t, v("smwb-save-asset-dialog__body", e.class))), t;
+          }), null), l(t, () => e.children, null), u(() => p(t, v("smwb-save-asset-dialog__body", e.class))), t;
         }
       }), r(a.Footer, {
         get children() {

package/dist/headless/components/feedBack/saveAssetDialog/saveAssetDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"saveAssetDialog.js","sources":["../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"small\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"names":["SaveAssetDialog","props","local","splitProps","showNameField","onNameChange","undefined","name","_$createComponent","Modal","open","onClose","size","children","Header","title","Content","_el$","_tmpl$2","_$insert","Show","when","TextField","label","nameLabel","value","disabled","busy","onChange","event","currentTarget","previewSrc","_el$2","_tmpl$","_el$3","firstChild","_$effect","_$setAttribute","onCapture","Button","variant","onClick","captureLabel","_$className","cn","class","Footer","cancelLabel","onConfirm","confirmLabel"],"mappings":"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"}
+{"version":3,"file":"saveAssetDialog.js","sources":["../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"medium\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              fullWidth\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"names":["SaveAssetDialog","props","local","splitProps","showNameField","onNameChange","undefined","name","_$createComponent","Modal","open","onClose","size","children","Header","title","Content","_el$","_tmpl$2","_$insert","Show","when","TextField","label","nameLabel","value","fullWidth","disabled","busy","onChange","event","currentTarget","previewSrc","_el$2","_tmpl$","_el$3","firstChild","_$effect","_$setAttribute","onCapture","Button","variant","onClick","captureLabel","_$className","cn","class","Footer","cancelLabel","onConfirm","confirmLabel"],"mappings":"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"}

package/dist/headless/source/components/dataDisplay/table/tableHeadCell.jsx

@@ -1,4 +1,4 @@
-import { mergeProps, splitProps } from "solid-js";
+import { Show, mergeProps, splitProps } from "solid-js";
 import cn from "clsx";
 import { Icon } from "../../base/icon";
 import { mergeRefs } from "../../../primitives/mergeRefs";
@@ -17,7 +17,7 @@ function TableHeadCell(props) {
   ]);
   const direction = () => local.sortDirection !== void 0 ? local.sortDirection : local.isSortedByAsc ? "asc" : local.isSortedByDesc ? "desc" : false;
   const ariaSort = () => local.sortable ? direction() === "asc" ? "ascending" : direction() === "desc" ? "descending" : "none" : void 0;
-  const iconName = () => direction() === "asc" ? "expand_more" : direction() === "desc" ? "expand_less" : "";
+  const iconName = () => direction() === "asc" ? "expand_more" : direction() === "desc" ? "expand_less" : "unfold_more";
   const onKeyDown = (event) => {
     if (local.sortable && local.onSort && (event.key === "Enter" || event.key === " ")) {
       event.preventDefault();
@@ -30,7 +30,8 @@ function TableHeadCell(props) {
     aria-sort={ariaSort()}
     class={cn("smwb-table__cell", "smwb-head-cell", local.class, {
       [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,
-      "smwb-head-cell_sortable": local.sortable
+      "smwb-head-cell_sortable": local.sortable,
+      "smwb-head-cell_sorted": !!local.sortable && direction() !== false
     })}
   >
       <span
@@ -41,7 +42,9 @@ function TableHeadCell(props) {
     tabindex={local.sortable ? 0 : void 0}
   >
         {local.children}
-        <Icon name={iconName()} size={18} weight={800} />
+        <Show when={local.sortable}>
+          <Icon class="smwb-head-cell__icon" name={iconName()} size={18} weight={800} />
+        </Show>
       </span>
     </th>;
 }

package/dist/headless/source/components/dataDisplay/table/tableHeadCell.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  const iconName = (): string => (direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"\");\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Icon name={iconName()} size={18} weight={800} />\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"mappings":"AAAA,SAAqC,YAAY,kBAAkB;AACnE,OAAO,QAAQ;AACf,SAAS,YAAY;AACrB,SAAS,iBAA2B;AAmB7B,SAAS,cAAc,OAAqD;AACjF,QAAM,SAAS,WAAW,EAAE,WAAW,OAAgB,GAAG,KAAK;AAC/D,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,YAAY,MAChB,MAAM,kBAAkB,SAAY,MAAM,gBAAgB,MAAM,gBAAgB,QAAQ,MAAM,iBAAiB,SAAS;AAE1H,QAAM,WAAW,MACf,MAAM,WAAY,UAAU,MAAM,QAAQ,cAAc,UAAU,MAAM,SAAS,eAAe,SAAU;AAE5G,QAAM,WAAW,MAAe,UAAU,MAAM,QAAQ,gBAAgB,UAAU,MAAM,SAAS,gBAAgB;AAEjH,QAAM,YAA8D,CAAC,UAAU;AAC7E,QAAI,MAAM,YAAY,MAAM,WAAW,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;AAClF,YAAM,eAAe;AACrB,YAAM,OAAO;AAAA,IACf;AAAA,EACF;AAEA,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,WAAW,SAAS;AAAA,IACpB,OAAO,GAAG,oBAAoB,kBAAkB,MAAM,OAAO;AAAA,MAC3D,CAAC,cAAc,MAAM,SAAS,EAAE,GAAG,CAAC,CAAC,MAAM;AAAA,MAC3C,2BAA2B,MAAM;AAAA,IACnC,CAAC;AAAA,GACF;AAAA,MACC,CAAC;AAAA,IACC,MAAM;AAAA,IACN,SAAS,MAAM,WAAW,MAAM,MAAM,SAAS,IAAI;AAAA,IACnD,WAAW,MAAM,WAAW,YAAY;AAAA,IACxC,MAAM,MAAM,WAAW,WAAW;AAAA,IAClC,UAAU,MAAM,WAAW,IAAI;AAAA,GAChC;AAAA,SACE,MAAM,SAAS;AAAA,QAChB,CAAC,KAAK,MAAM,SAAS,GAAG,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,MACnD,EATC,KASM;AAAA,IACT,EAnBC;AAqBL;AAEA,IAAO,wBAAQ;","names":[],"file":"tableHeadCell.jsx"}
+{"version":3,"sources":["../../../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  /**\n   * A sortable column always shows a marker: the current direction once sorted,\n   * and `unfold_more` before that — otherwise nothing tells the reader the column\n   * can be sorted at all. A cell that is not sortable shows nothing; it used to\n   * render an `<Icon name=\"\">`, which reserved a gap and warned about a missing\n   * icon under `source: \"smwb\"`.\n   */\n  const iconName = (): string =>\n    direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"unfold_more\";\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n        \"smwb-head-cell_sorted\": !!local.sortable && direction() !== false,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Show when={local.sortable}>\n          <Icon class=\"smwb-head-cell__icon\" name={iconName()} size={18} weight={800} />\n        </Show>\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"mappings":"AAAA,SAAqC,MAAM,YAAY,kBAAkB;AACzE,OAAO,QAAQ;AACf,SAAS,YAAY;AACrB,SAAS,iBAA2B;AAmB7B,SAAS,cAAc,OAAqD;AACjF,QAAM,SAAS,WAAW,EAAE,WAAW,OAAgB,GAAG,KAAK;AAC/D,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,YAAY,MAChB,MAAM,kBAAkB,SAAY,MAAM,gBAAgB,MAAM,gBAAgB,QAAQ,MAAM,iBAAiB,SAAS;AAE1H,QAAM,WAAW,MACf,MAAM,WAAY,UAAU,MAAM,QAAQ,cAAc,UAAU,MAAM,SAAS,eAAe,SAAU;AAS5G,QAAM,WAAW,MACf,UAAU,MAAM,QAAQ,gBAAgB,UAAU,MAAM,SAAS,gBAAgB;AAEnF,QAAM,YAA8D,CAAC,UAAU;AAC7E,QAAI,MAAM,YAAY,MAAM,WAAW,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;AAClF,YAAM,eAAe;AACrB,YAAM,OAAO;AAAA,IACf;AAAA,EACF;AAEA,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,WAAW,SAAS;AAAA,IACpB,OAAO,GAAG,oBAAoB,kBAAkB,MAAM,OAAO;AAAA,MAC3D,CAAC,cAAc,MAAM,SAAS,EAAE,GAAG,CAAC,CAAC,MAAM;AAAA,MAC3C,2BAA2B,MAAM;AAAA,MACjC,yBAAyB,CAAC,CAAC,MAAM,YAAY,UAAU,MAAM;AAAA,IAC/D,CAAC;AAAA,GACF;AAAA,MACC,CAAC;AAAA,IACC,MAAM;AAAA,IACN,SAAS,MAAM,WAAW,MAAM,MAAM,SAAS,IAAI;AAAA,IACnD,WAAW,MAAM,WAAW,YAAY;AAAA,IACxC,MAAM,MAAM,WAAW,WAAW;AAAA,IAClC,UAAU,MAAM,WAAW,IAAI;AAAA,GAChC;AAAA,SACE,MAAM,SAAS;AAAA,QAChB,CAAC,KAAK,MAAM,MAAM,UAAU;AAAA,UAC1B,CAAC,KAAK,MAAM,uBAAuB,MAAM,SAAS,GAAG,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,QAChF,EAFC,KAEM;AAAA,MACT,EAXC,KAWM;AAAA,IACT,EAtBC;AAwBL;AAEA,IAAO,wBAAQ;","names":[],"file":"tableHeadCell.jsx"}

package/dist/headless/source/components/feedBack/confirmDialog/confirmDialog.jsx

@@ -26,7 +26,7 @@ function ConfirmDialog(props) {
   return <Modal
     open={local.open}
     onClose={() => local.onCancel()}
-    size="small"
+    size="medium"
     role="alertdialog"
     backdrop="dark"
     closeOnEsc={!local.busy}

package/dist/headless/source/components/feedBack/confirmDialog/confirmDialog.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"small\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"mappings":"AAAA,SAAmB,MAAM,YAAY,sBAAsB;AAC3D,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AA2BpB,SAAS,cAAc,OAAwC;AACpE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,YAAY,eAAe;AACjC,QAAM,YAAY,eAAe;AAGjC,QAAM,gBAAgB,MAAuC;AAC3D,UAAM,MAAM,CAAC,MAAM,UAAU,YAAY,IAAI,MAAM,UAAU,YAAY,EAAE,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACrG,WAAO,MAAM,EAAE,oBAAoB,IAAI,IAAI,CAAC;AAAA,EAC9C;AAEA,SACE,CAAC;AAAA,IACC,MAAM,MAAM;AAAA,IACZ,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,KAAK;AAAA,IACL,KAAK;AAAA,IACL,SAAS;AAAA,IACT,YAAY,CAAC,MAAM;AAAA,IACnB,qBAAqB,CAAC,MAAM;AAAA,IAC5B,YAAY,MAAM;AAAA,QACd,cAAc;AAAA,GACnB;AAAA,MACC,CAAC,MAAM,QAAQ,MAAM,MAAM,EAA1B,MAAM,OAAmC;AAAA,MAC1C,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,6BAA6B,MAAM,KAAK,GAAG;AAAA,UACxD,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,QAAQ,MAAM,cAAc,UAAU,OAAO;AAAA,eAC7E,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,UAAU,MAAM,gBAAgB,UAAU,OAAO;AAAA,eACjF,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,QACT,EAXC,IAWK;AAAA,MACR,EAbC,MAAM,QAaS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,OAAO,MAAM,eAAe;AAAA,EAC9B,EAAE;AAAA,QACF,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,OAAO,MAAM,SAAS,UAAU;AAAA,IAChC,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,UAAU;AAAA,IAC/B,OAAO,MAAM;AAAA,EACf,EAAE;AAAA,MACJ,EAhBC,MAAM,OAgBQ;AAAA,IACjB,EA3CC;AA6CL;AAEA,IAAO,wBAAQ;","names":[],"file":"confirmDialog.jsx"}
+{"version":3,"sources":["../../../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"medium\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"mappings":"AAAA,SAAmB,MAAM,YAAY,sBAAsB;AAC3D,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AA2BpB,SAAS,cAAc,OAAwC;AACpE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,YAAY,eAAe;AACjC,QAAM,YAAY,eAAe;AAGjC,QAAM,gBAAgB,MAAuC;AAC3D,UAAM,MAAM,CAAC,MAAM,UAAU,YAAY,IAAI,MAAM,UAAU,YAAY,EAAE,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACrG,WAAO,MAAM,EAAE,oBAAoB,IAAI,IAAI,CAAC;AAAA,EAC9C;AAEA,SACE,CAAC;AAAA,IACC,MAAM,MAAM;AAAA,IACZ,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,KAAK;AAAA,IACL,KAAK;AAAA,IACL,SAAS;AAAA,IACT,YAAY,CAAC,MAAM;AAAA,IACnB,qBAAqB,CAAC,MAAM;AAAA,IAC5B,YAAY,MAAM;AAAA,QACd,cAAc;AAAA,GACnB;AAAA,MACC,CAAC,MAAM,QAAQ,MAAM,MAAM,EAA1B,MAAM,OAAmC;AAAA,MAC1C,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,6BAA6B,MAAM,KAAK,GAAG;AAAA,UACxD,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,QAAQ,MAAM,cAAc,UAAU,OAAO;AAAA,eAC7E,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,UAAU,MAAM,gBAAgB,UAAU,OAAO;AAAA,eACjF,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,QACT,EAXC,IAWK;AAAA,MACR,EAbC,MAAM,QAaS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,OAAO,MAAM,eAAe;AAAA,EAC9B,EAAE;AAAA,QACF,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,OAAO,MAAM,SAAS,UAAU;AAAA,IAChC,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,UAAU;AAAA,IAC/B,OAAO,MAAM;AAAA,EACf,EAAE;AAAA,MACJ,EAhBC,MAAM,OAgBQ;AAAA,IACjB,EA3CC;AA6CL;AAEA,IAAO,wBAAQ;","names":[],"file":"confirmDialog.jsx"}

package/dist/headless/source/components/feedBack/saveAssetDialog/saveAssetDialog.jsx

@@ -22,7 +22,7 @@ function SaveAssetDialog(props) {
     "class"
   ]);
   const showNameField = () => local.onNameChange !== void 0 || local.name !== void 0;
-  return <Modal open={local.open} onClose={local.onClose} size="small">
+  return <Modal open={local.open} onClose={local.onClose} size="medium">
       <Modal.Header>{local.title ?? "Save"}</Modal.Header>
       <Modal.Content>
         <div class={cn("smwb-save-asset-dialog__body", local.class)}>
@@ -30,6 +30,7 @@ function SaveAssetDialog(props) {
             <TextField
     label={local.nameLabel ?? "Name"}
     value={local.name ?? ""}
+    fullWidth
     disabled={!!local.busy}
     onChange={(event) => local.onNameChange?.(event.currentTarget.value)}
   />

package/dist/headless/source/components/feedBack/saveAssetDialog/saveAssetDialog.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"small\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"mappings":"AAAA,SAAmB,MAAM,kBAAkB;AAC3C,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,iBAAiB;AA8BnB,SAAS,gBAAgB,OAA0C;AACxE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,MAAe,MAAM,iBAAiB,UAAa,MAAM,SAAS;AAExF,SACE,CAAC,MAAM,MAAM,MAAM,MAAM,SAAS,MAAM,SAAS,KAAK,QAAQ;AAAA,MAC5D,CAAC,MAAM,QAAQ,MAAM,SAAS,OAAO,EAApC,MAAM,OAA6C;AAAA,MACpD,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,gCAAgC,MAAM,KAAK,GAAG;AAAA,UAC3D,CAAC,KAAK,MAAM,cAAc,GAAG;AAAA,YAC3B,CAAC;AAAA,IACC,OAAO,MAAM,aAAa;AAAA,IAC1B,OAAO,MAAM,QAAQ;AAAA,IACrB,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,UAAU,CAAC,UAAU,MAAM,eAAgB,MAAM,cAAmC,KAAK;AAAA,EAC3F,EAAE;AAAA,UACJ,EAPC,KAOM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,YAAY;AAAA,YAC5B,CAAC,IAAI,MAAM,kCAAkC;AAAA,cAC3C,CAAC,IAAI,KAAK,MAAM,YAAY,IAAI,GAAG,EAAE;AAAA,YACvC,EAFC,IAEK;AAAA,UACR,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,WAAW;AAAA,YAC3B,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,YAAY;AAAA,IACjC,OAAO,MAAM,gBAAgB;AAAA,EAC/B,EAAE;AAAA,UACJ,EARC,KAQM;AAAA,WACN,MAAM,SAAS;AAAA,QAClB,EAxBC,IAwBK;AAAA,MACR,EA1BC,MAAM,QA0BS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC,OAAO,QAAQ,OAAO,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,QAAQ,GAAG,OAAO,MAAM,eAAe,UAAU,EAAE;AAAA,QACvH,CAAC,OAAO,QAAQ,YAAY,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,UAAU,GAAG,OAAO,MAAM,gBAAgB,QAAQ,EAAE;AAAA,MAC/H,EAHC,MAAM,OAGQ;AAAA,IACjB,EAjCC;AAmCL;AAEA,IAAO,0BAAQ;","names":[],"file":"saveAssetDialog.jsx"}
+{"version":3,"sources":["../../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"medium\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              fullWidth\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"mappings":"AAAA,SAAmB,MAAM,kBAAkB;AAC3C,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,iBAAiB;AA8BnB,SAAS,gBAAgB,OAA0C;AACxE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,MAAe,MAAM,iBAAiB,UAAa,MAAM,SAAS;AAExF,SACE,CAAC,MAAM,MAAM,MAAM,MAAM,SAAS,MAAM,SAAS,KAAK,SAAS;AAAA,MAC7D,CAAC,MAAM,QAAQ,MAAM,SAAS,OAAO,EAApC,MAAM,OAA6C;AAAA,MACpD,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,gCAAgC,MAAM,KAAK,GAAG;AAAA,UAC3D,CAAC,KAAK,MAAM,cAAc,GAAG;AAAA,YAC3B,CAAC;AAAA,IACC,OAAO,MAAM,aAAa;AAAA,IAC1B,OAAO,MAAM,QAAQ;AAAA,IACrB;AAAA,IACA,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,UAAU,CAAC,UAAU,MAAM,eAAgB,MAAM,cAAmC,KAAK;AAAA,EAC3F,EAAE;AAAA,UACJ,EARC,KAQM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,YAAY;AAAA,YAC5B,CAAC,IAAI,MAAM,kCAAkC;AAAA,cAC3C,CAAC,IAAI,KAAK,MAAM,YAAY,IAAI,GAAG,EAAE;AAAA,YACvC,EAFC,IAEK;AAAA,UACR,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,WAAW;AAAA,YAC3B,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,YAAY;AAAA,IACjC,OAAO,MAAM,gBAAgB;AAAA,EAC/B,EAAE;AAAA,UACJ,EARC,KAQM;AAAA,WACN,MAAM,SAAS;AAAA,QAClB,EAzBC,IAyBK;AAAA,MACR,EA3BC,MAAM,QA2BS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC,OAAO,QAAQ,OAAO,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,QAAQ,GAAG,OAAO,MAAM,eAAe,UAAU,EAAE;AAAA,QACvH,CAAC,OAAO,QAAQ,YAAY,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,UAAU,GAAG,OAAO,MAAM,gBAAgB,QAAQ,EAAE;AAAA,MAC/H,EAHC,MAAM,OAGQ;AAAA,IACjB,EAlCC;AAoCL;AAEA,IAAO,0BAAQ;","names":[],"file":"saveAssetDialog.jsx"}

package/dist/source/components/dataDisplay/table/tableHeadCell.jsx

@@ -1,4 +1,4 @@
-import { mergeProps, splitProps } from "solid-js";
+import { Show, mergeProps, splitProps } from "solid-js";
 import cn from "clsx";
 import { Icon } from "../../base/icon";
 import { mergeRefs } from "../../../primitives/mergeRefs";
@@ -17,7 +17,7 @@ function TableHeadCell(props) {
   ]);
   const direction = () => local.sortDirection !== void 0 ? local.sortDirection : local.isSortedByAsc ? "asc" : local.isSortedByDesc ? "desc" : false;
   const ariaSort = () => local.sortable ? direction() === "asc" ? "ascending" : direction() === "desc" ? "descending" : "none" : void 0;
-  const iconName = () => direction() === "asc" ? "expand_more" : direction() === "desc" ? "expand_less" : "";
+  const iconName = () => direction() === "asc" ? "expand_more" : direction() === "desc" ? "expand_less" : "unfold_more";
   const onKeyDown = (event) => {
     if (local.sortable && local.onSort && (event.key === "Enter" || event.key === " ")) {
       event.preventDefault();
@@ -30,7 +30,8 @@ function TableHeadCell(props) {
     aria-sort={ariaSort()}
     class={cn("smwb-table__cell", "smwb-head-cell", local.class, {
       [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,
-      "smwb-head-cell_sortable": local.sortable
+      "smwb-head-cell_sortable": local.sortable,
+      "smwb-head-cell_sorted": !!local.sortable && direction() !== false
     })}
   >
       <span
@@ -41,7 +42,9 @@ function TableHeadCell(props) {
     tabindex={local.sortable ? 0 : void 0}
   >
         {local.children}
-        <Icon name={iconName()} size={18} weight={800} />
+        <Show when={local.sortable}>
+          <Icon class="smwb-head-cell__icon" name={iconName()} size={18} weight={800} />
+        </Show>
       </span>
     </th>;
 }

package/dist/source/components/dataDisplay/table/tableHeadCell.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  const iconName = (): string => (direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"\");\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Icon name={iconName()} size={18} weight={800} />\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"mappings":"AAAA,SAAqC,YAAY,kBAAkB;AACnE,OAAO,QAAQ;AACf,SAAS,YAAY;AACrB,SAAS,iBAA2B;AAmB7B,SAAS,cAAc,OAAqD;AACjF,QAAM,SAAS,WAAW,EAAE,WAAW,OAAgB,GAAG,KAAK;AAC/D,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,YAAY,MAChB,MAAM,kBAAkB,SAAY,MAAM,gBAAgB,MAAM,gBAAgB,QAAQ,MAAM,iBAAiB,SAAS;AAE1H,QAAM,WAAW,MACf,MAAM,WAAY,UAAU,MAAM,QAAQ,cAAc,UAAU,MAAM,SAAS,eAAe,SAAU;AAE5G,QAAM,WAAW,MAAe,UAAU,MAAM,QAAQ,gBAAgB,UAAU,MAAM,SAAS,gBAAgB;AAEjH,QAAM,YAA8D,CAAC,UAAU;AAC7E,QAAI,MAAM,YAAY,MAAM,WAAW,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;AAClF,YAAM,eAAe;AACrB,YAAM,OAAO;AAAA,IACf;AAAA,EACF;AAEA,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,WAAW,SAAS;AAAA,IACpB,OAAO,GAAG,oBAAoB,kBAAkB,MAAM,OAAO;AAAA,MAC3D,CAAC,cAAc,MAAM,SAAS,EAAE,GAAG,CAAC,CAAC,MAAM;AAAA,MAC3C,2BAA2B,MAAM;AAAA,IACnC,CAAC;AAAA,GACF;AAAA,MACC,CAAC;AAAA,IACC,MAAM;AAAA,IACN,SAAS,MAAM,WAAW,MAAM,MAAM,SAAS,IAAI;AAAA,IACnD,WAAW,MAAM,WAAW,YAAY;AAAA,IACxC,MAAM,MAAM,WAAW,WAAW;AAAA,IAClC,UAAU,MAAM,WAAW,IAAI;AAAA,GAChC;AAAA,SACE,MAAM,SAAS;AAAA,QAChB,CAAC,KAAK,MAAM,SAAS,GAAG,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,MACnD,EATC,KASM;AAAA,IACT,EAnBC;AAqBL;AAEA,IAAO,wBAAQ;","names":[],"file":"tableHeadCell.jsx"}
+{"version":3,"sources":["../../../../../src/components/dataDisplay/table/tableHeadCell.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SortDirection = \"asc\" | \"desc\" | false;\n\nexport interface TableHeadCellProps extends JSX.ThHTMLAttributes<HTMLTableCellElement> {\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** @deprecated use `sortDirection=\"desc\"`. */\n  isSortedByDesc?: boolean;\n  /** @deprecated use `sortDirection=\"asc\"`. */\n  isSortedByAsc?: boolean;\n  /** Enables the interactive sort affordance with keyboard/aria support. */\n  sortable?: boolean;\n  /** Current sort direction for this column. */\n  sortDirection?: SortDirection;\n  /** Invoked when the user activates the sort control. */\n  onSort?: () => void;\n  ref?: Ref<HTMLTableCellElement>;\n}\n\nexport function TableHeadCell(props: ParentProps<TableHeadCellProps>): JSX.Element {\n  const merged = mergeProps({ cellAlign: \"left\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"children\",\n    \"class\",\n    \"cellAlign\",\n    \"isSortedByAsc\",\n    \"isSortedByDesc\",\n    \"sortable\",\n    \"sortDirection\",\n    \"onSort\",\n    \"ref\",\n  ]);\n\n  const direction = (): SortDirection =>\n    local.sortDirection !== undefined ? local.sortDirection : local.isSortedByAsc ? \"asc\" : local.isSortedByDesc ? \"desc\" : false;\n\n  const ariaSort = (): \"ascending\" | \"descending\" | \"none\" | undefined =>\n    local.sortable ? (direction() === \"asc\" ? \"ascending\" : direction() === \"desc\" ? \"descending\" : \"none\") : undefined;\n\n  /**\n   * A sortable column always shows a marker: the current direction once sorted,\n   * and `unfold_more` before that — otherwise nothing tells the reader the column\n   * can be sorted at all. A cell that is not sortable shows nothing; it used to\n   * render an `<Icon name=\"\">`, which reserved a gap and warned about a missing\n   * icon under `source: \"smwb\"`.\n   */\n  const iconName = (): string =>\n    direction() === \"asc\" ? \"expand_more\" : direction() === \"desc\" ? \"expand_less\" : \"unfold_more\";\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (local.sortable && local.onSort && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault();\n      local.onSort();\n    }\n  };\n\n  return (\n    <th\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      aria-sort={ariaSort()}\n      class={cn(\"smwb-table__cell\", \"smwb-head-cell\", local.class, {\n        [`smwb-align_${local.cellAlign}`]: !!local.cellAlign,\n        \"smwb-head-cell_sortable\": local.sortable,\n        \"smwb-head-cell_sorted\": !!local.sortable && direction() !== false,\n      })}\n    >\n      <span\n        class=\"smwb-head-cell__content\"\n        onClick={local.sortable ? () => local.onSort?.() : undefined}\n        onKeyDown={local.sortable ? onKeyDown : undefined}\n        role={local.sortable ? \"button\" : undefined}\n        tabindex={local.sortable ? 0 : undefined}\n      >\n        {local.children}\n        <Show when={local.sortable}>\n          <Icon class=\"smwb-head-cell__icon\" name={iconName()} size={18} weight={800} />\n        </Show>\n      </span>\n    </th>\n  );\n}\n\nexport default TableHeadCell;\n"],"mappings":"AAAA,SAAqC,MAAM,YAAY,kBAAkB;AACzE,OAAO,QAAQ;AACf,SAAS,YAAY;AACrB,SAAS,iBAA2B;AAmB7B,SAAS,cAAc,OAAqD;AACjF,QAAM,SAAS,WAAW,EAAE,WAAW,OAAgB,GAAG,KAAK;AAC/D,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,YAAY,MAChB,MAAM,kBAAkB,SAAY,MAAM,gBAAgB,MAAM,gBAAgB,QAAQ,MAAM,iBAAiB,SAAS;AAE1H,QAAM,WAAW,MACf,MAAM,WAAY,UAAU,MAAM,QAAQ,cAAc,UAAU,MAAM,SAAS,eAAe,SAAU;AAS5G,QAAM,WAAW,MACf,UAAU,MAAM,QAAQ,gBAAgB,UAAU,MAAM,SAAS,gBAAgB;AAEnF,QAAM,YAA8D,CAAC,UAAU;AAC7E,QAAI,MAAM,YAAY,MAAM,WAAW,MAAM,QAAQ,WAAW,MAAM,QAAQ,MAAM;AAClF,YAAM,eAAe;AACrB,YAAM,OAAO;AAAA,IACf;AAAA,EACF;AAEA,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,WAAW,SAAS;AAAA,IACpB,OAAO,GAAG,oBAAoB,kBAAkB,MAAM,OAAO;AAAA,MAC3D,CAAC,cAAc,MAAM,SAAS,EAAE,GAAG,CAAC,CAAC,MAAM;AAAA,MAC3C,2BAA2B,MAAM;AAAA,MACjC,yBAAyB,CAAC,CAAC,MAAM,YAAY,UAAU,MAAM;AAAA,IAC/D,CAAC;AAAA,GACF;AAAA,MACC,CAAC;AAAA,IACC,MAAM;AAAA,IACN,SAAS,MAAM,WAAW,MAAM,MAAM,SAAS,IAAI;AAAA,IACnD,WAAW,MAAM,WAAW,YAAY;AAAA,IACxC,MAAM,MAAM,WAAW,WAAW;AAAA,IAClC,UAAU,MAAM,WAAW,IAAI;AAAA,GAChC;AAAA,SACE,MAAM,SAAS;AAAA,QAChB,CAAC,KAAK,MAAM,MAAM,UAAU;AAAA,UAC1B,CAAC,KAAK,MAAM,uBAAuB,MAAM,SAAS,GAAG,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,QAChF,EAFC,KAEM;AAAA,MACT,EAXC,KAWM;AAAA,IACT,EAtBC;AAwBL;AAEA,IAAO,wBAAQ;","names":[],"file":"tableHeadCell.jsx"}

package/dist/source/components/feedBack/confirmDialog/confirmDialog.jsx

@@ -27,7 +27,7 @@ function ConfirmDialog(props) {
   return <Modal
     open={local.open}
     onClose={() => local.onCancel()}
-    size="small"
+    size="medium"
     role="alertdialog"
     backdrop="dark"
     closeOnEsc={!local.busy}

package/dist/source/components/feedBack/confirmDialog/confirmDialog.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/confirmDialog/confirmDialog.entry.less\";\nimport { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"small\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"mappings":"AAAA,OAAO;AACP,SAAmB,MAAM,YAAY,sBAAsB;AAC3D,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AA2BpB,SAAS,cAAc,OAAwC;AACpE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,YAAY,eAAe;AACjC,QAAM,YAAY,eAAe;AAGjC,QAAM,gBAAgB,MAAuC;AAC3D,UAAM,MAAM,CAAC,MAAM,UAAU,YAAY,IAAI,MAAM,UAAU,YAAY,EAAE,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACrG,WAAO,MAAM,EAAE,oBAAoB,IAAI,IAAI,CAAC;AAAA,EAC9C;AAEA,SACE,CAAC;AAAA,IACC,MAAM,MAAM;AAAA,IACZ,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,KAAK;AAAA,IACL,KAAK;AAAA,IACL,SAAS;AAAA,IACT,YAAY,CAAC,MAAM;AAAA,IACnB,qBAAqB,CAAC,MAAM;AAAA,IAC5B,YAAY,MAAM;AAAA,QACd,cAAc;AAAA,GACnB;AAAA,MACC,CAAC,MAAM,QAAQ,MAAM,MAAM,EAA1B,MAAM,OAAmC;AAAA,MAC1C,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,6BAA6B,MAAM,KAAK,GAAG;AAAA,UACxD,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,QAAQ,MAAM,cAAc,UAAU,OAAO;AAAA,eAC7E,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,UAAU,MAAM,gBAAgB,UAAU,OAAO;AAAA,eACjF,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,QACT,EAXC,IAWK;AAAA,MACR,EAbC,MAAM,QAaS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,OAAO,MAAM,eAAe;AAAA,EAC9B,EAAE;AAAA,QACF,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,OAAO,MAAM,SAAS,UAAU;AAAA,IAChC,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,UAAU;AAAA,IAC/B,OAAO,MAAM;AAAA,EACf,EAAE;AAAA,MACJ,EAhBC,MAAM,OAgBQ;AAAA,IACjB,EA3CC;AA6CL;AAEA,IAAO,wBAAQ;","names":[],"file":"confirmDialog.jsx"}
+{"version":3,"sources":["../../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/confirmDialog/confirmDialog.entry.less\";\nimport { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"medium\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"mappings":"AAAA,OAAO;AACP,SAAmB,MAAM,YAAY,sBAAsB;AAC3D,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AA2BpB,SAAS,cAAc,OAAwC;AACpE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,YAAY,eAAe;AACjC,QAAM,YAAY,eAAe;AAGjC,QAAM,gBAAgB,MAAuC;AAC3D,UAAM,MAAM,CAAC,MAAM,UAAU,YAAY,IAAI,MAAM,UAAU,YAAY,EAAE,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACrG,WAAO,MAAM,EAAE,oBAAoB,IAAI,IAAI,CAAC;AAAA,EAC9C;AAEA,SACE,CAAC;AAAA,IACC,MAAM,MAAM;AAAA,IACZ,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,KAAK;AAAA,IACL,KAAK;AAAA,IACL,SAAS;AAAA,IACT,YAAY,CAAC,MAAM;AAAA,IACnB,qBAAqB,CAAC,MAAM;AAAA,IAC5B,YAAY,MAAM;AAAA,QACd,cAAc;AAAA,GACnB;AAAA,MACC,CAAC,MAAM,QAAQ,MAAM,MAAM,EAA1B,MAAM,OAAmC;AAAA,MAC1C,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,6BAA6B,MAAM,KAAK,GAAG;AAAA,UACxD,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,QAAQ,MAAM,cAAc,UAAU,OAAO;AAAA,eAC7E,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,YACzB,CAAC,WAAW,IAAI,WAAW,QAAQ,UAAU,MAAM,gBAAgB,UAAU,OAAO;AAAA,eACjF,MAAM,QAAQ;AAAA,YACjB,EAFC,WAEY;AAAA,UACf,EAJC,KAIM;AAAA,QACT,EAXC,IAWK;AAAA,MACR,EAbC,MAAM,QAaS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,SAAS;AAAA,IAC9B,OAAO,MAAM,eAAe;AAAA,EAC9B,EAAE;AAAA,QACF,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,OAAO,MAAM,SAAS,UAAU;AAAA,IAChC,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,UAAU;AAAA,IAC/B,OAAO,MAAM;AAAA,EACf,EAAE;AAAA,MACJ,EAhBC,MAAM,OAgBQ;AAAA,IACjB,EA3CC;AA6CL;AAEA,IAAO,wBAAQ;","names":[],"file":"confirmDialog.jsx"}

package/dist/source/components/feedBack/saveAssetDialog/saveAssetDialog.jsx

@@ -23,7 +23,7 @@ function SaveAssetDialog(props) {
     "class"
   ]);
   const showNameField = () => local.onNameChange !== void 0 || local.name !== void 0;
-  return <Modal open={local.open} onClose={local.onClose} size="small">
+  return <Modal open={local.open} onClose={local.onClose} size="medium">
       <Modal.Header>{local.title ?? "Save"}</Modal.Header>
       <Modal.Content>
         <div class={cn("smwb-save-asset-dialog__body", local.class)}>
@@ -31,6 +31,7 @@ function SaveAssetDialog(props) {
             <TextField
     label={local.nameLabel ?? "Name"}
     value={local.name ?? ""}
+    fullWidth
     disabled={!!local.busy}
     onChange={(event) => local.onNameChange?.(event.currentTarget.value)}
   />

package/dist/source/components/feedBack/saveAssetDialog/saveAssetDialog.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/saveAssetDialog/saveAssetDialog.entry.less\";\nimport { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"small\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"mappings":"AAAA,OAAO;AACP,SAAmB,MAAM,kBAAkB;AAC3C,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,iBAAiB;AA8BnB,SAAS,gBAAgB,OAA0C;AACxE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,MAAe,MAAM,iBAAiB,UAAa,MAAM,SAAS;AAExF,SACE,CAAC,MAAM,MAAM,MAAM,MAAM,SAAS,MAAM,SAAS,KAAK,QAAQ;AAAA,MAC5D,CAAC,MAAM,QAAQ,MAAM,SAAS,OAAO,EAApC,MAAM,OAA6C;AAAA,MACpD,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,gCAAgC,MAAM,KAAK,GAAG;AAAA,UAC3D,CAAC,KAAK,MAAM,cAAc,GAAG;AAAA,YAC3B,CAAC;AAAA,IACC,OAAO,MAAM,aAAa;AAAA,IAC1B,OAAO,MAAM,QAAQ;AAAA,IACrB,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,UAAU,CAAC,UAAU,MAAM,eAAgB,MAAM,cAAmC,KAAK;AAAA,EAC3F,EAAE;AAAA,UACJ,EAPC,KAOM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,YAAY;AAAA,YAC5B,CAAC,IAAI,MAAM,kCAAkC;AAAA,cAC3C,CAAC,IAAI,KAAK,MAAM,YAAY,IAAI,GAAG,EAAE;AAAA,YACvC,EAFC,IAEK;AAAA,UACR,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,WAAW;AAAA,YAC3B,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,YAAY;AAAA,IACjC,OAAO,MAAM,gBAAgB;AAAA,EAC/B,EAAE;AAAA,UACJ,EARC,KAQM;AAAA,WACN,MAAM,SAAS;AAAA,QAClB,EAxBC,IAwBK;AAAA,MACR,EA1BC,MAAM,QA0BS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC,OAAO,QAAQ,OAAO,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,QAAQ,GAAG,OAAO,MAAM,eAAe,UAAU,EAAE;AAAA,QACvH,CAAC,OAAO,QAAQ,YAAY,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,UAAU,GAAG,OAAO,MAAM,gBAAgB,QAAQ,EAAE;AAAA,MAC/H,EAHC,MAAM,OAGQ;AAAA,IACjB,EAjCC;AAmCL;AAEA,IAAO,0BAAQ;","names":[],"file":"saveAssetDialog.jsx"}
+{"version":3,"sources":["../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/saveAssetDialog/saveAssetDialog.entry.less\";\nimport { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"medium\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              fullWidth\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"mappings":"AAAA,OAAO;AACP,SAAmB,MAAM,kBAAkB;AAC3C,OAAO,QAAQ;AACf,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,iBAAiB;AA8BnB,SAAS,gBAAgB,OAA0C;AACxE,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,MAAe,MAAM,iBAAiB,UAAa,MAAM,SAAS;AAExF,SACE,CAAC,MAAM,MAAM,MAAM,MAAM,SAAS,MAAM,SAAS,KAAK,SAAS;AAAA,MAC7D,CAAC,MAAM,QAAQ,MAAM,SAAS,OAAO,EAApC,MAAM,OAA6C;AAAA,MACpD,CAAC,MAAM,QAAQ;AAAA,QACb,CAAC,IAAI,OAAO,GAAG,gCAAgC,MAAM,KAAK,GAAG;AAAA,UAC3D,CAAC,KAAK,MAAM,cAAc,GAAG;AAAA,YAC3B,CAAC;AAAA,IACC,OAAO,MAAM,aAAa;AAAA,IAC1B,OAAO,MAAM,QAAQ;AAAA,IACrB;AAAA,IACA,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,UAAU,CAAC,UAAU,MAAM,eAAgB,MAAM,cAAmC,KAAK;AAAA,EAC3F,EAAE;AAAA,UACJ,EARC,KAQM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,YAAY;AAAA,YAC5B,CAAC,IAAI,MAAM,kCAAkC;AAAA,cAC3C,CAAC,IAAI,KAAK,MAAM,YAAY,IAAI,GAAG,EAAE;AAAA,YACvC,EAFC,IAEK;AAAA,UACR,EAJC,KAIM;AAAA,UACP,CAAC,KAAK,MAAM,MAAM,WAAW;AAAA,YAC3B,CAAC;AAAA,IACC,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM,MAAM,YAAY;AAAA,IACjC,OAAO,MAAM,gBAAgB;AAAA,EAC/B,EAAE;AAAA,UACJ,EARC,KAQM;AAAA,WACN,MAAM,SAAS;AAAA,QAClB,EAzBC,IAyBK;AAAA,MACR,EA3BC,MAAM,QA2BS;AAAA,MAChB,CAAC,MAAM,OAAO;AAAA,QACZ,CAAC,OAAO,QAAQ,OAAO,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,QAAQ,GAAG,OAAO,MAAM,eAAe,UAAU,EAAE;AAAA,QACvH,CAAC,OAAO,QAAQ,YAAY,UAAU,CAAC,CAAC,MAAM,MAAM,SAAS,MAAM,MAAM,UAAU,GAAG,OAAO,MAAM,gBAAgB,QAAQ,EAAE;AAAA,MAC/H,EAHC,MAAM,OAGQ;AAAA,IACjB,EAlCC;AAoCL;AAEA,IAAO,0BAAQ;","names":[],"file":"saveAssetDialog.jsx"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@smwb/ui-solid",
-  "version": "0.11.0",
+  "version": "0.11.2",
   "description": "SolidJS port of summer-ui: strict, tree-shakeable Material-style component library sharing the @smwb/ui-styles design system.",
   "license": "MIT",
   "type": "module",
@@ -539,7 +539,7 @@
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.0",
-    "@smwb/ui-styles": "^1.4.0",
+    "@smwb/ui-styles": "^1.4.3",
     "clsx": "^2.1.1",
     "zod": "^4.4.3"
   },
@@ -549,7 +549,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.39.0",
-    "@smwb/ui-styles": "^1.4.0",
+    "@smwb/ui-styles": "^1.4.3",
     "@solidjs/testing-library": "^0.8.10",
     "@storybook/addon-docs": "^10.4.0",
     "@storybook/addon-links": "^10.4.0",