@3t-transform/threeteeui 1.9.102 → 1.9.103

package/dist/collection/components/molecules/tttx-date-range-picker/tttx-date-range-picker.stories.js

@@ -1,34 +1,34 @@
-import { withActions } from '@storybook/addon-actions/decorator';
-export default {
-  title: 'Molecules/Date Range Picker',
-  component: 'tttx-date-range-picker',
-  decorators: [withActions],
-  parameters: {
-    actions: {
-      handles: ['dateRangeChanged'],
-    },
-    docs: {
-      description: {
-        component: 'custom date range picker with a single calendar UI, allowing start and end date selection in sequence. Emits `dateRangeChanged` event with formatted `dd/mm/yyyy` values.',
-      },
-    },
-  },
-  argTypes: {
-    initialValue: {
-      control: 'object',
-      description: 'Initial start and end date',
-    },
-    placeholderText: {
-      control: 'text',
-      description: 'Placeholder text when no dates are selected',
-    },
-  },
-};
-// ✅ The only template that works properly with complex props
-const Template = (args) => {
-  var _a, _b;
-  const pickerId = 'range-picker';
-  const safePlaceholder = (_b = (_a = args.placeholderText) === null || _a === void 0 ? void 0 : _a.replace(/"/g, '"')) !== null && _b !== void 0 ? _b : '';
+import { withActions } from '@storybook/addon-actions/decorator';
+export default {
+  title: 'Molecules/Date Range Picker',
+  component: 'tttx-date-range-picker',
+  decorators: [withActions],
+  parameters: {
+    actions: {
+      handles: ['dateRangeChanged'],
+    },
+    docs: {
+      description: {
+        component: 'custom date range picker with a single calendar UI, allowing start and end date selection in sequence. Emits `dateRangeChanged` event with formatted `dd/mm/yyyy` values.',
+      },
+    },
+  },
+  argTypes: {
+    initialValue: {
+      control: 'object',
+      description: 'Initial start and end date',
+    },
+    placeholderText: {
+      control: 'text',
+      description: 'Placeholder text when no dates are selected',
+    },
+  },
+};
+// ✅ The only template that works properly with complex props
+const Template = (args) => {
+  var _a, _b;
+  const pickerId = 'range-picker';
+  const safePlaceholder = (_b = (_a = args.placeholderText) === null || _a === void 0 ? void 0 : _a.replace(/"/g, '"')) !== null && _b !== void 0 ? _b : '';
   return `
     <div style="padding: 2rem; max-width: 800px;">
       <tttx-date-range-picker id="${pickerId}" placeholder-text="${safePlaceholder}"></tttx-date-range-picker>
@@ -41,20 +41,20 @@ const Template = (args) => {
         }, 0);
       </script>
     </div>
-  `;
-};
-export const Default = Template.bind({});
-Default.storyName = 'Default Range Picker';
-Default.args = {
-  initialValue: null,
-  placeholderText: 'dd/mm/yyyy-dd/mm/yyyy',
-};
-export const WithPreselectedRange = Template.bind({});
-WithPreselectedRange.storyName = 'With Preselected Range';
-WithPreselectedRange.args = {
-  initialValue: {
-    start: '09/07/2025',
-    end: '26/07/2025',
-  },
-  placeholderText: 'dd/mm/yyyy-dd/mm/yyyy'
-};
+  `;
+};
+export const Default = Template.bind({});
+Default.storyName = 'Default Range Picker';
+Default.args = {
+  initialValue: null,
+  placeholderText: 'dd/mm/yyyy-dd/mm/yyyy',
+};
+export const WithPreselectedRange = Template.bind({});
+WithPreselectedRange.storyName = 'With Preselected Range';
+WithPreselectedRange.args = {
+  initialValue: {
+    start: '09/07/2025',
+    end: '26/07/2025',
+  },
+  placeholderText: 'dd/mm/yyyy-dd/mm/yyyy'
+};

package/dist/collection/components/molecules/tttx-dialog/icon-types.js

@@ -1,6 +1,6 @@
-export const ICON_TYPES = {
-  critical: { iconName: 'report', iconColor: 'red' },
-  info: { iconName: 'info', iconColor: 'blue' },
-  success: { iconName: 'check_circle', iconColor: 'green' },
-  warning: { iconName: 'warning', iconColor: 'orange' },
-};
+export const ICON_TYPES = {
+  critical: { iconName: 'report', iconColor: 'red' },
+  info: { iconName: 'info', iconColor: 'blue' },
+  success: { iconName: 'check_circle', iconColor: 'green' },
+  warning: { iconName: 'warning', iconColor: 'orange' },
+};

package/dist/collection/components/molecules/tttx-dialog/tttx-dialog.js

@@ -1,218 +1,218 @@
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { h } from '@stencil/core';
-import { ICON_TYPES } from './icon-types';
-export class TttxDialog {
-  constructor() {
-    this.header = undefined;
-    this.type = undefined;
-    this.size = 'regular';
-    this.open = false;
-    this.allowOverflow = false;
-    this.closeEnabled = true;
-    this.elementSize = undefined;
-  }
-  handleResize() {
-    if (window.innerWidth < 698) {
-      this.elementSize = 'mobile';
-    }
-    else {
-      this.elementSize = this.size;
-    }
-  }
-  emitDialogClose() {
-    this.closeButtonClick.emit();
-  }
-  componentDidLoad() {
-    this.dialog.addEventListener('close', this.emitDialogClose.bind(this));
-  }
-  onCloseClickHandler() {
-    this.dialog.close();
-  }
-  headerIconDetails(iconEnabled) {
-    if (!iconEnabled)
-      return { iconName: undefined, iconColor: undefined };
-    return ICON_TYPES[this.type];
-  }
-  renderHeader() {
-    const iconEnabled = typeof this.type !== 'undefined';
-    const { iconName, iconColor } = this.headerIconDetails(iconEnabled);
-    return (h("div", { class: `padding header ${this.type || ''}` }, iconEnabled && h("tttx-icon_localcomponent", { class: "icon", icon: iconName, color: iconColor }), h("h3", { class: "title", title: this.header }, this.header), this.closeEnabled && (h("tttx-button_localcomponent", { class: "align-right close-button", design: "borderless-circle", icon: "close", color: "black", notext: true, onClick: () => this.onCloseClickHandler() }))));
-  }
-  body() {
-    return (h("div", { class: `body ${!this.allowOverflow ? 'overflow-hidden' : ''}` }, h("span", { class: "body-content" }, h("slot", null))));
-  }
-  footer() {
-    if (!this.el.querySelector('[slot="buttons"]'))
-      return;
-    return (h("div", { class: "padding footer" }, h("div", { class: "align-right" }, h("slot", { name: "buttons" }))));
-  }
-  componentDidRender() {
-    if (!this.open) {
-      this.dialog.close();
-      return;
-    }
-    if (!this.dialog.open)
-      this.dialog.showModal();
-  }
-  componentWillLoad() {
-    this.handleResize();
-  }
-  render() {
-    return (h("dialog", { ref: el => (this.dialog = el), class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, this.renderHeader(), this.body(), this.footer())));
-  }
-  static get is() { return "tttx-dialog_localcomponent"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["tttx-dialog.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["tttx-dialog.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "header": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "header",
-        "reflect": false
-      },
-      "type": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'info' | 'success' | 'warning' | 'critical' | undefined",
-          "resolved": "\"critical\" | \"info\" | \"success\" | \"warning\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "type",
-        "reflect": false
-      },
-      "size": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'regular' | 'mobile' | 'large' | 'small'",
-          "resolved": "\"large\" | \"mobile\" | \"regular\" | \"small\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "size",
-        "reflect": false,
-        "defaultValue": "'regular'"
-      },
-      "open": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "open",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "allowOverflow": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "allow-overflow",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "closeEnabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "close-enabled",
-        "reflect": false,
-        "defaultValue": "true"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "elementSize": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "closeButtonClick",
-        "name": "closeButtonClick",
-        "bubbles": true,
-        "cancelable": false,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }];
-  }
-  static get elementRef() { return "el"; }
-  static get listeners() {
-    return [{
-        "name": "resize",
-        "method": "handleResize",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }];
-  }
-}
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { h } from '@stencil/core';
+import { ICON_TYPES } from './icon-types';
+export class TttxDialog {
+  constructor() {
+    this.header = undefined;
+    this.type = undefined;
+    this.size = 'regular';
+    this.open = false;
+    this.allowOverflow = false;
+    this.closeEnabled = true;
+    this.elementSize = undefined;
+  }
+  handleResize() {
+    if (window.innerWidth < 698) {
+      this.elementSize = 'mobile';
+    }
+    else {
+      this.elementSize = this.size;
+    }
+  }
+  emitDialogClose() {
+    this.closeButtonClick.emit();
+  }
+  componentDidLoad() {
+    this.dialog.addEventListener('close', this.emitDialogClose.bind(this));
+  }
+  onCloseClickHandler() {
+    this.dialog.close();
+  }
+  headerIconDetails(iconEnabled) {
+    if (!iconEnabled)
+      return { iconName: undefined, iconColor: undefined };
+    return ICON_TYPES[this.type];
+  }
+  renderHeader() {
+    const iconEnabled = typeof this.type !== 'undefined';
+    const { iconName, iconColor } = this.headerIconDetails(iconEnabled);
+    return (h("div", { class: `padding header ${this.type || ''}` }, iconEnabled && h("tttx-icon_1_9_103", { class: "icon", icon: iconName, color: iconColor }), h("h3", { class: "title", title: this.header }, this.header), this.closeEnabled && (h("tttx-button_1_9_103", { class: "align-right close-button", design: "borderless-circle", icon: "close", color: "black", notext: true, onClick: () => this.onCloseClickHandler() }))));
+  }
+  body() {
+    return (h("div", { class: `body ${!this.allowOverflow ? 'overflow-hidden' : ''}` }, h("span", { class: "body-content" }, h("slot", null))));
+  }
+  footer() {
+    if (!this.el.querySelector('[slot="buttons"]'))
+      return;
+    return (h("div", { class: "padding footer" }, h("div", { class: "align-right" }, h("slot", { name: "buttons" }))));
+  }
+  componentDidRender() {
+    if (!this.open) {
+      this.dialog.close();
+      return;
+    }
+    if (!this.dialog.open)
+      this.dialog.showModal();
+  }
+  componentWillLoad() {
+    this.handleResize();
+  }
+  render() {
+    return (h("dialog", { ref: el => (this.dialog = el), class: `dialog-box ${this.allowOverflow ? 'overflow-visible' : ''} ${this.elementSize}` }, h("div", { class: "contents" }, this.renderHeader(), this.body(), this.footer())));
+  }
+  static get is() { return "tttx-dialog_1_9_103"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["tttx-dialog.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["tttx-dialog.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "header": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "header",
+        "reflect": false
+      },
+      "type": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'info' | 'success' | 'warning' | 'critical' | undefined",
+          "resolved": "\"critical\" | \"info\" | \"success\" | \"warning\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "type",
+        "reflect": false
+      },
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'regular' | 'mobile' | 'large' | 'small'",
+          "resolved": "\"large\" | \"mobile\" | \"regular\" | \"small\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "size",
+        "reflect": false,
+        "defaultValue": "'regular'"
+      },
+      "open": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "open",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "allowOverflow": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "allow-overflow",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "closeEnabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "close-enabled",
+        "reflect": false,
+        "defaultValue": "true"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "elementSize": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "closeButtonClick",
+        "name": "closeButtonClick",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get elementRef() { return "el"; }
+  static get listeners() {
+    return [{
+        "name": "resize",
+        "method": "handleResize",
+        "target": "window",
+        "capture": false,
+        "passive": true
+      }];
+  }
+}