yuyeon 0.0.23 → 0.0.25

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 (40) hide show
  1. package/dist/style.css +1 -1
  2. package/dist/yuyeon.js +649 -609
  3. package/dist/yuyeon.umd.cjs +3 -3
  4. package/lib/components/alert/YAlert.mjs +32 -0
  5. package/lib/components/alert/YAlert.mjs.map +1 -0
  6. package/lib/components/alert/index.mjs +2 -0
  7. package/lib/components/alert/index.mjs.map +1 -0
  8. package/lib/components/button/YButton.mjs +2 -2
  9. package/lib/components/button/YButton.mjs.map +1 -1
  10. package/lib/components/card/YCard.scss +36 -36
  11. package/lib/components/checkbox/YInputCheckbox.scss +86 -86
  12. package/lib/components/dropdown/YDropdown.mjs +1 -1
  13. package/lib/components/dropdown/YDropdown.mjs.map +1 -1
  14. package/lib/components/field-input/YFieldInput.mjs +2 -1
  15. package/lib/components/field-input/YFieldInput.mjs.map +1 -1
  16. package/lib/components/field-input/YFieldInput.scss +73 -63
  17. package/lib/components/input/YInput.mjs +15 -7
  18. package/lib/components/input/YInput.mjs.map +1 -1
  19. package/lib/components/input/YInput.scss +256 -245
  20. package/lib/components/layer/YLayer.mjs +1 -1
  21. package/lib/components/layer/YLayer.mjs.map +1 -1
  22. package/lib/components/layer/YLayer.scss +33 -33
  23. package/lib/components/menu/YMenu.scss +22 -22
  24. package/lib/components/progress-bar/YProgressBar.mjs.map +1 -1
  25. package/lib/components/select/YSelect.mjs +1 -1
  26. package/lib/components/select/YSelect.mjs.map +1 -1
  27. package/lib/components/switch/YSwitch.scss +198 -198
  28. package/lib/components/table/YTable.scss +114 -114
  29. package/lib/components/tree-view/YTreeView.mjs.map +1 -1
  30. package/lib/composables/layer-group.mjs +6 -1
  31. package/lib/composables/layer-group.mjs.map +1 -1
  32. package/lib/composables/theme/factory.mjs.map +1 -1
  33. package/lib/composables/timing.mjs +3 -3
  34. package/lib/composables/timing.mjs.map +1 -1
  35. package/lib/styles/base.scss +119 -115
  36. package/package.json +1 -1
  37. package/types/components/field-input/YFieldInput.d.ts +27 -0
  38. package/types/components/input/YInput.d.ts +30 -3
  39. package/types/components/select/YSelect.d.ts +27 -0
  40. package/types/composables/timing.d.ts +1 -1
@@ -0,0 +1,32 @@
1
+ import { createVNode as _createVNode } from "vue";
2
+ import { defineComponent, ref } from 'vue';
3
+ import { useRender } from "../../composables/component.mjs";
4
+ import { toKebabCase } from "../../util/string.mjs";
5
+ const NAME = 'YAlert';
6
+ const KEBAB_NAME = toKebabCase(NAME);
7
+ const YAlertPropOptions = {
8
+ outlined: {
9
+ type: Boolean
10
+ }
11
+ };
12
+
13
+ /**
14
+ * # Component
15
+ */
16
+ export const YAlert = defineComponent({
17
+ name: NAME,
18
+ props: {
19
+ ...YAlertPropOptions
20
+ },
21
+ setup(looseProps, _ref) {
22
+ let {
23
+ slots
24
+ } = _ref;
25
+ const props = defineProps(YAlertPropOptions);
26
+ const el$ = ref();
27
+ useRender(() => _createVNode("div", {
28
+ "ref": el$
29
+ }, [slots.default?.()]));
30
+ }
31
+ });
32
+ //# sourceMappingURL=YAlert.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"YAlert.mjs","names":["defineComponent","ref","useRender","toKebabCase","NAME","KEBAB_NAME","YAlertPropOptions","outlined","type","Boolean","YAlert","name","props","setup","looseProps","_ref","slots","defineProps","el$","_createVNode","default"],"sources":["../../../src/components/alert/YAlert.tsx"],"sourcesContent":["import { PropType, defineComponent, ref } from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\nimport { toKebabCase } from '../../util/string';\r\n\r\nconst NAME = 'YAlert';\r\nconst KEBAB_NAME = toKebabCase(NAME);\r\n\r\nconst YAlertPropOptions = {\r\n outlined: {\r\n type: Boolean as PropType<boolean>,\r\n },\r\n};\r\n\r\n/**\r\n * # Component\r\n */\r\nexport const YAlert = defineComponent({\r\n name: NAME,\r\n props: {\r\n ...YAlertPropOptions,\r\n },\r\n setup(looseProps, { slots }) {\r\n const props = defineProps(YAlertPropOptions);\r\n const el$ = ref<HTMLElement>();\r\n\r\n useRender(() => <div ref={el$}>{slots.default?.()}</div>);\r\n },\r\n});\r\n"],"mappings":";AAAA,SAAmBA,eAAe,EAAEC,GAAG,QAAQ,KAAK;AAAC,SAE5CC,SAAS;AAAA,SACTC,WAAW;AAEpB,MAAMC,IAAI,GAAG,QAAQ;AACrB,MAAMC,UAAU,GAAGF,WAAW,CAACC,IAAI,CAAC;AAEpC,MAAME,iBAAiB,GAAG;EACtBC,QAAQ,EAAE;IACNC,IAAI,EAAEC;EACV;AACJ,CAAC;;AAED;AACA;AACA;AACA,OAAO,MAAMC,MAAM,GAAGV,eAAe,CAAC;EAClCW,IAAI,EAAEP,IAAI;EACVQ,KAAK,EAAE;IACH,GAAGN;EACP,CAAC;EACDO,KAAKA,CAACC,UAAU,EAAAC,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACvB,MAAMH,KAAK,GAAGK,WAAW,CAACX,iBAAiB,CAAC;IAC5C,MAAMY,GAAG,GAAGjB,GAAG,CAAc,CAAC;IAE9BC,SAAS,CAAC,MAAAiB,YAAA;MAAA,OAAgBD;IAAG,IAAGF,KAAK,CAACI,OAAO,GAAG,CAAC,EAAO,CAAC;EAC7D;AACJ,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+
2
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/alert/index.ts"],"sourcesContent":[""],"mappings":""}
@@ -3,8 +3,8 @@ import { PlateWave } from "../../directives/plate-wave/index.mjs";
3
3
  import { isColorValue } from "../../util/color/index.mjs";
4
4
  import { getSlot, propsFactory } from "../../util/vue-component.mjs";
5
5
  import { YSpinnerRing } from "../loading/YSpinnerRing.mjs";
6
- /**
7
- * Style
6
+ /**
7
+ * Style
8
8
  */
9
9
  import "./YButton.scss";
10
10
  const NAME = 'y-button';
@@ -1 +1 @@
1
- {"version":3,"file":"YButton.mjs","names":["defineComponent","h","withDirectives","PlateWave","isColorValue","getSlot","propsFactory","YSpinnerRing","NAME","pressYButtonProps","loading","Boolean","disabled","type","variation","String","small","icon","outlined","default","rounded","filled","text","color","noWave","YButton","name","directives","props","computed","variations","split","map","value","trim","classes","includes","styles","textColor","methods","createContent","defaultSlot","children","push","width","height","class","getClasses","onClick","e","preventDefault","render","style","undefined"],"sources":["../../../src/components/button/YButton.ts"],"sourcesContent":["import type { PropType, VNodeArrayChildren } from 'vue';\nimport { defineComponent, h, withDirectives } from 'vue';\n\nimport { PlateWave } from '../../directives/plate-wave';\nimport { isColorValue } from '../../util/color';\nimport { getSlot, propsFactory } from '../../util/vue-component';\nimport { YSpinnerRing } from '../loading/YSpinnerRing';\n\n/**\n * Style\n */\nimport './YButton.scss';\n\nconst NAME = 'y-button';\n\nexport const pressYButtonProps = propsFactory(\n {\n loading: Boolean,\n disabled: {\n type: Boolean,\n },\n //\n variation: {\n type: String as PropType<string>,\n },\n small: Boolean,\n icon: Boolean,\n outlined: {\n type: Boolean,\n default: false,\n },\n rounded: {\n type: Boolean,\n default: false,\n },\n filled: {\n type: Boolean,\n default: false,\n },\n text: {\n type: Boolean,\n },\n //\n color: {\n type: String,\n },\n noWave: {\n type: Boolean,\n default: false,\n },\n },\n 'YButton',\n);\n\nexport const YButton = defineComponent({\n name: 'YButton',\n directives: {\n PlateWave,\n },\n props: {\n ...pressYButtonProps(),\n },\n computed: {\n variations(): any[] {\n const { variation } = this;\n if (variation) {\n return variation.split(',').map((value) => {\n return value.trim();\n });\n }\n return [];\n },\n //\n classes() {\n const { variations, outlined, rounded, filled, text, small, icon } = this;\n return {\n [`${NAME}--outlined`]: variations.includes('outlined') || outlined,\n [`${NAME}--rounded`]: variations.includes('rounded') || rounded,\n [`${NAME}--filled`]: variations.includes('filled') || filled,\n [`${NAME}--text`]: variations.includes('text') || text,\n [`${NAME}--small`]: variations.includes('small') || small,\n [`${NAME}--icon`]: variations.includes('icon') || icon,\n [`${NAME}--color`]: this.color,\n [`${NAME}--loading`]: this.loading,\n [`${NAME}--disabled`]: this.disabled,\n };\n },\n styles(): Record<string, any> {\n let { color } = this;\n let textColor: string | undefined;\n if (color && !isColorValue(color)) {\n color = `var(--y-theme-${color})`;\n textColor = `var(--y-theme-on-${this.color})`;\n }\n return {\n [`--y-button__color`]: color,\n [`--y-button__text-color`]: textColor,\n };\n },\n },\n methods: {\n createContent() {\n const defaultSlot = getSlot(this, 'default');\n const children: VNodeArrayChildren = [];\n if (this.loading) {\n children.push(h(YSpinnerRing, { width: '24', height: '24' }));\n }\n children.push(defaultSlot);\n return h('span', { class: 'y-button__content' }, children);\n },\n getClasses() {\n return this.classes;\n },\n /// Events\n onClick(e: MouseEvent) {\n e.preventDefault();\n if (this.loading) {\n return;\n }\n },\n },\n render() {\n const { onClick, styles, noWave, loading } = this;\n return withDirectives(\n h(\n 'button',\n {\n class: {\n ...this.getClasses(),\n [`${NAME}`]: true,\n },\n style: styles,\n onClick,\n '^disabled': this.disabled ? true : undefined,\n },\n this.createContent(),\n ),\n [[PlateWave, !noWave && !loading]],\n );\n },\n});\n\nexport type YButton = InstanceType<typeof YButton>;\n"],"mappings":"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"}
1
+ {"version":3,"file":"YButton.mjs","names":["defineComponent","h","withDirectives","PlateWave","isColorValue","getSlot","propsFactory","YSpinnerRing","NAME","pressYButtonProps","loading","Boolean","disabled","type","variation","String","small","icon","outlined","default","rounded","filled","text","color","noWave","YButton","name","directives","props","computed","variations","split","map","value","trim","classes","includes","styles","textColor","methods","createContent","defaultSlot","children","push","width","height","class","getClasses","onClick","e","preventDefault","render","style","undefined"],"sources":["../../../src/components/button/YButton.ts"],"sourcesContent":["import type { PropType, VNodeArrayChildren } from 'vue';\r\nimport { defineComponent, h, withDirectives } from 'vue';\r\n\r\nimport { PlateWave } from '../../directives/plate-wave';\r\nimport { isColorValue } from '../../util/color';\r\nimport { getSlot, propsFactory } from '../../util/vue-component';\r\nimport { YSpinnerRing } from '../loading/YSpinnerRing';\r\n\r\n/**\r\n * Style\r\n */\r\nimport './YButton.scss';\r\n\r\nconst NAME = 'y-button';\r\n\r\nexport const pressYButtonProps = propsFactory(\r\n {\r\n loading: Boolean,\r\n disabled: {\r\n type: Boolean,\r\n },\r\n //\r\n variation: {\r\n type: String as PropType<string>,\r\n },\r\n small: Boolean,\r\n icon: Boolean,\r\n outlined: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n rounded: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n filled: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n text: {\r\n type: Boolean,\r\n },\r\n //\r\n color: {\r\n type: String,\r\n },\r\n noWave: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n },\r\n 'YButton',\r\n);\r\n\r\nexport const YButton = defineComponent({\r\n name: 'YButton',\r\n directives: {\r\n PlateWave,\r\n },\r\n props: {\r\n ...pressYButtonProps(),\r\n },\r\n computed: {\r\n variations(): any[] {\r\n const { variation } = this;\r\n if (variation) {\r\n return variation.split(',').map((value) => {\r\n return value.trim();\r\n });\r\n }\r\n return [];\r\n },\r\n //\r\n classes() {\r\n const { variations, outlined, rounded, filled, text, small, icon } = this;\r\n return {\r\n [`${NAME}--outlined`]: variations.includes('outlined') || outlined,\r\n [`${NAME}--rounded`]: variations.includes('rounded') || rounded,\r\n [`${NAME}--filled`]: variations.includes('filled') || filled,\r\n [`${NAME}--text`]: variations.includes('text') || text,\r\n [`${NAME}--small`]: variations.includes('small') || small,\r\n [`${NAME}--icon`]: variations.includes('icon') || icon,\r\n [`${NAME}--color`]: this.color,\r\n [`${NAME}--loading`]: this.loading,\r\n [`${NAME}--disabled`]: this.disabled,\r\n };\r\n },\r\n styles(): Record<string, any> {\r\n let { color } = this;\r\n let textColor: string | undefined;\r\n if (color && !isColorValue(color)) {\r\n color = `var(--y-theme-${color})`;\r\n textColor = `var(--y-theme-on-${this.color})`;\r\n }\r\n return {\r\n [`--y-button__color`]: color,\r\n [`--y-button__text-color`]: textColor,\r\n };\r\n },\r\n },\r\n methods: {\r\n createContent() {\r\n const defaultSlot = getSlot(this, 'default');\r\n const children: VNodeArrayChildren = [];\r\n if (this.loading) {\r\n children.push(h(YSpinnerRing, { width: '24', height: '24' }));\r\n }\r\n children.push(defaultSlot);\r\n return h('span', { class: 'y-button__content' }, children);\r\n },\r\n getClasses() {\r\n return this.classes;\r\n },\r\n /// Events\r\n onClick(e: MouseEvent) {\r\n e.preventDefault();\r\n if (this.loading) {\r\n return;\r\n }\r\n },\r\n },\r\n render() {\r\n const { onClick, styles, noWave, loading } = this;\r\n return withDirectives(\r\n h(\r\n 'button',\r\n {\r\n class: {\r\n ...this.getClasses(),\r\n [`${NAME}`]: true,\r\n },\r\n style: styles,\r\n onClick,\r\n '^disabled': this.disabled ? true : undefined,\r\n },\r\n this.createContent(),\r\n ),\r\n [[PlateWave, !noWave && !loading]],\r\n );\r\n },\r\n});\r\n\r\nexport type YButton = InstanceType<typeof YButton>;\r\n"],"mappings":"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"}
@@ -1,36 +1,36 @@
1
- @use '../../styles/palette';
2
- @use '../../styles/variables';
3
-
4
- $card__border-radius: variables.$border-radius-root !default;
5
- $card__padding: 24px;
6
-
7
- .y-card {
8
- --y-card__border-radius: #{$card__border-radius};
9
- --y-card__default-background: #ffffff;
10
- --y-card__background: var(--y-theme-surface, var(--y-card__default-background));
11
-
12
- background-color: var(--y-card__background);
13
- border-radius: var(--y-card__border-radius, $card__border-radius);
14
-
15
- &__header {
16
- padding: $card__padding $card__padding 0;
17
- display: flex;
18
- }
19
-
20
- &__body {
21
- padding: 0 $card__padding;
22
- display: flex;
23
- flex-direction: column;
24
- }
25
-
26
- &__footer {
27
- padding: 12px 24px;
28
- display: flex;
29
- justify-content: space-between;
30
- }
31
-
32
- &-title {
33
- font-weight: bolder;
34
- font-size: 1.12em;
35
- }
36
- }
1
+ @use '../../styles/palette';
2
+ @use '../../styles/variables';
3
+
4
+ $card__border-radius: variables.$border-radius-root !default;
5
+ $card__padding: 24px;
6
+
7
+ .y-card {
8
+ --y-card__border-radius: #{$card__border-radius};
9
+ --y-card__default-background: #ffffff;
10
+ --y-card__background: var(--y-theme-surface, var(--y-card__default-background));
11
+
12
+ background-color: var(--y-card__background);
13
+ border-radius: var(--y-card__border-radius, $card__border-radius);
14
+
15
+ &__header {
16
+ padding: $card__padding $card__padding 0;
17
+ display: flex;
18
+ }
19
+
20
+ &__body {
21
+ padding: 0 $card__padding;
22
+ display: flex;
23
+ flex-direction: column;
24
+ }
25
+
26
+ &__footer {
27
+ padding: 12px 24px;
28
+ display: flex;
29
+ justify-content: space-between;
30
+ }
31
+
32
+ &-title {
33
+ font-weight: bolder;
34
+ font-size: 1.12em;
35
+ }
36
+ }
@@ -1,86 +1,86 @@
1
- @use '../../styles/palette';
2
-
3
- $checkbox__color: palette.$primary;
4
- $checkbox__border-color: #a4a4a4;
5
-
6
- .y-input--checkbox {
7
- --y-checkbox__color: var(--y-theme-primary-rgb);
8
-
9
- position: relative;
10
- width: 24px;
11
- height: 24px;
12
- display: inline-flex;
13
- flex: 0 0 auto;
14
- box-sizing: border-box;
15
-
16
- input[role='checkbox'] {
17
- position: absolute;
18
- opacity: 0;
19
- width: 100%;
20
- height: 100%;
21
- cursor: pointer;
22
- user-select: none;
23
- }
24
-
25
- .y-icon-checkbox__checkmark-path {
26
- fill: none;
27
- stroke: #ffffff;
28
- stroke-width: 2px;
29
- stroke-dashoffset: 29.7833385;
30
- stroke-dasharray: 29.7833385;
31
- transition: stroke-dashoffset 120ms cubic-bezier(0.4, 0, 0.6, 1);
32
- }
33
-
34
- .y-icon-checkbox__border-path {
35
- fill: rgba(var(--y-checkbox__color), 0);
36
- stroke: rgba($checkbox__border-color, 0.8);
37
- stroke-width: 2;
38
- transition: fill 200ms 180ms ease-in;
39
- }
40
-
41
- input:checked ~ .y-icon-checkbox,
42
- &.y-input--active .y-icon-checkbox {
43
- .y-icon-checkbox__checkmark-path {
44
- stroke-dashoffset: 0;
45
- transition: stroke-dashoffset 120ms 140ms cubic-bezier(0.4, 0, 0.6, 1);
46
- }
47
-
48
- .y-icon-checkbox__border-path {
49
- fill: rgb(var(--y-checkbox__color));
50
- stroke: rgba(var(--y-checkbox__color), 0.8);
51
- transition: fill 200ms ease-in;
52
- }
53
- }
54
-
55
- input:focus ~ .y-icon-checkbox {
56
- .y-icon-checkbox__border-path {
57
- outline: rgba(var(--y-checkbox__color), 0.5) solid 4px;
58
- outline-offset: -6px;
59
- }
60
- }
61
-
62
- &:hover {
63
- .y-icon-checkbox__border-path {
64
- stroke: rgba(var(--y-checkbox__color), 0.5);
65
- }
66
- }
67
-
68
- &.y-input--active:hover {
69
- .y-icon-checkbox__border-path {
70
- fill: lighten($checkbox__color, 10);
71
- }
72
- }
73
-
74
- &.y-input--indeterminate .y-icon-checkbox {
75
- .y-icon-checkbox__checkmark-path {
76
- stroke-dashoffset: 0;
77
- d: path('M5.73,11.91 11.1,11.91 17.79,11.91');
78
- transition: stroke-dashoffset 400ms ease;
79
- }
80
-
81
- .y-icon-checkbox__border-path {
82
- fill: rgba($checkbox__border-color, 0.8);
83
- stroke: rgba($checkbox__border-color, 0.8);
84
- }
85
- }
86
- }
1
+ @use '../../styles/palette';
2
+
3
+ $checkbox__color: palette.$primary;
4
+ $checkbox__border-color: #a4a4a4;
5
+
6
+ .y-input--checkbox {
7
+ --y-checkbox__color: var(--y-theme-primary-rgb);
8
+
9
+ position: relative;
10
+ width: 24px;
11
+ height: 24px;
12
+ display: inline-flex;
13
+ flex: 0 0 auto;
14
+ box-sizing: border-box;
15
+
16
+ input[role='checkbox'] {
17
+ position: absolute;
18
+ opacity: 0;
19
+ width: 100%;
20
+ height: 100%;
21
+ cursor: pointer;
22
+ user-select: none;
23
+ }
24
+
25
+ .y-icon-checkbox__checkmark-path {
26
+ fill: none;
27
+ stroke: #ffffff;
28
+ stroke-width: 2px;
29
+ stroke-dashoffset: 29.7833385;
30
+ stroke-dasharray: 29.7833385;
31
+ transition: stroke-dashoffset 120ms cubic-bezier(0.4, 0, 0.6, 1);
32
+ }
33
+
34
+ .y-icon-checkbox__border-path {
35
+ fill: rgba(var(--y-checkbox__color), 0);
36
+ stroke: rgba($checkbox__border-color, 0.8);
37
+ stroke-width: 2;
38
+ transition: fill 200ms 180ms ease-in;
39
+ }
40
+
41
+ input:checked ~ .y-icon-checkbox,
42
+ &.y-input--active .y-icon-checkbox {
43
+ .y-icon-checkbox__checkmark-path {
44
+ stroke-dashoffset: 0;
45
+ transition: stroke-dashoffset 120ms 140ms cubic-bezier(0.4, 0, 0.6, 1);
46
+ }
47
+
48
+ .y-icon-checkbox__border-path {
49
+ fill: rgb(var(--y-checkbox__color));
50
+ stroke: rgba(var(--y-checkbox__color), 0.8);
51
+ transition: fill 200ms ease-in;
52
+ }
53
+ }
54
+
55
+ input:focus ~ .y-icon-checkbox {
56
+ .y-icon-checkbox__border-path {
57
+ outline: rgba(var(--y-checkbox__color), 0.5) solid 4px;
58
+ outline-offset: -6px;
59
+ }
60
+ }
61
+
62
+ &:hover {
63
+ .y-icon-checkbox__border-path {
64
+ stroke: rgba(var(--y-checkbox__color), 0.5);
65
+ }
66
+ }
67
+
68
+ &.y-input--active:hover {
69
+ .y-icon-checkbox__border-path {
70
+ fill: lighten($checkbox__color, 10);
71
+ }
72
+ }
73
+
74
+ &.y-input--indeterminate .y-icon-checkbox {
75
+ .y-icon-checkbox__checkmark-path {
76
+ stroke-dashoffset: 0;
77
+ d: path('M5.73,11.91 11.1,11.91 17.79,11.91');
78
+ transition: stroke-dashoffset 400ms ease;
79
+ }
80
+
81
+ .y-icon-checkbox__border-path {
82
+ fill: rgba($checkbox__border-color, 0.8);
83
+ stroke: rgba($checkbox__border-color, 0.8);
84
+ }
85
+ }
86
+ }
@@ -78,7 +78,7 @@ export const YDropdown = defineComponent({
78
78
  });
79
79
  })]
80
80
  }) : _createVNode("div", {
81
- "class": "pa-4"
81
+ "class": "y-dropdown__no-options"
82
82
  }, [_createTextVNode("\uD56D\uBAA9\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.")])]
83
83
  })
84
84
  })]);
@@ -1 +1 @@
1
- {"version":3,"file":"YDropdown.mjs","names":["defineComponent","pressItemsPropsOptions","useModelDuplex","useRender","pressCoordinateProps","getObjectValueByPath","omit","chooseProps","propsFactory","YButton","YCard","YIconDropdown","YList","YListItem","YMenu","pressYDropdownPropsOptions","modelValue","Boolean","variation","String","color","position","YDropdown","name","inheritAttrs","components","props","emits","setup","_ref","slots","attrs","emit","opened","onClickItem","item","value","menuProps","_createVNode","_Fragment","_mergeProps","$event","base","_len","arguments","length","args","Array","_key","default","menu","isArray","items","map","text","itemText","e","_createTextVNode"],"sources":["../../../src/components/dropdown/YDropdown.tsx"],"sourcesContent":["import { PropType, defineComponent, mergeProps } from 'vue';\n\nimport { pressItemsPropsOptions } from '../../abstract/items';\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { pressCoordinateProps } from '../../composables/coordinate';\nimport { getObjectValueByPath, omit } from '../../util/common';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { YButton } from '../button';\nimport { YCard } from '../card';\nimport { YIconDropdown } from '../icons/YIconDropdown';\nimport { YList, YListItem } from '../list';\nimport { YMenu } from '../menu';\n\nimport './YDropdown.scss';\n\nexport const pressYDropdownPropsOptions = propsFactory(\n {\n modelValue: Boolean as PropType<boolean>,\n variation: String as PropType<string>,\n color: String as PropType<string>,\n ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\n 'coordinateStrategy',\n ]),\n ...pressItemsPropsOptions(),\n },\n 'YDropdown',\n);\n\nexport const YDropdown = defineComponent({\n name: 'YDropdown',\n inheritAttrs: false,\n components: {\n YMenu,\n },\n props: {\n ...pressYDropdownPropsOptions(),\n },\n emits: ['update:modelValue', 'click'],\n setup(props, { slots, attrs, emit }) {\n const opened = useModelDuplex(props);\n\n function onClickItem(item: any) {\n opened.value = false;\n emit('click', item);\n }\n\n useRender(() => {\n const menuProps = chooseProps(props, YMenu.props);\n return (\n <>\n <YMenu\n {...menuProps}\n v-model={opened.value}\n content-classes={['y-dropdown__content']}\n >\n {{\n base: (...args: any[]) =>\n slots.base ? (\n slots.base?.(...args)\n ) : (\n <YButton\n variation={props.variation}\n color={props.color}\n class={[\n 'y-dropdown',\n { 'y-dropdown--opened': opened.value },\n ]}\n {...attrs}\n >\n {\n <span class=\"y-dropdown__default\">\n {slots.default?.()}\n </span>\n }\n {slots['expand-icon'] ? (\n slots['expand-icon']()\n ) : (\n <i class=\"y-dropdown__icon\">\n <YIconDropdown></YIconDropdown>\n </i>\n )}\n </YButton>\n ),\n default: () =>\n slots.menu ? (\n slots.menu()\n ) : (\n <YCard>\n {Array.isArray(props.items) && props.items.length > 0 ? (\n <YList>\n {props.items.map((item) => {\n const text = getObjectValueByPath(\n item,\n props.itemText,\n );\n return (\n <YListItem onClick={(e) => onClickItem(item)}>\n {text}\n </YListItem>\n );\n })}\n </YList>\n ) : (\n <div class=\"pa-4\">항목이 없습니다.</div>\n )}\n </YCard>\n ),\n }}\n </YMenu>\n </>\n );\n });\n },\n});\n"],"mappings":";AAAA,SAAmBA,eAAe,QAAoB,KAAK;AAAC,SAEnDC,sBAAsB;AAAA,SACtBC,cAAc;AAAA,SACdC,SAAS;AAAA,SACTC,oBAAoB;AAAA,SACpBC,oBAAoB,EAAEC,IAAI;AAAA,SAC1BC,WAAW,EAAEC,YAAY;AAAA,SACzBC,OAAO;AAAA,SACPC,KAAK;AAAA,SACLC,aAAa;AAAA,SACbC,KAAK,EAAEC,SAAS;AAAA,SAChBC,KAAK;AAEd;AAEA,OAAO,MAAMC,0BAA0B,GAAGP,YAAY,CACpD;EACEQ,UAAU,EAAEC,OAA4B;EACxCC,SAAS,EAAEC,MAA0B;EACrCC,KAAK,EAAED,MAA0B;EACjC,GAAGb,IAAI,CAACF,oBAAoB,CAAC;IAAEiB,QAAQ,EAAE;EAAqB,CAAC,CAAC,EAAE,CAChE,oBAAoB,CACrB,CAAC;EACF,GAAGpB,sBAAsB,CAAC;AAC5B,CAAC,EACD,WACF,CAAC;AAED,OAAO,MAAMqB,SAAS,GAAGtB,eAAe,CAAC;EACvCuB,IAAI,EAAE,WAAW;EACjBC,YAAY,EAAE,KAAK;EACnBC,UAAU,EAAE;IACVX;EACF,CAAC;EACDY,KAAK,EAAE;IACL,GAAGX,0BAA0B,CAAC;EAChC,CAAC;EACDY,KAAK,EAAE,CAAC,mBAAmB,EAAE,OAAO,CAAC;EACrCC,KAAKA,CAACF,KAAK,EAAAG,IAAA,EAA0B;IAAA,IAAxB;MAAEC,KAAK;MAAEC,KAAK;MAAEC;IAAK,CAAC,GAAAH,IAAA;IACjC,MAAMI,MAAM,GAAG/B,cAAc,CAACwB,KAAK,CAAC;IAEpC,SAASQ,WAAWA,CAACC,IAAS,EAAE;MAC9BF,MAAM,CAACG,KAAK,GAAG,KAAK;MACpBJ,IAAI,CAAC,OAAO,EAAEG,IAAI,CAAC;IACrB;IAEAhC,SAAS,CAAC,MAAM;MACd,MAAMkC,SAAS,GAAG9B,WAAW,CAACmB,KAAK,EAAEZ,KAAK,CAACY,KAAK,CAAC;MACjD,OAAAY,YAAA,CAAAC,SAAA,SAAAD,YAAA,CAAAxB,KAAA,EAAA0B,WAAA,CAGUH,SAAS;QAAA,cACJJ,MAAM,CAACG,KAAK;QAAA,uBAAAK,MAAA,IAAZR,MAAM,CAACG,KAAK,GAAAK,MAAA;QAAA,mBACJ,CAAC,qBAAqB;MAAC;QAGtCC,IAAI,EAAE,SAAAA,CAAA;UAAA,SAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAIC,IAAI,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;YAAJF,IAAI,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;UAAA;UAAA,OACZlB,KAAK,CAACY,IAAI,GACRZ,KAAK,CAACY,IAAI,GAAG,GAAGI,IAAI,CAAC,GAAAR,YAAA,CAAA7B,OAAA,EAAA+B,WAAA;YAAA,aAGRd,KAAK,CAACR,SAAS;YAAA,SACnBQ,KAAK,CAACN,KAAK;YAAA,SACX,CACL,YAAY,EACZ;cAAE,oBAAoB,EAAEa,MAAM,CAACG;YAAM,CAAC;UACvC,GACGL,KAAK;YAAAkB,OAAA,EAAAA,CAAA,MAAAX,YAAA;cAAA,SAGK;YAAqB,IAC9BR,KAAK,CAACmB,OAAO,GAAG,CAAC,IAGrBnB,KAAK,CAAC,aAAa,CAAC,GACnBA,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,GAAAQ,YAAA;cAAA,SAEb;YAAkB,IAAAA,YAAA,CAAA3B,aAAA,eAG5B;UAAA,EAEJ;QAAA;QACHsC,OAAO,EAAEA,CAAA,KACPnB,KAAK,CAACoB,IAAI,GACRpB,KAAK,CAACoB,IAAI,CAAC,CAAC,GAAAZ,YAAA,CAAA5B,KAAA;UAAAuC,OAAA,EAAAA,CAAA,MAGTF,KAAK,CAACI,OAAO,CAACzB,KAAK,CAAC0B,KAAK,CAAC,IAAI1B,KAAK,CAAC0B,KAAK,CAACP,MAAM,GAAG,CAAC,GAAAP,YAAA,CAAA1B,KAAA;YAAAqC,OAAA,EAAAA,CAAA,MAEhDvB,KAAK,CAAC0B,KAAK,CAACC,GAAG,CAAElB,IAAI,IAAK;cACzB,MAAMmB,IAAI,GAAGjD,oBAAoB,CAC/B8B,IAAI,EACJT,KAAK,CAAC6B,QACR,CAAC;cACD,OAAAjB,YAAA,CAAAzB,SAAA;gBAAA,WACuB2C,CAAC,IAAKtB,WAAW,CAACC,IAAI;cAAC;gBAAAc,OAAA,EAAAA,CAAA,MACzCK,IAAI;cAAA;YAGX,CAAC,CAAC;UAAA,KAAAhB,YAAA;YAAA,SAGO;UAAM,IAAAmB,gBAAA,kDAClB;QAAA;MAEJ;IAKb,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
1
+ {"version":3,"file":"YDropdown.mjs","names":["defineComponent","pressItemsPropsOptions","useModelDuplex","useRender","pressCoordinateProps","getObjectValueByPath","omit","chooseProps","propsFactory","YButton","YCard","YIconDropdown","YList","YListItem","YMenu","pressYDropdownPropsOptions","modelValue","Boolean","variation","String","color","position","YDropdown","name","inheritAttrs","components","props","emits","setup","_ref","slots","attrs","emit","opened","onClickItem","item","value","menuProps","_createVNode","_Fragment","_mergeProps","$event","base","_len","arguments","length","args","Array","_key","default","menu","isArray","items","map","text","itemText","e","_createTextVNode"],"sources":["../../../src/components/dropdown/YDropdown.tsx"],"sourcesContent":["import { PropType, defineComponent, mergeProps } from 'vue';\n\nimport { pressItemsPropsOptions } from '../../abstract/items';\nimport { useModelDuplex } from '../../composables/communication';\nimport { useRender } from '../../composables/component';\nimport { pressCoordinateProps } from '../../composables/coordinate';\nimport { getObjectValueByPath, omit } from '../../util/common';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { YButton } from '../button';\nimport { YCard } from '../card';\nimport { YIconDropdown } from '../icons/YIconDropdown';\nimport { YList, YListItem } from '../list';\nimport { YMenu } from '../menu';\n\nimport './YDropdown.scss';\n\nexport const pressYDropdownPropsOptions = propsFactory(\n {\n modelValue: Boolean as PropType<boolean>,\n variation: String as PropType<string>,\n color: String as PropType<string>,\n ...omit(pressCoordinateProps({ position: 'bottom' as 'bottom' }), [\n 'coordinateStrategy',\n ]),\n ...pressItemsPropsOptions(),\n },\n 'YDropdown',\n);\n\nexport const YDropdown = defineComponent({\n name: 'YDropdown',\n inheritAttrs: false,\n components: {\n YMenu,\n },\n props: {\n ...pressYDropdownPropsOptions(),\n },\n emits: ['update:modelValue', 'click'],\n setup(props, { slots, attrs, emit }) {\n const opened = useModelDuplex(props);\n\n function onClickItem(item: any) {\n opened.value = false;\n emit('click', item);\n }\n\n useRender(() => {\n const menuProps = chooseProps(props, YMenu.props);\n return (\n <>\n <YMenu\n {...menuProps}\n v-model={opened.value}\n content-classes={['y-dropdown__content']}\n >\n {{\n base: (...args: any[]) =>\n slots.base ? (\n slots.base?.(...args)\n ) : (\n <YButton\n variation={props.variation}\n color={props.color}\n class={[\n 'y-dropdown',\n { 'y-dropdown--opened': opened.value },\n ]}\n {...attrs}\n >\n {\n <span class=\"y-dropdown__default\">\n {slots.default?.()}\n </span>\n }\n {slots['expand-icon'] ? (\n slots['expand-icon']()\n ) : (\n <i class=\"y-dropdown__icon\">\n <YIconDropdown></YIconDropdown>\n </i>\n )}\n </YButton>\n ),\n default: () =>\n slots.menu ? (\n slots.menu()\n ) : (\n <YCard>\n {Array.isArray(props.items) && props.items.length > 0 ? (\n <YList>\n {props.items.map((item) => {\n const text = getObjectValueByPath(\n item,\n props.itemText,\n );\n return (\n <YListItem onClick={(e) => onClickItem(item)}>\n {text}\n </YListItem>\n );\n })}\n </YList>\n ) : (\n <div class=\"y-dropdown__no-options\">항목이 없습니다.</div>\n )}\n </YCard>\n ),\n }}\n </YMenu>\n </>\n );\n });\n },\n});\n"],"mappings":"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"}
@@ -173,7 +173,7 @@ export const YFieldInput = defineComponent({
173
173
  class: `${NAME}__field`,
174
174
  'data-id': defaultProps.attrId,
175
175
  ref: 'field'
176
- }, [YInput.methods.createLabel.call(yInputRef), slots.default?.(), h('input', {
176
+ }, [props.floating ? yInputRef.value && YInput.methods.createLabel.call(yInputRef.value) : undefined, slots.default?.(), h('input', {
177
177
  '.value': displayValue.value,
178
178
  '.id': defaultProps.attrId,
179
179
  '^type': inputType.value,
@@ -214,6 +214,7 @@ export const YFieldInput = defineComponent({
214
214
  }
215
215
  return trailingChildren;
216
216
  },
217
+ label: slots['label']?.(),
217
218
  'helper-text': slots['helper-text'] ? () => {
218
219
  return slots['helper-text']?.();
219
220
  } : undefined
@@ -1 +1 @@
1
- {"version":3,"file":"YFieldInput.mjs","names":["computed","defineComponent","getCurrentInstance","h","nextTick","ref","toRef","watch","useRender","useFocus","chooseProps","propsFactory","YIconClear","YInput","pressYInputPropsOptions","NAME","pressYFieldInputPropsOptions","enableClear","Boolean","inputAlign","String","displayText","Function","whenInputValid","Number","tabindex","type","default","variation","YFieldInput","name","props","emits","setup","_ref","attrs","expose","emit","slots","yInputRef","inputRef","focused","whenFocus","whenBlur","inValue","displayValue","inputType","classes","invokeValidators","onClick","event","value","focus","onFocus","onBlur","changeDisplay","onInput","target","onChange","onKeydown","onKeyup","onClickClear","clear","onKeydownClear","code","select","vm","undefined","text","call","modelValue","neo","immediate","onUpdateModel","class","$event","leading","leadingChildren","_len","arguments","length","args","Array","_key","slot","push","defaultProps","attrId","methods","createLabel","readonly","loading","formLoading","placeholder","disabled","autocomplete","maxlength","style","textAlign","trailing","trailingChildren"],"sources":["../../../src/components/field-input/YFieldInput.ts"],"sourcesContent":["import type { PropType } from 'vue';\nimport {\n computed,\n defineComponent,\n getCurrentInstance,\n h,\n nextTick,\n ref,\n toRef,\n watch,\n} from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { useFocus } from '../../composables/focus';\nimport { chooseProps, propsFactory } from '../../util/vue-component';\nimport { YIconClear } from '../icons/YIconClear';\nimport { YInput, pressYInputPropsOptions } from '../input';\n\nimport './YFieldInput.scss';\n\nconst NAME = 'y-field-input';\n\nexport const pressYFieldInputPropsOptions = propsFactory(\n {\n enableClear: Boolean as PropType<boolean>,\n inputAlign: String as PropType<string>,\n displayText: [String, Function] as PropType<\n string | ((value: any) => string)\n >,\n whenInputValid: [Boolean, Number] as PropType<boolean | number>,\n tabindex: {\n type: String as PropType<string>,\n default: '0',\n },\n type: {\n type: String as PropType<string>,\n default: 'text',\n },\n ...pressYInputPropsOptions({\n variation: 'filled',\n }),\n },\n 'YFieldInput',\n);\n\nexport const YFieldInput = defineComponent({\n name: 'YFieldInput',\n props: {\n ...pressYFieldInputPropsOptions(),\n },\n emits: [\n 'update:modelValue',\n 'update:focused',\n 'input',\n 'change',\n 'click',\n 'mousedown',\n 'mouseup',\n 'keydown',\n 'keyup',\n 'focus',\n 'blur',\n 'mousedown:display',\n ],\n setup(props, { attrs, expose, emit, slots }) {\n const yInputRef = ref<YInput>();\n const inputRef = ref<HTMLInputElement>();\n const { focused, whenFocus, whenBlur } = useFocus(props, 'y-field-input');\n const inValue = ref<any>('');\n const displayValue = ref('');\n const inputType = toRef(props, 'type');\n\n const classes = computed(() => {\n return {\n [NAME]: true,\n };\n });\n\n const invokeValidators = () => {\n //\n };\n\n function onClick(event: MouseEvent) {\n inputRef.value?.focus();\n emit('click', event);\n }\n\n function onFocus(event: FocusEvent) {\n whenFocus();\n displayValue.value = inValue.value as string;\n emit('focus', event);\n }\n\n function onBlur(event: FocusEvent) {\n whenBlur();\n invokeValidators();\n emit('blur', event);\n changeDisplay();\n }\n\n function onInput(event: InputEvent) {\n emit('input', event);\n const target = event.target as HTMLInputElement | null;\n inValue.value = target?.value;\n displayValue.value = target?.value as string;\n if (props.whenInputValid) {\n invokeValidators();\n }\n }\n\n function onChange(event: Event) {\n emit('change', inValue.value);\n }\n\n function onKeydown(event: KeyboardEvent) {\n emit('keydown', event);\n }\n\n function onKeyup(event: KeyboardEvent) {\n emit('keyup', event);\n }\n\n function onClickClear(event: MouseEvent) {\n clear();\n }\n\n function onKeydownClear(event: KeyboardEvent) {\n if (event.code === 'Space' || event.code === 'Enter') {\n clear();\n }\n }\n\n function focus() {\n inputRef.value?.focus();\n }\n\n function select() {\n inputRef.value?.select();\n }\n\n function clear() {\n inValue.value = '';\n displayValue.value = '';\n emit('update:modelValue', inValue.value);\n }\n\n function changeDisplay() {\n const vm = getCurrentInstance();\n const { displayText } = props;\n if (displayText !== undefined) {\n let text = inValue.value;\n if (typeof displayText === 'string') {\n text = displayText;\n }\n if (displayText && typeof displayText === 'function') {\n text = (displayText as any).call(vm, text);\n }\n nextTick(() => {\n displayValue.value = text as string;\n });\n }\n }\n\n watch(\n () => props.modelValue,\n (neo: any) => {\n inValue.value = neo;\n displayValue.value = neo;\n },\n {\n immediate: true,\n },\n );\n\n watch(inValue, (neo: string) => {\n if (!focused.value) {\n changeDisplay();\n } else {\n displayValue.value = neo;\n }\n });\n\n expose({\n focus,\n select,\n clear,\n inputRef,\n });\n\n function onUpdateModel(value: any) {\n emit('update:modelValue', value);\n }\n\n useRender(() =>\n h(\n YInput,\n {\n class: classes.value,\n ref: yInputRef,\n ...chooseProps(props, YInput.props),\n modelValue: inValue.value,\n 'onUpdate:modelValue': onUpdateModel,\n onClick,\n focused: focused.value,\n 'onMousedown:display': ($event) => emit('mousedown:display', $event),\n },\n {\n leading: slots.leading\n ? (...args: any[]) => {\n const leadingChildren = [];\n const slot = slots.leading?.(...args);\n if (slot) {\n leadingChildren.push(slot);\n } else {\n return undefined;\n }\n return leadingChildren;\n }\n : undefined,\n default: (defaultProps: any) =>\n h(\n 'div',\n {\n class: `${NAME}__field`,\n 'data-id': defaultProps.attrId,\n ref: 'field',\n },\n [\n YInput.methods!.createLabel.call(yInputRef),\n slots.default?.(),\n h('input', {\n '.value': displayValue.value,\n '.id': defaultProps.attrId,\n '^type': inputType.value,\n readonly:\n props.readonly || props.loading || defaultProps.formLoading,\n '.placeholder': props.placeholder,\n '.disabled': props.disabled,\n '^tabindex': props.tabindex || '0',\n autocomplete: attrs.autocomplete,\n maxlength: attrs.maxlength,\n onInput,\n onFocus,\n onBlur,\n onChange,\n onKeydown,\n onKeyup,\n style: {\n textAlign: props.inputAlign,\n },\n ref: inputRef,\n }),\n ],\n ),\n trailing: () => {\n const trailingChildren = [];\n if (props.enableClear && inValue.value) {\n trailingChildren.push(\n h(\n 'div',\n { class: 'y-input__trailing y-input__trailing--clear' },\n [\n h(\n 'button',\n {\n class: `${NAME}__clear`,\n onClick: onClickClear,\n onKeydown: onKeydownClear,\n '^tabindex': '2',\n },\n [h(YIconClear)],\n ),\n ],\n ),\n );\n }\n const slot = slots.trailing;\n if (slot) {\n trailingChildren.push(\n h('div', { class: 'y-input__trailing' }, slot()),\n );\n }\n return trailingChildren;\n },\n 'helper-text': slots['helper-text'] ? () => {\n return slots['helper-text']?.();\n } : undefined,\n },\n ),\n );\n\n return {\n focused,\n };\n },\n});\n\nexport type YFieldInput = InstanceType<typeof YFieldInput>;\n"],"mappings":"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"}
1
+ {"version":3,"file":"YFieldInput.mjs","names":["computed","defineComponent","getCurrentInstance","h","nextTick","ref","toRef","watch","useRender","useFocus","chooseProps","propsFactory","YIconClear","YInput","pressYInputPropsOptions","NAME","pressYFieldInputPropsOptions","enableClear","Boolean","inputAlign","String","displayText","Function","whenInputValid","Number","tabindex","type","default","variation","YFieldInput","name","props","emits","setup","_ref","attrs","expose","emit","slots","yInputRef","inputRef","focused","whenFocus","whenBlur","inValue","displayValue","inputType","classes","invokeValidators","onClick","event","value","focus","onFocus","onBlur","changeDisplay","onInput","target","onChange","onKeydown","onKeyup","onClickClear","clear","onKeydownClear","code","select","vm","undefined","text","call","modelValue","neo","immediate","onUpdateModel","class","$event","leading","leadingChildren","_len","arguments","length","args","Array","_key","slot","push","defaultProps","attrId","floating","methods","createLabel","readonly","loading","formLoading","placeholder","disabled","autocomplete","maxlength","style","textAlign","trailing","trailingChildren","label"],"sources":["../../../src/components/field-input/YFieldInput.ts"],"sourcesContent":["import type { PropType } from 'vue';\r\nimport {\r\n computed,\r\n defineComponent,\r\n getCurrentInstance,\r\n h,\r\n nextTick,\r\n ref,\r\n toRef,\r\n watch,\r\n} from 'vue';\r\n\r\nimport { useRender } from '../../composables/component';\r\nimport { useFocus } from '../../composables/focus';\r\nimport { chooseProps, propsFactory } from '../../util/vue-component';\r\nimport { YIconClear } from '../icons/YIconClear';\r\nimport { YInput, pressYInputPropsOptions } from '../input';\r\n\r\nimport './YFieldInput.scss';\r\n\r\nconst NAME = 'y-field-input';\r\n\r\nexport const pressYFieldInputPropsOptions = propsFactory(\r\n {\r\n enableClear: Boolean as PropType<boolean>,\r\n inputAlign: String as PropType<string>,\r\n displayText: [String, Function] as PropType<\r\n string | ((value: any) => string)\r\n >,\r\n whenInputValid: [Boolean, Number] as PropType<boolean | number>,\r\n tabindex: {\r\n type: String as PropType<string>,\r\n default: '0',\r\n },\r\n type: {\r\n type: String as PropType<string>,\r\n default: 'text',\r\n },\r\n ...pressYInputPropsOptions({\r\n variation: 'filled',\r\n }),\r\n },\r\n 'YFieldInput',\r\n);\r\n\r\nexport const YFieldInput = defineComponent({\r\n name: 'YFieldInput',\r\n props: {\r\n ...pressYFieldInputPropsOptions(),\r\n },\r\n emits: [\r\n 'update:modelValue',\r\n 'update:focused',\r\n 'input',\r\n 'change',\r\n 'click',\r\n 'mousedown',\r\n 'mouseup',\r\n 'keydown',\r\n 'keyup',\r\n 'focus',\r\n 'blur',\r\n 'mousedown:display',\r\n ],\r\n setup(props, { attrs, expose, emit, slots }) {\r\n const yInputRef = ref<YInput>();\r\n const inputRef = ref<HTMLInputElement>();\r\n const { focused, whenFocus, whenBlur } = useFocus(props, 'y-field-input');\r\n const inValue = ref<any>('');\r\n const displayValue = ref('');\r\n const inputType = toRef(props, 'type');\r\n\r\n const classes = computed(() => {\r\n return {\r\n [NAME]: true,\r\n };\r\n });\r\n\r\n const invokeValidators = () => {\r\n //\r\n };\r\n\r\n function onClick(event: MouseEvent) {\r\n inputRef.value?.focus();\r\n emit('click', event);\r\n }\r\n\r\n function onFocus(event: FocusEvent) {\r\n whenFocus();\r\n displayValue.value = inValue.value as string;\r\n emit('focus', event);\r\n }\r\n\r\n function onBlur(event: FocusEvent) {\r\n whenBlur();\r\n invokeValidators();\r\n emit('blur', event);\r\n changeDisplay();\r\n }\r\n\r\n function onInput(event: InputEvent) {\r\n emit('input', event);\r\n const target = event.target as HTMLInputElement | null;\r\n inValue.value = target?.value;\r\n displayValue.value = target?.value as string;\r\n if (props.whenInputValid) {\r\n invokeValidators();\r\n }\r\n }\r\n\r\n function onChange(event: Event) {\r\n emit('change', inValue.value);\r\n }\r\n\r\n function onKeydown(event: KeyboardEvent) {\r\n emit('keydown', event);\r\n }\r\n\r\n function onKeyup(event: KeyboardEvent) {\r\n emit('keyup', event);\r\n }\r\n\r\n function onClickClear(event: MouseEvent) {\r\n clear();\r\n }\r\n\r\n function onKeydownClear(event: KeyboardEvent) {\r\n if (event.code === 'Space' || event.code === 'Enter') {\r\n clear();\r\n }\r\n }\r\n\r\n function focus() {\r\n inputRef.value?.focus();\r\n }\r\n\r\n function select() {\r\n inputRef.value?.select();\r\n }\r\n\r\n function clear() {\r\n inValue.value = '';\r\n displayValue.value = '';\r\n emit('update:modelValue', inValue.value);\r\n }\r\n\r\n function changeDisplay() {\r\n const vm = getCurrentInstance();\r\n const { displayText } = props;\r\n if (displayText !== undefined) {\r\n let text = inValue.value;\r\n if (typeof displayText === 'string') {\r\n text = displayText;\r\n }\r\n if (displayText && typeof displayText === 'function') {\r\n text = (displayText as any).call(vm, text);\r\n }\r\n nextTick(() => {\r\n displayValue.value = text as string;\r\n });\r\n }\r\n }\r\n\r\n watch(\r\n () => props.modelValue,\r\n (neo: any) => {\r\n inValue.value = neo;\r\n displayValue.value = neo;\r\n },\r\n {\r\n immediate: true,\r\n },\r\n );\r\n\r\n watch(inValue, (neo: string) => {\r\n if (!focused.value) {\r\n changeDisplay();\r\n } else {\r\n displayValue.value = neo;\r\n }\r\n });\r\n\r\n expose({\r\n focus,\r\n select,\r\n clear,\r\n inputRef,\r\n });\r\n\r\n function onUpdateModel(value: any) {\r\n emit('update:modelValue', value);\r\n }\r\n\r\n useRender(() =>\r\n h(\r\n YInput,\r\n {\r\n class: classes.value,\r\n ref: yInputRef,\r\n ...chooseProps(props, YInput.props),\r\n modelValue: inValue.value,\r\n 'onUpdate:modelValue': onUpdateModel,\r\n onClick,\r\n focused: focused.value,\r\n 'onMousedown:display': ($event) => emit('mousedown:display', $event),\r\n },\r\n {\r\n leading: slots.leading\r\n ? (...args: any[]) => {\r\n const leadingChildren = [];\r\n const slot = slots.leading?.(...args);\r\n if (slot) {\r\n leadingChildren.push(slot);\r\n } else {\r\n return undefined;\r\n }\r\n return leadingChildren;\r\n }\r\n : undefined,\r\n default: (defaultProps: any) =>\r\n h(\r\n 'div',\r\n {\r\n class: `${NAME}__field`,\r\n 'data-id': defaultProps.attrId,\r\n ref: 'field',\r\n },\r\n [\r\n props.floating\r\n ? yInputRef.value &&\r\n YInput.methods!.createLabel.call(yInputRef.value)\r\n : undefined,\r\n slots.default?.(),\r\n h('input', {\r\n '.value': displayValue.value,\r\n '.id': defaultProps.attrId,\r\n '^type': inputType.value,\r\n readonly:\r\n props.readonly || props.loading || defaultProps.formLoading,\r\n '.placeholder': props.placeholder,\r\n '.disabled': props.disabled,\r\n '^tabindex': props.tabindex || '0',\r\n autocomplete: attrs.autocomplete,\r\n maxlength: attrs.maxlength,\r\n onInput,\r\n onFocus,\r\n onBlur,\r\n onChange,\r\n onKeydown,\r\n onKeyup,\r\n style: {\r\n textAlign: props.inputAlign,\r\n },\r\n ref: inputRef,\r\n }),\r\n ],\r\n ),\r\n trailing: () => {\r\n const trailingChildren = [];\r\n if (props.enableClear && inValue.value) {\r\n trailingChildren.push(\r\n h(\r\n 'div',\r\n { class: 'y-input__trailing y-input__trailing--clear' },\r\n [\r\n h(\r\n 'button',\r\n {\r\n class: `${NAME}__clear`,\r\n onClick: onClickClear,\r\n onKeydown: onKeydownClear,\r\n '^tabindex': '2',\r\n },\r\n [h(YIconClear)],\r\n ),\r\n ],\r\n ),\r\n );\r\n }\r\n const slot = slots.trailing;\r\n if (slot) {\r\n trailingChildren.push(\r\n h('div', { class: 'y-input__trailing' }, slot()),\r\n );\r\n }\r\n return trailingChildren;\r\n },\r\n label: slots['label']?.(),\r\n 'helper-text': slots['helper-text']\r\n ? () => {\r\n return slots['helper-text']?.();\r\n }\r\n : undefined,\r\n },\r\n ),\r\n );\r\n\r\n return {\r\n focused,\r\n };\r\n },\r\n});\r\n\r\nexport type YFieldInput = InstanceType<typeof YFieldInput>;\r\n"],"mappings":"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"}
@@ -1,63 +1,73 @@
1
- @use '../../styles/util/theme';
2
- @use '../../styles/util/helper';
3
- @use '../../styles/variables';
4
-
5
- .y-field-input {
6
- .y-input {
7
- &__display {
8
- padding: 0 2px;
9
- }
10
-
11
- &__plate {
12
- pointer-events: none;
13
- }
14
- }
15
-
16
- &__field {
17
- position: relative;
18
- flex: 1 1 auto;
19
- min-height: 36px;
20
- padding: 1px 0;
21
- border-radius: inherit;
22
-
23
- > input {
24
- position: relative;
25
- outline: none;
26
- padding: 8px 10px;
27
- width: 100%;
28
- height: 100%;
29
- line-height: 1.2;
30
- font-size: 0.875rem;
31
- color: inherit;
32
- border-radius: inherit;
33
- }
34
- }
35
-
36
- .y-input__prepend + &__field {
37
- > input {
38
- padding-left: 4px;
39
- padding-right: 4px;
40
- }
41
- }
42
-
43
- .y-input__append:last-child {
44
- &.y-input__append--clear {
45
- margin-right: 8px;
46
- }
47
- }
48
-
49
- &__clear {
50
- width: 16px;
51
- height: 16px;
52
- padding: 0;
53
- cursor: pointer;
54
- }
55
- }
56
-
57
- @include theme.basicTheme('y-field-input') using ($themeMap, $class) {
58
- .y-field-input {
59
- &__clear {
60
- color: helper.deepGet($themeMap, 'fieldInput', 'clear');
61
- }
62
- }
63
- }
1
+ @use '../../styles/util/theme';
2
+ @use '../../styles/util/helper';
3
+ @use '../../styles/variables';
4
+
5
+ .y-field-input {
6
+ --y-field-input-horizon-padding: 10px;
7
+
8
+ .y-input {
9
+ &__display {
10
+ padding: 0 2px;
11
+ }
12
+
13
+ &__plate {
14
+ pointer-events: none;
15
+ }
16
+
17
+ &__floating-label {
18
+ padding-left: var(--y-field-input-horizon-padding, 10px);
19
+
20
+ &--floated {
21
+ padding-left: unset;
22
+ }
23
+ }
24
+ }
25
+
26
+ &__field {
27
+ position: relative;
28
+ flex: 1 1 auto;
29
+ min-height: 36px;
30
+ padding: 1px 0;
31
+ border-radius: inherit;
32
+
33
+ > input {
34
+ position: relative;
35
+ outline: none;
36
+ padding: 8px var(--y-field-input-horizon-padding, 10px);
37
+ width: 100%;
38
+ height: 100%;
39
+ line-height: 1.2;
40
+ font-size: 0.875rem;
41
+ color: inherit;
42
+ border-radius: inherit;
43
+ }
44
+ }
45
+
46
+ .y-input__prepend + &__field {
47
+ > input {
48
+ padding-left: 4px;
49
+ padding-right: 4px;
50
+ }
51
+ }
52
+
53
+ .y-input__append:last-child {
54
+ &.y-input__append--clear {
55
+ margin-right: 8px;
56
+ }
57
+ }
58
+
59
+ &__clear {
60
+ width: 16px;
61
+ height: 16px;
62
+ padding: 0;
63
+ cursor: pointer;
64
+ }
65
+ }
66
+
67
+ @include theme.basicTheme('y-field-input') using ($themeMap, $class) {
68
+ .y-field-input {
69
+ &__clear {
70
+ color: helper.deepGet($themeMap, 'fieldInput', 'clear');
71
+ }
72
+ }
73
+ }