Remove with Text
Remove GetEngineeringSpcReview Better error message EnforceCodeStyleInBuild NginxFileSystem Remove Reactors and Working Directory AppSettings Delete self contained Thunder Tests Back to .net8.0 api/v4/InfinityQS ApiExplorerSettings Wafer Counter
This commit is contained in:
173
Server/wwwroot/package/dist/collection/components/text-field/text-field.css
vendored
Normal file
173
Server/wwwroot/package/dist/collection/components/text-field/text-field.css
vendored
Normal file
@ -0,0 +1,173 @@
|
||||
:root {
|
||||
--ifx-font-family: "Source Sans 3";
|
||||
font-family: var(--ifx-font-family, sans-serif);
|
||||
}
|
||||
|
||||
:host {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.textInput__container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 0px;
|
||||
width: 100%;
|
||||
flex: none;
|
||||
order: 0;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
font-family: var(--ifx-font-family);
|
||||
}
|
||||
.textInput__container.disabled .textInput__top-wrapper label {
|
||||
color: #575352;
|
||||
}
|
||||
.textInput__container.disabled .textInput__bottom-wrapper input {
|
||||
border: 1px solid #575352;
|
||||
background-color: #EEEDED;
|
||||
}
|
||||
.textInput__container.disabled .textInput__bottom-wrapper input::placeholder {
|
||||
font-size: 0.875rem;
|
||||
color: #575352;
|
||||
}
|
||||
.textInput__container .textInput__top-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
padding: 0px;
|
||||
gap: 4px;
|
||||
flex: none;
|
||||
order: 0;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
}
|
||||
.textInput__container .textInput__top-wrapper label {
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #1D1D1D;
|
||||
flex: none;
|
||||
order: 0;
|
||||
flex-grow: 0;
|
||||
}
|
||||
.textInput__container .textInput__top-wrapper label .optional-required {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.textInput__container .textInput__top-wrapper label .optional {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.textInput__container .textInput__top-wrapper label .required {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.textInput__container .input-container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper {
|
||||
flex-grow: 1;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
padding: 0px;
|
||||
gap: 4px;
|
||||
flex: none;
|
||||
order: 1;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 8px 16px;
|
||||
gap: 8px;
|
||||
height: 40px;
|
||||
background-color: #FFFFFF;
|
||||
color: #1D1D1D;
|
||||
font-family: "Source Sans 3";
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
border: 1px solid #8D8786;
|
||||
border-radius: 1px;
|
||||
flex: none;
|
||||
order: 0;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input.input-s {
|
||||
height: 36px;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input.input-s::placeholder {
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input.icon {
|
||||
padding-left: 40px;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input.error {
|
||||
border: 1px solid #CD002F;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input.error:focus {
|
||||
outline: none;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input.success {
|
||||
border: 1px solid #4CA460;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input.success:focus {
|
||||
outline: none;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input:focus:not(.error, .success) {
|
||||
outline: none;
|
||||
border: 1px solid #0A8276;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input:hover:not(:disabled, :focus, .error, .success) {
|
||||
border: 1px solid #575352;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper input::placeholder {
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
color: #8D8786;
|
||||
flex: none;
|
||||
order: 1;
|
||||
flex-grow: 1;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper ifx-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 16px;
|
||||
/* Adjust this value to control the icon's left offset */
|
||||
transition: 0.3s;
|
||||
color: #8D8786;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption {
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1rem;
|
||||
letter-spacing: 0.2px;
|
||||
color: #1D1D1D;
|
||||
flex: none;
|
||||
order: 1;
|
||||
align-self: stretch;
|
||||
flex-grow: 0;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.error {
|
||||
color: #CD002F;
|
||||
}
|
||||
.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.disabled {
|
||||
color: #575352;
|
||||
}
|
||||
49
Server/wwwroot/package/dist/collection/components/text-field/text-field.e2e.js
vendored
Normal file
49
Server/wwwroot/package/dist/collection/components/text-field/text-field.e2e.js
vendored
Normal file
@ -0,0 +1,49 @@
|
||||
import { newE2EPage } from "@stencil/core/testing";
|
||||
describe('ifx-text-field', () => {
|
||||
it('renders', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-text-field></ifx-text-field>');
|
||||
const element = await page.find('ifx-text-field');
|
||||
expect(element).toHaveClass('hydrated');
|
||||
});
|
||||
it('renders placeholder', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-text-field placeholder="Testing placeholder"></ifx-text-field>');
|
||||
const input = await page.find('ifx-text-field >>> input');
|
||||
expect(await input.getProperty('placeholder')).toEqual('Testing placeholder');
|
||||
});
|
||||
it('renders disabled', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-text-field disabled></ifx-text-field>');
|
||||
const input = await page.find('ifx-text-field >>> input');
|
||||
expect(await input.getProperty('disabled')).toBeTruthy();
|
||||
});
|
||||
it('handles value change', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-text-field></ifx-text-field>');
|
||||
const input = await page.find('ifx-text-field >>> input');
|
||||
const newValue = 'New value';
|
||||
await input.type(newValue);
|
||||
expect(await input.getProperty('value')).toBe(newValue);
|
||||
});
|
||||
it('renders with error', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-text-field error caption="Invalid input"></ifx-text-field>');
|
||||
const errorDiv = await page.find('ifx-text-field >>> .textInput__bottom-wrapper-caption.error');
|
||||
expect(errorDiv.innerText).toBe('Invalid input');
|
||||
});
|
||||
it('renders with success', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-text-field success></ifx-text-field>');
|
||||
const input = await page.find('ifx-text-field >>> input');
|
||||
expect(input).toHaveClass('success');
|
||||
});
|
||||
it('renders with icon', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-text-field icon="chevron-down-16"></ifx-text-field>'); // Set the icon attribute with a valid icon name
|
||||
await page.waitForChanges(); // Wait for any potential asynchronous updates
|
||||
const icon = await page.find('ifx-text-field >>> ifx-icon');
|
||||
expect(icon).not.toBeNull();
|
||||
});
|
||||
});
|
||||
//# sourceMappingURL=text-field.e2e.js.map
|
||||
1
Server/wwwroot/package/dist/collection/components/text-field/text-field.e2e.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/text-field/text-field.e2e.js.map
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"text-field.e2e.js","sourceRoot":"","sources":["../../../src/components/text-field/text-field.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('ifx-text-field', () => {\n it('renders', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-text-field></ifx-text-field>');\n const element = await page.find('ifx-text-field');\n expect(element).toHaveClass('hydrated');\n });\n\n it('renders placeholder', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-text-field placeholder=\"Testing placeholder\"></ifx-text-field>');\n const input = await page.find('ifx-text-field >>> input');\n expect(await input.getProperty('placeholder')).toEqual('Testing placeholder');\n });\n\n it('renders disabled', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-text-field disabled></ifx-text-field>');\n const input = await page.find('ifx-text-field >>> input');\n expect(await input.getProperty('disabled')).toBeTruthy();\n });\n\n\n it('handles value change', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-text-field></ifx-text-field>');\n const input = await page.find('ifx-text-field >>> input');\n const newValue = 'New value';\n await input.type(newValue);\n expect(await input.getProperty('value')).toBe(newValue);\n });\n\n it('renders with error', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-text-field error caption=\"Invalid input\"></ifx-text-field>');\n const errorDiv = await page.find('ifx-text-field >>> .textInput__bottom-wrapper-caption.error');\n expect(errorDiv.innerText).toBe('Invalid input');\n });\n\n it('renders with success', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-text-field success></ifx-text-field>');\n const input = await page.find('ifx-text-field >>> input');\n expect(input).toHaveClass('success');\n });\n\n it('renders with icon', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-text-field icon=\"chevron-down-16\"></ifx-text-field>'); // Set the icon attribute with a valid icon name\n await page.waitForChanges(); // Wait for any potential asynchronous updates\n const icon = await page.find('ifx-text-field >>> ifx-icon');\n expect(icon).not.toBeNull();\n });\n\n});\n"]}
|
||||
306
Server/wwwroot/package/dist/collection/components/text-field/text-field.js
vendored
Normal file
306
Server/wwwroot/package/dist/collection/components/text-field/text-field.js
vendored
Normal file
@ -0,0 +1,306 @@
|
||||
import { h } from "@stencil/core";
|
||||
export class TextField {
|
||||
constructor() {
|
||||
this.placeholder = "Placeholder";
|
||||
this.value = '';
|
||||
this.error = false;
|
||||
this.label = "";
|
||||
this.icon = "";
|
||||
this.caption = "";
|
||||
this.size = 'm';
|
||||
this.required = false;
|
||||
this.optional = false;
|
||||
this.success = false;
|
||||
this.disabled = false;
|
||||
}
|
||||
// @Prop({ reflect: true })
|
||||
// resetOnSubmit: boolean = false;
|
||||
valueWatcher(newValue) {
|
||||
if (newValue !== this.inputElement.value) {
|
||||
this.inputElement.value = newValue;
|
||||
}
|
||||
}
|
||||
async reset() {
|
||||
this.value = '';
|
||||
this.inputElement.value = '';
|
||||
}
|
||||
handleInput() {
|
||||
const query = this.inputElement.value;
|
||||
this.value = query; // update the value property when input changes
|
||||
this.ifxInput.emit(this.value);
|
||||
}
|
||||
render() {
|
||||
return (h("div", { "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { class: "textInput__top-wrapper" }, h("label", { htmlFor: "text-field" }, h("slot", null), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: "required" }, "*")) : null)), h("div", { class: "textInput__bottom-wrapper" }, h("div", { class: "input-container" }, this.icon && (h("ifx-icon", { icon: this.icon })), h("input", { ref: (el) => (this.inputElement = el), disabled: this.disabled, type: "text", id: 'text-field', value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, class: `${this.icon ? 'icon' : ""}
|
||||
${this.error ? 'error' : ""}
|
||||
${this.size === "s" ? "input-s" : ""}
|
||||
${this.success ? "success" : ""}` })), this.caption && !this.error &&
|
||||
h("div", { class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
|
||||
h("div", { class: "textInput__bottom-wrapper-caption error" }, this.caption))));
|
||||
}
|
||||
static get is() { return "ifx-text-field"; }
|
||||
static get encapsulation() { return "shadow"; }
|
||||
static get originalStyleUrls() {
|
||||
return {
|
||||
"$": ["text-field.scss"]
|
||||
};
|
||||
}
|
||||
static get styleUrls() {
|
||||
return {
|
||||
"$": ["text-field.css"]
|
||||
};
|
||||
}
|
||||
static get properties() {
|
||||
return {
|
||||
"placeholder": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "placeholder",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"Placeholder\""
|
||||
},
|
||||
"value": {
|
||||
"type": "string",
|
||||
"mutable": true,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "value",
|
||||
"reflect": false,
|
||||
"defaultValue": "''"
|
||||
},
|
||||
"error": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "error",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"label": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "label",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"\""
|
||||
},
|
||||
"icon": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "icon",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"\""
|
||||
},
|
||||
"caption": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "caption",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"\""
|
||||
},
|
||||
"size": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "string",
|
||||
"resolved": "string",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "size",
|
||||
"reflect": false,
|
||||
"defaultValue": "'m'"
|
||||
},
|
||||
"required": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "required",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"optional": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "optional",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"success": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "success",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"disabled": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "disabled",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
}
|
||||
};
|
||||
}
|
||||
static get events() {
|
||||
return [{
|
||||
"method": "ifxInput",
|
||||
"name": "ifxInput",
|
||||
"bubbles": true,
|
||||
"cancelable": true,
|
||||
"composed": true,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"complexType": {
|
||||
"original": "String",
|
||||
"resolved": "String",
|
||||
"references": {
|
||||
"String": {
|
||||
"location": "global",
|
||||
"id": "global::String"
|
||||
}
|
||||
}
|
||||
}
|
||||
}];
|
||||
}
|
||||
static get methods() {
|
||||
return {
|
||||
"reset": {
|
||||
"complexType": {
|
||||
"signature": "() => Promise<void>",
|
||||
"parameters": [],
|
||||
"references": {
|
||||
"Promise": {
|
||||
"location": "global",
|
||||
"id": "global::Promise"
|
||||
}
|
||||
},
|
||||
"return": "Promise<void>"
|
||||
},
|
||||
"docs": {
|
||||
"text": "",
|
||||
"tags": []
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
static get elementRef() { return "el"; }
|
||||
static get watchers() {
|
||||
return [{
|
||||
"propName": "value",
|
||||
"methodName": "valueWatcher"
|
||||
}];
|
||||
}
|
||||
}
|
||||
//# sourceMappingURL=text-field.js.map
|
||||
1
Server/wwwroot/package/dist/collection/components/text-field/text-field.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/text-field/text-field.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
57
Server/wwwroot/package/dist/collection/components/text-field/text-field.stories.js
vendored
Normal file
57
Server/wwwroot/package/dist/collection/components/text-field/text-field.stories.js
vendored
Normal file
@ -0,0 +1,57 @@
|
||||
import { action } from "@storybook/addon-actions";
|
||||
import { icons } from "@infineon/infineon-icons";
|
||||
export default {
|
||||
title: "Components/Text Field",
|
||||
// tags: ['autodocs'],
|
||||
args: {
|
||||
disabled: false,
|
||||
size: "m",
|
||||
success: false,
|
||||
label: "Label",
|
||||
placeholder: 'Placeholder',
|
||||
error: false,
|
||||
caption: "Caption",
|
||||
required: true,
|
||||
optional: false,
|
||||
icon: 'c-info-16'
|
||||
},
|
||||
argTypes: {
|
||||
size: {
|
||||
description: "Size options: s (36px) and m (40px) - default: m",
|
||||
options: ['s', 'm'],
|
||||
control: { type: 'radio' },
|
||||
},
|
||||
icon: {
|
||||
options: Object.values(icons).map(i => i['name']),
|
||||
control: { type: 'select' }
|
||||
},
|
||||
ifxInput: {
|
||||
action: 'ifxInput',
|
||||
description: 'Custom event',
|
||||
table: {
|
||||
type: {
|
||||
summary: 'Framework integration',
|
||||
detail: 'React: onIfxInput={handleInput}\nVue:@ifxInput="handleInput"\nAngular:(ifxInput)="handleInput()"\nVanillaJs:.addEventListener("ifxInput", (event) => {//handle input});',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
};
|
||||
const DefaultTemplate = ({ error, disabled, success, size, placeholder, label, caption, icon, required, optional }) => {
|
||||
const element = document.createElement('ifx-text-field');
|
||||
element.setAttribute('error', error);
|
||||
element.setAttribute('disabled', disabled);
|
||||
element.setAttribute('size', size);
|
||||
element.setAttribute('icon', icon);
|
||||
element.setAttribute('success', success);
|
||||
element.setAttribute('placeholder', placeholder);
|
||||
element.setAttribute('caption', caption);
|
||||
element.setAttribute('required', required);
|
||||
element.setAttribute('optional', optional);
|
||||
element.addEventListener('ifxInput', action('ifxInput'));
|
||||
const slotContent = document.createTextNode(label);
|
||||
element.appendChild(slotContent);
|
||||
return element;
|
||||
};
|
||||
export const Default = DefaultTemplate.bind({});
|
||||
//# sourceMappingURL=text-field.stories.js.map
|
||||
1
Server/wwwroot/package/dist/collection/components/text-field/text-field.stories.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/text-field/text-field.stories.js.map
vendored
Normal file
@ -0,0 +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;EACb,KAAK,EAAE,uBAAuB;EAC9B,sBAAsB;EAEtB,IAAI,EAAE;IACJ,QAAQ,EAAE,KAAK;IACf,IAAI,EAAE,GAAG;IACT,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,OAAO;IACd,WAAW,EAAE,aAAa;IAC1B,KAAK,EAAE,KAAK;IACZ,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,KAAK;IACf,IAAI,EAAE,WAAW;GAClB;EAED,QAAQ,EAAE;IACR,IAAI,EAAE;MACJ,WAAW,EAAE,kDAAkD;MAC/D,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC;MACnB,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;KAC3B;IACD,IAAI,EAAE;MACJ,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;MACjD,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC5B;IACD,QAAQ,EAAE;MACR,MAAM,EAAE,UAAU;MAClB,WAAW,EAAE,cAAc;MAC3B,KAAK,EAAE;QACL,IAAI,EAAE;UACJ,OAAO,EAAE,uBAAuB;UAChC,MAAM,EAAE,yKAAyK;SAClL;OACF;KACF;GACF;CACF,CAAC;AAGF,MAAM,eAAe,GAAG,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE;EACpH,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;EACzD,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;EACrC,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;EAC3C,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;EACnC,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;EACnC,OAAO,CAAC,YAAY,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;EACzC,OAAO,CAAC,YAAY,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;EACjD,OAAO,CAAC,YAAY,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;EACzC,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;EAC3C,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;EAC3C,OAAO,CAAC,gBAAgB,CAAC,UAAU,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC;EAEzD,MAAM,WAAW,GAAG,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;EACnD,OAAO,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;EAEjC,OAAO,OAAO,CAAC;AACjB,CAAC,CAAA;AAKD,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","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 disabled: false,\n size: \"m\",\n success: false,\n label: \"Label\",\n placeholder: 'Placeholder',\n error: false,\n caption: \"Caption\",\n required: true,\n optional: false,\n icon: 'c-info-16'\n },\n\n argTypes: {\n size: {\n description: \"Size options: s (36px) and m (40px) - default: m\",\n options: ['s', 'm'],\n control: { type: 'radio' },\n },\n icon: {\n options: Object.values(icons).map(i => i['name']),\n control: { type: 'select' }\n },\n ifxInput: {\n action: 'ifxInput',\n description: 'Custom event',\n table: {\n type: {\n summary: 'Framework integration',\n detail: 'React: onIfxInput={handleInput}\\nVue:@ifxInput=\"handleInput\"\\nAngular:(ifxInput)=\"handleInput()\"\\nVanillaJs:.addEventListener(\"ifxInput\", (event) => {//handle input});',\n },\n },\n },\n }\n};\n\n\nconst DefaultTemplate = ({ error, disabled, success, size, placeholder, label, caption, icon, required, optional }) => {\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.addEventListener('ifxInput', action('ifxInput'));\n\n const slotContent = document.createTextNode(label);\n element.appendChild(slotContent);\n\n return element;\n}\n\n\n\n\nexport const Default = DefaultTemplate.bind({});\n\n"]}
|
||||
Reference in New Issue
Block a user