@kouji-ui/components 0.7.0 → 0.7.1

package/fesm2022/kouji-ui-components.mjs

@@ -13395,7 +13395,7 @@ class KjSelectComponent {
     <kj-select-content [kjFor]="trig" class="kj-select-content">
       <ng-content />
     </kj-select-content>
-  `, isInline: true, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans)}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"], dependencies: [{ kind: "directive", type: KjIconDirective, selector: "span[kjIcon], i[kjIcon]", inputs: ["kjIcon", "kjIconLabel", "kjIconColor", "kjIconSize"] }, { kind: "directive", type: KjSelectTrigger, selector: "[kjSelectTrigger]", inputs: ["kjMultiple", "kjDisabled"], exportAs: ["kjSelectTrigger"] }, { kind: "component", type: KjSelectContent, selector: "kj-select-content", inputs: ["kjSide", "kjAlign", "kjOffset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer;min-width:0}.kj-select-trigger-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;max-width:min(28rem,calc(100vw - 2rem));background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"], dependencies: [{ kind: "directive", type: KjIconDirective, selector: "span[kjIcon], i[kjIcon]", inputs: ["kjIcon", "kjIconLabel", "kjIconColor", "kjIconSize"] }, { kind: "directive", type: KjSelectTrigger, selector: "[kjSelectTrigger]", inputs: ["kjMultiple", "kjDisabled"], exportAs: ["kjSelectTrigger"] }, { kind: "component", type: KjSelectContent, selector: "kj-select-content", inputs: ["kjSide", "kjAlign", "kjOffset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjSelectComponent, decorators: [{
             type: Component,
@@ -13414,7 +13414,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                         '[attr.data-disabled]': "disabled() ? '' : null",
                         '[attr.data-multiple]': "multiple() ? '' : null",
                         '[attr.data-size]': "kjSize() === 'md' ? null : kjSize()",
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans)}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"] }]
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer;min-width:0}.kj-select-trigger-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;max-width:min(28rem,calc(100vw - 2rem));background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"] }]
         }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], kjSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSize", required: false }] }], options: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => forwardRef(() => KjOptionComponent)), { isSignal: true }] }] } });
 /**
  * Single option row.