@infineon/infineon-design-system-stencil 30.9.2--canary.1640.4a0823f0ad38c1973e4da6a7d4432f1481628cb9.0 → 30.9.2--canary.1640.0ac197ba0669dd5839444b74b932354060dbf70c.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.
@@ -17,6 +17,7 @@ export default {
|
|
17
17
|
name: 'text-field',
|
18
18
|
showDeleteIcon: false,
|
19
19
|
maxlength: '',
|
20
|
+
value: '',
|
20
21
|
},
|
21
22
|
argTypes: {
|
22
23
|
label: {
|
@@ -127,6 +128,16 @@ export default {
|
|
127
128
|
category: 'ifx-text-field props',
|
128
129
|
}
|
129
130
|
},
|
131
|
+
value: {
|
132
|
+
description: 'The value of the text field. It is used for the form submission.',
|
133
|
+
control: 'text',
|
134
|
+
table: {
|
135
|
+
category: 'ifx-text-field props',
|
136
|
+
type: {
|
137
|
+
summary: 'string'
|
138
|
+
}
|
139
|
+
}
|
140
|
+
},
|
130
141
|
ifxInput: {
|
131
142
|
action: 'ifxInput',
|
132
143
|
description: 'Custom event emitted on input change.',
|
@@ -140,7 +151,7 @@ export default {
|
|
140
151
|
},
|
141
152
|
},
|
142
153
|
};
|
143
|
-
const DefaultTemplate = ({ error, disabled, success, size, placeholder, label, caption, icon, required, optional, name, maxlength, showDeleteIcon }) => {
|
154
|
+
const DefaultTemplate = ({ error, disabled, success, size, placeholder, label, caption, icon, required, optional, name, maxlength, showDeleteIcon, value }) => {
|
144
155
|
const element = document.createElement('ifx-text-field');
|
145
156
|
element.setAttribute('error', error);
|
146
157
|
element.setAttribute('disabled', disabled);
|
@@ -153,6 +164,7 @@ const DefaultTemplate = ({ error, disabled, success, size, placeholder, label, c
|
|
153
164
|
element.setAttribute('optional', optional);
|
154
165
|
element.setAttribute('name', name);
|
155
166
|
element.setAttribute('show-delete-icon', showDeleteIcon);
|
167
|
+
element.setAttribute('value', value);
|
156
168
|
if (maxlength)
|
157
169
|
element.setAttribute('maxlength', maxlength);
|
158
170
|
element.addEventListener('ifxInput', action('ifxInput'));
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"text-field.stories.js","sourceRoot":"","sources":["../../../src/components/text-field/text-field.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAEjD,eAAe;IACb,KAAK,EAAE,uBAAuB;IAC9B,sBAAsB;IAEtB,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,KAAK,EAAE,KAAK;QACZ,QAAQ,EAAE,KAAK;QACf,IAAI,EAAE,GAAG;QACT,IAAI,EAAE,WAAW;QACjB,OAAO,EAAE,KAAK;QACd,WAAW,EAAE,aAAa;QAC1B,OAAO,EAAE,SAAS;QAClB,QAAQ,EAAE,IAAI;QACd,QAAQ,EAAE,KAAK;QACf,IAAI,EAAE,YAAY;QAClB,cAAc,EAAE,KAAK;QACrB,SAAS,EAAE,EAAE;
|
1
|
+
{"version":3,"file":"text-field.stories.js","sourceRoot":"","sources":["../../../src/components/text-field/text-field.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import { action } from '@storybook/addon-actions';\nimport { icons } from '@infineon/infineon-icons';\n\nexport default {\n title: 'Components/Text Field',\n // tags: ['autodocs'],\n\n args: {\n label: 'Label',\n error: false,\n disabled: false,\n size: 'm',\n icon: 'c-info-16',\n success: false,\n placeholder: 'Placeholder',\n caption: 'Caption',\n required: true,\n optional: false,\n name: 'text-field',\n showDeleteIcon: false,\n maxlength: '',\n value: '',\n },\n\n argTypes: {\n label: {\n name: 'Label of Text Field',\n description: 'The text label displayed above the *<ifx-text-field>*.',\n table: {\n category: 'story controls',\n }\n },\n error: {\n description: 'Indicates an error state for the text field.',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: false\n }\n }\n },\n disabled: {\n description: 'Disables the text field.',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: false\n }\n }\n },\n size: {\n description: 'Size options: s (36px) and m (40px) - default: m',\n options: ['s', 'm'],\n control: 'radio',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: 'm'\n }\n }\n },\n icon: {\n description: 'Specifies an icon to display within the text field.',\n options: Object.values(icons).map(i => i['name']),\n control: 'select',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: 'c-info-16'\n }\n }\n },\n success: {\n description: 'Indicates a successful state for the text field.',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: false\n }\n }\n },\n placeholder: {\n description: 'Displays a placeholder text inside the text field when it is empty.',\n table: {\n category: 'ifx-text-field props',\n }\n },\n caption: {\n description: 'Text displayed below the text field to provide additional information.',\n table: {\n category: 'ifx-text-field props',\n }\n },\n required: {\n description: 'Marks the text field as required for form submission. Displays an asterisk next to the label when set to **true**.',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: true\n }\n }\n },\n optional: {\n description: 'Indicates that the field is optional.',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: false\n }\n }\n },\n name: {\n description: 'Name of the element, that is used as reference when a form is submitted.',\n table: {\n category: 'ifx-text-field props',\n }\n },\n showDeleteIcon: {\n description: 'Displays a delete icon inside the text field when set to **true**, allowing user to clear the input content.',\n table: {\n category: 'ifx-text-field props',\n defaultValue: {\n summary: false\n }\n }\n },\n maxlength: {\n description: 'Specifies the maximum number of characters that can be entered into the text field.',\n control: 'number',\n table: {\n category: 'ifx-text-field props',\n }\n },\n value: {\n description: 'The value of the text field. It is used for the form submission.',\n control: 'text',\n table: {\n category: 'ifx-text-field props',\n type: {\n summary: 'string'\n }\n }\n },\n ifxInput: {\n action: 'ifxInput',\n description: 'Custom event emitted on input change.',\n table: {\n category: 'custom events',\n type: {\n summary: 'Framework integration',\n detail:\n 'React: onIfxInput={handleInput}\\nVue:@ifxInput=\"handleInput\"\\nAngular:(ifxInput)=\"handleInput()\"\\nVanillaJs:.addEventListener(\"ifxInput\", (event) => {//handle input});',\n },\n },\n },\n },\n};\n\nconst DefaultTemplate = ({ error, disabled, success, size, placeholder, label, caption, icon, required, optional, name, maxlength, showDeleteIcon, value }) => {\n const element = document.createElement('ifx-text-field');\n element.setAttribute('error', error);\n element.setAttribute('disabled', disabled);\n element.setAttribute('size', size);\n element.setAttribute('icon', icon);\n element.setAttribute('success', success);\n element.setAttribute('placeholder', placeholder);\n element.setAttribute('caption', caption);\n element.setAttribute('required', required);\n element.setAttribute('optional', optional);\n element.setAttribute('name', name);\n element.setAttribute('show-delete-icon', showDeleteIcon);\n element.setAttribute('value', value);\n if (maxlength) element.setAttribute('maxlength', maxlength);\n\n element.addEventListener('ifxInput', action('ifxInput'));\n\n\n const slotContent = document.createTextNode(label);\n element.appendChild(slotContent);\n\n return element;\n};\n\nexport const Default = DefaultTemplate.bind({});\n"]}
|
@@ -14,6 +14,7 @@ declare const _default: {
|
|
14
14
|
name: string;
|
15
15
|
showDeleteIcon: boolean;
|
16
16
|
maxlength: string;
|
17
|
+
value: string;
|
17
18
|
};
|
18
19
|
argTypes: {
|
19
20
|
label: {
|
@@ -124,6 +125,16 @@ declare const _default: {
|
|
124
125
|
category: string;
|
125
126
|
};
|
126
127
|
};
|
128
|
+
value: {
|
129
|
+
description: string;
|
130
|
+
control: string;
|
131
|
+
table: {
|
132
|
+
category: string;
|
133
|
+
type: {
|
134
|
+
summary: string;
|
135
|
+
};
|
136
|
+
};
|
137
|
+
};
|
127
138
|
ifxInput: {
|
128
139
|
action: string;
|
129
140
|
description: string;
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@infineon/infineon-design-system-stencil",
|
3
|
-
"version": "30.9.2--canary.1640.
|
3
|
+
"version": "30.9.2--canary.1640.0ac197ba0669dd5839444b74b932354060dbf70c.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",
|