@operato/input 2.0.0-alpha.4 → 2.0.0-alpha.47

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.
Files changed (34) hide show
  1. package/CHANGELOG.md +118 -0
  2. package/dist/src/ox-input-barcode.d.ts +48 -5
  3. package/dist/src/ox-input-barcode.js +96 -69
  4. package/dist/src/ox-input-barcode.js.map +1 -1
  5. package/dist/src/ox-input-data.d.ts +3 -4
  6. package/dist/src/ox-input-data.js +86 -34
  7. package/dist/src/ox-input-data.js.map +1 -1
  8. package/dist/src/ox-input-i18n-label.d.ts +33 -0
  9. package/dist/src/ox-input-i18n-label.js +129 -0
  10. package/dist/src/ox-input-i18n-label.js.map +1 -0
  11. package/dist/src/ox-input-mass-fraction.d.ts +1 -0
  12. package/dist/src/ox-input-mass-fraction.js +48 -31
  13. package/dist/src/ox-input-mass-fraction.js.map +1 -1
  14. package/dist/stories/ox-input-barcode.stories.js +4 -0
  15. package/dist/stories/ox-input-barcode.stories.js.map +1 -1
  16. package/dist/stories/ox-input-data.stories.d.ts +33 -0
  17. package/dist/stories/ox-input-data.stories.js +40 -0
  18. package/dist/stories/ox-input-data.stories.js.map +1 -0
  19. package/dist/stories/ox-input-i18n-label.stories.d.ts +29 -0
  20. package/dist/stories/ox-input-i18n-label.stories.js +58 -0
  21. package/dist/stories/ox-input-i18n-label.stories.js.map +1 -0
  22. package/dist/stories/ox-input-mass-fraction.stories.d.ts +4 -0
  23. package/dist/stories/ox-input-mass-fraction.stories.js +9 -2
  24. package/dist/stories/ox-input-mass-fraction.stories.js.map +1 -1
  25. package/dist/tsconfig.tsbuildinfo +1 -1
  26. package/package.json +21 -17
  27. package/src/ox-input-barcode.ts +127 -63
  28. package/src/ox-input-data.ts +95 -36
  29. package/src/ox-input-i18n-label.ts +139 -0
  30. package/src/ox-input-mass-fraction.ts +46 -32
  31. package/stories/ox-input-barcode.stories.ts +4 -0
  32. package/stories/ox-input-data.stories.ts +55 -0
  33. package/stories/ox-input-i18n-label.stories.ts +73 -0
  34. package/stories/ox-input-mass-fraction.stories.ts +10 -1
@@ -1 +1 @@
1
- {"version":3,"file":"ox-input-barcode.stories.js","sourceRoot":"","sources":["../../stories/ox-input-barcode.stories.ts"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAE1C,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,kBAAkB;IAC7B,QAAQ,EAAE;QACR,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QACzB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAC1B,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACjC,YAAY,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACpC,WAAW,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACnC,iBAAiB,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACzC,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACjC;CACF,CAAA;AAkBD,MAAM,QAAQ,GAAoB,CAAC,EACjC,IAAI,GAAG,SAAS,EAChB,SAAS,GAAG,IAAI,EAChB,YAAY,GAAG,IAAI,EACnB,WAAW,GAAG,KAAK,EACnB,iBAAiB,GAAG,KAAK,EACzB,QAAQ,EACC,EAAE,EAAE,CAAC,IAAI,CAAA;;;;;;;;;;;WAWT,IAAI;qBACM,YAAY;iBAChB,SAAS;oBACN,WAAW;2BACJ,iBAAiB;cAC9B,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC;gBACnE,QAAQ;;;CAGvB,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,IAAI;IACf,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,KAAK;IAClB,iBAAiB,EAAE,KAAK;CACzB,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC5C,WAAW,CAAC,IAAI,GAAG;IACjB,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,IAAI;IACf,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,IAAI;IACjB,iBAAiB,EAAE,KAAK;CACzB,CAAA;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAClD,iBAAiB,CAAC,IAAI,GAAG;IACvB,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,IAAI;IACf,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,IAAI;IACjB,iBAAiB,EAAE,IAAI;CACxB,CAAA","sourcesContent":["import '../src/ox-input-barcode.js'\n\nimport { html, TemplateResult } from 'lit'\n\nexport default {\n title: 'ox-input-barcode',\n component: 'ox-input-barcode',\n argTypes: {\n name: { control: 'text' },\n value: { control: 'text' },\n scannable: { control: 'boolean' },\n withoutEnter: { control: 'boolean' },\n englishOnly: { control: 'boolean' },\n selectAfterChange: { control: 'boolean' },\n disabled: { control: 'boolean' }\n }\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {\n name?: string\n value?: string\n scannable?: boolean\n withoutEnter?: boolean\n englishOnly?: boolean\n selectAfterChange?: boolean\n disabled?: boolean\n}\n\nconst Template: Story<ArgTypes> = ({\n name = 'barcode',\n scannable = true,\n withoutEnter = true,\n englishOnly = false,\n selectAfterChange = false,\n disabled\n}: ArgTypes) => html`\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"https://fonts.googleapis.com/css?family=Material+Icons&display=block\" rel=\"stylesheet\" />\n <style>\n ox-input-barcode {\n font-size: 80px;\n --input-font: initial;\n }\n </style>\n\n <ox-input-barcode\n name=${name}\n ?without-enter=${withoutEnter}\n ?scannable=${scannable}\n ?english-only=${englishOnly}\n ?select-after-change=${selectAfterChange}\n @change=${(e: CustomEvent) => console.log((e.target as HTMLInputElement).value)}\n ?disabled=${disabled}\n >\n </ox-input-barcode>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {\n name: 'barcode',\n scannable: true,\n withoutEnter: true,\n englishOnly: false,\n selectAfterChange: false\n}\n\nexport const EnglishOnly = Template.bind({})\nEnglishOnly.args = {\n name: 'barcode',\n scannable: true,\n withoutEnter: true,\n englishOnly: true,\n selectAfterChange: false\n}\n\nexport const selectAfterChange = Template.bind({})\nselectAfterChange.args = {\n name: 'barcode',\n scannable: true,\n withoutEnter: true,\n englishOnly: true,\n selectAfterChange: true\n}\n"]}
1
+ {"version":3,"file":"ox-input-barcode.stories.js","sourceRoot":"","sources":["../../stories/ox-input-barcode.stories.ts"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAE1C,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,kBAAkB;IAC7B,QAAQ,EAAE;QACR,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QACzB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAC1B,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACjC,YAAY,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACpC,WAAW,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACnC,iBAAiB,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QACzC,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACjC;CACF,CAAA;AAkBD,MAAM,QAAQ,GAAoB,CAAC,EACjC,IAAI,GAAG,SAAS,EAChB,SAAS,GAAG,IAAI,EAChB,YAAY,GAAG,IAAI,EACnB,WAAW,GAAG,KAAK,EACnB,iBAAiB,GAAG,KAAK,EACzB,QAAQ,EACC,EAAE,EAAE,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;WAeT,IAAI;qBACM,YAAY;iBAChB,SAAS;oBACN,WAAW;2BACJ,iBAAiB;cAC9B,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC;gBACnE,QAAQ;;;CAGvB,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,IAAI;IACf,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,KAAK;IAClB,iBAAiB,EAAE,KAAK;CACzB,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC5C,WAAW,CAAC,IAAI,GAAG;IACjB,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,IAAI;IACf,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,IAAI;IACjB,iBAAiB,EAAE,KAAK;CACzB,CAAA;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAClD,iBAAiB,CAAC,IAAI,GAAG;IACvB,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,IAAI;IACf,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,IAAI;IACjB,iBAAiB,EAAE,IAAI;CACxB,CAAA","sourcesContent":["import '../src/ox-input-barcode.js'\n\nimport { html, TemplateResult } from 'lit'\n\nexport default {\n title: 'ox-input-barcode',\n component: 'ox-input-barcode',\n argTypes: {\n name: { control: 'text' },\n value: { control: 'text' },\n scannable: { control: 'boolean' },\n withoutEnter: { control: 'boolean' },\n englishOnly: { control: 'boolean' },\n selectAfterChange: { control: 'boolean' },\n disabled: { control: 'boolean' }\n }\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {\n name?: string\n value?: string\n scannable?: boolean\n withoutEnter?: boolean\n englishOnly?: boolean\n selectAfterChange?: boolean\n disabled?: boolean\n}\n\nconst Template: Story<ArgTypes> = ({\n name = 'barcode',\n scannable = true,\n withoutEnter = true,\n englishOnly = false,\n selectAfterChange = false,\n disabled\n}: ArgTypes) => html`\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"https://fonts.googleapis.com/css?family=Material+Icons&display=block\" rel=\"stylesheet\" />\n <style>\n #root {\n height: 500px;\n }\n\n ox-input-barcode {\n font-size: 80px;\n --input-font: initial;\n }\n </style>\n\n <ox-input-barcode\n name=${name}\n ?without-enter=${withoutEnter}\n ?scannable=${scannable}\n ?english-only=${englishOnly}\n ?select-after-change=${selectAfterChange}\n @change=${(e: CustomEvent) => console.log((e.target as HTMLInputElement).value)}\n ?disabled=${disabled}\n >\n </ox-input-barcode>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {\n name: 'barcode',\n scannable: true,\n withoutEnter: true,\n englishOnly: false,\n selectAfterChange: false\n}\n\nexport const EnglishOnly = Template.bind({})\nEnglishOnly.args = {\n name: 'barcode',\n scannable: true,\n withoutEnter: true,\n englishOnly: true,\n selectAfterChange: false\n}\n\nexport const selectAfterChange = Template.bind({})\nselectAfterChange.args = {\n name: 'barcode',\n scannable: true,\n withoutEnter: true,\n englishOnly: true,\n selectAfterChange: true\n}\n"]}
@@ -0,0 +1,33 @@
1
+ import '../src/ox-input-data.js';
2
+ import { TemplateResult } from 'lit';
3
+ declare const _default: {
4
+ title: string;
5
+ component: string;
6
+ argTypes: {
7
+ value: {
8
+ control: string;
9
+ };
10
+ name: {
11
+ control: string;
12
+ };
13
+ language: {
14
+ control: string;
15
+ options: string[];
16
+ };
17
+ disabled: {
18
+ control: string;
19
+ };
20
+ };
21
+ };
22
+ export default _default;
23
+ interface Story<T> {
24
+ (args: T): TemplateResult;
25
+ args?: Partial<T>;
26
+ argTypes?: Record<string, unknown>;
27
+ }
28
+ interface ArgTypes {
29
+ name?: string;
30
+ value?: string | number | object;
31
+ disabled?: boolean;
32
+ }
33
+ export declare const Regular: Story<ArgTypes>;
@@ -0,0 +1,40 @@
1
+ import '../src/ox-input-data.js';
2
+ import { html } from 'lit';
3
+ export default {
4
+ title: 'ox-input-data',
5
+ component: 'ox-input-data',
6
+ argTypes: {
7
+ value: { control: 'text' },
8
+ name: { control: 'text' },
9
+ language: { control: 'select', options: ['javascript', 'sql', 'json'] },
10
+ disabled: { control: 'boolean' }
11
+ }
12
+ };
13
+ const Template = ({ name = 'code', value = '', disabled }) => html `
14
+ <link href="/themes/app-theme.css" rel="stylesheet" />
15
+ <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
16
+ <style>
17
+ body {
18
+ }
19
+ ox-input-data {
20
+ height: 300px;
21
+ }
22
+ </style>
23
+
24
+ <ox-input-data
25
+ @change=${(e) => {
26
+ const value = e.target.value;
27
+ console.log('value : ', value, typeof value);
28
+ }}
29
+ name=${name}
30
+ .value=${value}
31
+ ?disabled=${disabled}
32
+ >
33
+ </ox-input-data>
34
+ `;
35
+ export const Regular = Template.bind({});
36
+ Regular.args = {
37
+ name: 'data',
38
+ value: ''
39
+ };
40
+ //# sourceMappingURL=ox-input-data.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ox-input-data.stories.js","sourceRoot":"","sources":["../../stories/ox-input-data.stories.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAA;AAEhC,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAE1C,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,eAAe;IAC1B,QAAQ,EAAE;QACR,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAC1B,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QACzB,QAAQ,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,YAAY,EAAE,KAAK,EAAE,MAAM,CAAC,EAAE;QACvE,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACjC;CACF,CAAA;AAcD,MAAM,QAAQ,GAAoB,CAAC,EAAE,IAAI,GAAG,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,QAAQ,EAAY,EAAE,EAAE,CAAC,IAAI,CAAA;;;;;;;;;;;;cAY/E,CAAC,CAAQ,EAAE,EAAE;IACrB,MAAM,KAAK,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAA;IAClD,OAAO,CAAC,GAAG,CAAC,UAAU,EAAE,KAAK,EAAE,OAAO,KAAK,CAAC,CAAA;AAC9C,CAAC;WACM,IAAI;aACF,KAAK;gBACF,QAAQ;;;CAGvB,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,EAAE;CACV,CAAA","sourcesContent":["import '../src/ox-input-data.js'\n\nimport { html, TemplateResult } from 'lit'\n\nexport default {\n title: 'ox-input-data',\n component: 'ox-input-data',\n argTypes: {\n value: { control: 'text' },\n name: { control: 'text' },\n language: { control: 'select', options: ['javascript', 'sql', 'json'] },\n disabled: { control: 'boolean' }\n }\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {\n name?: string\n value?: string | number | object\n disabled?: boolean\n}\n\nconst Template: Story<ArgTypes> = ({ name = 'code', value = '', disabled }: ArgTypes) => html`\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"https://fonts.googleapis.com/css?family=Material+Icons&display=block\" rel=\"stylesheet\" />\n <style>\n body {\n }\n ox-input-data {\n height: 300px;\n }\n </style>\n\n <ox-input-data\n @change=${(e: Event) => {\n const value = (e.target as HTMLInputElement).value\n console.log('value : ', value, typeof value)\n }}\n name=${name}\n .value=${value}\n ?disabled=${disabled}\n >\n </ox-input-data>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {\n name: 'data',\n value: ''\n}\n"]}
@@ -0,0 +1,29 @@
1
+ import '../src/ox-input-i18n-label.js';
2
+ import { TemplateResult } from 'lit';
3
+ declare const _default: {
4
+ title: string;
5
+ component: string;
6
+ argTypes: {
7
+ name: {
8
+ control: string;
9
+ };
10
+ value: {
11
+ control: string;
12
+ };
13
+ disabled: {
14
+ control: string;
15
+ };
16
+ };
17
+ };
18
+ export default _default;
19
+ interface Story<T> {
20
+ (args: T): TemplateResult;
21
+ args?: Partial<T>;
22
+ argTypes?: Record<string, unknown>;
23
+ }
24
+ interface ArgTypes {
25
+ name?: string;
26
+ value?: object;
27
+ disabled?: boolean;
28
+ }
29
+ export declare const Regular: Story<ArgTypes>;
@@ -0,0 +1,58 @@
1
+ import '../src/ox-input-i18n-label.js';
2
+ import { html } from 'lit';
3
+ export default {
4
+ title: 'ox-input-i18n-label',
5
+ component: 'ox-input-i18n-label',
6
+ argTypes: {
7
+ name: { control: 'text' },
8
+ value: { control: 'object' },
9
+ disabled: { control: 'boolean' }
10
+ }
11
+ };
12
+ const Template = ({ name = 'values', value = {}, disabled }) => html `
13
+ <link href="/themes/app-theme.css" rel="stylesheet" />
14
+ <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
15
+ <style>
16
+ body {
17
+ }
18
+ </style>
19
+
20
+ <ox-input-i18n-label
21
+ @change=${(e) => {
22
+ console.log(e.target.value);
23
+ }}
24
+ name=${name}
25
+ .value=${value}
26
+ .languages=${[
27
+ {
28
+ code: 'ko',
29
+ display: '한글'
30
+ },
31
+ {
32
+ code: 'en',
33
+ display: 'English'
34
+ },
35
+ {
36
+ code: 'zh',
37
+ display: 'Chinese'
38
+ },
39
+ {
40
+ code: 'ja',
41
+ display: 'Japanese'
42
+ }
43
+ ]}
44
+ ?disabled=${disabled}
45
+ >
46
+ </ox-input-i18n-label>
47
+ `;
48
+ export const Regular = Template.bind({});
49
+ Regular.args = {
50
+ name: 'i18n labels',
51
+ value: {
52
+ ko: '한글 코드',
53
+ en: 'English code',
54
+ zh: 'Chinese code',
55
+ ja: 'Japan code'
56
+ }
57
+ };
58
+ //# sourceMappingURL=ox-input-i18n-label.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ox-input-i18n-label.stories.js","sourceRoot":"","sources":["../../stories/ox-input-i18n-label.stories.ts"],"names":[],"mappings":"AAAA,OAAO,+BAA+B,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAE1C,eAAe;IACb,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,qBAAqB;IAChC,QAAQ,EAAE;QACR,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QACzB,KAAK,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;QAC5B,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACjC;CACF,CAAA;AAcD,MAAM,QAAQ,GAAoB,CAAC,EAAE,IAAI,GAAG,QAAQ,EAAE,KAAK,GAAG,EAAE,EAAE,QAAQ,EAAY,EAAE,EAAE,CAAC,IAAI,CAAA;;;;;;;;;cASjF,CAAC,CAAQ,EAAE,EAAE;IACrB,OAAO,CAAC,GAAG,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAA;AACnD,CAAC;WACM,IAAI;aACF,KAAK;iBACD;IACX;QACE,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,IAAI;KACd;IACD;QACE,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,SAAS;KACnB;IACD;QACE,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,SAAS;KACnB;IACD;QACE,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,UAAU;KACpB;CACF;gBACW,QAAQ;;;CAGvB,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,aAAa;IACnB,KAAK,EAAE;QACL,EAAE,EAAE,OAAO;QACX,EAAE,EAAE,cAAc;QAClB,EAAE,EAAE,cAAc;QAClB,EAAE,EAAE,YAAY;KACjB;CACF,CAAA","sourcesContent":["import '../src/ox-input-i18n-label.js'\n\nimport { html, TemplateResult } from 'lit'\n\nexport default {\n title: 'ox-input-i18n-label',\n component: 'ox-input-i18n-label',\n argTypes: {\n name: { control: 'text' },\n value: { control: 'object' },\n disabled: { control: 'boolean' }\n }\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {\n name?: string\n value?: object\n disabled?: boolean\n}\n\nconst Template: Story<ArgTypes> = ({ name = 'values', value = {}, disabled }: ArgTypes) => html`\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"https://fonts.googleapis.com/css?family=Material+Icons&display=block\" rel=\"stylesheet\" />\n <style>\n body {\n }\n </style>\n\n <ox-input-i18n-label\n @change=${(e: Event) => {\n console.log((e.target as HTMLInputElement).value)\n }}\n name=${name}\n .value=${value}\n .languages=${[\n {\n code: 'ko',\n display: '한글'\n },\n {\n code: 'en',\n display: 'English'\n },\n {\n code: 'zh',\n display: 'Chinese'\n },\n {\n code: 'ja',\n display: 'Japanese'\n }\n ]}\n ?disabled=${disabled}\n >\n </ox-input-i18n-label>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {\n name: 'i18n labels',\n value: {\n ko: '한글 코드',\n en: 'English code',\n zh: 'Chinese code',\n ja: 'Japan code'\n }\n}\n"]}
@@ -13,6 +13,9 @@ declare const _default: {
13
13
  defaultValue: {
14
14
  control: string;
15
15
  };
16
+ composable: {
17
+ control: string;
18
+ };
16
19
  disabled: {
17
20
  control: string;
18
21
  };
@@ -28,6 +31,7 @@ interface ArgTypes {
28
31
  name?: string;
29
32
  value?: object;
30
33
  defaultValue?: object;
34
+ composable?: boolean;
31
35
  disabled?: boolean;
32
36
  }
33
37
  export declare const Regular: Story<ArgTypes>;
@@ -7,10 +7,11 @@ export default {
7
7
  name: { control: 'text' },
8
8
  value: { control: 'object' },
9
9
  defaultValue: { control: 'object' },
10
+ composable: { control: 'boolean' },
10
11
  disabled: { control: 'boolean' }
11
12
  }
12
13
  };
13
- const Template = ({ name = 'mass-fraction', value = {}, defaultValue = {}, disabled }) => html `
14
+ const Template = ({ name = 'mass-fraction', value = {}, defaultValue = {}, composable = true, disabled }) => html `
14
15
  <link href="/themes/app-theme.css" rel="stylesheet" />
15
16
  <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
16
17
  <style>
@@ -25,6 +26,7 @@ const Template = ({ name = 'mass-fraction', value = {}, defaultValue = {}, disab
25
26
  name=${name}
26
27
  .value=${value}
27
28
  .defaultValue=${defaultValue}
29
+ ?composable=${composable}
28
30
  ?disabled=${disabled}
29
31
  >
30
32
  </ox-input-mass-fraction>
@@ -32,7 +34,12 @@ const Template = ({ name = 'mass-fraction', value = {}, defaultValue = {}, disab
32
34
  export const Regular = Template.bind({});
33
35
  Regular.args = {
34
36
  name: 'mass-fraction',
35
- value: {},
37
+ value: {
38
+ H2O: 0.8,
39
+ N2O: 0.1,
40
+ CO2: 0.1
41
+ },
42
+ composable: true,
36
43
  defaultValue: {
37
44
  H2O: 0.8,
38
45
  N2O: 0.1,
@@ -1 +1 @@
1
- {"version":3,"file":"ox-input-mass-fraction.stories.js","sourceRoot":"","sources":["../../stories/ox-input-mass-fraction.stories.ts"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAA;AAEzC,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAE1C,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,wBAAwB;IACnC,QAAQ,EAAE;QACR,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QACzB,KAAK,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;QAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;QACnC,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACjC;CACF,CAAA;AAeD,MAAM,QAAQ,GAAoB,CAAC,EACjC,IAAI,GAAG,eAAe,EACtB,KAAK,GAAG,EAAE,EACV,YAAY,GAAG,EAAE,EACjB,QAAQ,EACC,EAAE,EAAE,CAAC,IAAI,CAAA;;;;;;;;;cASN,CAAC,CAAQ,EAAE,EAAE;IACrB,OAAO,CAAC,GAAG,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAA;AACnD,CAAC;WACM,IAAI;aACF,KAAK;oBACE,YAAY;gBAChB,QAAQ;;;CAGvB,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,eAAe;IACrB,KAAK,EAAE,EAAE;IACT,YAAY,EAAE;QACZ,GAAG,EAAE,GAAG;QACR,GAAG,EAAE,GAAG;QACR,GAAG,EAAE,GAAG;KACT;CACF,CAAA","sourcesContent":["import '../src/ox-input-mass-fraction.js'\n\nimport { html, TemplateResult } from 'lit'\n\nexport default {\n title: 'ox-input-mass-fraction',\n component: 'ox-input-mass-fraction',\n argTypes: {\n name: { control: 'text' },\n value: { control: 'object' },\n defaultValue: { control: 'object' },\n disabled: { control: 'boolean' }\n }\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {\n name?: string\n value?: object\n defaultValue?: object\n disabled?: boolean\n}\n\nconst Template: Story<ArgTypes> = ({\n name = 'mass-fraction',\n value = {},\n defaultValue = {},\n disabled\n}: ArgTypes) => html`\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"https://fonts.googleapis.com/css?family=Material+Icons&display=block\" rel=\"stylesheet\" />\n <style>\n body {\n }\n </style>\n\n <ox-input-mass-fraction\n @change=${(e: Event) => {\n console.log((e.target as HTMLInputElement).value)\n }}\n name=${name}\n .value=${value}\n .defaultValue=${defaultValue}\n ?disabled=${disabled}\n >\n </ox-input-mass-fraction>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {\n name: 'mass-fraction',\n value: {},\n defaultValue: {\n H2O: 0.8,\n N2O: 0.1,\n CO2: 0.1\n }\n}\n"]}
1
+ {"version":3,"file":"ox-input-mass-fraction.stories.js","sourceRoot":"","sources":["../../stories/ox-input-mass-fraction.stories.ts"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAA;AAEzC,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAE1C,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,wBAAwB;IACnC,QAAQ,EAAE;QACR,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QACzB,KAAK,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;QAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;QACnC,UAAU,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QAClC,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACjC;CACF,CAAA;AAgBD,MAAM,QAAQ,GAAoB,CAAC,EACjC,IAAI,GAAG,eAAe,EACtB,KAAK,GAAG,EAAE,EACV,YAAY,GAAG,EAAE,EACjB,UAAU,GAAG,IAAI,EACjB,QAAQ,EACC,EAAE,EAAE,CAAC,IAAI,CAAA;;;;;;;;;cASN,CAAC,CAAQ,EAAE,EAAE;IACrB,OAAO,CAAC,GAAG,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAA;AACnD,CAAC;WACM,IAAI;aACF,KAAK;oBACE,YAAY;kBACd,UAAU;gBACZ,QAAQ;;;CAGvB,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,eAAe;IACrB,KAAK,EAAE;QACL,GAAG,EAAE,GAAG;QACR,GAAG,EAAE,GAAG;QACR,GAAG,EAAE,GAAG;KACT;IACD,UAAU,EAAE,IAAI;IAChB,YAAY,EAAE;QACZ,GAAG,EAAE,GAAG;QACR,GAAG,EAAE,GAAG;QACR,GAAG,EAAE,GAAG;KACT;CACF,CAAA","sourcesContent":["import '../src/ox-input-mass-fraction.js'\n\nimport { html, TemplateResult } from 'lit'\n\nexport default {\n title: 'ox-input-mass-fraction',\n component: 'ox-input-mass-fraction',\n argTypes: {\n name: { control: 'text' },\n value: { control: 'object' },\n defaultValue: { control: 'object' },\n composable: { control: 'boolean' },\n disabled: { control: 'boolean' }\n }\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {\n name?: string\n value?: object\n defaultValue?: object\n composable?: boolean\n disabled?: boolean\n}\n\nconst Template: Story<ArgTypes> = ({\n name = 'mass-fraction',\n value = {},\n defaultValue = {},\n composable = true,\n disabled\n}: ArgTypes) => html`\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"https://fonts.googleapis.com/css?family=Material+Icons&display=block\" rel=\"stylesheet\" />\n <style>\n body {\n }\n </style>\n\n <ox-input-mass-fraction\n @change=${(e: Event) => {\n console.log((e.target as HTMLInputElement).value)\n }}\n name=${name}\n .value=${value}\n .defaultValue=${defaultValue}\n ?composable=${composable}\n ?disabled=${disabled}\n >\n </ox-input-mass-fraction>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {\n name: 'mass-fraction',\n value: {\n H2O: 0.8,\n N2O: 0.1,\n CO2: 0.1\n },\n composable: true,\n defaultValue: {\n H2O: 0.8,\n N2O: 0.1,\n CO2: 0.1\n }\n}\n"]}