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:
131
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.css
vendored
Normal file
131
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.css
vendored
Normal file
@ -0,0 +1,131 @@
|
||||
:root {
|
||||
--ifx-font-family: "Source Sans 3";
|
||||
font-family: var(--ifx-font-family, sans-serif);
|
||||
}
|
||||
|
||||
:host {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.radioButton__container {
|
||||
box-sizing: border-box;
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 0px;
|
||||
gap: 8px;
|
||||
cursor: pointer;
|
||||
font-family: var(--ifx-font-family);
|
||||
}
|
||||
.radioButton__container.m .radioButton__wrapper {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: relative;
|
||||
display: block;
|
||||
border-radius: 50%;
|
||||
background-color: #FFFFFF;
|
||||
border: 1px solid #575352;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper:focus {
|
||||
outline: none;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper:focus::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: calc(100% + 4px);
|
||||
height: calc(100% + 4px);
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border: 2px solid #0A8276;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper .radioButton__wrapper-mark {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-color: #0A8276;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-color: transparent;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper:hover {
|
||||
background-color: #EEEDED;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.disabled {
|
||||
background-color: #BFBBBB;
|
||||
border-color: #BFBBBB;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.disabled.error:hover, .radioButton__container .radioButton__wrapper.disabled.error:focus-visible {
|
||||
border-color: #CD002F;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked {
|
||||
border-color: #0A8276;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background-color: #0A8276;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked.disabled::after {
|
||||
background-color: #BFBBBB;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked:hover {
|
||||
border-color: #08665C;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked:hover .radioButton__wrapper-mark {
|
||||
background-color: #08665C;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked.disabled {
|
||||
background-color: #FFFFFF;
|
||||
border-color: #BFBBBB;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked.disabled.disabled::after {
|
||||
background-color: #BFBBBB;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.checked.disabled .radioButton__wrapper-mark {
|
||||
background-color: #BFBBBB;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.error:not(.disabled) {
|
||||
border-color: #CD002F;
|
||||
}
|
||||
.radioButton__container .radioButton__wrapper.error:not(.disabled):hover, .radioButton__container .radioButton__wrapper.error:not(.disabled):focus-visible {
|
||||
border-color: #CD002F;
|
||||
}
|
||||
.radioButton__container .label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.25rem;
|
||||
color: #1D1D1D;
|
||||
flex: none;
|
||||
order: 1;
|
||||
flex-grow: 0;
|
||||
}
|
||||
.radioButton__container .label.label-m {
|
||||
height: 24px;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
.radioButton__container .label.disabled {
|
||||
color: #BFBBBB;
|
||||
}
|
||||
.radioButton__container .label:hover {
|
||||
cursor: pointer;
|
||||
}
|
23
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.e2e.js
vendored
Normal file
23
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.e2e.js
vendored
Normal file
@ -0,0 +1,23 @@
|
||||
import { newE2EPage } from "@stencil/core/testing";
|
||||
describe('ifx-radio-button', () => {
|
||||
it('renders', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-radio-button></ifx-radio-button>');
|
||||
const element = await page.find('ifx-radio-button');
|
||||
expect(element).toHaveClass('hydrated');
|
||||
});
|
||||
it('handleRadioButtonClick should emit ifxChange event if not disabled, not in errorv or not already checked', async () => {
|
||||
const page = await newE2EPage();
|
||||
await page.setContent('<ifx-radio-button>Test</ifx-radio-button>');
|
||||
const component = await page.find('ifx-radio-button');
|
||||
component.setProperty('disabled', false);
|
||||
component.setProperty('error', false);
|
||||
component.setProperty('value', false);
|
||||
await page.waitForChanges();
|
||||
const changeSpy = await component.spyOnEvent('ifxChange');
|
||||
const element = await page.find('ifx-radio-button >>> .label');
|
||||
await element.click();
|
||||
expect(changeSpy).toHaveReceivedEventDetail(true);
|
||||
});
|
||||
});
|
||||
//# sourceMappingURL=radio-button.e2e.js.map
|
1
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.e2e.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.e2e.js.map
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"radio-button.e2e.js","sourceRoot":"","sources":["../../../src/components/radio-button/radio-button.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;EAEhC,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,uCAAuC,CAAC,CAAC;IAE/D,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IACpD,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;EAMH,EAAE,CAAC,0GAA0G,EAAE,KAAK,IAAI,EAAE;IACxH,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,2CAA2C,CAAC,CAAC;IACnE,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAEtD,SAAS,CAAC,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IACzC,SAAS,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACtC,SAAS,CAAC,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IAEtC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,SAAS,GAAG,MAAM,SAAS,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC;IAE1D,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,6BAA6B,CAAC,CAAC;IAC/D,MAAM,OAAO,CAAC,KAAK,EAAE,CAAC;IAEtB,MAAM,CAAC,SAAS,CAAC,CAAC,yBAAyB,CAAC,IAAI,CAAC,CAAC;EACpD,CAAC,CAAC,CAAC;AAEL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('ifx-radio-button', () => {\n\n it('renders', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-radio-button></ifx-radio-button>');\n\n const element = await page.find('ifx-radio-button');\n expect(element).toHaveClass('hydrated');\n });\n\n\n\n\n\n it('handleRadioButtonClick should emit ifxChange event if not disabled, not in errorv or not already checked', async () => {\n const page = await newE2EPage();\n await page.setContent('<ifx-radio-button>Test</ifx-radio-button>');\n const component = await page.find('ifx-radio-button');\n\n component.setProperty('disabled', false);\n component.setProperty('error', false);\n component.setProperty('value', false);\n\n await page.waitForChanges();\n\n const changeSpy = await component.spyOnEvent('ifxChange');\n\n const element = await page.find('ifx-radio-button >>> .label');\n await element.click();\n\n expect(changeSpy).toHaveReceivedEventDetail(true);\n });\n\n});\n"]}
|
158
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.js
vendored
Normal file
158
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.js
vendored
Normal file
@ -0,0 +1,158 @@
|
||||
import { h } from "@stencil/core";
|
||||
export class RadioButton {
|
||||
constructor() {
|
||||
this.disabled = false;
|
||||
this.value = false;
|
||||
this.error = false;
|
||||
this.size = "s";
|
||||
this.internalValue = undefined;
|
||||
this.hasSlot = true;
|
||||
}
|
||||
valueChanged(newValue, oldValue) {
|
||||
if (newValue !== oldValue) {
|
||||
this.internalValue = newValue;
|
||||
}
|
||||
}
|
||||
componentWillLoad() {
|
||||
this.internalValue = this.value;
|
||||
const slot = this.el.innerHTML;
|
||||
if (slot) {
|
||||
this.hasSlot = true;
|
||||
}
|
||||
else
|
||||
this.hasSlot = false;
|
||||
}
|
||||
handleRadioButtonClick() {
|
||||
if (!this.disabled && !this.error && !this.internalValue) {
|
||||
this.internalValue = !this.internalValue;
|
||||
this.el.shadowRoot.querySelector('.radioButton__wrapper').focus();
|
||||
this.ifxChange.emit(this.internalValue);
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (h("div", { "aria-label": 'a radio button', "aria-value": this.value, "aria-disabled": this.disabled, class: `radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`, onClick: this.handleRadioButtonClick.bind(this) }, h("div", { class: `radioButton__wrapper
|
||||
${this.internalValue ? 'checked' : ''}
|
||||
${this.disabled ? 'disabled' : ''}
|
||||
${this.error ? 'error' : ''}`, tabIndex: this.disabled ? -1 : 0 }, this.internalValue && h("div", { class: "radioButton__wrapper-mark" })), this.hasSlot && (h("div", { class: `label ${this.size === "m" ? "label-m" : ""} ${this.disabled ? 'disabled' : ''}` }, h("slot", null)))));
|
||||
}
|
||||
static get is() { return "ifx-radio-button"; }
|
||||
static get encapsulation() { return "shadow"; }
|
||||
static get originalStyleUrls() {
|
||||
return {
|
||||
"$": ["radio-button.scss"]
|
||||
};
|
||||
}
|
||||
static get styleUrls() {
|
||||
return {
|
||||
"$": ["radio-button.css"]
|
||||
};
|
||||
}
|
||||
static get properties() {
|
||||
return {
|
||||
"disabled": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "disabled",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"value": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "value",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"error": {
|
||||
"type": "boolean",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "boolean",
|
||||
"resolved": "boolean",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "error",
|
||||
"reflect": false,
|
||||
"defaultValue": "false"
|
||||
},
|
||||
"size": {
|
||||
"type": "string",
|
||||
"mutable": false,
|
||||
"complexType": {
|
||||
"original": "\"s\" | \"m\"",
|
||||
"resolved": "\"m\" | \"s\"",
|
||||
"references": {}
|
||||
},
|
||||
"required": false,
|
||||
"optional": false,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"attribute": "size",
|
||||
"reflect": false,
|
||||
"defaultValue": "\"s\""
|
||||
}
|
||||
};
|
||||
}
|
||||
static get states() {
|
||||
return {
|
||||
"internalValue": {},
|
||||
"hasSlot": {}
|
||||
};
|
||||
}
|
||||
static get events() {
|
||||
return [{
|
||||
"method": "ifxChange",
|
||||
"name": "ifxChange",
|
||||
"bubbles": true,
|
||||
"cancelable": true,
|
||||
"composed": true,
|
||||
"docs": {
|
||||
"tags": [],
|
||||
"text": ""
|
||||
},
|
||||
"complexType": {
|
||||
"original": "any",
|
||||
"resolved": "any",
|
||||
"references": {}
|
||||
}
|
||||
}];
|
||||
}
|
||||
static get elementRef() { return "el"; }
|
||||
static get watchers() {
|
||||
return [{
|
||||
"propName": "value",
|
||||
"methodName": "valueChanged"
|
||||
}];
|
||||
}
|
||||
}
|
||||
//# sourceMappingURL=radio-button.js.map
|
1
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.js.map
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"radio-button.js","sourceRoot":"","sources":["../../../src/components/radio-button/radio-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAgB,KAAK,EAAE,MAAM,eAAe,CAAC;AAO/F,MAAM,OAAO,WAAW;;oBAEM,KAAK;iBACR,KAAK;iBACL,KAAK;gBACJ,GAAG;;mBAED,IAAI;;EAKhC,YAAY,CAAC,QAAiB,EAAE,QAAiB;IAC/C,IAAI,QAAQ,KAAK,QAAQ,EAAE;MACzB,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC;KAC/B;EACH,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC;IAChC,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC;IAC/B,IAAI,IAAI,EAAE;MACR,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;KACrB;;MAAM,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;EAC9B,CAAC;EAED,sBAAsB;IACpB,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;MACxD,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC;MACzC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC,KAAK,EAAE,CAAC;MAClE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KACzC;EACH,CAAC;EAED,MAAM;IACJ,OAAO,CACL,yBACa,gBAAgB,gBAAa,IAAI,CAAC,KAAK,mBAAiB,IAAI,CAAC,QAAQ,EAChF,KAAK,EAAE,0BAA0B,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,EAC/E,OAAO,EAAE,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC;MAE/C,WACE,KAAK,EAAE;YACL,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;YACnC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;YAC/B,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAE/B,IAAI,CAAC,aAAa,IAAI,WAAK,KAAK,EAAC,2BAA2B,GAAO,CAChE;MACL,IAAI,CAAC,OAAO,IAAI,CACf,WAAK,KAAK,EAAE,SAAS,IAAI,CAAC,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;QAC1F,eAAQ,CACJ,CACP,CACG,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Element, State, Event, EventEmitter, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-radio-button',\n styleUrl: 'radio-button.scss',\n shadow: true\n})\nexport class RadioButton {\n @Element() el;\n @Prop() disabled: boolean = false;\n @Prop() value: boolean = false;\n @Prop() error: boolean = false;\n @Prop() size: \"s\" | \"m\" = \"s\";\n @State() internalValue: boolean;\n @State() hasSlot: boolean = true;\n\n @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter;\n\n @Watch('value')\n valueChanged(newValue: boolean, oldValue: boolean) {\n if (newValue !== oldValue) {\n this.internalValue = newValue;\n }\n }\n\n componentWillLoad() {\n this.internalValue = this.value;\n const slot = this.el.innerHTML;\n if (slot) {\n this.hasSlot = true;\n } else this.hasSlot = false;\n }\n\n handleRadioButtonClick() {\n if (!this.disabled && !this.error && !this.internalValue) {\n this.internalValue = !this.internalValue;\n this.el.shadowRoot.querySelector('.radioButton__wrapper').focus();\n this.ifxChange.emit(this.internalValue);\n }\n }\n\n render() {\n return (\n <div\n aria-label='a radio button' aria-value={this.value} aria-disabled={this.disabled}\n class={`radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`}\n onClick={this.handleRadioButtonClick.bind(this)}\n >\n <div\n class={`radioButton__wrapper \n ${this.internalValue ? 'checked' : ''} \n ${this.disabled ? 'disabled' : ''} \n ${this.error ? 'error' : ''}`}\n tabIndex={this.disabled ? -1 : 0}\n >\n {this.internalValue && <div class=\"radioButton__wrapper-mark\"></div>}\n </div>\n {this.hasSlot && (\n <div class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : ''}`}>\n <slot />\n </div>\n )}\n </div>\n );\n }\n}\n"]}
|
46
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.stories.js
vendored
Normal file
46
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.stories.js
vendored
Normal file
@ -0,0 +1,46 @@
|
||||
import { action } from "@storybook/addon-actions";
|
||||
export default {
|
||||
title: "Components/Radio Button",
|
||||
// tags: ['autodocs'],
|
||||
args: {
|
||||
error: false,
|
||||
disabled: false,
|
||||
value: false,
|
||||
size: 's',
|
||||
label: 'Text'
|
||||
},
|
||||
argTypes: {
|
||||
ifxChange: {
|
||||
description: 'Custom event emitted when radio button checked and unchecked',
|
||||
table: {
|
||||
type: {
|
||||
summary: 'Framework integration',
|
||||
detail: 'React: onIfxChange={handleChange}\nVue:@ifxChange="handleChange"\nAngular:(ifxChange)="handleChange()"\nVanillaJs:.addEventListener("ifxChange", (event) => {//handle change});',
|
||||
},
|
||||
},
|
||||
action: 'ifxChange'
|
||||
},
|
||||
size: {
|
||||
description: "Size options: s (20px) and m (24px) - default: s",
|
||||
options: ['s', 'm'],
|
||||
control: { type: 'radio' },
|
||||
},
|
||||
},
|
||||
};
|
||||
const DefaultTemplate = (args) => {
|
||||
// Create the radio button element
|
||||
const element = document.createElement('ifx-radio-button');
|
||||
// Set the attributes
|
||||
element.setAttribute('error', args.error);
|
||||
element.setAttribute('disabled', args.disabled);
|
||||
element.setAttribute('value', args.value);
|
||||
element.setAttribute('size', args.size);
|
||||
// Add the label as a text node
|
||||
element.appendChild(document.createTextNode(args.label));
|
||||
// Add the event listener
|
||||
element.addEventListener('ifxChange', action('ifxChange'));
|
||||
// Return the element
|
||||
return element;
|
||||
};
|
||||
export const Default = DefaultTemplate.bind({});
|
||||
//# sourceMappingURL=radio-button.stories.js.map
|
1
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.stories.js.map
vendored
Normal file
1
Server/wwwroot/package/dist/collection/components/radio-button/radio-button.stories.js.map
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"radio-button.stories.js","sourceRoot":"","sources":["../../../src/components/radio-button/radio-button.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,eAAe;EACb,KAAK,EAAE,yBAAyB;EAChC,sBAAsB;EAEtB,IAAI,EAAE;IACJ,KAAK,EAAE,KAAK;IACZ,QAAQ,EAAE,KAAK;IACf,KAAK,EAAE,KAAK;IACZ,IAAI,EAAE,GAAG;IACT,KAAK,EAAE,MAAM;GACd;EACD,QAAQ,EAAE;IACR,SAAS,EAAE;MACT,WAAW,EAAE,8DAA8D;MAC3E,KAAK,EAAE;QACL,IAAI,EAAE;UACJ,OAAO,EAAE,uBAAuB;UAChC,MAAM,EAAE,iLAAiL;SAC1L;OACF;MAED,MAAM,EAAE,WAAW;KACpB;IACD,IAAI,EAAE;MACJ,WAAW,EAAE,kDAAkD;MAC/D,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC;MACnB,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;KAC3B;GACF;CACF,CAAC;AAEF,MAAM,eAAe,GAAG,CAAC,IAAI,EAAE,EAAE;EAC/B,kCAAkC;EAClC,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;EAE3D,qBAAqB;EACrB,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;EAC1C,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;EAChD,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;EAC1C,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;EAExC,+BAA+B;EAC/B,OAAO,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;EAEzD,yBAAyB;EACzB,OAAO,CAAC,gBAAgB,CAAC,WAAW,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC;EAE3D,qBAAqB;EACrB,OAAO,OAAO,CAAC;AACjB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: \"Components/Radio Button\",\n // tags: ['autodocs'],\n\n args: {\n error: false,\n disabled: false,\n value: false,\n size: 's',\n label: 'Text'\n },\n argTypes: {\n ifxChange: {\n description: 'Custom event emitted when radio button checked and unchecked',\n table: {\n type: {\n summary: 'Framework integration',\n detail: 'React: onIfxChange={handleChange}\\nVue:@ifxChange=\"handleChange\"\\nAngular:(ifxChange)=\"handleChange()\"\\nVanillaJs:.addEventListener(\"ifxChange\", (event) => {//handle change});',\n },\n },\n\n action: 'ifxChange'\n },\n size: {\n description: \"Size options: s (20px) and m (24px) - default: s\",\n options: ['s', 'm'],\n control: { type: 'radio' },\n },\n },\n};\n\nconst DefaultTemplate = (args) => {\n // Create the radio button element\n const element = document.createElement('ifx-radio-button');\n\n // Set the attributes\n element.setAttribute('error', args.error);\n element.setAttribute('disabled', args.disabled);\n element.setAttribute('value', args.value);\n element.setAttribute('size', args.size);\n\n // Add the label as a text node\n element.appendChild(document.createTextNode(args.label));\n\n // Add the event listener\n element.addEventListener('ifxChange', action('ifxChange'));\n\n // Return the element\n return element;\n}\n\nexport const Default = DefaultTemplate.bind({});\n"]}
|
Reference in New Issue
Block a user