@dubai-design-system/components-js 3.12.9 → 3.12.11

package/dist/collection/components/dda-checkbox/dda-checkbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-checkbox.js","sourceRoot":"","sources":["../../../src/components/dda-checkbox/dda-checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,WAAW;IALxB;QAaU,iBAAY,GAAY,EAAE,CAAC;QAOnC,8BAA8B;QAC9B,sBAAiB,GAAG,CAAC,KAAY,EAAE,EAAE;YACnC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;YAChD,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QAC3C,CAAC,CAAC;KAmCH;IAjCC,MAAM;QACJ,MAAM,aAAa,GAAG;YACpB,wBAAwB;YACxB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,gBAAgB,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE;YACxD,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE;YAC1C,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC,EAAE;YAClE,IAAI,CAAC,cAAc;SACpB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAE5B,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,aAAa;gBACvB,8DACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,QAAQ,EACjB,IAAI,EAAE,IAAI,CAAC,UAAU,gBACT,IAAI,CAAC,UAAU,EAC3B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,iBAAiB,GAChC;gBACF,8DAAO,OAAO,EAAE,IAAI,CAAC,QAAQ;oBAC3B,6DAAM,KAAK,EAAC,kBAAkB,GAAQ;oBACtC;wBACE,6DAAM,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,UAAU,CAAQ;wBACxD,IAAI,CAAC,UAAU,IAAI,CAClB,6DAAM,KAAK,EAAC,yBAAyB,IAAE,IAAI,CAAC,UAAU,CAAQ,CAC/D,CACC,CACE,CACJ,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-checkbox',\r\n  styleUrls: ['dda-checkbox.css'],\r\n  shadow: false,\r\n})\r\nexport class DdaCheckbox {\r\n  @Prop() title_text: string;\r\n  @Prop() supporting?: string;\r\n  @Prop() group_name?: string;\r\n  @Prop() input_id?: string;\r\n  @Prop() checked: boolean;\r\n  @Prop() checkbox_status?: string;\r\n  @Prop() style_type?: string;\r\n  @Prop() custom_class?: string = ''; \r\n  @Prop() component_mode?: string; \r\n  @Prop() aria_label?: string;\r\n\r\n  /** Emits change event with current checked state */\r\n  @Event() checkboxChange: EventEmitter<boolean>;\r\n\r\n  /** Handles checkbox change */\r\n  handleInputChange = (event: Event) => {\r\n    const target = event.target as HTMLInputElement;\r\n    this.checkboxChange.emit(target.checked);\r\n  };\r\n\r\n  render() {\r\n    const checkboxClass = [\r\n      'dda-checkbox-container',\r\n      this.style_type ? `dda-checkbox-${this.style_type}` : '',\r\n      this.custom_class ? this.custom_class : '',\r\n      this.checkbox_status ? `dda-checkbox-${this.checkbox_status}` : '',\r\n      this.component_mode,\r\n    ].filter(Boolean).join(' ');\r\n\r\n    return (\r\n      <Host>\r\n        <div class={checkboxClass}>\r\n          <input\r\n            type=\"checkbox\"\r\n            id={this.input_id}\r\n            name={this.group_name}\r\n            aria-label={this.aria_label}\r\n            checked={this.checked}\r\n            onChange={this.handleInputChange}\r\n          />\r\n          <label htmlFor={this.input_id}>\r\n            <span class=\"dda-check-square\"></span>\r\n            <p>\r\n              <span class=\"dda-checkbox-title\">{this.title_text}</span>\r\n              {this.supporting && (\r\n                <span class=\"dda-checkbox-supporting\">{this.supporting}</span>\r\n              )}\r\n            </p>\r\n          </label>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/dda-checkbox/dda-checkbox.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-checkbox.stories.js","sourceRoot":"","sources":["../../../src/components/dda-checkbox/dda-checkbox.stories.tsx"],"names":[],"mappings":"AAAA,eAAe;IACb,KAAK,EAAE,qBAAqB;IAC5B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,UAAU,EAAE;YACV,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,wBAAwB;SACtC;QACD,UAAU,EAAE;YACV,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,kCAAkC;SAChD;QACD,UAAU,EAAE;YACV,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,yBAAyB;SACvC;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,+BAA+B;SAC7C;QACD,OAAO,EAAE;YACP,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,+BAA+B;SAC7C;QACD,eAAe,EAAE;YACf,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC;YAC/B,WAAW,EAAE,yBAAyB;SACvC;QACD,UAAU,EAAE;YACV,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC;YAC3B,WAAW,EAAE,8BAA8B;SAC5C;QACD,YAAY,EAAE;YACZ,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,WAAW,EAAE,wBAAwB;SACtC;QACD,cAAc,EAAE;YACd,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;YAC1B,OAAO,EAAE,CAAC,YAAY,CAAC;YACvB,WAAW,EAAE,gCAAgC;SAC9C;QACD,UAAU,EAAE;YACV,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,WAAW,EAAE,8BAA8B;SAC5C;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;;;;SAuBV;aACF;SACF;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,kBAAkB,CAAC;IAErD,yBAAyB;IACzB,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;SACpC,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,KAAK,KAAK,SAAS,IAAI,GAAG,KAAK,MAAM,CAAC;SAC/D,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,GAAG,KAAK,KAAK,GAAG,CAAC;SAC1C,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,yCAAyC;IACzC,OAAO;sBACa,UAAU;;;+DAG+B,QAAQ;;;uCAGhC,QAAQ;;;;;GAK5C,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACd,UAAU,EAAE,gBAAgB;IAC5B,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,MAAM;IAClB,UAAU,EAAE,iBAAiB;IAC7B,UAAU,EAAE,eAAe;IAC3B,QAAQ,EAAE,aAAa;IACvB,UAAU,EAAE,UAAU;IACtB,YAAY,EAAE,EAAE;IAChB,cAAc,EAAE,EAAE;IAClB,eAAe,EAAE,QAAQ;IACzB,cAAc,EAAC,EAAE;CAClB,CAAC","sourcesContent":["export default {\r\n  title: 'Components/Checkbox',\r\n  tags: ['autodocs'],\r\n  argTypes: {\r\n    title_text: {\r\n      control: 'text',\r\n      description: 'Title for the checkbox',\r\n    },\r\n    supporting: {\r\n      control: 'text',\r\n      description: 'Supporting text for the checkbox',\r\n    },\r\n    group_name: {\r\n      control: 'text',\r\n      description: 'Name for checkbox group',\r\n    },\r\n    input_id: {\r\n      control: 'text',\r\n      description: 'Unique ID for the input field',\r\n    },\r\n    checked: {\r\n      control: 'boolean',\r\n      description: 'Checked state of the checkbox',\r\n    },\r\n    checkbox_status: {\r\n      control: { type: 'select' },\r\n      options: ['normal', 'disabled'],\r\n      description: 'Visual status indicator',\r\n    },\r\n    style_type: {\r\n      control: { type: 'select' },\r\n      options: ['fill', 'stroke'],\r\n      description: 'Visual style of the checkbox',\r\n    },\r\n    custom_class: {\r\n      control: { type: 'text' },\r\n      description: 'Additional CSS classes',\r\n    },\r\n    component_mode: {\r\n      control: { type: 'check' },\r\n      options: ['light-mode'],\r\n      description: 'Mode of the checkbox component',\r\n    },\r\n    aria_label: {\r\n      control: { type: 'text' },\r\n      description: 'ARIA label for accessibility',\r\n    },\r\n  },\r\n  parameters: {\r\n    docs: {\r\n      description: {\r\n        component: `\r\nTo use the \\`dda-checkbox\\` component, pass the following props:\r\n\r\n\\`\\`\\`html\r\n<dda-checkbox\r\n    title_text=\"Checkbox Title\"\r\n    checked=\"false\"\r\n    style_type=\"fill\"\r\n    supporting=\"Supporting Text\"\r\n    group_name=\"checkboxgroup\"\r\n    input_id=\"testId\"\r\n    custom_class=\"\"\r\n    component_mode=\"\"\r\n    aria_label=\"checkbox\"\r\n></dda-checkbox>\r\n\r\n<!-- Listen for checkboxChange event -->\r\n<script>\r\n  document.querySelector('dda-checkbox').addEventListener('checkboxChange', e => {\r\n    console.log('Checkbox toggled:', e.detail);\r\n  });\r\n</script>\r\n\\`\\`\\`\r\n        `,\r\n      },\r\n    },\r\n  },\r\n};\r\n\r\nconst Template = (args) => {\r\n  const uniqueId = args.input_id || 'checkbox-demo-id';\r\n\r\n  // Create checkbox markup\r\n  const attributes = Object.entries(args)\r\n    .filter(([key, value]) => value !== undefined && key !== 'text')\r\n    .map(([key, value]) => `${key}=\"${value}\"`)\r\n    .join(' ');\r\n\r\n  // Return wrapped HTML with event binding\r\n  return `\r\n      <dda-checkbox ${attributes}></dda-checkbox>\r\n      <script>\r\n        (() => {\r\n          const checkbox = document.getElementById(\"checkbox-${uniqueId}\");\r\n          if (checkbox) {\r\n            checkbox.addEventListener(\"checkboxChange\", function(e) {\r\n              console.log(\"Checkbox [${uniqueId}] changed to:\", e.detail);\r\n            });\r\n          }\r\n        })();\r\n      </script>\r\n  `;\r\n};\r\n\r\nexport const checkbox = Template.bind({});\r\ncheckbox.args = {\r\n  title_text: 'Checkbox Title',\r\n  checked: false,\r\n  style_type: 'fill',\r\n  supporting: 'Supporting Text',\r\n  group_name: 'checkboxgroup',\r\n  input_id: 'checkboxOne',\r\n  aria_label: 'checkbox',\r\n  custom_class: '',\r\n  component_mode: '',\r\n  checkbox_status: 'normal',\r\n  checkboxChange:\"\",\r\n};\r\n\r\n"]}

package/dist/collection/components/dda-chip/dda-chip.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-chip.js","sourceRoot":"","sources":["../../../src/components/dda-chip/dda-chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,OAAO;IALpB;QAMU,aAAQ,GAAW,SAAS,CAAC;QAC7B,YAAO,GAAY,EAAE,CAAC;QAKtB,oBAAe,GAAY,KAAK,CAAC;KAyC1C;IA9BC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,SAAS,IAAI,WAAW,CAAC;QAErE,OAAO,CACL,EAAC,IAAI;YACH,4DACE,KAAK,EAAE,qBAAqB,IAAI,CAAC,QAAQ,aAAa,IAAI,CAAC,IAAI,gBAAgB,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,cAAc,EAAE,gBAC7H,KAAK;gBAEhB,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAChB,SAAG,KAAK,EAAE,kBAAkB,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,gBAAgB,EAAE,IACvE,IAAI,CAAC,SAAS,CACb,CACL,CAAC,CAAC,CAAC,IAAI;gBACP,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CACtB,SAAG,KAAK,EAAE,kBAAkB,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,sBAAsB,EAAE,IACnF,IAAI,CAAC,eAAe,CACnB,CACL,CAAC,CAAC,CAAC,IAAI;gBACR,+DAAO,IAAI,CAAC,SAAS,CAAQ;gBAC5B,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,gBAAO,IAAI,CAAC,gBAAgB,CAAQ,CAAC,CAAC,CAAC,IAAI;gBACnE,IAAI,CAAC,eAAe,IAAI,CACvB,6DAAM,KAAK,EAAC,YAAY,EAAC,OAAO,EAAE,IAAI,CAAC,YAAY;oBACjD,0DAAG,KAAK,EAAC,0CAA0C,iBAAa,MAAM,YAAU,CAC3E,CACR,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-chip',\r\n  styleUrls: ['dda-chip.css'],\r\n  shadow: false,\r\n})\r\nexport class DdaChip {\r\n  @Prop() bg_color: string = 'success';\r\n  @Prop() rounded?: string = '';\r\n  @Prop() chip_text: string;\r\n  @Prop() chip_icon: string;\r\n  @Prop() chip_icon_family: string;\r\n  @Prop() chip_icon_size: string;\r\n  @Prop() show_close_icon: boolean = false;\r\n  @Prop() size?: string; // e.g., 'sm', 'md', 'lg'\r\n  @Prop() custom_class?: string;\r\n  @Prop() component_mode?: string;  \r\n  @Prop() clickHandler?: (event: MouseEvent) => void;\r\n\r\n  @Prop() image_chip_label: string;\r\n  @Prop() image_chip_icon: string;\r\n  @Prop() image_chip_icon_family: string;\r\n  @Prop() image_chip_icon_size?: string;\r\n\r\n  render() {\r\n    const label = this.image_chip_label || this.chip_text || 'Chip item';\r\n\r\n    return (\r\n      <Host>\r\n        <div\r\n          class={`dda-chip dda-chip-${this.bg_color} dda-chip-${this.size} dda-rounded-${this.rounded} ${this.custom_class} ${this.component_mode}`}\r\n          aria-label={label}\r\n        >\r\n          {this.chip_icon ? (\r\n            <i class={`chip-icon-size-${this.chip_icon_size} ${this.chip_icon_family}`}>\r\n              {this.chip_icon}\r\n            </i>\r\n          ) : null}\r\n          {this.image_chip_icon ? (\r\n            <i class={`chip-icon-size-${this.image_chip_icon_size} ${this.image_chip_icon_family}`}>\r\n              {this.image_chip_icon}\r\n            </i>\r\n          ) : null}\r\n          <span>{this.chip_text}</span>\r\n          {this.image_chip_label ? <span>{this.image_chip_label}</span> : null}\r\n          {this.show_close_icon && (\r\n            <span class=\"chip-close\" onClick={this.clickHandler}>\r\n              <i class=\"material-icons material-symbols-outlined\" aria-hidden=\"true\">close</i>\r\n            </span>\r\n          )}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n\r\n"]}

package/dist/collection/components/dda-chip/dda-chip.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-chip.stories.js","sourceRoot":"","sources":["../../../src/components/dda-chip/dda-chip.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["export default {\r\n  title: 'Components/Chip',\r\n  tags: ['autodocs'],\r\n  argTypes: {\r\n    bg_color: {\r\n      control: { type: 'select' },\r\n      options: ['grey', 'primary', 'green', 'yellow', 'red', 'purple'],\r\n      description: 'Background color of the chip',\r\n    },\r\n    size: {\r\n      control: { type: 'select' },\r\n      options: ['sm', 'md', 'lg'],\r\n      description: 'Select the size of the chip',\r\n    },\r\n    chip_text: {\r\n      control: { type: 'text' },\r\n      description: 'Text to display inside the chip',\r\n    },\r\n    chip_icon: {\r\n      control: 'text',\r\n      description: 'Material Icons icon class to display at the start of the chip',\r\n    },\r\n    chip_icon_family: {\r\n      control: 'text',\r\n      description: 'Material Icons icon class to display at the start of the chip',\r\n    },\r\n    chip_icon_size:{\r\n      control: { type: 'select' },\r\n      options: ['sm', 'md', 'lg'],\r\n      description: 'Select the size of the chip',\r\n    },\r\n    show_close_icon: {\r\n      control: 'boolean',\r\n      description: 'Whether to show a close icon at the end of the chip',\r\n    },\r\n    rounded: {\r\n      control: { type: 'select' },\r\n      options: ['sm', 'circle'],\r\n      description: 'Define the roundedness of the chip',\r\n    },\r\n    custom_class: {\r\n      control: { type: 'text' },\r\n      description: 'Custom class for the chip',\r\n    },\r\n    component_mode: {\r\n      control: { type: 'check' },\r\n      options: ['light-mode'],\r\n      description: 'Mode of the chip component',\r\n    },\r\n    onclick:{\r\n      control: { type: 'text' },\r\n      description: 'Function triggered when the close icon is clicked',\r\n    },\r\n  },\r\n  \r\n  parameters: {\r\n    docs: {\r\n      description: {\r\n        component: `\r\nTo use the \\`dda-chip\\` component, pass the following props:\r\n\r\n\\`\\`\\`html\r\n<dda-chip\r\n    chip_text=\"Label\"\r\n    bg_color=\"grey\"\r\n    chip_icon=\"sentiment_satisfied\"\r\n    chip_icon_family=\"material-icons material-symbols-outlined\"\r\n    show_close_icon=\"true\"\r\n    custom_class=\"\"\r\n    component_mode=\"\"\r\n    onclick=\"console.log(\"clicked!\")\"\r\n    >Label\r\n</dda-chip>\r\n  \\`\\`\\`\r\n`,\r\n      },\r\n    },\r\n  },\r\n};\r\n\r\nconst Template = (args) => {\r\n  const attributes = Object.entries(args)\r\n    .filter(([key, value]) => value !== undefined && key !== 'text' && key !== 'onCloseClick')\r\n    .map(([key, value]) => `${key}=\"${value}\"`)\r\n    .join(' ');\r\n\r\n  return `\r\n    <dda-chip ${attributes}>\r\n    </dda-chip>\r\n  `;\r\n};\r\n\r\nexport const Grey = Template.bind({});\r\nGrey.args = {\r\n  chip_text: 'Label',\r\n  bg_color: 'grey',\r\n  chip_icon: 'sentiment_satisfied',\r\n  chip_icon_size: 'md',\r\n  chip_icon_family: 'material-icons material-symbols-outlined',\r\n  show_close_icon: true,\r\n  custom_class: '',\r\n  component_mode: '',\r\n  onclick: \"console.log('clicked')\",\r\n};\r\n\r\n\r\nexport const Primary = Template.bind({});\r\nPrimary.args = {\r\n  chip_text: 'Label',\r\n  bg_color: 'primary',\r\n  chip_icon: 'sentiment_satisfied',\r\n  chip_icon_size: 'md',\r\n  chip_icon_family: 'material-icons material-symbols-outlined',\r\n  show_close_icon: true,\r\n  custom_class: '',\r\n  component_mode: '',\r\n  onclick: \"alert('Close icon clicked!')\",\r\n};\r\n\r\nexport const Green = Template.bind({});\r\nGreen.args = {\r\n  chip_text: 'Label',\r\n  bg_color: 'green',\r\n  chip_icon: 'sentiment_satisfied',\r\n  chip_icon_size: 'md',\r\n  chip_icon_family: 'material-icons material-symbols-outlined',\r\n  show_close_icon: true,\r\n  custom_class: '',\r\n  component_mode: '',\r\n  onclick: \"() => alert('Close icon clicked!')\",\r\n};\r\n\r\nexport const Yellow = Template.bind({});\r\nYellow.args = {\r\n  chip_text: 'Label',\r\n  bg_color: 'yellow',\r\n  chip_icon: 'sentiment_satisfied',\r\n  chip_icon_size: 'md',\r\n  chip_icon_family: 'material-icons material-symbols-outlined',\r\n  show_close_icon: true,\r\n  custom_class: '',\r\n  component_mode: '',\r\n  onclick: \"() => alert('Close icon clicked!')\",\r\n};\r\n\r\nexport const Red = Template.bind({});\r\nRed.args = {\r\n  chip_text: 'Label',\r\n  bg_color: 'red',\r\n  chip_icon: 'sentiment_satisfied',\r\n  chip_icon_size: 'md',\r\n  chip_icon_family: 'material-icons material-symbols-outlined',\r\n  show_close_icon: true,\r\n  custom_class: '',\r\n  component_mode: '',\r\n  onclick: \"() => alert('Close icon clicked!')\",\r\n};\r\n\r\nexport const Purple = Template.bind({});\r\nPurple.args = {\r\n  chip_text: 'Label',\r\n  bg_color: 'purple',\r\n  chip_icon: 'sentiment_satisfied',\r\n  chip_icon_size: 'md',\r\n  chip_icon_family: 'material-icons material-symbols-outlined',\r\n  show_close_icon: true,\r\n  custom_class: '',\r\n  component_mode: '',\r\n  onclick: \"() => alert('Close icon clicked!')\",\r\n};"]}

package/dist/collection/components/dda-credit-card/dda-credit-card.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-credit-card.js","sourceRoot":"","sources":["../../../src/components/dda-credit-card/dda-credit-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,aAAa;IAL1B;QAWU,iBAAY,GAAY,EAAE,CAAC;KAgCpC;IA7BC,MAAM;QACJ,MAAM,SAAS,GAAG;YAChB,2BAA2B;YAC3B,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,mBAAmB,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE;YACnD,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,EAAE;YAC/C,IAAI,CAAC,cAAc;SACpB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAE5B,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,SAAS;gBACnB,4DAAK,KAAK,EAAC,wBAAwB;oBACjC,4DAAK,KAAK,EAAC,mBAAmB;wBAC5B,6DAAM,KAAK,EAAC,oBAAoB,sBAAuB;wBACvD,6DAAM,KAAK,EAAC,cAAc;4BAAC,iEAAS,IAAI,CAAC,OAAO,CAAU,CAAO,CAC7D;oBACN,0DAAG,KAAK,EAAC,2CAA2C,iBAAa,MAAM,WAAS,CAC5E;gBACN,4DAAK,KAAK,EAAC,sBAAsB;oBAC/B,4DAAK,KAAK,EAAC,eAAe;wBACxB,6DAAM,KAAK,EAAC,eAAe,IAAE,IAAI,CAAC,IAAI,CAAQ;wBAC9C,6DAAM,KAAK,EAAC,iBAAiB;;4BAAO,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAQ,CAClE;oBACN;wBAAK,4DAAK,GAAG,EAAE,IAAI,CAAC,SAAS,EAAE,GAAG,EAAC,WAAW,EAAC,KAAK,EAAC,gBAAgB,GAAE,CAAM,CACzE,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-credit-card',\r\n  styleUrls: [],\r\n  shadow: false,\r\n})\r\nexport class DdaCreditCard {\r\n  @Prop() balance: string;\r\n  @Prop() name: string;\r\n  @Prop() card_number: string;\r\n  @Prop() card_type: string;\r\n  @Prop() design: string;\r\n  @Prop() custom_class?: string = ''; \r\n  @Prop() component_mode?: string; \r\n\r\n  render() {\r\n    const cardClass = [\r\n      'dda-credit-card-container',\r\n      this.design ? `dda-credit-card-${this.design}` : '',\r\n      this.custom_class ? `${this.custom_class}` : \"\",\r\n      this.component_mode,\r\n    ].filter(Boolean).join(' ');\r\n\r\n    return (\r\n      <Host>\r\n        <div class={cardClass}>\r\n          <div class=\"dda-credit-card-header\">\r\n            <div class=\"card-balance-info\">\r\n              <span class=\"card-balance-label\">Current Balance</span>\r\n              <span class=\"card-balance\"><strong>{this.balance}</strong></span>\r\n            </div>\r\n            <i class=\"material-icons  material-symbols-outlined\" aria-hidden=\"true\">wifi</i>\r\n          </div>\r\n          <div class=\"dda-credit-card-body\">\r\n            <div class=\"card-userinfo\">\r\n              <span class=\"dda-card-name\">{this.name}</span>\r\n              <span class=\"dda-card-number\">**** {this.card_number.slice(-4)}</span>\r\n            </div>\r\n            <div><img src={this.card_type} alt=\"Card Type\" class=\"card-type-icon\"/></div>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/dda-credit-card/dda-credit-card.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-credit-card.stories.js","sourceRoot":"","sources":["../../../src/components/dda-credit-card/dda-credit-card.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,iDAAiD,CAAC;AAE1E,eAAe;IACX,KAAK,EAAE,wBAAwB;IAC/B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,6BAA6B;SAC3C;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,yBAAyB;SACvC;QACD,WAAW,EAAE;YACX,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,+CAA+C;SAC7D;QACD,SAAS,EAAE;YACT,OAAO,EAAE,MAAM;YACf,WAAW,EAAE,2BAA2B;SACzC;QACD,MAAM,EAAE;YACN,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,MAAM,CAAC;YACrC,WAAW,EAAE,qCAAqC;SACnD;QACD,YAAY,EAAE;YACZ,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,WAAW,EAAE,4CAA4C;SAC1D;QACD,cAAc,EAAE;YACd,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;YAC1B,OAAO,EAAE,CAAC,YAAY,CAAC;YACvB,WAAW,EAAE,mCAAmC;SACjD;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;GAclB;aACM;SACF;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;IACxB,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;SACpC,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,KAAK,KAAK,SAAS,IAAI,GAAG,KAAK,MAAM,CAAC;SAC/D,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,GAAG,KAAK,KAAK,GAAG,CAAC;SAC1C,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,OAAO,oBAAoB,UAAU,qBAAqB,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,OAAO,EAAE,WAAW;IACpB,IAAI,EAAE,aAAa;IACnB,WAAW,EAAE,MAAM;IACnB,SAAS,EAAE,WAAW;IACtB,MAAM,EAAE,SAAS;IACjB,YAAY,EAAE,EAAE;IAChB,cAAc,EAAE,EAAE;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,KAAK,CAAC,IAAI,GAAG;IACX,OAAO,EAAE,WAAW;IACpB,IAAI,EAAE,aAAa;IACnB,WAAW,EAAE,MAAM;IACnB,SAAS,EAAE,WAAW;IACtB,MAAM,EAAE,OAAO;IACf,YAAY,EAAE,EAAE;IAChB,cAAc,EAAE,EAAE;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACtC,IAAI,CAAC,IAAI,GAAG;IACV,OAAO,EAAE,WAAW;IACpB,IAAI,EAAE,aAAa;IACnB,WAAW,EAAE,MAAM;IACnB,SAAS,EAAE,WAAW;IACtB,MAAM,EAAE,MAAM;IACd,YAAY,EAAE,EAAE;IAChB,cAAc,EAAE,EAAE;CACnB,CAAC","sourcesContent":["import master_card from \"../../../src/assets/img/icn/icn-master-card.svg\";\r\n\r\nexport default {\r\n    title: 'Components/Credit Card',\r\n    tags: ['autodocs'],\r\n    argTypes: {\r\n      balance: {\r\n        control: 'text',\r\n        description: 'Current balance on the card',\r\n      },\r\n      name: {\r\n        control: 'text',\r\n        description: 'Name of the card holder',\r\n      },\r\n      card_number: {\r\n        control: 'text',\r\n        description: 'Card number (last 4 digits will be displayed)',\r\n      },\r\n      card_type: {\r\n        control: 'text',\r\n        description: 'URL of the card type icon',\r\n      },\r\n      design: {\r\n        control: { type: 'select' },\r\n        options: ['default', 'green', 'dark'],\r\n        description: 'Design variation of the credit card',\r\n      },\r\n      custom_class: {\r\n        control: { type: 'text' },\r\n        description: 'Custom class for the credit card component',\r\n      },\r\n      component_mode: {\r\n        control: { type: 'check' },\r\n        options: ['light-mode'],\r\n        description: 'Mode of the credit card component',\r\n      }\r\n    },\r\n    parameters: {\r\n      docs: {\r\n        description: {\r\n          component: `\r\n  To use the \\`dda-credit-card\\` component, pass the following props:\r\n  \r\n  \\`\\`\\`html\r\n<dda-credit-card\r\n    balance=\"$5,750.20\"\r\n    name=\"MARIA GOMEZ\"\r\n    card_number=\"1289\"\r\n    card_type= master_card\r\n    design=\"default\"\r\n    custom_class=\"\"\r\n    component_mode=\"\"\r\n></dda-credit-card>\r\n    \\`\\`\\`\r\n  `,\r\n        },\r\n      },\r\n    },  \r\n  };\r\n  \r\n  const Template = (args) => {\r\n    const attributes = Object.entries(args)\r\n      .filter(([key, value]) => value !== undefined && key !== 'text')\r\n      .map(([key, value]) => `${key}=\"${value}\"`)\r\n      .join(' ');\r\n  \r\n    return `<dda-credit-card ${attributes}></dda-credit-card>`;\r\n  };\r\n  \r\n  export const Default = Template.bind({});\r\n  Default.args = {\r\n    balance: '$5,750.20',\r\n    name: 'MARIA GOMEZ',\r\n    card_number: '1289',\r\n    card_type: master_card,\r\n    design: 'default',\r\n    custom_class: '',\r\n    component_mode: '',\r\n  };\r\n  \r\n  export const Green = Template.bind({});\r\n  Green.args = {\r\n    balance: '$5,750.20',\r\n    name: 'MARIA GOMEZ',\r\n    card_number: '1289',\r\n    card_type: master_card,\r\n    design: 'green',\r\n    custom_class: '',\r\n    component_mode: '',\r\n  };\r\n  \r\n  export const Dark = Template.bind({});\r\n  Dark.args = {\r\n    balance: '$5,750.20',\r\n    name: 'MARIA GOMEZ',\r\n    card_number: '1289',\r\n    card_type: master_card,\r\n    design: 'dark',\r\n    custom_class: '',\r\n    component_mode: '',\r\n  };\r\n  "]}

package/dist/collection/components/dda-creditcard-field/dda-creditcard-field.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-creditcard-field.js","sourceRoot":"","sources":["../../../src/components/dda-creditcard-field/dda-creditcard-field.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, Event, EventEmitter, h, Host } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-creditcard-field',\r\n  styleUrls: [],\r\n  shadow: false,\r\n})\r\nexport class DdaCreditCardField {\r\n  @Prop() placeholder: string;\r\n  @Prop() label: string;\r\n  @Prop() value: string = '';\r\n  @Prop() card_icon: string;\r\n  @Prop() error_message: string;\r\n  @Prop() validation_type?: string;\r\n  @Prop() validation_id: string = 'text';\r\n  @Prop() size?: string;\r\n  @Prop() input_type?: string;\r\n  @Prop() helper_text: string;\r\n  @Prop() disabled: boolean = false;\r\n  @Prop() custom_class?: string = '';\r\n  @Prop() restrict_input: boolean = false;\r\n  @Prop() component_mode?: string; \r\n  @Prop() input_id: string;\r\n  @Prop() aria_label?: string;\r\n  @Prop() input_name?: string;\r\n\r\n  @State() formattedValue: string = '';\r\n\r\n  @Event({ eventName: 'inputBlurred' }) inputBlurred: EventEmitter<{ name: string; value: string }>;\r\n  @Event({ eventName: 'cardValidChanged' }) cardValidChanged: EventEmitter<{ name: string; isValid: boolean }>;\r\n\r\n\r\n  // handleInput(event: Event) {\r\n  //   const inputElement = event.target as HTMLInputElement;\r\n  //   const inputValue = inputElement.value.replace(/[^0-9-]/g, '');\r\n  //   const maxLength = this.restrict_input ? 100 : 25;\r\n\r\n  //   if (inputValue.length <= maxLength) {\r\n  //     this.value = inputValue;\r\n  //     this.formatCardNumber(this.value);\r\n  //     inputElement.value = this.formattedValue;\r\n  //   } else {\r\n  //     inputElement.value = this.formattedValue;\r\n  //   }\r\n  // }\r\n\r\n  handleInput(event: Event) {\r\n    const inputElement = event.target as HTMLInputElement;\r\n    const inputValue = inputElement.value.replace(/[^0-9]/g, ''); // remove all non-numeric chars\r\n    const maxLength = this.restrict_input ? 100 : 25;\r\n\r\n    if (inputValue.length <= maxLength) {\r\n      this.value = inputValue;\r\n      this.formatCardNumber(this.value);\r\n      inputElement.value = this.formattedValue;\r\n\r\n      // Emit validity status to parent\r\n      const isValid = /^\\d{16}$/.test(this.value);\r\n      this.cardValidChanged.emit({ name: this.input_name || '', isValid });\r\n    } else {\r\n      inputElement.value = this.formattedValue;\r\n    }\r\n  }\r\n\r\n  // handleBlur(event: FocusEvent) {\r\n  //   const inputElement = event.target as HTMLInputElement;\r\n  //   this.inputBlurred.emit({\r\n  //     name: this.input_name || '',\r\n  //     value: inputElement.value,\r\n  //   });\r\n  // }\r\n\r\n  handleBlur(event: FocusEvent) {\r\n    const inputElement = event.target as HTMLInputElement;\r\n    const rawValue = inputElement.value.replace(/[^0-9]/g, '');\r\n\r\n    // Emit onBlur event (existing functionality)\r\n    this.inputBlurred.emit({\r\n      name: this.input_name || '',\r\n      value: inputElement.value,\r\n    });\r\n\r\n    // Emit card validation status\r\n    const isValid = /^\\d{16}$/.test(rawValue);\r\n    this.cardValidChanged.emit({\r\n      name: this.input_name || '',\r\n      isValid,\r\n    });\r\n  }\r\n\r\n  formatCardNumber(value: string) {\r\n    const cleaned = value.replace(/\\D/g, '');\r\n    const matched = cleaned.match(/.{1,4}/g);\r\n    if (matched) {\r\n      this.formattedValue = matched.join(' - ');\r\n    } else {\r\n      this.formattedValue = cleaned;\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.formatCardNumber(this.value);\r\n  }\r\n\r\n  render() {\r\n    const inputClass = [\r\n      'dda-input-container dda-credit-card-field',\r\n      this.validation_type ? `dda-validation-${this.validation_type}` : '',\r\n      this.size ? `dda-input-size-${this.size}` : '',\r\n      this.input_type ? `dda-input-${this.input_type}` : '',\r\n      this.disabled ? 'dda-input-disabled' : '',\r\n      this.error_message ? 'dda-error-message' : '',\r\n      this.custom_class ? `${this.custom_class}` : '',\r\n      this.component_mode, \r\n    ].filter(Boolean).join(' ');\r\n\r\n    const describedByIds: string[] = [];\r\n    if (this.helper_text) describedByIds.push(`${this.validation_id}-helper`);\r\n    if (this.validation_type === 'error' && this.error_message)\r\n      describedByIds.push(`${this.validation_id}-error`);\r\n\r\n    return (\r\n      <Host>\r\n        <div class={inputClass}>\r\n          {this.label && <label htmlFor={this.input_id} class=\"dda-input-label\">{this.label}</label>}\r\n          <div class=\"dda-input-field-wrapper\">\r\n            {this.card_icon && <img src={this.card_icon} alt=\"Card Icon\" class=\"dda-creditcard-icon\" />}\r\n            <input\r\n              aria-label={this.aria_label}\r\n              id={this.input_id}\r\n              name={this.input_name}\r\n              type=\"text\"\r\n              inputmode=\"numeric\"\r\n              placeholder={this.placeholder}\r\n              value={this.formattedValue}\r\n              class=\"dda-input-field\"\r\n              disabled={this.disabled}\r\n              maxlength={this.restrict_input ? 100 : 25}\r\n              onInput={(event) => this.handleInput(event)}\r\n              onBlur={(event) => this.handleBlur(event)}\r\n            />\r\n          </div>\r\n          {this.validation_type === 'error' && this.error_message ? (\r\n            <span \r\n              class=\"dda-error-message\" \r\n              id={this.validation_id}\r\n              role=\"alert\"\r\n            >\r\n              {this.error_message}\r\n            </span>\r\n          ) : (\r\n            this.helper_text && (\r\n              <span \r\n                class=\"dda-helper-text\" \r\n                id={this.validation_id}\r\n              >\r\n                {this.helper_text}\r\n              </span>\r\n            )\r\n          )}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/dda-creditcard-field/dda-creditcard-field.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-creditcard-field.stories.js","sourceRoot":"","sources":["../../../src/components/dda-creditcard-field/dda-creditcard-field.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import master_card from \"../../../src/assets/img/icn/icn-master-card.svg\";\r\n\r\nexport default {\r\n    title: 'Components/Credit Card Field',\r\n    tags: ['autodocs'],\r\n    argTypes: {\r\n      placeholder: {\r\n        control: 'text',\r\n        description: 'Placeholder text for the input field',\r\n      },\r\n      label: {\r\n        control: 'text',\r\n        description: 'Label for the input field',\r\n      },\r\n      restrict_input: {\r\n        control: 'boolean',\r\n        description: 'Restrict the input field to 16 digits',\r\n      },\r\n      value: {\r\n        control: 'text',\r\n        description: 'Value of the input field',\r\n      },\r\n      card_icon: {\r\n        control: 'text',\r\n        description: 'URL of the card icon',\r\n      },\r\n      error_message: {\r\n        control: 'text',\r\n        description: 'Error message displayed below the input field',\r\n      },\r\n      validation_type: {\r\n        control: { type: 'select' },\r\n        options: ['normal', 'error'],\r\n        description: 'Validation type of the input field',\r\n      },\r\n      validation_id:{\r\n        control: 'text',\r\n        description: 'Validation ID of helper text and error text',\r\n      },\r\n      size: {\r\n        control: { type: 'select' },\r\n        options: ['default', 'small',],\r\n        description: 'Size of the input field',\r\n      },\r\n      input_type: {\r\n        control: { type: 'select' },\r\n        options: ['normal', 'disabled'],\r\n        description: 'Input type of the input field',\r\n      },\r\n      helper_text: {\r\n        control: 'text',\r\n        description: 'Helper text displayed below the input field',\r\n      },\r\n      disabled: {\r\n        control: 'boolean',\r\n        description: 'Disables the input field',\r\n      },\r\n      custom_class: {\r\n        control: { type: 'text' },\r\n        description: 'Custom class for the input field',\r\n      },\r\n      component_mode: {\r\n        control: { type: 'check' },\r\n        options: ['light-mode'],\r\n        description: 'Mode of the credit card field component',\r\n      },\r\n      input_id: {\r\n        control: { type: 'text' },\r\n        description: 'default',\r\n      },\r\n      aria_label: {\r\n        control: { type: 'text' },\r\n        description: 'Accessible label for the credit card field',\r\n      },\r\n      onchange:{\r\n        control: { type: 'text' },\r\n        description: 'onchange event for the credit card field',\r\n      },\r\n      input_name: {\r\n        control: { type: 'text' },\r\n        description: 'Name of the input field',\r\n      }\r\n    },\r\n    parameters: {\r\n      docs: {\r\n        description: {\r\n          component: `\r\n  To use the \\`dda-credit-card-field\\` component, pass the following props:\r\n  \r\n  \\`\\`\\`html\r\n<dda-creditcard-field\r\n    placeholder=\"0000 - 0000 - 0000 - 0000\"\r\n    label=\"Card Number\"\r\n    restrict_input=\"false\"\r\n    value=\"\"\r\n    card_icon= master_card\r\n    size=\"default\"\r\n    helper_text=\"Helper or footer text\"\r\n    error_message=\"\"\r\n    validation_type=\"normal\"\r\n    custom_class=\"\"\r\n    component_mode=\"\"\r\n    input_id=\"input\"\r\n    aria_label=\"credit-card-field\"\r\n    onchange=\"console.log('changed')\"\r\n    input_name=\"input\"\r\n></dda-creditcard-field>\r\n    \\`\\`\\`\r\n  `,\r\n        },\r\n      },\r\n    },  \r\n  };\r\n  \r\n  const Template = (args) => {\r\n    const attributes = Object.entries(args)\r\n      .filter(([key, value]) => value !== undefined && key !== 'text')\r\n      .map(([key, value]) => `${key}=\"${value}\"`)\r\n      .join(' ');\r\n  \r\n    return `<dda-creditcard-field ${attributes}></dda-creditcard-field>`;\r\n  };\r\n  \r\n  export const Default = Template.bind({});\r\n  Default.args = {\r\n    placeholder: '0000 - 0000 - 0000 - 0000',\r\n    label: 'Card Number',\r\n    restrict_input: false,\r\n    value: '',\r\n    card_icon: master_card,\r\n    size: 'default',\r\n    helper_text: 'Helper or footer text',\r\n    error_message: 'This is an error message',\r\n    validation_type: 'normal',\r\n    validation_id: 'validationId',\r\n    custom_class: '',\r\n    component_mode: '',\r\n    input_id: 'input',\r\n    aria_label: 'credit-card-field',\r\n    onchange: '',\r\n    input_name: 'input',\r\n  };\r\n  \r\n  export const SmallSize = Template.bind({});\r\n  SmallSize.args = {\r\n    placeholder: '0000 - 0000 - 0000 - 0000',\r\n    label: 'Card Number',\r\n    restrict_input: false,\r\n    value: '',\r\n    card_icon: master_card,\r\n    size: 'small',\r\n    helper_text: 'Helper or footer text',\r\n    error_message: 'This is an error message',\r\n    validation_type: 'normal',\r\n    validation_id: 'validationId',\r\n    custom_class: '',\r\n    component_mode: '',\r\n    input_id: 'input',\r\n    aria_label: 'credit-card-field',\r\n    onchange: '',\r\n    input_name: 'input',\r\n  };\r\n\r\n  export const WithErrorMessage = Template.bind({});\r\n  WithErrorMessage.args = {\r\n    placeholder: '0000 - 0000 - 0000 - 0000',\r\n    label: 'Card Number',\r\n    restrict_input: false,\r\n    value: '5464 - 5363 - 5363 - 6363',\r\n    card_icon: master_card,\r\n    size: 'default',\r\n    helper_text: 'Helper or footer text',\r\n    error_message: 'This is an error message',\r\n    validation_type: 'error',\r\n    validation_id: 'validationId',\r\n    custom_class: '',\r\n    component_mode: '',\r\n    input_id: 'input',\r\n    aria_label: 'credit-card-field',\r\n    onchange: '',\r\n    input_name: 'input',\r\n  };\r\n   \r\n  export const Disabled = Template.bind({});\r\n  Disabled.args = {\r\n    placeholder: '0000 - 0000 - 0000 - 0000',\r\n    label: 'Card Number',\r\n    restrict_input: false,\r\n    value: '',\r\n    card_icon: master_card,\r\n    size: 'default',\r\n    helper_text: 'Helper or footer text',\r\n    error_message: 'This is an error message',\r\n    validation_type: 'normal',\r\n    validation_id: 'validationId',\r\n    disabled: true,\r\n    custom_class: '',\r\n    component_mode: '',\r\n    input_id: 'input',\r\n    aria_label: 'credit-card-field',\r\n    onchange: '',\r\n    input_name: 'input',\r\n  };  "]}

package/dist/collection/components/dda-dropdown/dda-dropdown.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-dropdown.js","sourceRoot":"","sources":["../../../src/components/dda-dropdown/dda-dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, h, Host, Element, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-dropdown',\r\n  styleUrls: [],\r\n  shadow: false,\r\n})\r\nexport class DdaDropdown {\r\n  @Element() el: HTMLElement;\r\n\r\n  @Prop() label: string;\r\n  @Prop() options: string;\r\n  @Prop() selected: string; // can be id or text\r\n  @Prop() disabled: boolean = false;\r\n  @Prop() error?: string;\r\n  @Prop() error_message: string;\r\n  @Prop() helper_text: string;\r\n  @Prop() validation_id: string = 'text';\r\n  @Prop() size?: string;\r\n  @Prop() icon_mode: boolean = false; // New prop for icon mode\r\n  @Prop() custom_class?: string = '';\r\n  @Prop() component_mode?: string;\r\n  @Prop() button_id: string;\r\n  @Prop() toggle_button_name: string;\r\n  @Prop() option_select_button_name: string;\r\n  @Prop() placeholder: string = '';\r\n  @Prop() main_aria_label: string = '';\r\n  \r\n  @State() is_open: boolean = false;\r\n  @State() selectedId: number;\r\n  @State() selectedText: string;\r\n  \r\n  @Event() selectChanged: EventEmitter<{ id: number; text: string }>;\r\n\r\n  private get parsedOptions(): { id: number; text: string }[] {\r\n    try {\r\n      return JSON.parse(this.options);\r\n    } catch {\r\n      return [];\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    const selectedOption = this.parsedOptions.find(\r\n      (opt) => opt.id.toString() === this.selected || opt.text === this.selected\r\n    );\r\n    if (selectedOption) {\r\n      this.selectedId = selectedOption.id;\r\n      this.selectedText = selectedOption.text;\r\n    }\r\n  }\r\n\r\n  toggleSelect() {\r\n    if (!this.disabled) {\r\n      this.is_open = !this.is_open;\r\n    }\r\n  }\r\n\r\n  selectOption(option: { id: number; text: string }) {\r\n    if (!this.disabled) {\r\n      this.selectedId = option.id;\r\n      this.selectedText = option.text;\r\n      this.is_open = false;\r\n      this.selectChanged.emit(option);\r\n    }\r\n  }\r\n\r\n  handleClickOutside = (event: MouseEvent) => {\r\n    if (this.is_open && !this.el.contains(event.target as Node)) {\r\n      this.is_open = false;\r\n    }\r\n  };\r\n\r\n  connectedCallback() {\r\n    document.addEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    document.removeEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  private numberToWord(num: number): string {\r\n    const words = ['One', 'Two', 'Three', 'Four', 'Five'];\r\n    return words[num - 1] || num.toString();\r\n  }\r\n\r\n  render() {\r\n    const labelId = `${this.button_id}-label`;\r\n    const valueId = `${this.button_id}-value`;\r\n\r\n    return (\r\n      <Host>\r\n        <div\r\n          class={`dda-input-container ${this.custom_class} ${this.component_mode} ${\r\n            this.disabled ? 'dda-input-disabled' : ''\r\n          } dda-input-size-${this.size} dda-validation-${this.error}`}\r\n        >\r\n          {this.label && (\r\n            <label id={labelId} htmlFor={this.button_id} class=\"dda-input-label\">\r\n              {this.label}\r\n            </label>\r\n          )}\r\n          <div class=\"dda-dropdown-container\">\r\n            <button\r\n              name={this.toggle_button_name}\r\n              id={this.button_id}\r\n              type=\"button\"\r\n              class=\"dda-input-field dda-dropdown-header\"\r\n              onClick={() => this.toggleSelect()}\r\n              aria-labelledby={this.button_id}\r\n              disabled={this.disabled}\r\n            >\r\n              <i class={`three-dots material-icons`} aria-hidden=\"true\">{this.is_open ? 'more_vert' : 'more_vert'}</i>\r\n              {!this.icon_mode && (\r\n              <span id={valueId} class=\"dda-dropdown-text\">\r\n                <span>{this.selectedText || this.placeholder}</span>\r\n                <i class=\"material-icons\">{this.is_open ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}</i>\r\n              </span>\r\n              )}\r\n              \r\n            </button>\r\n\r\n            {this.is_open && (\r\n              <div class=\"dda-input-dropdown-list dda-select-list\">\r\n                {this.parsedOptions.length > 0 ? (\r\n                  this.parsedOptions.map((option, index) => (\r\n                    <button\r\n                      name={`option${this.numberToWord(index + 1)}`}\r\n                      type=\"button\"\r\n                      class={`dda-input-dropdown-item ${this.selectedId === option.id ? 'selected' : ''}`}\r\n                      onClick={() => this.selectOption(option)}\r\n                      role=\"option\"\r\n                      aria-selected={this.selectedId === option.id ? 'true' : 'false'}\r\n                    >\r\n                      {option.text}\r\n                    </button>\r\n                  ))\r\n                ) : (\r\n                  <div class=\"dda-input-dropdown-item\">No options available</div>\r\n                )}\r\n              </div>\r\n            )}\r\n          </div>\r\n\r\n          {this.helper_text && (\r\n            <span class=\"dda-helper-text\" id={this.validation_id}>\r\n              {this.helper_text}\r\n            </span>\r\n          )}\r\n          {this.error_message && (\r\n            <span class=\"dda-error-message\" id={this.validation_id}>\r\n              {this.error_message}\r\n            </span>\r\n          )}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/dda-dropdown/dda-dropdown.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-dropdown.stories.js","sourceRoot":"","sources":["../../../src/components/dda-dropdown/dda-dropdown.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["export default {\r\n  title: 'Components/Dropdown',\r\n  tags: ['autodocs'],\r\n  argTypes: {\r\n    size: {\r\n      control: { type: 'select' },\r\n      options: ['default', 'small'],\r\n      description: 'Size of the select',\r\n    },\r\n    label: { control: 'text', description: 'Label for the select' },\r\n    options: {\r\n      control: 'object',\r\n      description: 'Array of options (id and text)',\r\n    },\r\n    icon_mode: {\r\n      control: 'boolean',\r\n      description: 'Enable or disable icon mode',\r\n    },\r\n    selected: {\r\n      control: 'text',\r\n      description: 'Selected option (id or text)',\r\n    },\r\n    placeholder: {\r\n      control: 'text',\r\n      description: 'Placeholder text when no option is selected',\r\n    },\r\n    main_aria_label: {\r\n      control: 'text',\r\n      description: 'Aria Label text for the accessibility',\r\n    },\r\n    disabled: { control: 'boolean', description: 'Disable the select' },\r\n    error: {\r\n      control: { type: 'select' },\r\n      options: ['normal', 'error'],\r\n      description: 'Error state of the select',\r\n    },\r\n    error_message: { control: 'text', description: 'Error message to display' },\r\n    helper_text: { control: 'text', description: 'Helper or footer text' },\r\n    validation_id: { control: 'text', description: 'Validation ID' },\r\n    custom_class: { control: 'text', description: 'Custom class for the select' },\r\n    component_mode: {\r\n      control: 'check',\r\n      options: ['light-mode'],\r\n      description: 'Mode of the select component',\r\n    },\r\n    button_id: { control: 'text', description: 'Button ID' },\r\n    toggle_button_name: { control: 'text', description: 'Toggle button name' },\r\n    option_select_button_name: { control: 'text', description: 'Option select button name' },\r\n  },\r\n  parameters: {\r\n    docs: {\r\n      description: {\r\n        component: `\r\n\\`\\`\\`html\r\n<dda-dropdown\r\n  label=\"Select an option\"\r\n  placeholder=\"Please select...\"\r\n  main_aria_label=\"Please choose an option\"\r\n  selected=\"2\"\r\n  disabled=\"false\"\r\n  helper_text=\"Helper or footer text\"\r\n  error_message=\"\"\r\n  size=\"default\"\r\n  icon_mode=\"false\"\r\n  custom_class=\"\"\r\n  component_mode=\"\"\r\n  button_id=\"button\"\r\n  options='[{\"id\":1,\"text\":\"Option 1\"},{\"id\":2,\"text\":\"Option 2\"}]'\r\n  toggle_button_name=\"toggle_button\"\r\n  option_select_button_name=\"option_button\"\r\n></dda-dropdown>\r\n\\`\\`\\`\r\n        `,\r\n      },\r\n    },\r\n  },\r\n};\r\n\r\nconst Template = (args) => {\r\n  const optionsAttribute = args.options ? `options='${JSON.stringify(args.options)}'` : '';\r\n  const otherAttributes = Object.entries(args)\r\n    .filter(([key]) => key !== 'options')\r\n    .map(([key, value]) => `${key}=\"${value}\"`)\r\n    .join(' ');\r\n\r\n  return `\r\n    <dda-dropdown ${optionsAttribute} ${otherAttributes}></dda-dropdown>\r\n    <script>\r\n      document.querySelector('dda-dropdown').addEventListener('selectChanged', e => {\r\n        console.log('Selected:', e.detail);\r\n      });\r\n    </script>\r\n  `;\r\n};\r\n\r\nconst defaultOptions = [\r\n  { id: '1', text: 'Option 1' },\r\n  { id: '2', text: 'Option 2' },\r\n  { id: '3', text: 'Option 3' },\r\n  { id: '4', text: 'Option 4' },\r\n  { id: '5', text: 'Option 5' },\r\n];\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n  label: 'Select an option',\r\n  placeholder: 'Please select...',\r\n  main_aria_label: 'Please choose an option',\r\n  options: defaultOptions,\r\n  selected: '0',\r\n  disabled: false,\r\n  helper_text: 'Helper or footer text',\r\n  error_message: '',\r\n  validation_id: 'validationId',\r\n  size: 'default',\r\n  icon_mode: \"false\",\r\n  custom_class: '',\r\n  component_mode: '',\r\n  button_id: 'button',\r\n  toggle_button_name: 'toggle_button',\r\n  option_select_button_name: 'option_button',\r\n  selectChanged:\"\",\r\n};\r\n\r\nexport const Small = Template.bind({});\r\nSmall.args = {\r\n  ...Default.args,\r\n  size: 'small',\r\n};\r\n\r\nexport const WithError = Template.bind({});\r\nWithError.args = {\r\n  ...Default.args,\r\n  error: 'error',\r\n  error_message: 'This is an error message',\r\n};\r\n\r\nexport const Disabled = Template.bind({});\r\nDisabled.args = {\r\n  ...Default.args,\r\n  disabled: true,\r\n};\r\n"]}

package/dist/collection/components/dda-footer/dda-footer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-footer.js","sourceRoot":"","sources":["../../../src/components/dda-footer/dda-footer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-footer',\r\n  styleUrls: [],\r\n  shadow: false,\r\n})\r\nexport class DdaFooter {\r\n  @Prop() footerTitle: string;\r\n  @Prop() description: string;\r\n  @Prop() signUpButtonText: string;\r\n  @Prop() loginButtonText: string;\r\n  @Prop() logoSrc: string;\r\n  @Prop() logoAlt: string;\r\n  @Prop() copyrightText: string;\r\n\r\n  // Updated to accept JSON strings\r\n  @Prop() footerSections: string;\r\n  @Prop() socialIcons: string;\r\n\r\n  private parseJsonArray(jsonString: string) {\r\n    try {\r\n      return JSON.parse(jsonString);\r\n    } catch (e) {\r\n      console.error('Failed to parse JSON:', e);\r\n      return [];\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const sections = this.parseJsonArray(this.footerSections);\r\n    const icons = this.parseJsonArray(this.socialIcons);\r\n\r\n    return (\r\n      <footer class=\"WB-footer\">\r\n        {!!this.footerTitle && (\r\n          <div class=\"dda-container line-seperater\">\r\n            <div class=\"dda-d-flex dda-align-center dda-flex-column dda-gap-5\">\r\n              <h4 class=\"dda-fs-display-sm dda-fw-700 dda-color-black\">{this.footerTitle}</h4>\r\n              <p class=\"dda-fs-title-sm dda-fw-400 dda-mb-3\">{this.description}</p>\r\n              <div class=\"dda-d-flex dda-gap-5\">\r\n                <dda-button button_color=\"default-primary\" size=\"lg\" button_text={this.signUpButtonText}></dda-button>\r\n                <dda-button button_color=\"default-tertiary\" size=\"lg\" button_text={this.loginButtonText}></dda-button>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        )}\r\n\r\n        <div class=\"dda-container line-seperater\">\r\n          <div class=\"dda-row\">\r\n            <div class=\"dda-col-lg-4 dda-mb-3\">\r\n              <div class=\"text-center\">\r\n                <img class=\"entt-logo\" src={this.logoSrc} alt={this.logoAlt} />\r\n                {/* <p class=\"dda-fs-title-sm\">Design outstanding interfaces with advanced Figma features in a matter of minutes.</p> */}\r\n              </div>\r\n            </div>\r\n            <div class=\"dda-col-lg-8\">\r\n              <div class=\"dda-row\">\r\n                {sections.map(section => (\r\n                  <div class=\"dda-col-6 dda-col-sm-6 dda-col-md-3 dda-mb-3\">\r\n                    <p class=\"dda-fs-title-sm dda-fw-700 dda-color-black dda-mb-3\">{section.title}</p>\r\n                    <ul class=\"footer-menu\">\r\n                      {section.links.map(link => (\r\n                        <li>\r\n                          <a class=\"dda-fs-title-sm dda-fw-400\" href={link.href}>\r\n                            {link.label}\r\n                          </a>\r\n                        </li>\r\n                      ))}\r\n                    </ul>\r\n                  </div>\r\n                ))}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"dda-container dda-pt-4\">\r\n          <div class=\"dda-d-flex dda-align-center dda-justify-content-between\">\r\n            <p class=\"dda-fs-title-sm\">{this.copyrightText}</p>\r\n            <ul class=\"dda-d-flex dda-align-center dda-gap-4\">\r\n              {icons.map(icon => (\r\n                <li>\r\n                  <a href={icon.href}>\r\n                    <img class=\"footer-social-icn\" src={icon.src} alt={icon.alt} />\r\n                  </a>\r\n                </li>\r\n              ))}\r\n            </ul>\r\n          </div>\r\n        </div>\r\n      </footer>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/dda-footer/dda-footer.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-footer.stories.js","sourceRoot":"","sources":["../../../src/components/dda-footer/dda-footer.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["\r\nexport default {\r\n    title: 'Components/Footer',\r\n    tags: ['autodocs'],\r\n    component: 'dda-footer',\r\n    parameters: {\r\n      docs: {\r\n        description: {\r\n          component: `\r\n  To use the \\`dda-chip\\` component, pass the following props:\r\n  \r\n  \\`\\`\\`html\r\n<dda-footer\r\n    title=\"Welcome to your new digital reality.\"\r\n    description=\"Let us help you take you from zero to serious business and beyond. Our no-strings attached free trial lets you test our product today.\"\r\n    logo-src=\"https://www.digitaldubai.ae/ResourcePackages/Theme/assets/dist/images/logo.svg\"\r\n    logo-alt=\"Dubai-Digital-Authority\"\r\n    sign-up-button-text=\"Sign Up\"\r\n    login-button-text=\"Login\"\r\n    copyright-text=\"© 2023 Digitaldubai. All Rights Reserved.\"\r\n    footer-sections='[{\"title\":\"About Us\",\"links\":[{\"label\":\"Our Competition\",\"href\":\"#\"},{\"label\":\"Channels\",\"href\":\"#\"},{\"label\":\"Scale\",\"href\":\"#\"},{\"label\":\"Watch the Demo\",\"href\":\"#\"}]},{\"title\":\"Products\",\"links\":[{\"label\":\"Features\",\"href\":\"#\"},{\"label\":\"Products\",\"href\":\"#\"},{\"label\":\"Enterprise\",\"href\":\"#\"},{\"label\":\"Solutions\",\"href\":\"#\"}]},{\"title\":\"Resources\",\"links\":[{\"label\":\"Partners\",\"href\":\"#\"},{\"label\":\"Developers\",\"href\":\"#\"},{\"label\":\"Community\",\"href\":\"#\"},{\"label\":\"Apps\",\"href\":\"#\"}]},{\"title\":\"Company\",\"links\":[{\"label\":\"About Us\",\"href\":\"#\"},{\"label\":\"Leadership\",\"href\":\"#\"},{\"label\":\"News\",\"href\":\"#\"}]}]'\r\n    social-icons='[{\"href\":\"#\",\"src\":\"https://img.icons8.com/?size=256&amp;id=118497&amp;format=png\",\"alt\":\"Facebook\"},{\"href\":\"#\",\"src\":\"https://img.icons8.com/?size=256&amp;id=118497&amp;format=png\",\"alt\":\"Google\"},{\"href\":\"#\",\"src\":\"https://img.icons8.com/?size=256&amp;id=118497&amp;format=png\",\"alt\":\"Apple\"},{\"href\":\"#\",\"src\":\"https://img.icons8.com/?size=256&amp;id=118497&amp;format=png\",\"alt\":\"Instagram\"}]'\r\n    class=\"hydrated\"\r\n></dda-footer>\r\n    \\`\\`\\`\r\n  `,\r\n        },\r\n      },\r\n    },\r\n  };\r\n  \r\n  const Template = (args) => `\r\n    <dda-footer \r\n      title=\"${args.introTitle}\"\r\n      description=\"${args.introText}\"\r\n      logo-src=\"${args.logoUrl}\"\r\n      logo-alt=\"${args.logoAlt}\"\r\n      sign-up-button-text=\"${args.signUpLabel}\"\r\n      login-button-text=\"${args.loginLabel}\"\r\n      copyright-text=\"${args.copyrightText}\"\r\n      footer-sections='${JSON.stringify(args.footerSections)}'\r\n      social-icons='${JSON.stringify(args.socialIcons)}'\r\n    ></dda-footer>\r\n  `;\r\n  \r\n  export const Default = Template.bind({});\r\n  Default.args = {\r\n    introTitle: \"Welcome to your new digital reality.\",\r\n    introText: \"Let us help you take you from zero to serious business and beyond. Our no-strings attached free trial lets you test our product today.\",\r\n    logoUrl: \"https://www.digitaldubai.ae/ResourcePackages/Theme/assets/dist/images/logo.svg\",\r\n    logoAlt: \"Dubai-Digital-Authority\",\r\n    signUpLabel: \"Sign Up\",\r\n    loginLabel: \"Login\",\r\n    copyrightText: \"© 2023 Digitaldubai. All Rights Reserved.\",\r\n    footerSections: [\r\n      { \r\n        title: \"About Us\", \r\n        links: [\r\n          { label: \"Our Competition\", href: \"#\" },\r\n          { label: \"Channels\", href: \"#\" },\r\n          { label: \"Scale\", href: \"#\" },\r\n          { label: \"Watch the Demo\", href: \"#\" },\r\n        ]\r\n      },\r\n      { \r\n        title: \"Products\", \r\n        links: [\r\n          { label: \"Features\", href: \"#\" },\r\n          { label: \"Products\", href: \"#\" },\r\n          { label: \"Enterprise\", href: \"#\" },\r\n          { label: \"Solutions\", href: \"#\" },\r\n        ]\r\n      },\r\n      { \r\n        title: \"Resources\", \r\n        links: [\r\n          { label: \"Partners\", href: \"#\" },\r\n          { label: \"Developers\", href: \"#\" },\r\n          { label: \"Community\", href: \"#\" },\r\n          { label: \"Apps\", href: \"#\" },\r\n        ]\r\n      },\r\n      { \r\n        title: \"Company\", \r\n        links: [\r\n          { label: \"About Us\", href: \"#\" },\r\n          { label: \"Leadership\", href: \"#\" },\r\n          { label: \"News\", href: \"#\" },\r\n        ]\r\n      },\r\n    ],\r\n    socialIcons: [\r\n      { href: \"#\", src: \"https://img.icons8.com/?size=256&id=118497&format=png\", alt: \"Facebook\" },\r\n      { href: \"#\", src: \"https://img.icons8.com/?size=256&id=118497&format=png\", alt: \"Google\" },\r\n      { href: \"#\", src: \"https://img.icons8.com/?size=256&id=118497&format=png\", alt: \"Apple\" },\r\n      { href: \"#\", src: \"https://img.icons8.com/?size=256&id=118497&format=png\", alt: \"Instagram\" },\r\n    ],\r\n  };  "]}