@infineon/infineon-design-system-stencil 33.1.2--canary.1833.f2ea4904e9407d4dca14274dbb44c8699b4937fe.0 → 33.1.2--canary.1833.31f06740905830099d5486c62f6b53ff6346529e.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.
@@ -131,7 +131,7 @@ placeholder="${args.placeholder}"
131
131
  size="${args.size}"
132
132
  variant="${args.variant}"
133
133
  read-only="${args.readOnly}"
134
- ariaLabel="${args.ariaLabel}"
134
+ aria-label="${args.ariaLabel}"
135
135
  >
136
136
  ${(() => {
137
137
  return Array.from({ length: args.amountOfChipItems }, (_, chipItemId) => {
@@ -1 +1 @@
1
- {"version":3,"file":"chip.stories.js","sourceRoot":"","sources":["../../../src/components/chip/chip.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Chip',\n tags: ['autodocs'],\n parameters: {\n docs: {\n story: {\n height: '100px',\n },\n },\n },\n args: {\n amountOfChipItems: 4,\n chipItemLabel: 'Item Label',\n placeholder: 'Label',\n size: 'large',\n variant: 'single',\n readOnly: false,\n selected: false,\n value: 'Item Value',\n ariaLabel: 'Chip'\n },\n argTypes: {\n amountOfChipItems: {\n name: 'Amount of Chip Items',\n control: 'number',\n description: 'Control the number of *<ifx-chip-item>* in a Chip.',\n table: {\n category: 'story controls',\n type: {\n summary: null\n }\n }\n },\n chipItemLabel: {\n name: 'Label of Chip Item',\n description: 'Set the label of *<ifx-chip-item>*.',\n table: {\n category: 'story controls',\n }\n },\n placeholder: {\n description: 'Set the placeholder string.',\n table: {\n category: 'ifx-chip props'\n }\n },\n size: {\n description: 'Switch the size of Chip.',\n control: 'radio',\n options: ['large', 'small'],\n table: {\n category: 'ifx-chip props',\n defaultValue: {\n summary: 'large'\n },\n type: {\n summary: 'large | small'\n }\n }\n },\n variant: {\n description: 'Switch the variant of Chip.',\n control: 'radio',\n options: ['single', 'multi'],\n table: {\n category: 'ifx-chip props',\n defaultValue: {\n summary: 'single'\n },\n type: {\n summary: 'single | multi'\n }\n }\n },\n readOnly: {\n name: 'read-only',\n description: 'No dropdown menu. The chip component is read-only.',\n control: 'boolean',\n table: {\n category: 'ifx-chip props',\n defaultValue: {\n summary: false,\n }\n }\n },\n ariaLabel: {\n control: { type: 'text' },\n description: 'Set the aria label of the chip item. Enhances accessibility.',\n table: {\n category: 'ifx-chip props'\n }\n },\n selected: {\n description: 'Set the *selected* prop to pre-select the chip item.',\n table: {\n category: 'ifx-chip-item props',\n defaultValue: {\n summary: 'false'\n }\n }\n },\n value: {\n description: 'Set the value of chip item.',\n table: {\n category: 'ifx-chip-item props',\n }\n },\n ifxChange: {\n action: 'ifxChange',\n description: 'A custom event emitted when the selection in a *<ifx-chip>* is updated.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail: `\nReact: onIfxChange={handleChange}\nVue: @ifxChange=\"handleChange\"\nAngular: (ifxChange)=\"handleChange()\"\nVanillaJs: .addEventListener(\"ifxChange\", (event) => {/*handle change*/});`,\n }\n }\n }\n }\n};\n\nconst Template = (args) => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `\n<ifx-chip\nplaceholder=\"${args.placeholder}\"\nsize=\"${args.size}\"\nvariant=\"${args.variant}\"\nread-only=\"${args.readOnly}\"\nariaLabel=\"${args.ariaLabel}\"\n>\n ${(() => {\n return Array.from({ length: args.amountOfChipItems }, (_, chipItemId) => {\n const chipItem: HTMLIfxChipItemElement = document.createElement('ifx-chip-item');\n chipItem.innerHTML = args.chipItemLabel + ' ' + (chipItemId + 1);\n chipItem.setAttribute('value', args.value + ' ' + (chipItemId + 1));\n if (args.selected && chipItemId === 1) {\n chipItem.setAttribute('selected', 'true');\n }\n if (args.readOnly) {\n if (args.variant === 'multi') {\n chipItem.setAttribute('selected', 'true');\n } else if (chipItemId === 0) {\n chipItem.setAttribute('selected', 'true');\n }\n }\n return chipItem.outerHTML;\n }).join(`\\n `);\n })()\n }\n</ifx-chip>`;\n\n const chip = wrapper.querySelector('ifx-chip');\n chip.addEventListener('ifxChange', action('ifxChange'));\n\n return chip;\n};\n\nexport const Default = Template.bind({});\nDefault.tags = ['!dev', '!autodocs'];\n\nexport const Single = Template.bind({});\nSingle.args = {\n variant: 'single'\n};\nSingle.argTypes = {\n variant: {\n table: {\n disable: true\n }\n }\n};\n\nexport const Multi = Template.bind({});\nMulti.args = {\n variant: 'multi'\n};\nMulti.argTypes = {\n variant: {\n table: {\n disable: true\n }\n }\n};\n\nexport const ReadOnly = Template.bind({});\nReadOnly.args = {\n readOnly: true,\n variant: 'multi'\n};\nReadOnly.argTypes = {\n readOnly: {\n table: {\n disable: true\n }\n }\n};\n"]}
1
+ {"version":3,"file":"chip.stories.js","sourceRoot":"","sources":["../../../src/components/chip/chip.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Chip',\n tags: ['autodocs'],\n parameters: {\n docs: {\n story: {\n height: '100px',\n },\n },\n },\n args: {\n amountOfChipItems: 4,\n chipItemLabel: 'Item Label',\n placeholder: 'Label',\n size: 'large',\n variant: 'single',\n readOnly: false,\n selected: false,\n value: 'Item Value',\n ariaLabel: 'Chip'\n },\n argTypes: {\n amountOfChipItems: {\n name: 'Amount of Chip Items',\n control: 'number',\n description: 'Control the number of *<ifx-chip-item>* in a Chip.',\n table: {\n category: 'story controls',\n type: {\n summary: null\n }\n }\n },\n chipItemLabel: {\n name: 'Label of Chip Item',\n description: 'Set the label of *<ifx-chip-item>*.',\n table: {\n category: 'story controls',\n }\n },\n placeholder: {\n description: 'Set the placeholder string.',\n table: {\n category: 'ifx-chip props'\n }\n },\n size: {\n description: 'Switch the size of Chip.',\n control: 'radio',\n options: ['large', 'small'],\n table: {\n category: 'ifx-chip props',\n defaultValue: {\n summary: 'large'\n },\n type: {\n summary: 'large | small'\n }\n }\n },\n variant: {\n description: 'Switch the variant of Chip.',\n control: 'radio',\n options: ['single', 'multi'],\n table: {\n category: 'ifx-chip props',\n defaultValue: {\n summary: 'single'\n },\n type: {\n summary: 'single | multi'\n }\n }\n },\n readOnly: {\n name: 'read-only',\n description: 'No dropdown menu. The chip component is read-only.',\n control: 'boolean',\n table: {\n category: 'ifx-chip props',\n defaultValue: {\n summary: false,\n }\n }\n },\n ariaLabel: {\n control: { type: 'text' },\n description: 'Set the aria label of the chip item. Enhances accessibility.',\n table: {\n category: 'ifx-chip props'\n }\n },\n selected: {\n description: 'Set the *selected* prop to pre-select the chip item.',\n table: {\n category: 'ifx-chip-item props',\n defaultValue: {\n summary: 'false'\n }\n }\n },\n value: {\n description: 'Set the value of chip item.',\n table: {\n category: 'ifx-chip-item props',\n }\n },\n ifxChange: {\n action: 'ifxChange',\n description: 'A custom event emitted when the selection in a *<ifx-chip>* is updated.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail: `\nReact: onIfxChange={handleChange}\nVue: @ifxChange=\"handleChange\"\nAngular: (ifxChange)=\"handleChange()\"\nVanillaJs: .addEventListener(\"ifxChange\", (event) => {/*handle change*/});`,\n }\n }\n }\n }\n};\n\nconst Template = (args) => {\n const wrapper = document.createElement('div');\n wrapper.innerHTML = `\n<ifx-chip\nplaceholder=\"${args.placeholder}\"\nsize=\"${args.size}\"\nvariant=\"${args.variant}\"\nread-only=\"${args.readOnly}\"\naria-label=\"${args.ariaLabel}\"\n>\n ${(() => {\n return Array.from({ length: args.amountOfChipItems }, (_, chipItemId) => {\n const chipItem: HTMLIfxChipItemElement = document.createElement('ifx-chip-item');\n chipItem.innerHTML = args.chipItemLabel + ' ' + (chipItemId + 1);\n chipItem.setAttribute('value', args.value + ' ' + (chipItemId + 1));\n if (args.selected && chipItemId === 1) {\n chipItem.setAttribute('selected', 'true');\n }\n if (args.readOnly) {\n if (args.variant === 'multi') {\n chipItem.setAttribute('selected', 'true');\n } else if (chipItemId === 0) {\n chipItem.setAttribute('selected', 'true');\n }\n }\n return chipItem.outerHTML;\n }).join(`\\n `);\n })()\n }\n</ifx-chip>`;\n\n const chip = wrapper.querySelector('ifx-chip');\n chip.addEventListener('ifxChange', action('ifxChange'));\n\n return chip;\n};\n\nexport const Default = Template.bind({});\nDefault.tags = ['!dev', '!autodocs'];\n\nexport const Single = Template.bind({});\nSingle.args = {\n variant: 'single'\n};\nSingle.argTypes = {\n variant: {\n table: {\n disable: true\n }\n }\n};\n\nexport const Multi = Template.bind({});\nMulti.args = {\n variant: 'multi'\n};\nMulti.argTypes = {\n variant: {\n table: {\n disable: true\n }\n }\n};\n\nexport const ReadOnly = Template.bind({});\nReadOnly.args = {\n readOnly: true,\n variant: 'multi'\n};\nReadOnly.argTypes = {\n readOnly: {\n table: {\n disable: true\n }\n }\n};\n"]}
@@ -156,7 +156,7 @@ const DefaultTemplate = ({ error, disabled, success, size, value, max, min, capt
156
156
  element.setAttribute('min', min);
157
157
  element.setAttribute('label', label);
158
158
  element.setAttribute('caption', caption);
159
- element.setAttribute('ariaLabel', ariaLabel);
159
+ element.setAttribute('aria-label', ariaLabel);
160
160
  element.setAttribute('required', required);
161
161
  element.setAttribute('autocomplete', autocomplete);
162
162
  element.setAttribute('type', type);
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker.stories.js","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Date Picker',\n tags: ['autodocs'],\n\n args: {\n disabled: false,\n size: 's',\n success: false,\n error: false,\n name: 'date-picker',\n value: '',\n max: '',\n min: '',\n label: \"Label Text\",\n caption: \"Caption text, description, error notification.\",\n ariaLabel: 'Date Picker',\n required: false,\n autocomplete: \"on\",\n type: 'date'\n },\n argTypes: {\n label: {\n description: 'Label of Date Picker.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n caption: {\n description: 'Caption text, description, error notification.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n min: {\n description: 'Minimum date that can be selected. The parsed value is always formatted as yyyy-mm-dd.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n max: {\n description: 'The latest date that can be selected. The parsed value is always formatted as yyyy-mm-dd.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n disabled: {\n description: 'Disables the date picker',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n success: {\n description: 'Indicates success in the date picker.',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n error: {\n description: 'Indicates error in the date picker.',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n size: {\n description: 'Sets the size of the date picker. Options: Height small (36px) and Height large (40px).S',\n control: 'radio',\n options: ['s', 'l'],\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: 's'\n }\n }\n },\n name: {\n description: 'Name of the element, that is used as reference when a form is submitted.',\n control: 'text',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n value: {\n description: 'Displayed date is formatted based on the locale of the user`s browser, but the parsed value is always formatted as yyyy-mm-dd. For \"datetime-local\" type, it is yyyy-mm-ddTHH:MM. Example: \"2018-06-12T19:30\"',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n ariaLabel: {\n control: { type: 'text' },\n description: 'Set the aria label of the date picker. Enhances accessibility.',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n required: {\n description: 'Set the required attribute to true to make the date picker mandatory.',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n autocomplete: {\n description: 'Sets the autocomplete attribute. \"on\" by default.',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n type: {\n description: 'Sets the type of the date-picker. \"Date\" by default.',\n control: 'radio',\n options: ['date', 'datetime-local'],\n defaultValue: {\n summary: 'date'\n },\n table: {\n category: 'ifx-date-picker props'\n }\n },\n ifxDate: {\n action: 'ifxDate',\n description: 'A custom event emitted when a date in the calendar is being selected.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxDate={handleInput}\\nVue:@ifxDate=\"handleInput\"\\nAngular:(ifxDate)=\"handleInput()\"\\nVanillaJs:.addEventListener(\"ifxDate\", (event) => {//handle input});',\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = ({ error, disabled, success, size, value, max, min, caption, label, ariaLabel, required, name, autocomplete, type }) => {\n const element = document.createElement('ifx-date-picker');\n element.setAttribute('name', name);\n element.setAttribute('error', error);\n element.setAttribute('disabled', disabled);\n element.setAttribute('size', size);\n element.setAttribute('success', success);\n element.setAttribute('value', value);\n element.setAttribute('max', max);\n element.setAttribute('min', min);\n element.setAttribute('label', label);\n element.setAttribute('caption', caption);\n element.setAttribute('ariaLabel', ariaLabel);\n element.setAttribute('required', required);\n element.setAttribute('autocomplete', autocomplete);\n element.setAttribute('type', type);\n element.addEventListener('ifxDate', action('ifxDate'));\n return element;\n};\n\nexport const Default = DefaultTemplate.bind({});"]}
1
+ {"version":3,"file":"date-picker.stories.js","sourceRoot":"","sources":["../../../src/components/date-picker/date-picker.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Date Picker',\n tags: ['autodocs'],\n\n args: {\n disabled: false,\n size: 's',\n success: false,\n error: false,\n name: 'date-picker',\n value: '',\n max: '',\n min: '',\n label: \"Label Text\",\n caption: \"Caption text, description, error notification.\",\n ariaLabel: 'Date Picker',\n required: false,\n autocomplete: \"on\",\n type: 'date'\n },\n argTypes: {\n label: {\n description: 'Label of Date Picker.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n caption: {\n description: 'Caption text, description, error notification.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n min: {\n description: 'Minimum date that can be selected. The parsed value is always formatted as yyyy-mm-dd.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n max: {\n description: 'The latest date that can be selected. The parsed value is always formatted as yyyy-mm-dd.',\n table: {\n category: 'ifx-date-picker props',\n }\n },\n disabled: {\n description: 'Disables the date picker',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n success: {\n description: 'Indicates success in the date picker.',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n error: {\n description: 'Indicates error in the date picker.',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n size: {\n description: 'Sets the size of the date picker. Options: Height small (36px) and Height large (40px).S',\n control: 'radio',\n options: ['s', 'l'],\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: 's'\n }\n }\n },\n name: {\n description: 'Name of the element, that is used as reference when a form is submitted.',\n control: 'text',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n value: {\n description: 'Displayed date is formatted based on the locale of the user`s browser, but the parsed value is always formatted as yyyy-mm-dd. For \"datetime-local\" type, it is yyyy-mm-ddTHH:MM. Example: \"2018-06-12T19:30\"',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n ariaLabel: {\n control: { type: 'text' },\n description: 'Set the aria label of the date picker. Enhances accessibility.',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n required: {\n description: 'Set the required attribute to true to make the date picker mandatory.',\n control: 'boolean',\n table: {\n category: 'ifx-date-picker props',\n defaultValue: {\n summary: false\n }\n }\n },\n autocomplete: {\n description: 'Sets the autocomplete attribute. \"on\" by default.',\n table: {\n category: 'ifx-date-picker props'\n }\n },\n type: {\n description: 'Sets the type of the date-picker. \"Date\" by default.',\n control: 'radio',\n options: ['date', 'datetime-local'],\n defaultValue: {\n summary: 'date'\n },\n table: {\n category: 'ifx-date-picker props'\n }\n },\n ifxDate: {\n action: 'ifxDate',\n description: 'A custom event emitted when a date in the calendar is being selected.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxDate={handleInput}\\nVue:@ifxDate=\"handleInput\"\\nAngular:(ifxDate)=\"handleInput()\"\\nVanillaJs:.addEventListener(\"ifxDate\", (event) => {//handle input});',\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = ({ error, disabled, success, size, value, max, min, caption, label, ariaLabel, required, name, autocomplete, type }) => {\n const element = document.createElement('ifx-date-picker');\n element.setAttribute('name', name);\n element.setAttribute('error', error);\n element.setAttribute('disabled', disabled);\n element.setAttribute('size', size);\n element.setAttribute('success', success);\n element.setAttribute('value', value);\n element.setAttribute('max', max);\n element.setAttribute('min', min);\n element.setAttribute('label', label);\n element.setAttribute('caption', caption);\n element.setAttribute('aria-label', ariaLabel);\n element.setAttribute('required', required);\n element.setAttribute('autocomplete', autocomplete);\n element.setAttribute('type', type);\n element.addEventListener('ifxDate', action('ifxDate'));\n return element;\n};\n\nexport const Default = DefaultTemplate.bind({});"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@infineon/infineon-design-system-stencil",
3
- "version": "33.1.2--canary.1833.f2ea4904e9407d4dca14274dbb44c8699b4937fe.0",
3
+ "version": "33.1.2--canary.1833.31f06740905830099d5486c62f6b53ff6346529e.0",
4
4
  "private": false,
5
5
  "description": "Infineon design system Stencil web components",
6
6
  "homepage": "https://infineon.github.io/infineon-design-system-stencil",