@haiilo/catalyst 6.1.0 → 6.1.3

package/dist/cjs/cat-alert_25.cjs.entry.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-4258b31e.js');
-const catIconRegistry = require('./cat-icon-registry-6161e2ee.js');
+const index = require('./index-8d1f4d8e.js');
+const catIconRegistry = require('./cat-icon-registry-5c292d3f.js');
 
 function setAttributeDefault(host, attr, value) {
   if (!host.hostElement.hasAttribute(attr) && value != null) {
@@ -477,7 +477,7 @@ const CatFormHint = props => {
     ]));
 };
 
-const catCheckboxCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1.125rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;min-width:0}.input-hint,::slotted([slot=hint]){color:rgb(var(--cat-font-color-muted, 81, 92, 108));line-height:1.5;flex:1 1 auto;min-width:0}:host{display:flex;flex-direction:column;gap:0.5rem;margin-bottom:1rem}:host([hidden]){display:none}label{flex:0 1 auto;display:flex;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;position:relative}.label-left{flex-direction:row-reverse}.label-left input{right:1px;left:unset}input{position:absolute;width:1.25rem;height:1.25rem;margin:0;opacity:0;cursor:inherit;left:1px;top:0.5px}.box-placeholder{width:calc(1.25rem + 1px)}.box{flex:0 0 auto;display:flex;position:relative;height:1.25rem;width:1.25rem;background-color:white;border:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));border-radius:var(--cat-border-radius-s, 0.125rem);transition:background-color 0.13s ease, border-color 0.13s ease;pointer-events:none}.box svg{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16px;stroke-dashoffset:16px;transition:all 0.13s ease;width:50%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0.99)}:checked+.box{background-color:rgb(var(--cat-primary-bg, 0, 129, 148));border-color:rgb(var(--cat-primary-bg, 0, 129, 148));stroke:rgb(var(--cat-primary-fill, 255, 255, 255))}:checked+.box .check{stroke-dashoffset:0}:indeterminate+.box{background-color:rgb(var(--cat-primary-bg, 0, 129, 148));border-color:rgb(var(--cat-primary-bg, 0, 129, 148));stroke:rgb(var(--cat-primary-fill, 255, 255, 255))}:indeterminate+.box .dash{stroke-dashoffset:0}:focus-visible+.box{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.is-disabled .box{background-color:#f2f4f7;border-color:rgb(var(--cat-border-color-dark, 215, 219, 224));stroke:rgb(var(--cat-font-color-muted, 81, 92, 108))}:host(.cat-error) .box{border:1px solid rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) :checked+.box,:host(.cat-error) :indeterminate+.box{background-color:rgb(var(--cat-danger-bg, 217, 52, 13));border-color:rgb(var(--cat-danger-bg, 217, 52, 13));stroke:rgb(var(--cat-danger-fill, 255, 255, 255))}.label{flex:1 1 auto;min-width:0}.is-hidden .label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.is-disabled{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
+const catCheckboxCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1.125rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.hint-wrapper{flex:0 1 auto;display:flex;gap:0.5rem}.hint-section{flex:1 1 auto;min-width:0}.input-hint,::slotted([slot=hint]){color:rgb(var(--cat-font-color-muted, 81, 92, 108));line-height:1.5;flex:1 1 auto;min-width:0}:host{display:flex;flex-direction:column;gap:0.5rem;margin-bottom:1rem}:host([hidden]){display:none}label{flex:0 1 auto;display:flex;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);-webkit-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;position:relative}.label-left{flex-direction:row-reverse}.label-left input{right:1px;left:unset}input{position:absolute;width:1.25rem;height:1.25rem;margin:0;opacity:0;cursor:inherit;left:1px;top:0.5px}.box-placeholder{width:calc(1.25rem + 1px)}.box{flex:0 0 auto;display:flex;position:relative;height:1.25rem;width:1.25rem;background-color:white;border:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));border-radius:var(--cat-border-radius-s, 0.125rem);transition:background-color 0.13s ease, border-color 0.13s ease;pointer-events:none}.box svg{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16px;stroke-dashoffset:16px;transition:all 0.13s ease;width:50%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%) scale(0.99)}:checked+.box{background-color:rgb(var(--cat-primary-bg, 0, 129, 148));border-color:rgb(var(--cat-primary-bg, 0, 129, 148));stroke:rgb(var(--cat-primary-fill, 255, 255, 255))}:checked+.box .check{stroke-dashoffset:0}:indeterminate+.box{background-color:rgb(var(--cat-primary-bg, 0, 129, 148));border-color:rgb(var(--cat-primary-bg, 0, 129, 148));stroke:rgb(var(--cat-primary-fill, 255, 255, 255))}:indeterminate+.box .check{stroke-dashoffset:16px}:indeterminate+.box .dash{stroke-dashoffset:0}:focus-visible+.box{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.is-disabled .box{background-color:#f2f4f7;border-color:rgb(var(--cat-border-color-dark, 215, 219, 224));stroke:rgb(var(--cat-font-color-muted, 81, 92, 108))}:host(.cat-error) .box{border:1px solid rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) :checked+.box,:host(.cat-error) :indeterminate+.box{background-color:rgb(var(--cat-danger-bg, 217, 52, 13));border-color:rgb(var(--cat-danger-bg, 217, 52, 13));stroke:rgb(var(--cat-danger-fill, 255, 255, 255))}.label{flex:1 1 auto;min-width:0}.is-hidden .label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.is-disabled{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
 
 let nextUniqueId$8 = 0;
 const CatCheckbox = class {
@@ -490,9 +490,9 @@ const CatCheckbox = class {
     this.hasSlottedLabel = false;
     this.hasSlottedHint = false;
     this.checked = false;
+    this.indeterminate = false;
     this.disabled = false;
     this.identifier = undefined;
-    this.indeterminate = false;
     this.label = '';
     this.labelHidden = false;
     this.name = undefined;
@@ -509,11 +509,6 @@ const CatCheckbox = class {
   componentWillLoad() {
     this.updateResolved();
   }
-  componentDidLoad() {
-    if (this.input && this.indeterminate) {
-      this.input.indeterminate = true;
-    }
-  }
   componentWillRender() {
     this.hasSlottedLabel = !!this.hostElement.querySelector('[slot="label"]');
     this.hasSlottedHint = !!this.hostElement.querySelector('[slot="hint"]');
@@ -539,10 +534,11 @@ const CatCheckbox = class {
     this.input.blur();
   }
   render() {
-    return (index.h(index.Host, null, index.h("label", { htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft } }, index.h("input", { ...this.nativeAttributes, ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this) }), index.h("span", { class: "box", "aria-hidden": "true", part: "checkbox" }, index.h("svg", { class: "check", viewBox: "0 0 12 10" }, index.h("polyline", { points: "1.5 6 4.5 9 10.5 1" })), index.h("svg", { class: "dash", viewBox: "0 0 12 10" }, index.h("polyline", { points: "1.5 5 10.5 5" }))), index.h("span", { class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), (this.hint || this.hasSlottedHint) && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "box-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
+    return (index.h(index.Host, null, index.h("label", { htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft } }, index.h("input", { ...this.nativeAttributes, ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, indeterminate: this.indeterminate, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this) }), index.h("span", { class: "box", "aria-hidden": "true", part: "checkbox" }, index.h("svg", { class: "check", viewBox: "0 0 12 10" }, index.h("polyline", { points: "1.5 6 4.5 9 10.5 1" })), index.h("svg", { class: "dash", viewBox: "0 0 12 10" }, index.h("polyline", { points: "1.5 5 10.5 5" }))), index.h("span", { class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { name: "label" })) || this.label)), (this.hint || this.hasSlottedHint) && (index.h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { class: "box-placeholder" }), index.h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
   }
   onInput() {
     this.checked = this.input.checked;
+    this.indeterminate = this.input.indeterminate;
     this.updateResolved();
     this.catChange.emit(this.resolvedValue);
   }
@@ -7012,7 +7008,7 @@ class SafeSubscriber extends Subscriber {
         let partialObserver;
         if (isFunction(observerOrNext) || !observerOrNext) {
             partialObserver = {
-                next: (observerOrNext !== null && observerOrNext !== void 0 ? observerOrNext : undefined),
+                next: observerOrNext !== null && observerOrNext !== void 0 ? observerOrNext : undefined,
                 error: error !== null && error !== void 0 ? error : undefined,
                 complete: complete !== null && complete !== void 0 ? complete : undefined,
             };
@@ -7406,7 +7402,6 @@ class AsyncAction extends Action {
         this.pending = false;
     }
     schedule(state, delay = 0) {
-        var _a;
         if (this.closed) {
             return this;
         }
@@ -7418,7 +7413,7 @@ class AsyncAction extends Action {
         }
         this.pending = true;
         this.delay = delay;
-        this.id = (_a = this.id) !== null && _a !== void 0 ? _a : this.requestAsyncId(scheduler, this.id, delay);
+        this.id = this.id || this.requestAsyncId(scheduler, this.id, delay);
         return this;
     }
     requestAsyncId(scheduler, _id, delay = 0) {
@@ -7428,9 +7423,7 @@ class AsyncAction extends Action {
         if (delay != null && this.delay === delay && this.pending === false) {
             return id;
         }
-        if (id != null) {
-            intervalProvider.clearInterval(id);
-        }
+        intervalProvider.clearInterval(id);
         return undefined;
     }
     execute(state, delay) {
@@ -7493,6 +7486,7 @@ class AsyncScheduler extends Scheduler {
         super(SchedulerAction, now);
         this.actions = [];
         this._active = false;
+        this._scheduled = undefined;
     }
     flush(action) {
         const { actions } = this;
@@ -8249,7 +8243,7 @@ function delayWhen(delayDurationSelector, subscriptionDelay) {
     if (subscriptionDelay) {
         return (source) => concat(subscriptionDelay.pipe(take(1), ignoreElements()), source.pipe(delayWhen(delayDurationSelector)));
     }
-    return mergeMap((value, index) => innerFrom(delayDurationSelector(value, index)).pipe(take(1), mapTo(value)));
+    return mergeMap((value, index) => delayDurationSelector(value, index).pipe(take(1), mapTo(value)));
 }
 
 function delay(due, scheduler = asyncScheduler) {
@@ -8582,6 +8576,7 @@ const INIT_STATE = {
   activeSelectionIndex: -1
 };
 let nextUniqueId$4 = 0;
+let nextTagUniqueId = 0;
 const CatSelect = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
@@ -8713,7 +8708,8 @@ const CatSelect = class {
       }
     }
     this.hide();
-    if (!this.multiple && this.state.tempSelection?.length) {
+    // Conditionally remove selection if the option was not manually selected through click or enter key press
+    if (!this.multiple && (!this.tags || !this.state.selection?.length) && this.state.tempSelection?.length) {
       this.patchState({
         activeSelectionIndex: -1,
         selection: this.state.tempSelection,
@@ -9116,7 +9112,7 @@ const CatSelect = class {
     if (term.trim().length && !this.isTagSelected(term)) {
       const value = this.value;
       const tags = value?.tags;
-      const tag = { id: `select-${this.id}-tag-${tags ? tags.length : 0}`, name: term };
+      const tag = { id: `select-${this.id}-tag-${tags?.length ? tags?.length + nextTagUniqueId++ : 0}`, name: term };
       this.select({ item: tag, render: { label: tag.name } });
     }
     this.setTransparentCaret();