npm - @haiilo/catalyst - Versions diffs - 0.13.0 → 0.14.0 - Mend

@haiilo/catalyst 0.13.0 → 0.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (68) hide show

package/dist/collection/components/cat-alert/cat-alert.js CHANGED Viewed

@@ -7,10 +7,21 @@ import { Component, h, Host, Prop } from '@stencil/core';
  */
 export class CatAlert {
   constructor() {
+    this.mapIcon = new Map([
+      ['primary', 'star-circle-filled'],
+      ['secondary', 'clock-filled'],
+      ['success', 'check-circle-filled'],
+      ['warning', 'danger-filled'],
+      ['danger', 'cross-circle-filled']
+    ]);
     /**
      * The color palette of the alert.
      */
     this.color = 'primary';
+    /**
+     * Whether the icon of the alert is deactivated.
+     */
+    this.noIcon = false;
   }
   render() {
     return (h(Host, { tabindex: "0", role: this.role },
@@ -18,7 +29,9 @@ export class CatAlert {
           alert: true,
           [`alert-${this.color}`]: Boolean(this.color)
         } },
-        h("slot", null))));
+        !this.noIcon && h("cat-icon", { size: "l", icon: this.icon ? this.icon : this.mapIcon.get(this.color) }),
+        h("div", { class: "content" },
+          h("slot", null)))));
   }
   get role() {
     switch (this.color) {
@@ -55,6 +68,41 @@ export class CatAlert {
       "attribute": "color",
       "reflect": false,
       "defaultValue": "'primary'"
+    },
+    "icon": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string | undefined",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "The name of an icon to be displayed in the alert."
+      },
+      "attribute": "icon",
+      "reflect": false
+    },
+    "noIcon": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Whether the icon of the alert is deactivated."
+      },
+      "attribute": "no-icon",
+      "reflect": false,
+      "defaultValue": "false"
     }
   }; }
 }

package/dist/collection/components/cat-alert/cat-alert.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cat-alert.js","sourceRoot":"","sources":["../../../src/components/cat-alert/cat-alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;;GAKG;AAMH,MAAM,OAAO,QAAQ;EALrB;~~IAME~~;;OAEG;IACK,UAAK,GAA+D,SAAS,CAAC;~~GA2BvF~~;~~EAzBC~~,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI;MAChC,WACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE;UACL,KAAK,EAAE,IAAI;UACX,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;SAC7C;~~QAED~~,eAAa,CACT,CACD,CACR,CAAC;EACJ,CAAC;EAED,IAAY,IAAI;IACd,QAAQ,IAAI,CAAC,KAAK,EAAE;MAClB,KAAK,QAAQ,CAAC;MACd,KAAK,SAAS;QACZ,OAAO,OAAO,CAAC;MACjB;QACE,OAAO,QAAQ,CAAC;KACnB;EACH,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/*\n Informs user about important changes or conditions in the interface. Use this\n * component if you need to capture user’s attention in a prominent way.\n \n @part alert - The alert element.\n /\n@Component({\n tag: 'cat-alert',\n styleUrl: 'cat-alert.scss',\n shadow: true\n})\nexport class CatAlert {\n /\n The color palette of the alert.\n */\n @Prop() color: 'primary' \| 'secondary' \| 'danger' \| 'success' \| 'warning' = 'primary';\n\n render() {\n return (\n <Host tabindex=\"0\" role={this.role}>\n <div\n part=\"alert\"\n class={{\n alert: true,\n [`alert-${this.color}`]: Boolean(this.color)\n }}\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n\n private get role() {\n switch (this.color) {\n case 'danger':\n case 'warning':\n return 'alert';\n default:\n return 'status';\n }\n }\n}\n"]}
1	+ {"version":3,"file":"cat-alert.js","sourceRoot":"","sources":["../../../src/components/cat-alert/cat-alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;;GAKG;AAMH,MAAM,OAAO,QAAQ;EALrB;IAMmB,YAAO,GAAwB,IAAI,GAAG,CAAC;MACtD,CAAC,SAAS,EAAE,oBAAoB,CAAC;MACjC,CAAC,WAAW,EAAE,cAAc,CAAC;MAC7B,CAAC,SAAS,EAAE,qBAAqB,CAAC;MAClC,CAAC,SAAS,EAAE,eAAe,CAAC;MAC5B,CAAC,QAAQ,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IAEH;;OAEG;IACK,UAAK,GAA+D,SAAS,CAAC;IAOtF;;OAEG;IACK,WAAM,GAAG,KAAK,CAAC;GA8BxB;EA5BC,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI;MAChC,WACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE;UACL,KAAK,EAAE,IAAI;UACX,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;SAC7C;QAEA,CAAC,IAAI,CAAC,MAAM,IAAI,gBAAU,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,GAAa;QAC3G,WAAK,KAAK,EAAC,SAAS;UAClB,eAAa,CACT,CACF,CACD,CACR,CAAC;EACJ,CAAC;EAED,IAAY,IAAI;IACd,QAAQ,IAAI,CAAC,KAAK,EAAE;MAClB,KAAK,QAAQ,CAAC;MACd,KAAK,SAAS;QACZ,OAAO,OAAO,CAAC;MACjB;QACE,OAAO,QAAQ,CAAC;KACnB;EACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/*\n Informs user about important changes or conditions in the interface. Use this\n * component if you need to capture user’s attention in a prominent way.\n \n @part alert - The alert element.\n /\n@Component({\n tag: 'cat-alert',\n styleUrl: 'cat-alert.scss',\n shadow: true\n})\nexport class CatAlert {\n private readonly mapIcon: Map<string, string> = new Map([\n ['primary', 'star-circle-filled'],\n ['secondary', 'clock-filled'],\n ['success', 'check-circle-filled'],\n ['warning', 'danger-filled'],\n ['danger', 'cross-circle-filled']\n ]);\n\n /\n The color palette of the alert.\n /\n @Prop() color: 'primary' \| 'secondary' \| 'danger' \| 'success' \| 'warning' = 'primary';\n\n /\n The name of an icon to be displayed in the alert.\n /\n @Prop() icon?: string;\n\n /\n Whether the icon of the alert is deactivated.\n */\n @Prop() noIcon = false;\n\n render() {\n return (\n <Host tabindex=\"0\" role={this.role}>\n <div\n part=\"alert\"\n class={{\n alert: true,\n [`alert-${this.color}`]: Boolean(this.color)\n }}\n >\n {!this.noIcon && <cat-icon size=\"l\" icon={this.icon ? this.icon : this.mapIcon.get(this.color)}></cat-icon>}\n <div class=\"content\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n\n private get role() {\n switch (this.color) {\n case 'danger':\n case 'warning':\n return 'alert';\n default:\n return 'status';\n }\n }\n}\n"]}

package/dist/collection/components/cat-input/cat-input.js CHANGED Viewed

@@ -465,9 +465,14 @@ export class CatInput {
       "type": "string",
       "mutable": false,
       "complexType": {
-        "original": "'text' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'number'",
-        "resolved": "\"email\" | \"number\" | \"password\" | \"search\" | \"tel\" | \"text\" | \"url\"",
-        "references": {}
+        "original": "InputType",
+        "resolved": "\"button\" | \"color\" | \"date\" | \"datetime-local\" | \"email\" | \"file\" | \"month\" | \"number\" | \"password\" | \"range\" | \"reset\" | \"search\" | \"submit\" | \"tel\" | \"text\" | \"time\" | \"url\" | \"week\"",
+        "references": {
+          "InputType": {
+            "location": "import",
+            "path": "./input-type"
+          }
+        }
       },
       "required": false,
       "optional": false,

package/dist/collection/components/cat-input/cat-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cat-input.js","sourceRoot":"","sources":["../../../src/components/cat-input/cat-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State } from '@stencil/core';\nimport log from 'loglevel';\nimport { CatFormHint } from '../cat-form-hint/cat-form-hint';\nimport { CatI18nRegistry } from '../cat-i18n/cat-i18n-registry';\n\nlet nextUniqueId = 0;\n\n/*\n Inputs are used to allow users to provide text input when the expected input\n * is short. As well as plain text, Input supports various types of text,\n * including passwords and numbers.\n \n @slot hint - Optional hint element to be displayed with the input.\n * @slot label - The slotted label. If both the label property and the label slot are present, only the label slot will be displayed.\n * @part label - The label content.\n * @part prefix - The text prefix.\n * @part suffix - The text suffix.\n /\n@Component({\n tag: 'cat-input',\n styleUrl: 'cat-input.scss',\n shadow: true\n})\nexport class CatInput {\n private readonly i18n = CatI18nRegistry.getInstance();\n private readonly id = `cat-input-${nextUniqueId++}`;\n private input!: HTMLInputElement;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n /\n Hint for form autofill feature.\n /\n @Prop() autoComplete?: string;\n\n /\n Whether the input should show a clear button.\n /\n @Prop() clearable = false;\n\n /\n Whether the input is disabled.\n /\n @Prop() disabled = false;\n\n /\n Optional hint text(s) to be displayed with the input.\n /\n @Prop() hint?: string \| string[];\n\n /\n The name of an icon to be displayed in the input.\n /\n @Prop() icon?: string;\n\n /\n Display the icon on the right.\n /\n @Prop() iconRight = false;\n\n /\n The label for the input.\n /\n @Prop() label = '';\n\n /\n Visually hide the label, but still show it to assistive technologies like screen readers.\n /\n @Prop() labelHidden = false;\n\n /\n A maximum value for numeric values.\n /\n @Prop() max?: number;\n\n /\n A maximum length (number of characters) for textual values.\n /\n @Prop() maxLength?: number;\n\n /\n A minimum value for numeric values.\n /\n @Prop() min?: number;\n\n /\n A minimum length (number of characters) for textual values.\n /\n @Prop() minLength?: number;\n\n /\n The name of the form control. Submitted with the form as part of a name/value pair.\n /\n @Prop() name = '';\n\n /\n The placeholder text to display within the input.\n /\n @Prop() placeholder?: string;\n\n /\n A textual prefix to be displayed in the input.\n /\n @Prop() textPrefix?: string;\n\n /\n A textual suffix to be displayed in the input.\n /\n @Prop() textSuffix?: string;\n\n /\n The value is not editable.\n /\n @Prop() readonly = false;\n\n /\n A value is required or must be check for the form to be submittable.\n /\n @Prop() required = false;\n\n /\n Use round input edges.\n /\n @Prop() round = false;\n\n /\n Type of form control.\n /\n @Prop() type: 'text' \| 'email' \| 'password' \| 'tel' \| 'url' \| 'search' \| 'number' = 'text';\n\n /\n The value of the control.\n /\n @Prop({ mutable: true }) value?: string \| number;\n\n /\n Emitted when the value is changed.\n /\n @Event() catChange!: EventEmitter;\n\n /\n Emitted when the input received focus.\n /\n @Event() catFocus!: EventEmitter<FocusEvent>;\n\n /\n Emitted when the input loses focus.\n /\n @Event() catBlur!: EventEmitter<FocusEvent>;\n\n componentWillRender(): void {\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n if (!this.label && !this.hasSlottedLabel) {\n log.error('[A11y] Missing ARIA label on input', this);\n }\n }\n\n /\n Sets focus on the input. Use this method instead of `input.focus()`.\n \n @param options An optional object providing options to control aspects of\n * the focusing process.\n /\n @Method()\n async setFocus(options?: FocusOptions): Promise<void> {\n this.input.focus(options);\n }\n\n /\n Clear the input.\n */\n @Method()\n async clear(): Promise<void> {\n this.value = '';\n }\n\n render() {\n return (\n <Host>\n {(this.hasSlottedLabel \|\| this.label) && (\n <label htmlFor={this.id} class={{ hidden: this.labelHidden }}>\n <span part=\"label\">\n {(this.hasSlottedLabel && <slot name=\"label\"></slot>) \|\| this.label}\n {!this.required && (\n <span class=\"input-optional\" aria-hidden=\"true\">\n ({this.i18n.t('input.optional')})\n </span>\n )}\n </span>\n </label>\n )}\n <div\n class={{\n 'input-wrapper': true,\n 'input-round': this.round,\n 'input-disabled': this.disabled\n }}\n onClick={() => this.input.focus()}\n >\n {this.textPrefix && (\n <span class=\"text-prefix\" part=\"prefix\">\n {this.textPrefix}\n </span>\n )}\n {this.icon && !this.iconRight && <cat-icon icon={this.icon} class=\"icon-prefix\" size=\"l\"></cat-icon>}\n <div class=\"input-inner-wrapper\">\n <input\n ref={el => (this.input = el as HTMLInputElement)}\n id={this.id}\n class={{\n 'has-clearable': this.clearable && !this.disabled\n }}\n autocomplete={this.autoComplete}\n disabled={this.disabled}\n max={this.max}\n maxlength={this.maxLength}\n min={this.max}\n minlength={this.minLength}\n name={this.name}\n placeholder={this.placeholder}\n readonly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInput.bind(this)}\n onFocus={this.onFocus.bind(this)}\n onBlur={this.onBlur.bind(this)}\n ></input>\n {this.clearable && !this.disabled && this.value && (\n <cat-button\n class=\"clearable\"\n icon=\"cross-circle-outlined\"\n icon-only=\"true\"\n size=\"s\"\n variant=\"text\"\n a11y-label={this.i18n.t('input.clear')}\n onClick={this.clear.bind(this)}\n ></cat-button>\n )}\n </div>\n {this.icon && this.iconRight && <cat-icon icon={this.icon} class=\"icon-suffix\" size=\"l\"></cat-icon>}\n {this.textSuffix && (\n <span class=\"text-suffix\" part=\"suffix\">\n {this.textSuffix}\n </span>\n )}\n </div>\n {this.hintSection}\n </Host>\n );\n }\n\n private get hintSection() {\n const hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n return (\n (this.hint \|\| hasSlottedHint) && (\n <CatFormHint hint={this.hint} slottedHint={hasSlottedHint && <slot name=\"hint\"></slot>} />\n )\n );\n }\n\n private onInput(event: Event) {\n this.value = this.input.value;\n this.catChange.emit(event);\n }\n\n private onFocus(event: FocusEvent) {\n this.catFocus.emit(event);\n }\n\n private onBlur(event: FocusEvent) {\n this.catBlur.emit(event);\n }\n}\n"]}
1	+ {"version":3,"file":"cat-input.js","sourceRoot":"","sources":["../../../src/components/cat-input/cat-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State } from '@stencil/core';\nimport log from 'loglevel';\nimport { CatFormHint } from '../cat-form-hint/cat-form-hint';\nimport { CatI18nRegistry } from '../cat-i18n/cat-i18n-registry';\nimport { InputType } from './input-type';\n\nlet nextUniqueId = 0;\n\n/*\n Inputs are used to allow users to provide text input when the expected input\n * is short. As well as plain text, Input supports various types of text,\n * including passwords and numbers.\n \n @slot hint - Optional hint element to be displayed with the input.\n * @slot label - The slotted label. If both the label property and the label slot are present, only the label slot will be displayed.\n * @part label - The label content.\n * @part prefix - The text prefix.\n * @part suffix - The text suffix.\n /\n@Component({\n tag: 'cat-input',\n styleUrl: 'cat-input.scss',\n shadow: true\n})\nexport class CatInput {\n private readonly i18n = CatI18nRegistry.getInstance();\n private readonly id = `cat-input-${nextUniqueId++}`;\n private input!: HTMLInputElement;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n /\n Hint for form autofill feature.\n /\n @Prop() autoComplete?: string;\n\n /\n Whether the input should show a clear button.\n /\n @Prop() clearable = false;\n\n /\n Whether the input is disabled.\n /\n @Prop() disabled = false;\n\n /\n Optional hint text(s) to be displayed with the input.\n /\n @Prop() hint?: string \| string[];\n\n /\n The name of an icon to be displayed in the input.\n /\n @Prop() icon?: string;\n\n /\n Display the icon on the right.\n /\n @Prop() iconRight = false;\n\n /\n The label for the input.\n /\n @Prop() label = '';\n\n /\n Visually hide the label, but still show it to assistive technologies like screen readers.\n /\n @Prop() labelHidden = false;\n\n /\n A maximum value for numeric values.\n /\n @Prop() max?: number;\n\n /\n A maximum length (number of characters) for textual values.\n /\n @Prop() maxLength?: number;\n\n /\n A minimum value for numeric values.\n /\n @Prop() min?: number;\n\n /\n A minimum length (number of characters) for textual values.\n /\n @Prop() minLength?: number;\n\n /\n The name of the form control. Submitted with the form as part of a name/value pair.\n /\n @Prop() name = '';\n\n /\n The placeholder text to display within the input.\n /\n @Prop() placeholder?: string;\n\n /\n A textual prefix to be displayed in the input.\n /\n @Prop() textPrefix?: string;\n\n /\n A textual suffix to be displayed in the input.\n /\n @Prop() textSuffix?: string;\n\n /\n The value is not editable.\n /\n @Prop() readonly = false;\n\n /\n A value is required or must be check for the form to be submittable.\n /\n @Prop() required = false;\n\n /\n Use round input edges.\n /\n @Prop() round = false;\n\n /\n Type of form control.\n /\n @Prop() type: InputType = 'text';\n\n /\n The value of the control.\n /\n @Prop({ mutable: true }) value?: string \| number;\n\n /\n Emitted when the value is changed.\n /\n @Event() catChange!: EventEmitter;\n\n /\n Emitted when the input received focus.\n /\n @Event() catFocus!: EventEmitter<FocusEvent>;\n\n /\n Emitted when the input loses focus.\n /\n @Event() catBlur!: EventEmitter<FocusEvent>;\n\n componentWillRender(): void {\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n if (!this.label && !this.hasSlottedLabel) {\n log.error('[A11y] Missing ARIA label on input', this);\n }\n }\n\n /\n Sets focus on the input. Use this method instead of `input.focus()`.\n \n @param options An optional object providing options to control aspects of\n * the focusing process.\n /\n @Method()\n async setFocus(options?: FocusOptions): Promise<void> {\n this.input.focus(options);\n }\n\n /\n Clear the input.\n */\n @Method()\n async clear(): Promise<void> {\n this.value = '';\n }\n\n render() {\n return (\n <Host>\n {(this.hasSlottedLabel \|\| this.label) && (\n <label htmlFor={this.id} class={{ hidden: this.labelHidden }}>\n <span part=\"label\">\n {(this.hasSlottedLabel && <slot name=\"label\"></slot>) \|\| this.label}\n {!this.required && (\n <span class=\"input-optional\" aria-hidden=\"true\">\n ({this.i18n.t('input.optional')})\n </span>\n )}\n </span>\n </label>\n )}\n <div\n class={{\n 'input-wrapper': true,\n 'input-round': this.round,\n 'input-disabled': this.disabled\n }}\n onClick={() => this.input.focus()}\n >\n {this.textPrefix && (\n <span class=\"text-prefix\" part=\"prefix\">\n {this.textPrefix}\n </span>\n )}\n {this.icon && !this.iconRight && <cat-icon icon={this.icon} class=\"icon-prefix\" size=\"l\"></cat-icon>}\n <div class=\"input-inner-wrapper\">\n <input\n ref={el => (this.input = el as HTMLInputElement)}\n id={this.id}\n class={{\n 'has-clearable': this.clearable && !this.disabled\n }}\n autocomplete={this.autoComplete}\n disabled={this.disabled}\n max={this.max}\n maxlength={this.maxLength}\n min={this.max}\n minlength={this.minLength}\n name={this.name}\n placeholder={this.placeholder}\n readonly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInput.bind(this)}\n onFocus={this.onFocus.bind(this)}\n onBlur={this.onBlur.bind(this)}\n ></input>\n {this.clearable && !this.disabled && this.value && (\n <cat-button\n class=\"clearable\"\n icon=\"cross-circle-outlined\"\n icon-only=\"true\"\n size=\"s\"\n variant=\"text\"\n a11y-label={this.i18n.t('input.clear')}\n onClick={this.clear.bind(this)}\n ></cat-button>\n )}\n </div>\n {this.icon && this.iconRight && <cat-icon icon={this.icon} class=\"icon-suffix\" size=\"l\"></cat-icon>}\n {this.textSuffix && (\n <span class=\"text-suffix\" part=\"suffix\">\n {this.textSuffix}\n </span>\n )}\n </div>\n {this.hintSection}\n </Host>\n );\n }\n\n private get hintSection() {\n const hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n return (\n (this.hint \|\| hasSlottedHint) && (\n <CatFormHint hint={this.hint} slottedHint={hasSlottedHint && <slot name=\"hint\"></slot>} />\n )\n );\n }\n\n private onInput(event: Event) {\n this.value = this.input.value;\n this.catChange.emit(event);\n }\n\n private onFocus(event: FocusEvent) {\n this.catFocus.emit(event);\n }\n\n private onBlur(event: FocusEvent) {\n this.catBlur.emit(event);\n }\n}\n"]}

package/dist/collection/components/cat-input/input-type.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=input-type.js.map

package/dist/collection/components/cat-input/input-type.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"input-type.js","sourceRoot":"","sources":["../../../src/components/cat-input/input-type.ts"],"names":[],"mappings":"","sourcesContent":["export type InputType =\n | 'button'\n | 'color'\n | 'date'\n | 'datetime-local'\n | 'email'\n | 'file'\n | 'month'\n | 'number'\n | 'password'\n | 'range'\n | 'reset'\n | 'search'\n | 'submit'\n | 'tel'\n | 'text'\n | 'time'\n | 'url'\n | 'week';\n"]}

package/dist/collection/components/cat-notification/cat-notification.js CHANGED Viewed

@@ -2,8 +2,10 @@ import Toastify from 'toastify-js';
 export var TypeIcons;
 (function (TypeIcons) {
   TypeIcons["success"] = "check-circle-filled";
-  TypeIcons["error"] = "sparkle-filled";
-  TypeIcons["info"] = "sparkle-filled";
+  TypeIcons["error"] = "cross-circle-filled";
+  TypeIcons["info"] = "danger-filled";
+  TypeIcons["primary"] = "star-circle-filled";
+  TypeIcons["secondary"] = "info-circle-filled";
 })(TypeIcons || (TypeIcons = {}));
 export const ToastPositions = {
   'top-left': {
@@ -32,16 +34,36 @@ export const ToastPositions = {
   }
 };
 class CatNotificationService {
+  error(title, message = ' ', options) {
+    const toastOptions = this.extractOptions(title, message, options);
+    Toastify(toastOptions).showToast();
+  }
+  success(title, message = ' ', options) {
+    const toastOptions = this.extractOptions(title, message, options);
+    Toastify(toastOptions).showToast();
+  }
+  info(title, message = ' ', options) {
+    const toastOptions = this.extractOptions(title, message, options);
+    Toastify(toastOptions).showToast();
+  }
+  primary(title, message = ' ', options) {
+    const toastOptions = this.extractOptions(title, message, options);
+    Toastify(toastOptions).showToast();
+  }
+  secondary(title, message = ' ', options) {
+    const toastOptions = this.extractOptions(title, message, options);
+    Toastify(toastOptions).showToast();
+  }
   toastHTMLTemplate(title, message = ' ', options) {
     var _a;
     const template = document.createElement('template');
-    const typeIcon = (options === null || options === void 0 ? void 0 : options.type) ? TypeIcons[options.type] : TypeIcons.info;
+    const typeIcon = (options === null || options === void 0 ? void 0 : options.type) ? TypeIcons[options.type] : TypeIcons.secondary;
     title = title.trim();
     message = message.trim();
     const hasMessage = message && message !== '';
     const hasMessageClass = hasMessage ? 'has-message' : '';
     template.innerHTML = `<div class="cat-toastify-wrapper">
-        <div class="cat-toastify-icon-wrapper ${(_a = options === null || options === void 0 ? void 0 : options.type) !== null && _a !== void 0 ? _a : 'info'}">
+        <div class="cat-toastify-icon-wrapper ${(_a = options === null || options === void 0 ? void 0 : options.type) !== null && _a !== void 0 ? _a : 'secondary'}">
              <cat-icon icon="${typeIcon}"></cat-icon>
         </div>
         <div class="cat-toastify-title-wrapper ${hasMessageClass}">
@@ -50,57 +72,34 @@ class CatNotificationService {
       </div>`;
     return template.content.firstChild;
   }
-  error(title, message = ' ', options) {
-    const position = this.getPosition(options);
-    const toastOptions = {
-      node: (options === null || options === void 0 ? void 0 : options.content) ? options.content : this.toastHTMLTemplate(title, message, options),
-      duration: CatNotificationService.DURATION,
-      close: true,
-      className: 'cat-toastify',
-      gravity: position.gravity,
-      position: position.position,
-      stopOnFocus: true
-    };
-    Toastify(toastOptions).showToast();
-  }
-  success(title, message = ' ', options) {
-    const position = this.getPosition(options);
-    const toastOptions = {
-      node: (options === null || options === void 0 ? void 0 : options.content) ? options.content : this.toastHTMLTemplate(title, message, options),
-      duration: CatNotificationService.DURATION,
-      close: true,
-      className: 'cat-toastify',
-      gravity: position.gravity,
-      position: position.position,
-      stopOnFocus: true
+  getPosition(options) {
+    const position = {
+      gravity: 'bottom',
+      position: 'left'
     };
-    Toastify(toastOptions).showToast();
+    if ((options === null || options === void 0 ? void 0 : options.position) && ToastPositions[options.position]) {
+      position.position = ToastPositions[options.position].position;
+      position.gravity = ToastPositions[options.position].gravity;
+    }
+    return position;
   }
-  info(title, message = ' ', options) {
+  extractOptions(title, message = ' ', options) {
     const position = this.getPosition(options);
-    const toastOptions = {
+    return {
       node: (options === null || options === void 0 ? void 0 : options.content) ? options.content : this.toastHTMLTemplate(title, message, options),
       duration: CatNotificationService.DURATION,
       close: true,
       className: 'cat-toastify',
       gravity: position.gravity,
       position: position.position,
-      stopOnFocus: true
+      stopOnFocus: true,
+      offset: {
+        x: '1.5rem',
+        y: '1.5rem'
+      }
     };
-    Toastify(toastOptions).showToast();
-  }
-  getPosition(options) {
-    const position = {
-      gravity: 'bottom',
-      position: 'right'
-    };
-    if ((options === null || options === void 0 ? void 0 : options.position) && ToastPositions[options.position]) {
-      position.position = ToastPositions[options.position].position;
-      position.gravity = ToastPositions[options.position].gravity;
-    }
-    return position;
   }
 }
-CatNotificationService.DURATION = 8000;
+CatNotificationService.DURATION = 80000;
 export const NotificationsService = new CatNotificationService();
 //# sourceMappingURL=cat-notification.js.map

package/dist/collection/components/cat-notification/cat-notification.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cat-notification.js","sourceRoot":"","sources":["../../../src/components/cat-notification/cat-notification.tsx"],"names":[],"mappings":"AAAA,OAAO,QAAqB,MAAM,aAAa,CAAC;AAEhD,MAAM,CAAN,IAAY,~~SAIX~~;~~AAJD~~,WAAY,SAAS;EACnB,4CAAiC,CAAA;EACjC,~~qCAA0B~~,CAAA;~~EAC1B~~,~~oCAAyB~~,CAAA;~~AAC3B~~,CAAC,~~EAJW~~,SAAS,KAAT,SAAS,~~QAIpB~~;AAED,MAAM,CAAC,MAAM,cAAc,GAA4F;EACrH,UAAU,EAAE;IACV,OAAO,EAAE,KAAK;IACd,QAAQ,EAAE,MAAM;GACjB;EACD,YAAY,EAAE;IACZ,OAAO,EAAE,KAAK;IACd,QAAQ,EAAE,QAAQ;GACnB;EACD,WAAW,EAAE;IACX,OAAO,EAAE,KAAK;IACd,QAAQ,EAAE,OAAO;GAClB;EACD,aAAa,EAAE;IACb,OAAO,EAAE,QAAQ;IACjB,QAAQ,EAAE,MAAM;GACjB;EACD,eAAe,EAAE;IACf,OAAO,EAAE,QAAQ;IACjB,QAAQ,EAAE,QAAQ;GACnB;EACD,cAAc,EAAE;IACd,OAAO,EAAE,QAAQ;IACjB,QAAQ,EAAE,OAAO;GAClB;CACF,CAAC;AAkCF,MAAM,sBAAsB;EAG1B,~~iBAAiB~~,CAAC,KAAa,EAAE,OAAO,GAAG,GAAG,EAAE,OAA+B~~;;IAC7E~~,MAAM,~~QAAQ~~,~~GAAG~~,~~QAAQ~~,CAAC,~~aAAa~~,CAAC,~~UAAU~~,CAAC,CAAC;~~IACpD~~,~~MAAM,~~QAAQ,~~GAAG~~,~~CAAA~~,~~OAAO~~,~~aAAP~~,OAAO,~~uBAAP~~,OAAO,~~CAAE~~,~~IAAI~~,~~EAAC~~,~~CAAC~~,CAAC,~~SAAS~~,CAAC,OAAO,~~CAAC~~,~~IAAI~~,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC~~;IAC1E~~,~~KAAK~~,GAAG,~~KAAK~~,~~CAAC~~,IAAI,~~EAAE~~,CAAC~~;IACrB~~,OAAO,~~GAAG~~,OAAO,CAAC,~~IAAI~~,EAAE,CAAC;~~IACzB~~,~~MAAM~~,~~UAAU~~,~~GAAG~~,~~OAAO~~,~~IAAI~~,OAAO,~~KAAK~~,EAAE,~~CAAC~~;~~IAC7C~~,MAAM,~~eAAe~~,~~GAAG~~,~~UAAU~~,CAAC,CAAC,CAAC,~~aAAa~~,CAAC,CAAC,CAAC,EAAE,CAAC;~~IACxD~~,~~QAAQ,~~CAAC,SAAS,~~GAAG;gDACuB~~,~~MAAA~~,~~OAAO~~,~~aAAP,~~OAAO,~~uBAAP~~,~~OAAO~~,~~CAAE~~,~~IAAI~~,~~mCAAI,~~MAAM~~;+BACxC~~,~~QAAQ;;iDAEU~~,~~eAAe;8CAClB~~,~~KAAK;UACzC~~,~~UAAU,~~CAAC,~~CAAC~~,CAAC,~~qCAAqC~~,OAAO,~~QAAQ~~,~~CAAC~~,CAAC,CAAC~~,EAAE~~;~~aACnE~~,CAAC~~;IACV~~,~~OAAO~~,~~QAAQ~~,CAAC,~~OAAO~~,~~CAAC~~,~~UAAyB,~~CAAC;~~EACpD~~,CAAC;~~EAED~~,~~KAAK~~,CAAC,KAAa,EAAE,OAAO,GAAG,GAAG,EAAE,OAA+B~~;IACjE~~,MAAM,QAAQ,~~GAAkB~~,~~IAAI~~,CAAC,~~WAAW~~,CAAC,~~OAAO~~,CAAC,CAAC;~~IAC1D~~,MAAM,~~YAAY~~,~~GAAY;MAC5B~~,~~IAAI,EAAE,~~CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,~~OAAO~~,EAAC,CAAC,CAAC,~~OAAO~~,CAAC,OAAO,CAAC,CAAC,CAAC,~~IAAI~~,CAAC,~~iBAAiB~~,CAAC,KAAK,EAAE,OAAO,~~EAAE~~,OAAO,CAAC~~;MAC1F~~,~~QAAQ~~,EAAE,~~sBAAsB,~~CAAC~~,QAAQ~~;~~MACzC~~,~~KAAK~~,~~EAAE~~,IAAI~~;MACX~~,~~SAAS~~,EAAE,~~cAAc~~;~~MACzB~~,~~OAAO~~,~~EAAE~~,~~QAAQ~~,CAAC,~~OAAO;MACzB~~,~~QAAQ~~,EAAE,QAAQ,CAAC,~~QAAQ~~;~~MAC3B~~,WAAW,~~EAAE~~,~~IAAI~~;~~KAClB~~,~~CAAC~~;~~IACF~~,~~QAAQ~~,CAAC,~~YAAY~~,CAAC,CAAC,~~SAAS~~,EAAE,CAAC;~~EACrC~~,CAAC~~;EAED~~,OAAO,CAAC,~~KAAa~~,~~EAAE~~,~~OAAO~~,~~GAAG~~,~~GAAG~~,~~EAAE,~~OAA+B;~~IACnE~~,MAAM,QAAQ,GAAkB,~~IAAI~~,~~CAAC~~,~~WAAW~~,~~CAAC~~,~~OAAO~~,~~CAAC~~,CAAC;~~IAC1D~~,~~MAAM,YAAY,GAAY;MAC5B,~~IAAI,~~EAAE,~~CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,~~OAAO~~,~~EAAC~~,~~CAAC~~,CAAC,OAAO,CAAC,~~OAAO~~,CAAC,~~CAAC~~,CAAC,~~IAAI~~,~~CAAC~~,~~iBAAiB~~,CAAC,~~KAAK,EAAE,~~OAAO,~~EAAE,OAAO,~~CAAC~~;MAC1F~~,QAAQ,~~EAAE~~,~~sBAAsB,~~CAAC,QAAQ~~;MACzC~~,~~KAAK,EAAE,IAAI~~;~~MACX~~,~~SAAS~~,~~EAAE~~,~~cAAc;MACzB,~~OAAO,~~EAAE~~,~~QAAQ~~,CAAC,OAAO~~;MACzB~~,~~QAAQ,EAAE,QAAQ,~~CAAC,QAAQ~~;MAC3B~~,~~WAAW,EAAE,IAAI;KAClB,~~CAAC~~;IACF~~,~~QAAQ,~~CAAC,~~YAAY~~,CAAC,~~CAAC~~,~~SAAS~~,~~EAAE,~~CAAC;~~EACrC~~,CAAC;~~EAED~~,~~IAAI~~,CAAC,KAAa,EAAE,OAAO,GAAG,GAAG,EAAE,OAA+B;~~IAChE~~,MAAM,QAAQ,GAAkB,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAC1D,~~MAAM,YAAY,GAAY~~;~~MAC5B~~,IAAI,EAAE,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,EAAC,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC;MAC1F,QAAQ,EAAE,sBAAsB,CAAC,QAAQ;MACzC,KAAK,EAAE,IAAI;MACX,SAAS,EAAE,cAAc;MACzB,OAAO,EAAE,QAAQ,CAAC,OAAO;MACzB,QAAQ,EAAE,QAAQ,CAAC,QAAQ;MAC3B,WAAW,EAAE,IAAI;~~KAClB~~,~~CAAC;IACF~~,~~QAAQ,CAAC,YAAY,CAAC,CAAC,SAAS,~~EAAE~~,CAAC~~;~~EACrC~~,CAAC~~;EAEO~~,~~WAAW,CAAC,OAA+B;IACjD,MAAM,QAAQ,GAAkB;MAC9B,OAAO,~~EAAE,QAAQ;~~MACjB~~,~~QAAQ,EAAE,OAAO;KAClB,~~CAAC~~;IACF~~,~~IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,KAAI,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,~~EAAE~~;MACzD~~,QAAQ~~,CAAC,QAAQ,GAAG,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC~~;~~MAC9D,QAAQ,CAAC,OAAO,GAAG,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC~~;~~KAC7D;IACD~~,~~OAAO,QAAQ,~~CAAC;~~EAClB~~,CAAC;;AAxEc,+BAAQ,GAAG,~~IAAI~~,CAAC;~~AA2EjC~~,MAAM,CAAC,MAAM,oBAAoB,GAAG,IAAI,sBAAsB,EAAE,CAAC","sourcesContent":["import Toastify, { Options } from 'toastify-js';\n\nexport enum TypeIcons {\n 'success' = 'check-circle-filled',\n 'error' = '~~sparkle~~-filled',\n 'info' = '~~sparkle~~-filled'\n}\n\nexport const ToastPositions: { [key: string]: { gravity: 'top' \| 'bottom'; position: 'left' \| 'center' \| 'right' } } = {\n 'top-left': {\n gravity: 'top',\n position: 'left'\n },\n 'top-center': {\n gravity: 'top',\n position: 'center'\n },\n 'top-right': {\n gravity: 'top',\n position: 'right'\n },\n 'bottom-left': {\n gravity: 'bottom',\n position: 'left'\n },\n 'bottom-center': {\n gravity: 'bottom',\n position: 'center'\n },\n 'bottom-right': {\n gravity: 'bottom',\n position: 'right'\n }\n};\n\nexport interface ToastPosition {\n gravity: 'top' \| 'bottom';\n position: 'left' \| 'center' \| 'right';\n}\n\nexport interface ToastOptions {\n /*\n HTML content of the toast\n /\n content: Node;\n /\n Show close button\n /\n close: boolean;\n /\n Toast position\n /\n position: 'top-left' \| 'top-center' \| 'top-right' \| 'bottom-left' \| 'bottom-center' \| 'bottom-right';\n /\n Type of toast\n /\n type: 'success' \| 'info' \| 'error';\n /\n Invoked when the toast is clicked\n /\n onClick: () => void;\n /\n Toggle the default behavior of escaping HTML markup\n */\n escapeMarkup: boolean;\n}\n\nclass CatNotificationService {\n private static DURATION = ~~8000~~;\n\n toastHTMLTemplate(title: string, message = ' ', options?: Partial<ToastOptions>): HTMLElement {\n const template = document.createElement('template');\n const typeIcon = options?.type ? TypeIcons[options.type] : TypeIcons.~~info~~;\n title = title.trim();\n message = message.trim();\n const hasMessage = message && message !== '';\n const hasMessageClass = hasMessage ? 'has-message' : '';\n template.innerHTML = `<div class=\"cat-toastify-wrapper\">\n <div class=\"cat-toastify-icon-wrapper ${options?.type ?? '~~info~~'}\">\n <cat-icon icon=\"${typeIcon}\"></cat-icon>\n </div>\n <div class=\"cat-toastify-title-wrapper ${hasMessageClass}\">\n <div class=\"cat-toastify-title\">${title}</div></div>\n ${hasMessage ? `<div class=\"cat-toastify-message\">${message}</div>` : ''}\n </div>`;\n return template.content.firstChild as HTMLElement;\n }\n\n ~~error~~(~~title: string, message = ' ',~~ options?: Partial<ToastOptions>): ~~void~~ {\n const position: ToastPosition = ~~this.getPosition(options);\n const toastOptions: Options =~~ {\n ~~node~~: ~~options?.content ? options.content : this.toastHTMLTemplate(title, message, options),\n duration: CatNotificationService.DURATION,\n close: true,\n className:~~ '~~cat-toastify~~',\n ~~gravity:~~ position~~.gravity,\n position~~: ~~position.position,\n stopOnFocus: true~~\n };\n ~~Toastify~~(~~toastOptions).showToast();\n }\n\n success(title:~~ ~~string,~~ ~~message = ' ',~~ options~~?: Partial<ToastOptions>~~): ~~void~~ {\n ~~const~~ position: ~~ToastPosition~~ = ~~this~~.~~getPosition(options)~~;\n ~~const toastOptions: Options = {\n~~ ~~node: options?.content ? options~~.~~content~~ : ~~this.toastHTMLTemplate(title, message,~~ options~~),\n duration: CatNotificationService~~.~~DURATION,\n close: true,\n className: 'cat-toastify',\n gravity:~~ position.gravity,\n ~~position: position.position,\n stopOnFocus: true\n~~ };\n ~~Toastify(toastOptions).showToast()~~;\n }\n\n ~~info~~(title: string, message = ' ', options?: Partial<ToastOptions>): ~~void~~ {\n const position: ToastPosition = this.getPosition(options);\n ~~const~~ ~~toastOptions: Options =~~ {\n node: options?.content ? options.content : this.toastHTMLTemplate(title, message, options),\n duration: CatNotificationService.DURATION,\n close: true,\n className: 'cat-toastify',\n gravity: position.gravity,\n position: position.position,\n stopOnFocus: true\n ~~};\n Toastify(toastOptions).showToast();\n }\n\n private getPosition(options?: Partial<ToastOptions>)~~: ~~ToastPosition~~ {\n ~~const position~~: ~~ToastPosition = {\n gravity:~~ '~~bottom~~',\n ~~position~~: '~~right~~'\n }~~;\n if (options?.position && ToastPositions[options.position]) {~~\n ~~position.position = ToastPositions[options.position].position;\n position.gravity = ToastPositions[options.position].gravity;\n~~ }~~\n return position~~;\n }\n}\n\nexport const NotificationsService = new CatNotificationService();\n"]}
1	+ {"version":3,"file":"cat-notification.js","sourceRoot":"","sources":["../../../src/components/cat-notification/cat-notification.tsx"],"names":[],"mappings":"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","sourcesContent":["import Toastify, { Options } from 'toastify-js';\n\nexport enum TypeIcons {\n 'success' = 'check-circle-filled',\n 'error' = 'cross-circle-filled',\n 'info' = 'danger-filled',\n 'primary' = 'star-circle-filled',\n 'secondary' = 'info-circle-filled'\n}\n\nexport const ToastPositions: { [key: string]: { gravity: 'top' \| 'bottom'; position: 'left' \| 'center' \| 'right' } } = {\n 'top-left': {\n gravity: 'top',\n position: 'left'\n },\n 'top-center': {\n gravity: 'top',\n position: 'center'\n },\n 'top-right': {\n gravity: 'top',\n position: 'right'\n },\n 'bottom-left': {\n gravity: 'bottom',\n position: 'left'\n },\n 'bottom-center': {\n gravity: 'bottom',\n position: 'center'\n },\n 'bottom-right': {\n gravity: 'bottom',\n position: 'right'\n }\n};\n\nexport interface ToastPosition {\n gravity: 'top' \| 'bottom';\n position: 'left' \| 'center' \| 'right';\n}\n\nexport interface ToastOptions {\n /*\n HTML content of the toast\n /\n content: Node;\n /\n Show close button\n /\n close: boolean;\n /\n Toast position\n /\n position: 'top-left' \| 'top-center' \| 'top-right' \| 'bottom-left' \| 'bottom-center' \| 'bottom-right';\n /\n Type of toast\n /\n type: 'success' \| 'info' \| 'error' \| 'primary' \| 'secondary';\n /\n Invoked when the toast is clicked\n /\n onClick: () => void;\n /\n Toggle the default behavior of escaping HTML markup\n */\n escapeMarkup: boolean;\n}\n\nclass CatNotificationService {\n private static DURATION = 80000;\n\n error(title: string, message = ' ', options?: Partial<ToastOptions>): void {\n const toastOptions: Options = this.extractOptions(title, message, options);\n Toastify(toastOptions).showToast();\n }\n\n success(title: string, message = ' ', options?: Partial<ToastOptions>): void {\n const toastOptions: Options = this.extractOptions(title, message, options);\n Toastify(toastOptions).showToast();\n }\n\n info(title: string, message = ' ', options?: Partial<ToastOptions>): void {\n const toastOptions: Options = this.extractOptions(title, message, options);\n Toastify(toastOptions).showToast();\n }\n\n primary(title: string, message = ' ', options?: Partial<ToastOptions>): void {\n const toastOptions: Options = this.extractOptions(title, message, options);\n Toastify(toastOptions).showToast();\n }\n\n secondary(title: string, message = ' ', options?: Partial<ToastOptions>): void {\n const toastOptions: Options = this.extractOptions(title, message, options);\n Toastify(toastOptions).showToast();\n }\n\n private toastHTMLTemplate(title: string, message = ' ', options?: Partial<ToastOptions>): HTMLElement {\n const template = document.createElement('template');\n const typeIcon = options?.type ? TypeIcons[options.type] : TypeIcons.secondary;\n title = title.trim();\n message = message.trim();\n const hasMessage = message && message !== '';\n const hasMessageClass = hasMessage ? 'has-message' : '';\n template.innerHTML = `<div class=\"cat-toastify-wrapper\">\n <div class=\"cat-toastify-icon-wrapper ${options?.type ?? 'secondary'}\">\n <cat-icon icon=\"${typeIcon}\"></cat-icon>\n </div>\n <div class=\"cat-toastify-title-wrapper ${hasMessageClass}\">\n <div class=\"cat-toastify-title\">${title}</div></div>\n ${hasMessage ? `<div class=\"cat-toastify-message\">${message}</div>` : ''}\n </div>`;\n return template.content.firstChild as HTMLElement;\n }\n\n private getPosition(options?: Partial<ToastOptions>): ToastPosition {\n const position: ToastPosition = {\n gravity: 'bottom',\n position: 'left'\n };\n if (options?.position && ToastPositions[options.position]) {\n position.position = ToastPositions[options.position].position;\n position.gravity = ToastPositions[options.position].gravity;\n }\n return position;\n }\n\n private extractOptions(title: string, message = ' ', options?: Partial<ToastOptions>): Options {\n const position: ToastPosition = this.getPosition(options);\n return {\n node: options?.content ? options.content : this.toastHTMLTemplate(title, message, options),\n duration: CatNotificationService.DURATION,\n close: true,\n className: 'cat-toastify',\n gravity: position.gravity,\n position: position.position,\n stopOnFocus: true,\n offset: {\n x: '1.5rem',\n y: '1.5rem'\n }\n };\n }\n}\n\nexport const NotificationsService = new CatNotificationService();\n"]}

package/dist/collection/components/cat-tab/cat-tab.js CHANGED Viewed

@@ -57,7 +57,7 @@ export class CatTab {
         "text": "The label of the tab."
       },
       "attribute": "label",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "''"
     },
     "icon": {
@@ -75,7 +75,7 @@ export class CatTab {
         "text": "The name of an icon to be displayed in the tab."
       },
       "attribute": "icon",
-      "reflect": false
+      "reflect": true
     },
     "iconOnly": {
       "type": "any",
@@ -97,7 +97,7 @@ export class CatTab {
         "text": "Hide the actual button content and only display the tab."
       },
       "attribute": "icon-only",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "false"
     },
     "iconRight": {
@@ -115,7 +115,7 @@ export class CatTab {
         "text": "Display the icon on the right."
       },
       "attribute": "icon-right",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "false"
     },
     "url": {
@@ -133,7 +133,7 @@ export class CatTab {
         "text": "A destination to link to, rendered in the href attribute of a link."
       },
       "attribute": "url",
-      "reflect": false
+      "reflect": true
     },
     "urlTarget": {
       "type": "string",
@@ -150,7 +150,7 @@ export class CatTab {
         "text": "Specifies where to open the linked document."
       },
       "attribute": "url-target",
-      "reflect": false
+      "reflect": true
     },
     "deactivated": {
       "type": "boolean",
@@ -167,7 +167,7 @@ export class CatTab {
         "text": "Specifies that the tab should be deactivated."
       },
       "attribute": "deactivated",
-      "reflect": false,
+      "reflect": true,
       "defaultValue": "false"
     }
   }; }

package/dist/collection/components/cat-tab/cat-tab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cat-tab.js","sourceRoot":"","sources":["../../../src/components/cat-tab/cat-tab.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAG/F,IAAI,YAAY,GAAG,CAAC,CAAC;AAErB;;GAEG;AAMH,MAAM,OAAO,MAAM;EALnB;IAQE;;OAEG;~~IACK~~,UAAK,GAAG,EAAE,CAAC;~~IAOnB~~;;OAEG;~~IACK~~,aAAQ,GAAyB,KAAK,CAAC;~~IAE/C~~;;OAEG;~~IACK~~,cAAS,GAAG,KAAK,CAAC;~~IAY1B~~;;OAEG;~~IACK~~,gBAAW,GAAG,KAAK,CAAC;~~GAqB7B~~;EAdC,iBAAiB;IACf,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,EAAE;MACxB,IAAI,CAAC,WAAW,CAAC,EAAE,GAAG,WAAW,YAAY,EAAE,EAAE,CAAC;KACnD;EACH,CAAC;EAGD,OAAO,CAAC,KAAiB;IACvB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EAC5B,CAAC;EAED,MAAM;IACJ,OAAO,EAAC,IAAI,OAAQ,CAAC;EACvB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Listen, Host, Element } from '@stencil/core';\nimport { Breakpoint } from '../../utils/breakpoints';\n\nlet nextUniqueId = 0;\n\n/*\n A single tab inside a tabs component.\n /\n@Component({\n tag: 'cat-tab',\n styleUrl: 'cat-tab.scss',\n shadow: true\n})\nexport class CatTab {\n @Element() hostElement!: HTMLElement;\n\n /\n The label of the tab.\n /\n @Prop() label = '';\n\n /\n The name of an icon to be displayed in the tab.\n /\n @Prop() icon?: string;\n\n /\n Hide the actual button content and only display the tab.\n /\n @Prop() iconOnly: boolean \| Breakpoint = false;\n\n /\n Display the icon on the right.\n /\n @Prop() iconRight = false;\n\n /\n A destination to link to, rendered in the href attribute of a link.\n /\n @Prop() url?: string;\n\n /\n Specifies where to open the linked document.\n /\n @Prop() urlTarget?: '_blank' \| '_self';\n\n /\n Specifies that the tab should be deactivated.\n /\n @Prop() deactivated = false;\n\n /\n Emitted when tab is clicked.\n */\n @Event() tabClick!: EventEmitter<MouseEvent>;\n\n connectedCallback() {\n if (!this.hostElement.id) {\n this.hostElement.id = `cat-tab-${nextUniqueId++}`;\n }\n }\n\n @Listen('click')\n onClick(event: MouseEvent) {\n this.tabClick.emit(event);\n }\n\n render() {\n return <Host></Host>;\n }\n}\n"]}
1	+ {"version":3,"file":"cat-tab.js","sourceRoot":"","sources":["../../../src/components/cat-tab/cat-tab.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAG/F,IAAI,YAAY,GAAG,CAAC,CAAC;AAErB;;GAEG;AAMH,MAAM,OAAO,MAAM;EALnB;IAQE;;OAEG;IACsB,UAAK,GAAG,EAAE,CAAC;IAOpC;;OAEG;IACsB,aAAQ,GAAyB,KAAK,CAAC;IAEhE;;OAEG;IACsB,cAAS,GAAG,KAAK,CAAC;IAY3C;;OAEG;IACsB,gBAAW,GAAG,KAAK,CAAC;GAqB9C;EAdC,iBAAiB;IACf,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,EAAE;MACxB,IAAI,CAAC,WAAW,CAAC,EAAE,GAAG,WAAW,YAAY,EAAE,EAAE,CAAC;KACnD;EACH,CAAC;EAGD,OAAO,CAAC,KAAiB;IACvB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EAC5B,CAAC;EAED,MAAM;IACJ,OAAO,EAAC,IAAI,OAAQ,CAAC;EACvB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Listen, Host, Element } from '@stencil/core';\nimport { Breakpoint } from '../../utils/breakpoints';\n\nlet nextUniqueId = 0;\n\n/*\n A single tab inside a tabs component.\n /\n@Component({\n tag: 'cat-tab',\n styleUrl: 'cat-tab.scss',\n shadow: true\n})\nexport class CatTab {\n @Element() hostElement!: HTMLElement;\n\n /\n The label of the tab.\n /\n @Prop({ reflect: true }) label = '';\n\n /\n The name of an icon to be displayed in the tab.\n /\n @Prop({ reflect: true }) icon?: string;\n\n /\n Hide the actual button content and only display the tab.\n /\n @Prop({ reflect: true }) iconOnly: boolean \| Breakpoint = false;\n\n /\n Display the icon on the right.\n /\n @Prop({ reflect: true }) iconRight = false;\n\n /\n A destination to link to, rendered in the href attribute of a link.\n /\n @Prop({ reflect: true }) url?: string;\n\n /\n Specifies where to open the linked document.\n /\n @Prop({ reflect: true }) urlTarget?: '_blank' \| '_self';\n\n /\n Specifies that the tab should be deactivated.\n /\n @Prop({ reflect: true }) deactivated = false;\n\n /\n Emitted when tab is clicked.\n */\n @Event() tabClick!: EventEmitter<MouseEvent>;\n\n connectedCallback() {\n if (!this.hostElement.id) {\n this.hostElement.id = `cat-tab-${nextUniqueId++}`;\n }\n }\n\n @Listen('click')\n onClick(event: MouseEvent) {\n this.tabClick.emit(event);\n }\n\n render() {\n return <Host></Host>;\n }\n}\n"]}

package/dist/collection/components/cat-tabs/cat-tabs.js CHANGED Viewed

@@ -7,8 +7,8 @@ import { Component, h, Element, State, Watch, Listen, Host, Prop } from '@stenci
  */
 export class CatTabs {
   constructor() {
-    this.tabs = [];
     this.buttons = [];
+    this.tabs = [];
     /**
      * The ID of the active tab.
      */
@@ -23,11 +23,24 @@ export class CatTabs {
     activeTab === null || activeTab === void 0 ? void 0 : activeTab.click();
   }
   componentWillLoad() {
-    this.tabs = Array.from(this.hostElement.querySelectorAll('cat-tab'));
+    this.syncTabs();
     if (this.tabs.length) {
       this.activeTabId = this.activeTab;
     }
   }
+  componentDidLoad() {
+    var _a;
+    this.mutationObserver = new MutationObserver(mutations => mutations.some(value => value.target.nodeName === 'CAT-TAB') && this.syncTabs());
+    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.hostElement, {
+      childList: true,
+      attributes: true,
+      subtree: true
+    });
+  }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+  }
   onKeydown(event) {
     var _a;
     if (['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft'].includes(event.key)) {
@@ -57,6 +70,9 @@ export class CatTabs {
       this.buttons.push(button);
     }
   }
+  syncTabs() {
+    this.tabs = Array.from(this.hostElement.querySelectorAll('cat-tab'));
+  }
   static get is() { return "cat-tabs"; }
   static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() { return {
@@ -104,6 +120,7 @@ export class CatTabs {
     }
   }; }
   static get states() { return {
+    "tabs": {},
     "activeTabId": {}
   }; }
   static get elementRef() { return "hostElement"; }

package/dist/collection/components/cat-tabs/cat-tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cat-tabs.js","sourceRoot":"","sources":["../../../src/components/cat-tabs/cat-tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAExF;;;;;GAKG;AAMH,MAAM,OAAO,OAAO;EALpB;IAMU,~~SAAI~~,~~GAAwB~~,EAAE,CAAC;~~IAC/B~~,~~YAAO~~,~~GAA2B~~,EAAE,CAAC;~~IAM7C~~;;OAEG;IACK,cAAS,GAAG,EAAE,CAAC;IAEvB;;OAEG;IACK,cAAS,GAA4C,MAAM,CAAC;~~GAqErE~~;~~EAlEC~~,kBAAkB,CAAC,YAAoB;IACrC,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,YAAY,CAAC,CAAC;IACrE,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,KAAK,EAAE,CAAC;EACrB,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,IAAI,~~GAAG~~,~~KAAK,~~CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC,CAAC~~;IACrE~~,IAAI,~~IAAI~~,CAAC,~~IAAI~~,CAAC,MAAM,EAAE;~~MACpB~~,IAAI,CAAC,~~WAAW~~,~~GAAG~~,IAAI,CAAC,SAAS,CAAC;~~KACnC~~;~~EACH~~,CAAC;EAGD,SAAS,CAAC,KAAoB;;IAC5B,IAAI,CAAC,WAAW,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;MAC3E,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;MACvE,MAAM,aAAa,GAAG,MAAA,IAAI,CAAC,WAAW,CAAC,UAAU,0CAAE,aAAqC,CAAC;MACzF,MAAM,SAAS,GAAG,aAAa,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;MAC7E,MAAM,SAAS,GAAG,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;MAC3E,MAAM,SAAS,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,GAAG,SAAS,GAAG,cAAc,CAAC,MAAM,CAAC,GAAG,cAAc,CAAC,MAAM,CAAC;MAC9G,cAAc,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,CAAC;MACrC,KAAK,CAAC,cAAc,EAAE,CAAC;KACxB;EACH,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,QACF,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAsB,EAAE,EAAE;MACxC,OAAO,CACL,kBACE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,IAAI,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,EAC1C,QAAQ,EAAE,GAAG,CAAC,EAAE,EAChB,IAAI,EAAC,KAAK,EACV,IAAI,EAAC,KAAK,EACV,KAAK,EAAE;UACL,GAAG,EAAE,IAAI;UACT,YAAY,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,IAAI,GAAG,CAAC,EAAE,KAAK,IAAI,CAAC,WAAW,CAAC;SACvE,EACD,KAAK,EAAE,IAAI,CAAC,WAAW,IAAI,GAAG,CAAC,EAAE,KAAK,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EAChF,OAAO,EAAC,MAAM,EACd,IAAI,EAAE,GAAG,CAAC,IAAI,EACd,QAAQ,EAAE,GAAG,CAAC,QAAQ,EACtB,SAAS,EAAE,GAAG,CAAC,SAAS,EACxB,GAAG,EAAE,GAAG,CAAC,GAAG,EACZ,QAAQ,EAAE,GAAG,CAAC,WAAW,EACzB,SAAS,EAAE,GAAG,CAAC,SAAS,EACxB,UAAU,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC,EAAE,CAAC,IAE5C,GAAG,CAAC,KAAK,CACC,CACd,CAAC;IACJ,CAAC,CAAC,CACG,CACR,CAAC;EACJ,CAAC;EAEO,gBAAgB,CAAC,MAA4B;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAE7C,IAAI,OAAO,IAAI,CAAC,EAAE;MAChB,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,MAAM,CAAC;KAChC;SAAM;MACL,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KAC3B;EACH,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, h, Element, State, Watch, Listen, Host, Prop } from '@stencil/core';\n\n/*\n Tabs are used to display multiple panels to be contained within a single\n * window, using tabs as a navigational element.\n \n @part tab - The header of the tab.\n /\n@Component({\n tag: 'cat-tabs',\n styleUrl: 'cat-tabs.scss',\n shadow: true\n})\nexport class CatTabs {\n private ~~tabs~~: ~~HTMLCatTabElement~~[] = [];\n private ~~buttons:~~ ~~HTMLCatButtonElement[] = []~~;\n\n @Element() hostElement!: HTMLElement;\n\n @State() activeTabId?: string;\n\n /\n The ID of the active tab.\n /\n @Prop() activeTab = '';\n\n /\n The alignment of the tabs.\n */\n @Prop() tabsAlign: 'left' \| 'center' \| 'right' \| 'justify' = 'left';\n\n @Watch('activeTabId')\n onActiveTabChanged(newActiveTab: string): void {\n const activeTab = this.tabs.find(value => value.id === newActiveTab);\n activeTab?.click();\n }\n\n componentWillLoad(): void {\n this.~~tabs = Array.from~~(~~this.hostElement.querySelectorAll('cat-tab'~~));\n if (this.tabs.length) {\n this.activeTabId = this.activeTab;\n }\n }\n\n @Listen('keydown')\n onKeydown(event: KeyboardEvent): void {\n if (['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft'].includes(event.key)) {\n const targetElements = this.buttons.filter(button => !button.disabled);\n const activeElement = this.hostElement.shadowRoot?.activeElement as HTMLCatButtonElement;\n const activeIdx = activeElement ? targetElements.indexOf(activeElement) : -1;\n const activeOff = ['ArrowDown', 'ArrowRight'].includes(event.key) ? 1 : -1;\n const targetIdx = activeIdx < 0 ? 0 : (activeIdx + activeOff + targetElements.length) % targetElements.length;\n targetElements[targetIdx].setFocus();\n event.preventDefault();\n }\n }\n\n render() {\n return (\n <Host>\n {this.tabs.map((tab: HTMLCatTabElement) => {\n return (\n <cat-button\n ref={el => el && this.updateButtonsRef(el)}\n buttonId={tab.id}\n role=\"tab\"\n part=\"tab\"\n class={{\n tab: true,\n 'tab-active': Boolean(this.activeTabId && tab.id === this.activeTabId)\n }}\n color={this.activeTabId && tab.id === this.activeTabId ? 'primary' : 'secondary'}\n variant=\"text\"\n icon={tab.icon}\n iconOnly={tab.iconOnly}\n iconRight={tab.iconRight}\n url={tab.url}\n disabled={tab.deactivated}\n urlTarget={tab.urlTarget}\n onCatClick={() => (this.activeTabId = tab.id)}\n >\n {tab.label}\n </cat-button>\n );\n })}\n </Host>\n );\n }\n\n private updateButtonsRef(button: HTMLCatButtonElement) {\n const indexOf = this.buttons.indexOf(button);\n\n if (indexOf >= 0) {\n this.buttons[indexOf] = button;\n } else {\n this.buttons.push(button);\n }\n }\n}\n"]}
1	+ {"version":3,"file":"cat-tabs.js","sourceRoot":"","sources":["../../../src/components/cat-tabs/cat-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, State, Watch, Listen, Host, Prop } from '@stencil/core';\n\n/*\n Tabs are used to display multiple panels to be contained within a single\n * window, using tabs as a navigational element.\n \n @part tab - The header of the tab.\n /\n@Component({\n tag: 'cat-tabs',\n styleUrl: 'cat-tabs.scss',\n shadow: true\n})\nexport class CatTabs {\n private buttons: HTMLCatButtonElement[] = [];\n private mutationObserver?: MutationObserver;\n\n @Element() hostElement!: HTMLElement;\n\n @State() tabs: HTMLCatTabElement[] = [];\n\n @State() activeTabId?: string;\n\n /\n The ID of the active tab.\n /\n @Prop() activeTab = '';\n\n /\n The alignment of the tabs.\n */\n @Prop() tabsAlign: 'left' \| 'center' \| 'right' \| 'justify' = 'left';\n\n @Watch('activeTabId')\n onActiveTabChanged(newActiveTab: string): void {\n const activeTab = this.tabs.find(value => value.id === newActiveTab);\n activeTab?.click();\n }\n\n componentWillLoad(): void {\n this.syncTabs();\n if (this.tabs.length) {\n this.activeTabId = this.activeTab;\n }\n }\n\n componentDidLoad() {\n this.mutationObserver = new MutationObserver(\n mutations => mutations.some(value => value.target.nodeName === 'CAT-TAB') && this.syncTabs()\n );\n\n this.mutationObserver?.observe(this.hostElement, {\n childList: true,\n attributes: true,\n subtree: true\n });\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n }\n\n @Listen('keydown')\n onKeydown(event: KeyboardEvent): void {\n if (['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft'].includes(event.key)) {\n const targetElements = this.buttons.filter(button => !button.disabled);\n const activeElement = this.hostElement.shadowRoot?.activeElement as HTMLCatButtonElement;\n const activeIdx = activeElement ? targetElements.indexOf(activeElement) : -1;\n const activeOff = ['ArrowDown', 'ArrowRight'].includes(event.key) ? 1 : -1;\n const targetIdx = activeIdx < 0 ? 0 : (activeIdx + activeOff + targetElements.length) % targetElements.length;\n targetElements[targetIdx].setFocus();\n event.preventDefault();\n }\n }\n\n render() {\n return (\n <Host>\n {this.tabs.map((tab: HTMLCatTabElement) => {\n return (\n <cat-button\n ref={el => el && this.updateButtonsRef(el)}\n buttonId={tab.id}\n role=\"tab\"\n part=\"tab\"\n class={{\n tab: true,\n 'tab-active': Boolean(this.activeTabId && tab.id === this.activeTabId)\n }}\n color={this.activeTabId && tab.id === this.activeTabId ? 'primary' : 'secondary'}\n variant=\"text\"\n icon={tab.icon}\n iconOnly={tab.iconOnly}\n iconRight={tab.iconRight}\n url={tab.url}\n disabled={tab.deactivated}\n urlTarget={tab.urlTarget}\n onCatClick={() => (this.activeTabId = tab.id)}\n >\n {tab.label}\n </cat-button>\n );\n })}\n </Host>\n );\n }\n\n private updateButtonsRef(button: HTMLCatButtonElement) {\n const indexOf = this.buttons.indexOf(button);\n\n if (indexOf >= 0) {\n this.buttons[indexOf] = button;\n } else {\n this.buttons.push(button);\n }\n }\n\n private syncTabs() {\n this.tabs = Array.from(this.hostElement.querySelectorAll('cat-tab'));\n }\n}\n"]}

package/dist/collection/components/cat-toast-demo/cat-toast-demo.js CHANGED Viewed

@@ -11,7 +11,8 @@ export class CatToastDemo {
   }
   onClick() {
     const infoOptions = {
-      position: 'top-left'
+      position: 'top-left',
+      type: 'info'
     };
     const errorOptions = {
       position: 'top-center',
@@ -32,6 +33,16 @@ export class CatToastDemo {
       type: 'success',
       content: template.content.firstChild
     };
+    const primaryOptions = {
+      position: 'bottom-right',
+      type: 'primary'
+    };
+    const secondaryOptions = {
+      position: 'bottom-right',
+      type: 'secondary'
+    };
+    NotificationsService.secondary('Secondary Click', 'secondary info', secondaryOptions);
+    NotificationsService.primary('primary Click', 'secondary info', primaryOptions);
     NotificationsService.error('Default Click');
     NotificationsService.error('Long default title, long default title, long default title, long default title');
     NotificationsService.info('Info Click', 'Info message', infoOptions);

package/dist/collection/components/cat-toast-demo/cat-toast-demo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cat-toast-demo.js","sourceRoot":"","sources":["../../../src/components/cat-toast-demo/cat-toast-demo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,oBAAoB,EAAgB,MAAM,sCAAsC,CAAC;AAE1F;;;;GAIG;AAKH,MAAM,OAAO,YAAY;EACvB,MAAM;IACJ,OAAO,kBAAY,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,yBAAiC,CAAC;EACvF,CAAC;EAEO,OAAO;IACb,MAAM,WAAW,GAA0B;MACzC,QAAQ,EAAE,UAAU;~~KACrB~~,CAAC;IACF,MAAM,YAAY,GAA0B;MAC1C,QAAQ,EAAE,YAAY;MACtB,IAAI,EAAE,OAAO;KACd,CAAC;IACF,MAAM,aAAa,GAA0B;MAC3C,QAAQ,EAAE,aAAa;MACvB,IAAI,EAAE,OAAO;KACd,CAAC;IACF,MAAM,eAAe,GAA0B;MAC7C,QAAQ,EAAE,cAAc;MACxB,IAAI,EAAE,SAAS;KAChB,CAAC;IACF,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACpD,QAAQ,CAAC,SAAS,GAAG,wEAAwE,CAAC;IAC9F,MAAM,eAAe,GAA0B;MAC7C,QAAQ,EAAE,cAAc;MACxB,IAAI,EAAE,SAAS;MACf,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,UAAyB;KACpD,CAAC;IAEF,oBAAoB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAC5C,oBAAoB,CAAC,KAAK,CAAC,gFAAgF,CAAC,CAAC;IAC7G,oBAAoB,CAAC,IAAI,CAAC,YAAY,EAAE,cAAc,EAAE,WAAW,CAAC,CAAC;IACrE,oBAAoB,CAAC,OAAO,CAAC,EAAE,EAAE,GAAG,EAAE,eAAe,CAAC,CAAC;IACvD,oBAAoB,CAAC,KAAK,CAAC,aAAa,EAAE,GAAG,EAAE,YAAY,CAAC,CAAC;IAC7D,oBAAoB,CAAC,KAAK,CACxB,eAAe,EACf,8RAA8R,EAC9R,aAAa,CACd,CAAC;IACF,oBAAoB,CAAC,OAAO,CAAC,iDAAiD,EAAE,GAAG,EAAE,eAAe,CAAC,CAAC;EACxG,CAAC;;;;;;;;CACF","sourcesContent":["import { Component, h } from '@stencil/core';\nimport { NotificationsService, ToastOptions } from '../cat-notification/cat-notification';\n\n/*\n Toast Component Demo\n \n @part toast - The content of the toast.\n */\n@Component({\n tag: 'cat-toast-demo',\n styleUrl: 'cat-toast-demo.scss'\n})\nexport class CatToastDemo {\n render() {\n return <cat-button onClick={this.onClick.bind(this)}>Show Notifications</cat-button>;\n }\n\n private onClick() {\n const infoOptions: Partial<ToastOptions> = {\n position: 'top-left'\n };\n const errorOptions: Partial<ToastOptions> = {\n position: 'top-center',\n type: 'error'\n };\n const errorOptions2: Partial<ToastOptions> = {\n position: 'bottom-left',\n type: 'error'\n };\n const successOptions3: Partial<ToastOptions> = {\n position: 'bottom-right',\n type: 'success'\n };\n const template = document.createElement('template');\n template.innerHTML = `<div style=\"padding: 7px 30px 7px 10px\">Custom HTML Node Content</div>`;\n const successOptions4: Partial<ToastOptions> = {\n position: 'bottom-right',\n type: 'success',\n content: template.content.firstChild as HTMLElement\n };\n\n NotificationsService.error('Default Click');\n NotificationsService.error('Long default title, long default title, long default title, long default title');\n NotificationsService.info('Info Click', 'Info message', infoOptions);\n NotificationsService.success('', ' ', successOptions4);\n NotificationsService.error('Error Title', ' ', errorOptions);\n NotificationsService.error(\n 'Error 2 Title',\n 'Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message,Very long message, Very long message, Very long message, Very long message, Very long message, ',\n errorOptions2\n );\n NotificationsService.success('Success Title - very long title without message', ' ', successOptions3);\n }\n}\n"]}
1	+ {"version":3,"file":"cat-toast-demo.js","sourceRoot":"","sources":["../../../src/components/cat-toast-demo/cat-toast-demo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAAE,oBAAoB,EAAgB,MAAM,sCAAsC,CAAC;AAE1F;;;;GAIG;AAKH,MAAM,OAAO,YAAY;EACvB,MAAM;IACJ,OAAO,kBAAY,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,yBAAiC,CAAC;EACvF,CAAC;EAEO,OAAO;IACb,MAAM,WAAW,GAA0B;MACzC,QAAQ,EAAE,UAAU;MACpB,IAAI,EAAE,MAAM;KACb,CAAC;IACF,MAAM,YAAY,GAA0B;MAC1C,QAAQ,EAAE,YAAY;MACtB,IAAI,EAAE,OAAO;KACd,CAAC;IACF,MAAM,aAAa,GAA0B;MAC3C,QAAQ,EAAE,aAAa;MACvB,IAAI,EAAE,OAAO;KACd,CAAC;IACF,MAAM,eAAe,GAA0B;MAC7C,QAAQ,EAAE,cAAc;MACxB,IAAI,EAAE,SAAS;KAChB,CAAC;IACF,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACpD,QAAQ,CAAC,SAAS,GAAG,wEAAwE,CAAC;IAC9F,MAAM,eAAe,GAA0B;MAC7C,QAAQ,EAAE,cAAc;MACxB,IAAI,EAAE,SAAS;MACf,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,UAAyB;KACpD,CAAC;IACF,MAAM,cAAc,GAA0B;MAC5C,QAAQ,EAAE,cAAc;MACxB,IAAI,EAAE,SAAS;KAChB,CAAC;IAEF,MAAM,gBAAgB,GAA0B;MAC9C,QAAQ,EAAE,cAAc;MACxB,IAAI,EAAE,WAAW;KAClB,CAAC;IAEF,oBAAoB,CAAC,SAAS,CAAC,iBAAiB,EAAE,gBAAgB,EAAE,gBAAgB,CAAC,CAAC;IACtF,oBAAoB,CAAC,OAAO,CAAC,eAAe,EAAE,gBAAgB,EAAE,cAAc,CAAC,CAAC;IAChF,oBAAoB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAC5C,oBAAoB,CAAC,KAAK,CAAC,gFAAgF,CAAC,CAAC;IAC7G,oBAAoB,CAAC,IAAI,CAAC,YAAY,EAAE,cAAc,EAAE,WAAW,CAAC,CAAC;IACrE,oBAAoB,CAAC,OAAO,CAAC,EAAE,EAAE,GAAG,EAAE,eAAe,CAAC,CAAC;IACvD,oBAAoB,CAAC,KAAK,CAAC,aAAa,EAAE,GAAG,EAAE,YAAY,CAAC,CAAC;IAC7D,oBAAoB,CAAC,KAAK,CACxB,eAAe,EACf,8RAA8R,EAC9R,aAAa,CACd,CAAC;IACF,oBAAoB,CAAC,OAAO,CAAC,iDAAiD,EAAE,GAAG,EAAE,eAAe,CAAC,CAAC;EACxG,CAAC;;;;;;;;CACF","sourcesContent":["import { Component, h } from '@stencil/core';\nimport { NotificationsService, ToastOptions } from '../cat-notification/cat-notification';\n\n/*\n Toast Component Demo\n \n @part toast - The content of the toast.\n */\n@Component({\n tag: 'cat-toast-demo',\n styleUrl: 'cat-toast-demo.scss'\n})\nexport class CatToastDemo {\n render() {\n return <cat-button onClick={this.onClick.bind(this)}>Show Notifications</cat-button>;\n }\n\n private onClick() {\n const infoOptions: Partial<ToastOptions> = {\n position: 'top-left',\n type: 'info'\n };\n const errorOptions: Partial<ToastOptions> = {\n position: 'top-center',\n type: 'error'\n };\n const errorOptions2: Partial<ToastOptions> = {\n position: 'bottom-left',\n type: 'error'\n };\n const successOptions3: Partial<ToastOptions> = {\n position: 'bottom-right',\n type: 'success'\n };\n const template = document.createElement('template');\n template.innerHTML = `<div style=\"padding: 7px 30px 7px 10px\">Custom HTML Node Content</div>`;\n const successOptions4: Partial<ToastOptions> = {\n position: 'bottom-right',\n type: 'success',\n content: template.content.firstChild as HTMLElement\n };\n const primaryOptions: Partial<ToastOptions> = {\n position: 'bottom-right',\n type: 'primary'\n };\n\n const secondaryOptions: Partial<ToastOptions> = {\n position: 'bottom-right',\n type: 'secondary'\n };\n\n NotificationsService.secondary('Secondary Click', 'secondary info', secondaryOptions);\n NotificationsService.primary('primary Click', 'secondary info', primaryOptions);\n NotificationsService.error('Default Click');\n NotificationsService.error('Long default title, long default title, long default title, long default title');\n NotificationsService.info('Info Click', 'Info message', infoOptions);\n NotificationsService.success('', ' ', successOptions4);\n NotificationsService.error('Error Title', ' ', errorOptions);\n NotificationsService.error(\n 'Error 2 Title',\n 'Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message, Very long message,Very long message, Very long message, Very long message, Very long message, Very long message, ',\n errorOptions2\n );\n NotificationsService.success('Success Title - very long title without message', ' ', successOptions3);\n }\n}\n"]}