yuyeon 0.0.42 → 0.0.43
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.
- package/dist/style.css +1 -1
- package/dist/yuyeon.js +749 -736
- package/dist/yuyeon.umd.cjs +5 -5
- package/lib/components/badge/YBadge.mjs +16 -0
- package/lib/components/badge/YBadge.mjs.map +1 -0
- package/lib/components/badge/YBadge.scss +0 -0
- package/lib/components/badge/index.mjs +2 -0
- package/lib/components/badge/index.mjs.map +1 -0
- package/lib/components/button/YButton.mjs +2 -16
- package/lib/components/button/YButton.mjs.map +1 -1
- package/lib/components/table/YDataTableCell.mjs +4 -0
- package/lib/components/table/YDataTableCell.mjs.map +1 -1
- package/lib/components/table/YDataTableHead.mjs +1 -0
- package/lib/components/table/YDataTableHead.mjs.map +1 -1
- package/lib/components/table/YDataTableRow.mjs +52 -39
- package/lib/components/table/YDataTableRow.mjs.map +1 -1
- package/lib/components/table/YTable.scss +6 -2
- package/lib/components/table/types/index.mjs.map +1 -1
- package/lib/util/ui.mjs +4 -2
- package/lib/util/ui.mjs.map +1 -1
- package/package.json +1 -1
- package/types/components/table/YDataTableCell.d.ts +6 -0
- package/types/components/table/YDataTableRow.d.ts +5 -8
- package/types/components/table/composibles/header.d.ts +2 -0
- package/types/components/table/types/index.d.ts +19 -4
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { createVNode as _createVNode, Fragment as _Fragment } from "vue";
|
|
2
|
+
import { defineComponent } from 'vue';
|
|
3
|
+
import { useRender } from "../../composables/component.mjs";
|
|
4
|
+
import { propsFactory } from "../../util/vue-component.mjs";
|
|
5
|
+
import "./YBadge.scss";
|
|
6
|
+
export const pressYBadgePropsOptions = propsFactory({}, 'YBadge');
|
|
7
|
+
export const YBadge = defineComponent({
|
|
8
|
+
name: 'YBadge',
|
|
9
|
+
props: pressYBadgePropsOptions(),
|
|
10
|
+
setup(props, ctx) {
|
|
11
|
+
useRender(() => {
|
|
12
|
+
return _createVNode(_Fragment, null, null);
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
//# sourceMappingURL=YBadge.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"YBadge.mjs","names":["defineComponent","useRender","propsFactory","pressYBadgePropsOptions","YBadge","name","props","setup","ctx","_createVNode","_Fragment"],"sources":["../../../src/components/badge/YBadge.tsx"],"sourcesContent":["import { defineComponent } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { propsFactory } from '../../util/vue-component';\n\nimport './YBadge.scss';\n\nexport const pressYBadgePropsOptions = propsFactory({\n\n}, 'YBadge');\n\nexport const YBadge = defineComponent({\n name: 'YBadge',\n props: pressYBadgePropsOptions(),\n setup(props, ctx) {\n useRender(() => {\n return <></>;\n });\n },\n});\n"],"mappings":";AAAA,SAASA,eAAe,QAAQ,KAAK;AAAC,SAE7BC,SAAS;AAAA,SACTC,YAAY;AAErB;AAEA,OAAO,MAAMC,uBAAuB,GAAGD,YAAY,CAAC,CAEpD,CAAC,EAAE,QAAQ,CAAC;AAEZ,OAAO,MAAME,MAAM,GAAGJ,eAAe,CAAC;EACpCK,IAAI,EAAE,QAAQ;EACdC,KAAK,EAAEH,uBAAuB,CAAC,CAAC;EAChCI,KAAKA,CAACD,KAAK,EAAEE,GAAG,EAAE;IAChBP,SAAS,CAAC,MAAM;MACd,OAAAQ,YAAA,CAAAC,SAAA;IACF,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../../src/components/badge/index.ts"],"sourcesContent":["export * from './YBadge';\r\n"],"mappings":""}
|
|
@@ -60,7 +60,7 @@ export const YButton = defineComponent({
|
|
|
60
60
|
},
|
|
61
61
|
props: pressYButtonProps(),
|
|
62
62
|
emits: {
|
|
63
|
-
|
|
63
|
+
click: event => true,
|
|
64
64
|
'choice:selected': choice => true
|
|
65
65
|
},
|
|
66
66
|
setup(props, _ref) {
|
|
@@ -133,25 +133,11 @@ export const YButton = defineComponent({
|
|
|
133
133
|
|
|
134
134
|
/// Events
|
|
135
135
|
function onClick(e) {
|
|
136
|
-
|
|
137
|
-
// don't redirect with control keys
|
|
138
|
-
if (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey) return;
|
|
139
|
-
// don't redirect when preventDefault called
|
|
140
|
-
if (e.defaultPrevented) return;
|
|
141
|
-
// don't redirect on right click
|
|
142
|
-
if (e.button !== undefined && e.button !== 0) return;
|
|
143
|
-
// don't redirect if `target="_blank"`
|
|
144
|
-
if (/\b_blank\b/i.test(attrs.target)) {
|
|
145
|
-
return;
|
|
146
|
-
}
|
|
147
|
-
return true;
|
|
148
|
-
}
|
|
149
|
-
if (!guardEvent(e) || props.loading || isDisabled.value) {
|
|
136
|
+
if (isDisabled.value || props.loading || link.isLink.value && (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey || e.button !== 0 || attrs.target === '_blank')) {
|
|
150
137
|
return;
|
|
151
138
|
}
|
|
152
139
|
emit('click', e);
|
|
153
140
|
link.navigate?.(e);
|
|
154
|
-
if (e.preventDefault) e.preventDefault();
|
|
155
141
|
choice?.toggle();
|
|
156
142
|
}
|
|
157
143
|
useRender(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YButton.mjs","names":["computed","defineComponent","mergeProps","pressChoiceItemPropsOptions","useChoiceItem","useChoiceByLink","useRender","pressVueRouterPropsOptions","useLink","PlateWave","isColorValue","propsFactory","YSpinnerRing","Y_TOGGLE_BUTTON_KEY","NAME","pressYButtonProps","loading","Boolean","active","type","default","undefined","injectSymbol","variation","String","small","icon","outlined","rounded","filled","color","noWave","YButton","name","directives","props","emits","event","choice","setup","_ref","attrs","slots","emit","link","select","isActive","isLink","value","isSelected","variations","split","map","trim","classes","includes","disabled","styles","textColor","isDisabled","onClick","e","guardEvent","metaKey","altKey","ctrlKey","shiftKey","defaultPrevented","button","test","target","navigate","preventDefault","toggle","Tag","_withDirectives","_createVNode","selectedClass","href","width","height","append","_resolveDirective"],"sources":["../../../src/components/button/YButton.tsx"],"sourcesContent":["import type { PropType } from 'vue';\nimport { computed, defineComponent, mergeProps } from 'vue';\n\nimport {\n pressChoiceItemPropsOptions,\n useChoiceItem,\n} from '../../composables/choice';\nimport { useChoiceByLink } from '../../composables/choice-link';\nimport { useRender } from '../../composables/component';\nimport {\n pressVueRouterPropsOptions,\n useLink,\n} from '../../composables/vue-router';\nimport { PlateWave } from '../../directives/plate-wave';\nimport { isColorValue } from '../../util/color';\nimport { propsFactory } from '../../util/vue-component';\nimport { YSpinnerRing } from '../loading/YSpinnerRing';\nimport { Y_TOGGLE_BUTTON_KEY } from '../toggle-button';\n\n/**\n * Style\n */\nimport './YButton.scss';\n\nconst NAME = 'y-button';\n\nexport const pressYButtonProps = propsFactory(\n {\n loading: Boolean,\n active: { type: Boolean, default: undefined },\n injectSymbol: { type: null, default: Y_TOGGLE_BUTTON_KEY },\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 //\n color: {\n type: String,\n },\n noWave: {\n type: Boolean,\n default: false,\n },\n ...pressVueRouterPropsOptions(),\n ...pressChoiceItemPropsOptions(),\n },\n 'YButton',\n);\n\nexport const YButton = defineComponent({\n name: 'YButton',\n directives: {\n PlateWave,\n },\n props: pressYButtonProps(),\n emits: {\n 'click': (event: MouseEvent) => true,\n 'choice:selected': (choice: { value: boolean }) => true,\n },\n setup(props, { attrs, slots, emit }) {\n const choice = useChoiceItem(props, props.injectSymbol, false);\n const link = useLink(props, attrs);\n useChoiceByLink(link, choice?.select);\n\n const isActive = computed(() => {\n if (props.active !== undefined) {\n return props.active;\n }\n if (link.isLink.value) {\n return link.isActive?.value;\n }\n return choice?.isSelected.value;\n });\n\n const variations = computed(() => {\n const { variation } = props;\n if (typeof variation === 'string') {\n return variation.split(',').map((value) => {\n return value.trim();\n });\n }\n return [];\n });\n\n const classes = computed(() => {\n const { outlined, rounded, filled, small, icon } = props;\n return {\n [`${NAME}--outlined`]:\n variations.value.includes('outlined') || outlined,\n [`${NAME}--rounded`]: variations.value.includes('rounded') || rounded,\n [`${NAME}--filled`]: variations.value.includes('filled') || filled,\n [`${NAME}--text`]: variations.value.includes('text'),\n [`${NAME}--small`]: variations.value.includes('small') || small,\n [`${NAME}--icon`]: variations.value.includes('icon') || icon,\n [`${NAME}--color`]: props.color,\n [`${NAME}--loading`]: props.loading,\n [`${NAME}--disabled`]: props.disabled,\n [`${NAME}--active`]: isActive.value,\n };\n });\n\n const styles = computed(() => {\n let { color } = props;\n let textColor: string | undefined;\n if (color && !isColorValue(color)) {\n color = `var(--y-theme-${color})`;\n textColor = `var(--y-theme-on-${props.color})`;\n }\n return {\n [`--y-button__color`]: color,\n [`--y-button__text-color`]: textColor,\n };\n });\n\n const isDisabled = computed(() => {\n return choice?.disabled.value || props.disabled;\n });\n\n /// Events\n function onClick(e: MouseEvent) {\n function guardEvent(e: MouseEvent) {\n // don't redirect with control keys\n if (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey) return;\n // don't redirect when preventDefault called\n if (e.defaultPrevented) return;\n // don't redirect on right click\n if (e.button !== undefined && e.button !== 0) return;\n // don't redirect if `target=\"_blank\"`\n if (/\\b_blank\\b/i.test(attrs.target as string)) {\n return;\n }\n return true;\n }\n if (!guardEvent(e) || props.loading || isDisabled.value) {\n return;\n }\n emit('click', e);\n link.navigate?.(e);\n if (e.preventDefault) e.preventDefault();\n choice?.toggle();\n }\n\n useRender(() => {\n const Tag = link.isLink.value ? 'a' : 'button';\n return (\n <Tag\n class={[\n `${NAME}`,\n choice?.selectedClass.value,\n {\n ...classes.value,\n },\n ]}\n href={link.href.value}\n style={styles.value}\n onClick={onClick}\n disabled={props.disabled ? true : undefined}\n v-plate-wave={!props.noWave && !props.loading}\n >\n <span class={['y-button__content']}>\n {props.loading && (\n <YSpinnerRing\n {...mergeProps({ width: '24', height: '24' })}\n ></YSpinnerRing>\n )}\n {slots.default?.()}\n </span>\n {slots.append?.()}\n </Tag>\n );\n });\n\n return {\n link,\n };\n },\n});\n\nexport type YButton = InstanceType<typeof YButton>;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"YButton.mjs","names":["computed","defineComponent","mergeProps","pressChoiceItemPropsOptions","useChoiceItem","useChoiceByLink","useRender","pressVueRouterPropsOptions","useLink","PlateWave","isColorValue","propsFactory","YSpinnerRing","Y_TOGGLE_BUTTON_KEY","NAME","pressYButtonProps","loading","Boolean","active","type","default","undefined","injectSymbol","variation","String","small","icon","outlined","rounded","filled","color","noWave","YButton","name","directives","props","emits","click","event","choice","setup","_ref","attrs","slots","emit","link","select","isActive","isLink","value","isSelected","variations","split","map","trim","classes","includes","disabled","styles","textColor","isDisabled","onClick","e","metaKey","altKey","ctrlKey","shiftKey","button","target","navigate","toggle","Tag","_withDirectives","_createVNode","selectedClass","href","width","height","append","_resolveDirective"],"sources":["../../../src/components/button/YButton.tsx"],"sourcesContent":["import type { PropType } from 'vue';\nimport { computed, defineComponent, mergeProps } from 'vue';\n\nimport {\n pressChoiceItemPropsOptions,\n useChoiceItem,\n} from '../../composables/choice';\nimport { useChoiceByLink } from '../../composables/choice-link';\nimport { useRender } from '../../composables/component';\nimport {\n pressVueRouterPropsOptions,\n useLink,\n} from '../../composables/vue-router';\nimport { PlateWave } from '../../directives/plate-wave';\nimport { isColorValue } from '../../util/color';\nimport { EventProp, propsFactory } from '../../util/vue-component';\nimport { YSpinnerRing } from '../loading/YSpinnerRing';\nimport { Y_TOGGLE_BUTTON_KEY } from '../toggle-button';\n\n/**\n * Style\n */\nimport './YButton.scss';\n\nconst NAME = 'y-button';\n\nexport const pressYButtonProps = propsFactory(\n {\n loading: Boolean,\n active: { type: Boolean, default: undefined },\n injectSymbol: { type: null, default: Y_TOGGLE_BUTTON_KEY },\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 //\n color: {\n type: String,\n },\n noWave: {\n type: Boolean,\n default: false,\n },\n ...pressVueRouterPropsOptions(),\n ...pressChoiceItemPropsOptions(),\n },\n 'YButton',\n);\n\nexport const YButton = defineComponent({\n name: 'YButton',\n directives: {\n PlateWave,\n },\n props: pressYButtonProps(),\n emits: {\n click: (event: MouseEvent) => true,\n 'choice:selected': (choice: { value: boolean }) => true,\n },\n setup(props, { attrs, slots, emit }) {\n const choice = useChoiceItem(props, props.injectSymbol, false);\n const link = useLink(props, attrs);\n useChoiceByLink(link, choice?.select);\n\n const isActive = computed(() => {\n if (props.active !== undefined) {\n return props.active;\n }\n if (link.isLink.value) {\n return link.isActive?.value;\n }\n return choice?.isSelected.value;\n });\n\n const variations = computed(() => {\n const { variation } = props;\n if (typeof variation === 'string') {\n return variation.split(',').map((value) => {\n return value.trim();\n });\n }\n return [];\n });\n\n const classes = computed(() => {\n const { outlined, rounded, filled, small, icon } = props;\n return {\n [`${NAME}--outlined`]:\n variations.value.includes('outlined') || outlined,\n [`${NAME}--rounded`]: variations.value.includes('rounded') || rounded,\n [`${NAME}--filled`]: variations.value.includes('filled') || filled,\n [`${NAME}--text`]: variations.value.includes('text'),\n [`${NAME}--small`]: variations.value.includes('small') || small,\n [`${NAME}--icon`]: variations.value.includes('icon') || icon,\n [`${NAME}--color`]: props.color,\n [`${NAME}--loading`]: props.loading,\n [`${NAME}--disabled`]: props.disabled,\n [`${NAME}--active`]: isActive.value,\n };\n });\n\n const styles = computed(() => {\n let { color } = props;\n let textColor: string | undefined;\n if (color && !isColorValue(color)) {\n color = `var(--y-theme-${color})`;\n textColor = `var(--y-theme-on-${props.color})`;\n }\n return {\n [`--y-button__color`]: color,\n [`--y-button__text-color`]: textColor,\n };\n });\n\n const isDisabled = computed(() => {\n return choice?.disabled.value || props.disabled;\n });\n\n /// Events\n function onClick(e: MouseEvent) {\n if (\n isDisabled.value ||\n props.loading ||\n (link.isLink.value &&\n (e.metaKey ||\n e.altKey ||\n e.ctrlKey ||\n e.shiftKey ||\n e.button !== 0 ||\n attrs.target === '_blank'))\n ) {\n return;\n }\n emit('click', e);\n link.navigate?.(e);\n choice?.toggle();\n }\n\n useRender(() => {\n const Tag = link.isLink.value ? 'a' : 'button';\n return (\n <Tag\n class={[\n `${NAME}`,\n choice?.selectedClass.value,\n {\n ...classes.value,\n },\n ]}\n href={link.href.value}\n style={styles.value}\n onClick={onClick}\n disabled={props.disabled ? true : undefined}\n v-plate-wave={!props.noWave && !props.loading}\n >\n <span class={['y-button__content']}>\n {props.loading && (\n <YSpinnerRing\n {...mergeProps({ width: '24', height: '24' })}\n ></YSpinnerRing>\n )}\n {slots.default?.()}\n </span>\n {slots.append?.()}\n </Tag>\n );\n });\n\n return {\n link,\n };\n },\n});\n\nexport type YButton = InstanceType<typeof YButton>;\n"],"mappings":"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"}
|
|
@@ -19,6 +19,9 @@ export const YDataTableCell = defineComponent({
|
|
|
19
19
|
width: {
|
|
20
20
|
type: [Number, String]
|
|
21
21
|
},
|
|
22
|
+
maxWidth: {
|
|
23
|
+
type: [Number, String]
|
|
24
|
+
},
|
|
22
25
|
height: {
|
|
23
26
|
type: [Number, String]
|
|
24
27
|
},
|
|
@@ -56,6 +59,7 @@ export const YDataTableCell = defineComponent({
|
|
|
56
59
|
"style": {
|
|
57
60
|
width: toStyleSizeValue(props.width),
|
|
58
61
|
height: toStyleSizeValue(props.height),
|
|
62
|
+
maxWidth: toStyleSizeValue(props.maxWidth),
|
|
59
63
|
...offsetStyle.value
|
|
60
64
|
}
|
|
61
65
|
}, attrs, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YDataTableCell.mjs","names":["computed","defineComponent","useRender","toStyleSizeValue","YDataTableCell","name","functional","props","type","String","default","fixed","fixedOffset","Number","width","height","align","emits","setup","_ref","slots","emit","attrs","offsetStyle","ret","undefined","ElTag","_createVNode","_mergeProps","value","e"],"sources":["../../../src/components/table/YDataTableCell.tsx"],"sourcesContent":["import { CSSProperties, PropType, computed, defineComponent } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { toStyleSizeValue } from '../../util/ui';\n\nexport const YDataTableCell = defineComponent({\n name: 'YDataTableCell',\n functional: true,\n props: {\n type: {\n type: String as PropType<'head' | 'data'>,\n default: 'data',\n },\n fixed: {\n type: String as PropType<'lead' | 'trail'>,\n },\n fixedOffset: {\n type: Number as PropType<number>,\n },\n width: {\n type: [Number, String] as PropType<string | number>,\n },\n height: {\n type: [Number, String] as PropType<string | number>,\n },\n align: {\n type: String as PropType<'start' | 'center' | 'end'>,\n default: 'start',\n },\n },\n emits: ['click'],\n setup(props, { slots, emit, attrs }) {\n const offsetStyle = computed(() => {\n const ret: CSSProperties = {};\n if (props.fixed && props.fixedOffset !== undefined) {\n if (props.fixed === 'lead') {\n ret['left'] = toStyleSizeValue(props.fixedOffset);\n } else if (props.fixed === 'trail') {\n ret['right'] = toStyleSizeValue(props.fixedOffset);\n }\n }\n return ret;\n });\n\n useRender(() => {\n const ElTag = props.type === 'head' ? 'th' : 'td';\n return (\n <ElTag\n class={[\n `y-data-table__${ElTag}`,\n 'y-data-table-cell',\n {\n 'y-data-table-cell--fixed': props.fixed,\n [`y-data-table-cell--fixed-${props.fixed}`]: props.fixed,\n [`y-data-table-cell--align-${props.align}`]: props.align,\n },\n ]}\n style={{\n width: toStyleSizeValue(props.width),\n height: toStyleSizeValue(props.height),\n ...offsetStyle.value,\n }}\n {...attrs}\n onClick={(e) => emit('click', e)}\n >\n {slots.default?.()}\n </ElTag>\n );\n });\n },\n});\n\nexport type YDataTableCell = InstanceType<typeof YDataTableCell>;\n"],"mappings":";AAAA,SAAkCA,QAAQ,EAAEC,eAAe,QAAQ,KAAK;AAAC,SAEhEC,SAAS;AAAA,SACTC,gBAAgB;AAEzB,OAAO,MAAMC,cAAc,GAAGH,eAAe,CAAC;EAC5CI,IAAI,EAAE,gBAAgB;EACtBC,UAAU,EAAE,IAAI;EAChBC,KAAK,EAAE;IACLC,IAAI,EAAE;MACJA,IAAI,EAAEC,MAAmC;MACzCC,OAAO,EAAE;IACX,CAAC;IACDC,KAAK,EAAE;MACLH,IAAI,EAAEC;IACR,CAAC;IACDG,WAAW,EAAE;MACXJ,IAAI,EAAEK;IACR,CAAC;IACDC,KAAK,EAAE;MACLN,IAAI,EAAE,CAACK,MAAM,EAAEJ,MAAM;IACvB,CAAC;IACDM,
|
|
1
|
+
{"version":3,"file":"YDataTableCell.mjs","names":["computed","defineComponent","useRender","toStyleSizeValue","YDataTableCell","name","functional","props","type","String","default","fixed","fixedOffset","Number","width","maxWidth","height","align","emits","setup","_ref","slots","emit","attrs","offsetStyle","ret","undefined","ElTag","_createVNode","_mergeProps","value","e"],"sources":["../../../src/components/table/YDataTableCell.tsx"],"sourcesContent":["import { CSSProperties, PropType, computed, defineComponent } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { toStyleSizeValue } from '../../util/ui';\n\nexport const YDataTableCell = defineComponent({\n name: 'YDataTableCell',\n functional: true,\n props: {\n type: {\n type: String as PropType<'head' | 'data'>,\n default: 'data',\n },\n fixed: {\n type: String as PropType<'lead' | 'trail'>,\n },\n fixedOffset: {\n type: Number as PropType<number>,\n },\n width: {\n type: [Number, String] as PropType<string | number>,\n },\n maxWidth: {\n type: [Number, String] as PropType<string | number>,\n },\n height: {\n type: [Number, String] as PropType<string | number>,\n },\n align: {\n type: String as PropType<'start' | 'center' | 'end'>,\n default: 'start',\n },\n },\n emits: ['click'],\n setup(props, { slots, emit, attrs }) {\n const offsetStyle = computed(() => {\n const ret: CSSProperties = {};\n if (props.fixed && props.fixedOffset !== undefined) {\n if (props.fixed === 'lead') {\n ret['left'] = toStyleSizeValue(props.fixedOffset);\n } else if (props.fixed === 'trail') {\n ret['right'] = toStyleSizeValue(props.fixedOffset);\n }\n }\n return ret;\n });\n\n useRender(() => {\n const ElTag = props.type === 'head' ? 'th' : 'td';\n return (\n <ElTag\n class={[\n `y-data-table__${ElTag}`,\n 'y-data-table-cell',\n {\n 'y-data-table-cell--fixed': props.fixed,\n [`y-data-table-cell--fixed-${props.fixed}`]: props.fixed,\n [`y-data-table-cell--align-${props.align}`]: props.align,\n },\n ]}\n style={{\n width: toStyleSizeValue(props.width),\n height: toStyleSizeValue(props.height),\n maxWidth: toStyleSizeValue(props.maxWidth),\n ...offsetStyle.value,\n }}\n {...attrs}\n onClick={(e) => emit('click', e)}\n >\n {slots.default?.()}\n </ElTag>\n );\n });\n },\n});\n\nexport type YDataTableCell = InstanceType<typeof YDataTableCell>;\n"],"mappings":";AAAA,SAAkCA,QAAQ,EAAEC,eAAe,QAAQ,KAAK;AAAC,SAEhEC,SAAS;AAAA,SACTC,gBAAgB;AAEzB,OAAO,MAAMC,cAAc,GAAGH,eAAe,CAAC;EAC5CI,IAAI,EAAE,gBAAgB;EACtBC,UAAU,EAAE,IAAI;EAChBC,KAAK,EAAE;IACLC,IAAI,EAAE;MACJA,IAAI,EAAEC,MAAmC;MACzCC,OAAO,EAAE;IACX,CAAC;IACDC,KAAK,EAAE;MACLH,IAAI,EAAEC;IACR,CAAC;IACDG,WAAW,EAAE;MACXJ,IAAI,EAAEK;IACR,CAAC;IACDC,KAAK,EAAE;MACLN,IAAI,EAAE,CAACK,MAAM,EAAEJ,MAAM;IACvB,CAAC;IACDM,QAAQ,EAAE;MACRP,IAAI,EAAE,CAACK,MAAM,EAAEJ,MAAM;IACvB,CAAC;IACDO,MAAM,EAAE;MACNR,IAAI,EAAE,CAACK,MAAM,EAAEJ,MAAM;IACvB,CAAC;IACDQ,KAAK,EAAE;MACLT,IAAI,EAAEC,MAA8C;MACpDC,OAAO,EAAE;IACX;EACF,CAAC;EACDQ,KAAK,EAAE,CAAC,OAAO,CAAC;EAChBC,KAAKA,CAACZ,KAAK,EAAAa,IAAA,EAA0B;IAAA,IAAxB;MAAEC,KAAK;MAAEC,IAAI;MAAEC;IAAM,CAAC,GAAAH,IAAA;IACjC,MAAMI,WAAW,GAAGxB,QAAQ,CAAC,MAAM;MACjC,MAAMyB,GAAkB,GAAG,CAAC,CAAC;MAC7B,IAAIlB,KAAK,CAACI,KAAK,IAAIJ,KAAK,CAACK,WAAW,KAAKc,SAAS,EAAE;QAClD,IAAInB,KAAK,CAACI,KAAK,KAAK,MAAM,EAAE;UAC1Bc,GAAG,CAAC,MAAM,CAAC,GAAGtB,gBAAgB,CAACI,KAAK,CAACK,WAAW,CAAC;QACnD,CAAC,MAAM,IAAIL,KAAK,CAACI,KAAK,KAAK,OAAO,EAAE;UAClCc,GAAG,CAAC,OAAO,CAAC,GAAGtB,gBAAgB,CAACI,KAAK,CAACK,WAAW,CAAC;QACpD;MACF;MACA,OAAOa,GAAG;IACZ,CAAC,CAAC;IAEFvB,SAAS,CAAC,MAAM;MACd,MAAMyB,KAAK,GAAGpB,KAAK,CAACC,IAAI,KAAK,MAAM,GAAG,IAAI,GAAG,IAAI;MACjD,OAAAoB,YAAA,CAAAD,KAAA,EAAAE,WAAA;QAAA,SAEW,CACJ,iBAAgBF,KAAM,EAAC,EACxB,mBAAmB,EACnB;UACE,0BAA0B,EAAEpB,KAAK,CAACI,KAAK;UACvC,CAAE,4BAA2BJ,KAAK,CAACI,KAAM,EAAC,GAAGJ,KAAK,CAACI,KAAK;UACxD,CAAE,4BAA2BJ,KAAK,CAACU,KAAM,EAAC,GAAGV,KAAK,CAACU;QACrD,CAAC,CACF;QAAA,SACM;UACLH,KAAK,EAAEX,gBAAgB,CAACI,KAAK,CAACO,KAAK,CAAC;UACpCE,MAAM,EAAEb,gBAAgB,CAACI,KAAK,CAACS,MAAM,CAAC;UACtCD,QAAQ,EAAEZ,gBAAgB,CAACI,KAAK,CAACQ,QAAQ,CAAC;UAC1C,GAAGS,WAAW,CAACM;QACjB;MAAC,GACGP,KAAK;QAAA,WACCQ,CAAC,IAAKT,IAAI,CAAC,OAAO,EAAES,CAAC;MAAC;QAAArB,OAAA,EAAAA,CAAA,MAE/BW,KAAK,CAACX,OAAO,GAAG,CAAC;MAAA;IAGxB,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YDataTableHead.mjs","names":["defineComponent","useRender","toStyleSizeValue","propsFactory","YIconSort","YDataTableCell","useHeader","useSelection","useSorting","YIconCheckbox","pressYDataTableHeadProps","multiSort","Boolean","sortAscIcon","type","String","default","sortDescIcon","dualSortIcon","sticky","YDataTableHead","name","components","props","setup","_ref","slots","toggleSort","sortBy","isSorted","someSelected","allSelected","selectAll","showSelectAll","selectables","columns","headers","getFixedStyles","column","y","fixed","undefined","position","zIndex","left","fixedOffset","top","onClick","e","getSortDirection","found","value","find","by","key","order","YDataTableTh","_ref2","x","_createVNode","_mergeProps","align","lastFixed","sortable","width","minWidth","rowspan","colspan","headerSlotName","headerSlotProps","length","stopPropagation","text","_Fragment","head","map","row"],"sources":["../../../src/components/table/YDataTableHead.tsx"],"sourcesContent":["import { CSSProperties, defineComponent } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { toStyleSizeValue } from '../../util/ui';\nimport { propsFactory } from '../../util/vue-component';\nimport { YIconSort } from '../icons/YIconSort';\nimport { YDataTableCell } from './YDataTableCell';\nimport { useHeader } from './composibles/header';\nimport { useSelection } from './composibles/selection';\nimport { useSorting } from './composibles/sorting';\n\nimport { YIconCheckbox } from '../icons';\nimport { InternalDataTableHeader } from './types';\n\nexport const pressYDataTableHeadProps = propsFactory(\n {\n multiSort: Boolean,\n sortAscIcon: {\n type: String,\n default: '@sortAsc',\n },\n sortDescIcon: {\n type: String,\n default: '@sortDesc',\n },\n dualSortIcon: Boolean,\n sticky: Boolean,\n },\n 'YDataTableHead',\n);\n\nexport const YDataTableHead = defineComponent({\n name: 'YDataTableHead',\n components: {\n YDataTableCell,\n },\n props: {\n ...pressYDataTableHeadProps(),\n },\n setup(props, { slots }) {\n const { toggleSort, sortBy, isSorted } = useSorting();\n const { someSelected, allSelected, selectAll, showSelectAll, selectables } =\n useSelection();\n const { columns, headers } = useHeader();\n\n const getFixedStyles = (\n column: InternalDataTableHeader,\n y: number,\n ): CSSProperties | undefined => {\n if (!props.sticky && !column.fixed) return undefined;\n\n return {\n position: 'sticky',\n zIndex: column.fixed ? 4 : props.sticky ? 3 : undefined,\n left: column.fixed ? toStyleSizeValue(column.fixedOffset) : undefined,\n top: props.sticky\n ? `calc(var(--v-table-header-height) * ${y})`\n : undefined,\n };\n };\n\n function onClick(e: Event) {\n //\n }\n\n function getSortDirection(column: InternalDataTableHeader) {\n const found = sortBy.value.find((by) => by.key === column.key);\n if (!found) {\n return undefined;\n }\n if (found.order === 'asc') {\n return 'asc';\n }\n if (found.order === 'desc') {\n return 'desc';\n }\n }\n\n const YDataTableTh = ({\n column,\n x,\n y,\n }: {\n column: InternalDataTableHeader;\n x: number;\n y: number;\n }) => {\n return (\n <YDataTableCell\n type=\"head\"\n align={column.align}\n fixed={\n column.fixed ? (column.lastFixed ? 'trail' : 'lead') : undefined\n }\n class={[\n 'y-data-table-header',\n {\n 'y-data-table-header--sortable': column.sortable,\n 'y-data-table-header--sorted': isSorted(column),\n 'y-data-table-header--select': column.key === 'data-table-select',\n },\n ]}\n style={{\n width: toStyleSizeValue(column.width),\n minWidth: toStyleSizeValue(column.width),\n ...getFixedStyles(column, y),\n }}\n {...{ rowspan: column.rowspan, colspan: column.colspan }}\n onClick={onClick}\n >\n {{\n default: () => {\n const headerSlotName = `header.${column.key}` as const;\n const headerSlotProps = {\n column,\n selectAll,\n isSorted,\n toggleSort,\n sortBy: sortBy.value,\n someSelected: someSelected.value,\n allSelected: allSelected.value,\n selectables: selectables.value,\n getSortDirection,\n };\n\n if (slots[headerSlotName]) {\n return slots[headerSlotName]?.(headerSlotProps);\n }\n\n if (column.key === 'data-table-select') {\n return (\n slots['header.data-table-select']?.(headerSlotProps) ??\n (showSelectAll && (\n <YIconCheckbox\n checked={allSelected.value}\n indeterminate={!allSelected.value && someSelected.value}\n disabled={selectables.value.length < 1}\n {...{\n onClick: (e: MouseEvent) => {\n e.stopPropagation();\n selectAll(!allSelected.value);\n },\n }}\n ></YIconCheckbox>\n ))\n );\n }\n\n return (\n <div class=\"y-data-table-header__content\">\n <span class=\"y-data-table-header__text\">{column.text}</span>\n <span\n class={[\n 'y-data-table-header__sorting-icon',\n {\n 'y-data-table-header__sorting-icon--disabled':\n !column.sortable,\n },\n ]}\n onClick={\n column.sortable\n ? (e) => {\n e.stopPropagation();\n toggleSort(column);\n }\n : undefined\n }\n >\n <YIconSort\n disabled={!column.sortable}\n direction={getSortDirection(column)}\n ></YIconSort>\n </span>\n </div>\n );\n },\n }}\n </YDataTableCell>\n );\n };\n\n useRender(() => {\n return (\n <>\n {slots.head\n ? slots.head?.(props)\n : headers.value.map((row, y) => (\n <tr>\n {row.map((column, x) => (\n <YDataTableTh column={column} x={x} y={y} />\n ))}\n </tr>\n ))}\n </>\n );\n });\n },\n});\n\nexport type YDataTableHead = InstanceType<typeof YDataTableHead>;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"YDataTableHead.mjs","names":["defineComponent","useRender","toStyleSizeValue","propsFactory","YIconSort","YDataTableCell","useHeader","useSelection","useSorting","YIconCheckbox","pressYDataTableHeadProps","multiSort","Boolean","sortAscIcon","type","String","default","sortDescIcon","dualSortIcon","sticky","YDataTableHead","name","components","props","setup","_ref","slots","toggleSort","sortBy","isSorted","someSelected","allSelected","selectAll","showSelectAll","selectables","columns","headers","getFixedStyles","column","y","fixed","undefined","position","zIndex","left","fixedOffset","top","onClick","e","getSortDirection","found","value","find","by","key","order","YDataTableTh","_ref2","x","_createVNode","_mergeProps","align","lastFixed","sortable","width","minWidth","maxWidth","rowspan","colspan","headerSlotName","headerSlotProps","length","stopPropagation","text","_Fragment","head","map","row"],"sources":["../../../src/components/table/YDataTableHead.tsx"],"sourcesContent":["import { CSSProperties, defineComponent } from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { toStyleSizeValue } from '../../util/ui';\nimport { propsFactory } from '../../util/vue-component';\nimport { YIconSort } from '../icons/YIconSort';\nimport { YDataTableCell } from './YDataTableCell';\nimport { useHeader } from './composibles/header';\nimport { useSelection } from './composibles/selection';\nimport { useSorting } from './composibles/sorting';\n\nimport { YIconCheckbox } from '../icons';\nimport { InternalDataTableHeader } from './types';\n\nexport const pressYDataTableHeadProps = propsFactory(\n {\n multiSort: Boolean,\n sortAscIcon: {\n type: String,\n default: '@sortAsc',\n },\n sortDescIcon: {\n type: String,\n default: '@sortDesc',\n },\n dualSortIcon: Boolean,\n sticky: Boolean,\n },\n 'YDataTableHead',\n);\n\nexport const YDataTableHead = defineComponent({\n name: 'YDataTableHead',\n components: {\n YDataTableCell,\n },\n props: {\n ...pressYDataTableHeadProps(),\n },\n setup(props, { slots }) {\n const { toggleSort, sortBy, isSorted } = useSorting();\n const { someSelected, allSelected, selectAll, showSelectAll, selectables } =\n useSelection();\n const { columns, headers } = useHeader();\n\n const getFixedStyles = (\n column: InternalDataTableHeader,\n y: number,\n ): CSSProperties | undefined => {\n if (!props.sticky && !column.fixed) return undefined;\n\n return {\n position: 'sticky',\n zIndex: column.fixed ? 4 : props.sticky ? 3 : undefined,\n left: column.fixed ? toStyleSizeValue(column.fixedOffset) : undefined,\n top: props.sticky\n ? `calc(var(--v-table-header-height) * ${y})`\n : undefined,\n };\n };\n\n function onClick(e: Event) {\n //\n }\n\n function getSortDirection(column: InternalDataTableHeader) {\n const found = sortBy.value.find((by) => by.key === column.key);\n if (!found) {\n return undefined;\n }\n if (found.order === 'asc') {\n return 'asc';\n }\n if (found.order === 'desc') {\n return 'desc';\n }\n }\n\n const YDataTableTh = ({\n column,\n x,\n y,\n }: {\n column: InternalDataTableHeader;\n x: number;\n y: number;\n }) => {\n return (\n <YDataTableCell\n type=\"head\"\n align={column.align}\n fixed={\n column.fixed ? (column.lastFixed ? 'trail' : 'lead') : undefined\n }\n class={[\n 'y-data-table-header',\n {\n 'y-data-table-header--sortable': column.sortable,\n 'y-data-table-header--sorted': isSorted(column),\n 'y-data-table-header--select': column.key === 'data-table-select',\n },\n ]}\n style={{\n width: toStyleSizeValue(column.width),\n minWidth: toStyleSizeValue(column.width),\n maxWidth: toStyleSizeValue(column.maxWidth),\n ...getFixedStyles(column, y),\n }}\n {...{ rowspan: column.rowspan, colspan: column.colspan }}\n onClick={onClick}\n >\n {{\n default: () => {\n const headerSlotName = `header.${column.key}` as const;\n const headerSlotProps = {\n column,\n selectAll,\n isSorted,\n toggleSort,\n sortBy: sortBy.value,\n someSelected: someSelected.value,\n allSelected: allSelected.value,\n selectables: selectables.value,\n getSortDirection,\n };\n\n if (slots[headerSlotName]) {\n return slots[headerSlotName]?.(headerSlotProps);\n }\n\n if (column.key === 'data-table-select') {\n return (\n slots['header.data-table-select']?.(headerSlotProps) ??\n (showSelectAll && (\n <YIconCheckbox\n checked={allSelected.value}\n indeterminate={!allSelected.value && someSelected.value}\n disabled={selectables.value.length < 1}\n {...{\n onClick: (e: MouseEvent) => {\n e.stopPropagation();\n selectAll(!allSelected.value);\n },\n }}\n ></YIconCheckbox>\n ))\n );\n }\n\n return (\n <div class=\"y-data-table-header__content\">\n <span class=\"y-data-table-header__text\">{column.text}</span>\n <span\n class={[\n 'y-data-table-header__sorting-icon',\n {\n 'y-data-table-header__sorting-icon--disabled':\n !column.sortable,\n },\n ]}\n onClick={\n column.sortable\n ? (e) => {\n e.stopPropagation();\n toggleSort(column);\n }\n : undefined\n }\n >\n <YIconSort\n disabled={!column.sortable}\n direction={getSortDirection(column)}\n ></YIconSort>\n </span>\n </div>\n );\n },\n }}\n </YDataTableCell>\n );\n };\n\n useRender(() => {\n return (\n <>\n {slots.head\n ? slots.head?.(props)\n : headers.value.map((row, y) => (\n <tr>\n {row.map((column, x) => (\n <YDataTableTh column={column} x={x} y={y} />\n ))}\n </tr>\n ))}\n </>\n );\n });\n },\n});\n\nexport type YDataTableHead = InstanceType<typeof YDataTableHead>;\n"],"mappings":"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"}
|
|
@@ -1,20 +1,21 @@
|
|
|
1
1
|
import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
|
|
2
|
-
import { defineComponent } from 'vue';
|
|
2
|
+
import { defineComponent, computed } from 'vue';
|
|
3
3
|
import { useRender } from "../../composables/component.mjs";
|
|
4
4
|
import { getPropertyFromItem } from "../../util/common.mjs";
|
|
5
5
|
import { propsFactory } from "../../util/vue-component.mjs";
|
|
6
|
+
import { YIconCheckbox } from "../icons/index.mjs";
|
|
6
7
|
import { YDataTableCell } from "./YDataTableCell.mjs";
|
|
7
8
|
import { useHeader } from "./composibles/header.mjs";
|
|
8
9
|
import { useSelection } from "./composibles/selection.mjs";
|
|
9
|
-
import { YIconCheckbox } from "../icons/index.mjs";
|
|
10
10
|
export const pressYDataTableRowProps = propsFactory({
|
|
11
11
|
index: Number,
|
|
12
|
-
item: Object,
|
|
13
12
|
onClick: Function
|
|
14
13
|
}, 'YDataTableRow');
|
|
15
14
|
export const YDataTableRow = defineComponent({
|
|
16
15
|
name: 'YDataTableRow',
|
|
17
16
|
props: {
|
|
17
|
+
item: Object,
|
|
18
|
+
cellProps: [Object, Function],
|
|
18
19
|
...pressYDataTableRowProps()
|
|
19
20
|
},
|
|
20
21
|
setup(props, _ref) {
|
|
@@ -33,43 +34,55 @@ export const YDataTableRow = defineComponent({
|
|
|
33
34
|
return _createVNode("tr", {
|
|
34
35
|
"class": ['y-data-table__row'],
|
|
35
36
|
"onClick": e => emit('click:row', e)
|
|
36
|
-
}, [props.item && columns.value.map((column, colIndex) =>
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
37
|
+
}, [props.item && columns.value.map((column, colIndex) => {
|
|
38
|
+
const item = props.item;
|
|
39
|
+
const slotProps = {
|
|
40
|
+
index: props.index,
|
|
41
|
+
item: props.item.raw,
|
|
42
|
+
internalItem: props.item,
|
|
43
|
+
columns: columns.value,
|
|
44
|
+
value: getPropertyFromItem(item.columns, column.key),
|
|
45
|
+
selected: computed(() => isSelected(item)).value,
|
|
46
|
+
toggleSelect
|
|
47
|
+
};
|
|
48
|
+
const cellProps = typeof props.cellProps === 'function' ? props.cellProps({
|
|
49
|
+
index: slotProps.index,
|
|
50
|
+
column,
|
|
51
|
+
internalItem: slotProps.internalItem,
|
|
52
|
+
item: slotProps.item,
|
|
53
|
+
value: slotProps.value,
|
|
54
|
+
selected: slotProps.selected
|
|
55
|
+
}) : props.cellProps;
|
|
56
|
+
return _createVNode(YDataTableCell, _mergeProps({
|
|
57
|
+
"align": column.align,
|
|
58
|
+
"fixed": column.fixed ? column.lastFixed ? 'trail' : 'lead' : undefined,
|
|
59
|
+
"fixedOffset": column.fixedOffset,
|
|
60
|
+
"width": column.width,
|
|
61
|
+
"maxWidth": column.maxWidth,
|
|
62
|
+
"class": ['y-data-table-data', {
|
|
63
|
+
'y-data-table-data--select': column.key === 'data-table-select'
|
|
64
|
+
}]
|
|
65
|
+
}, cellProps), {
|
|
66
|
+
default: () => {
|
|
67
|
+
const slotName = `item.${column.key}`;
|
|
68
|
+
if (slots[slotName]) {
|
|
69
|
+
return slots[slotName]?.(slotProps);
|
|
70
|
+
}
|
|
71
|
+
if (column.key === 'data-table-select') {
|
|
72
|
+
return slots['item.data-table-select']?.(slotProps) ?? _createVNode(YIconCheckbox, _mergeProps({
|
|
73
|
+
"checked": isSelected(item),
|
|
74
|
+
"disabled": !item.selectable
|
|
75
|
+
}, {
|
|
76
|
+
onClick: e => {
|
|
77
|
+
e.stopPropagation();
|
|
78
|
+
toggleSelect(item);
|
|
79
|
+
}
|
|
80
|
+
}), null);
|
|
81
|
+
}
|
|
82
|
+
return slotProps.value;
|
|
69
83
|
}
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
}))]);
|
|
84
|
+
});
|
|
85
|
+
})]);
|
|
73
86
|
});
|
|
74
87
|
}
|
|
75
88
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YDataTableRow.mjs","names":["defineComponent","useRender","getPropertyFromItem","propsFactory","YDataTableCell","useHeader","useSelection","
|
|
1
|
+
{"version":3,"file":"YDataTableRow.mjs","names":["defineComponent","computed","useRender","getPropertyFromItem","propsFactory","YIconCheckbox","YDataTableCell","useHeader","useSelection","pressYDataTableRowProps","index","Number","onClick","Function","YDataTableRow","name","props","item","Object","cellProps","setup","_ref","emit","slots","isSelected","toggleSelect","columns","_createVNode","e","value","map","column","colIndex","slotProps","raw","internalItem","key","selected","_mergeProps","align","fixed","lastFixed","undefined","fixedOffset","width","maxWidth","default","slotName","selectable","stopPropagation"],"sources":["../../../src/components/table/YDataTableRow.tsx"],"sourcesContent":["import {PropType, defineComponent, computed} from 'vue';\n\nimport { useRender } from '../../composables/component';\nimport { getPropertyFromItem } from '../../util/common';\nimport { propsFactory } from '../../util/vue-component';\nimport { YIconCheckbox } from '../icons';\nimport { YDataTableCell } from './YDataTableCell';\nimport { useHeader } from './composibles/header';\nimport { useSelection } from './composibles/selection';\nimport { CellProps, DataTableItem } from './types';\n\nexport const pressYDataTableRowProps = propsFactory(\n {\n index: Number as PropType<number>,\n onClick: Function as PropType<(e: MouseEvent) => void>,\n },\n 'YDataTableRow',\n);\n\nexport const YDataTableRow = defineComponent({\n name: 'YDataTableRow',\n props: {\n item: Object as PropType<DataTableItem>,\n cellProps: [Object, Function] as PropType<CellProps>,\n ...pressYDataTableRowProps(),\n },\n setup(props, { emit, slots }) {\n const { isSelected, toggleSelect } = useSelection();\n const { columns } = useHeader();\n\n useRender(() => {\n return (\n <tr class={['y-data-table__row']} onClick={(e) => emit('click:row', e)}>\n {props.item &&\n columns.value.map((column, colIndex) => {\n const item = props.item!;\n const slotProps = {\n index: props.index!,\n item: props.item!.raw,\n internalItem: props.item!,\n columns: columns.value,\n value: getPropertyFromItem(item.columns, column.key),\n selected: computed(() => isSelected(item)).value,\n toggleSelect,\n };\n\n const cellProps =\n typeof props.cellProps === 'function'\n ? props.cellProps({\n index: slotProps.index,\n column,\n internalItem: slotProps.internalItem,\n item: slotProps.item,\n value: slotProps.value,\n selected: slotProps.selected,\n })\n : props.cellProps;\n\n return (\n <YDataTableCell\n align={column.align}\n fixed={\n column.fixed\n ? column.lastFixed\n ? 'trail'\n : 'lead'\n : undefined\n }\n fixedOffset={column.fixedOffset}\n width={column.width}\n maxWidth={column.maxWidth}\n class={[\n 'y-data-table-data',\n {\n 'y-data-table-data--select':\n column.key === 'data-table-select',\n },\n ]}\n {...cellProps}\n >\n {{\n default: () => {\n const slotName = `item.${column.key}`;\n\n if (slots[slotName]) {\n return slots[slotName]?.(slotProps);\n }\n\n if (column.key === 'data-table-select') {\n return (\n slots['item.data-table-select']?.(slotProps) ?? (\n <YIconCheckbox\n checked={isSelected(item)}\n disabled={!item.selectable}\n {...{\n onClick: (e: MouseEvent) => {\n e.stopPropagation();\n toggleSelect(item);\n },\n }}\n ></YIconCheckbox>\n )\n );\n }\n\n return slotProps.value;\n },\n }}\n </YDataTableCell>\n );\n })}\n </tr>\n );\n });\n },\n});\n\nexport type YDataTableRow = InstanceType<typeof YDataTableRow>;\n"],"mappings":";AAAA,SAAkBA,eAAe,EAAEC,QAAQ,QAAO,KAAK;AAAC,SAE/CC,SAAS;AAAA,SACTC,mBAAmB;AAAA,SACnBC,YAAY;AAAA,SACZC,aAAa;AAAA,SACbC,cAAc;AAAA,SACdC,SAAS;AAAA,SACTC,YAAY;AAGrB,OAAO,MAAMC,uBAAuB,GAAGL,YAAY,CACjD;EACEM,KAAK,EAAEC,MAA0B;EACjCC,OAAO,EAAEC;AACX,CAAC,EACD,eACF,CAAC;AAED,OAAO,MAAMC,aAAa,GAAGd,eAAe,CAAC;EAC3Ce,IAAI,EAAE,eAAe;EACrBC,KAAK,EAAE;IACLC,IAAI,EAAEC,MAAiC;IACvCC,SAAS,EAAE,CAACD,MAAM,EAAEL,QAAQ,CAAwB;IACpD,GAAGJ,uBAAuB,CAAC;EAC7B,CAAC;EACDW,KAAKA,CAACJ,KAAK,EAAAK,IAAA,EAAmB;IAAA,IAAjB;MAAEC,IAAI;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAC1B,MAAM;MAAEG,UAAU;MAAEC;IAAa,CAAC,GAAGjB,YAAY,CAAC,CAAC;IACnD,MAAM;MAAEkB;IAAQ,CAAC,GAAGnB,SAAS,CAAC,CAAC;IAE/BL,SAAS,CAAC,MAAM;MACd,OAAAyB,YAAA;QAAA,SACa,CAAC,mBAAmB,CAAC;QAAA,WAAYC,CAAC,IAAKN,IAAI,CAAC,WAAW,EAAEM,CAAC;MAAC,IACnEZ,KAAK,CAACC,IAAI,IACTS,OAAO,CAACG,KAAK,CAACC,GAAG,CAAC,CAACC,MAAM,EAAEC,QAAQ,KAAK;QACtC,MAAMf,IAAI,GAAGD,KAAK,CAACC,IAAK;QACxB,MAAMgB,SAAS,GAAG;UAChBvB,KAAK,EAAEM,KAAK,CAACN,KAAM;UACnBO,IAAI,EAAED,KAAK,CAACC,IAAI,CAAEiB,GAAG;UACrBC,YAAY,EAAEnB,KAAK,CAACC,IAAK;UACzBS,OAAO,EAAEA,OAAO,CAACG,KAAK;UACtBA,KAAK,EAAE1B,mBAAmB,CAACc,IAAI,CAACS,OAAO,EAAEK,MAAM,CAACK,GAAG,CAAC;UACpDC,QAAQ,EAAEpC,QAAQ,CAAC,MAAMuB,UAAU,CAACP,IAAI,CAAC,CAAC,CAACY,KAAK;UAChDJ;QACF,CAAC;QAED,MAAMN,SAAS,GACb,OAAOH,KAAK,CAACG,SAAS,KAAK,UAAU,GACjCH,KAAK,CAACG,SAAS,CAAC;UACdT,KAAK,EAAEuB,SAAS,CAACvB,KAAK;UACtBqB,MAAM;UACNI,YAAY,EAAEF,SAAS,CAACE,YAAY;UACpClB,IAAI,EAAEgB,SAAS,CAAChB,IAAI;UACpBY,KAAK,EAAEI,SAAS,CAACJ,KAAK;UACtBQ,QAAQ,EAAEJ,SAAS,CAACI;QACtB,CAAC,CAAC,GACFrB,KAAK,CAACG,SAAS;QAErB,OAAAQ,YAAA,CAAArB,cAAA,EAAAgC,WAAA;UAAA,SAEWP,MAAM,CAACQ,KAAK;UAAA,SAEjBR,MAAM,CAACS,KAAK,GACRT,MAAM,CAACU,SAAS,GACd,OAAO,GACP,MAAM,GACRC,SAAS;UAAA,eAEFX,MAAM,CAACY,WAAW;UAAA,SACxBZ,MAAM,CAACa,KAAK;UAAA,YACTb,MAAM,CAACc,QAAQ;UAAA,SAClB,CACL,mBAAmB,EACnB;YACE,2BAA2B,EACzBd,MAAM,CAACK,GAAG,KAAK;UACnB,CAAC;QACF,GACGjB,SAAS;UAGX2B,OAAO,EAAEA,CAAA,KAAM;YACb,MAAMC,QAAQ,GAAI,QAAOhB,MAAM,CAACK,GAAI,EAAC;YAErC,IAAIb,KAAK,CAACwB,QAAQ,CAAC,EAAE;cACnB,OAAOxB,KAAK,CAACwB,QAAQ,CAAC,GAAGd,SAAS,CAAC;YACrC;YAEA,IAAIF,MAAM,CAACK,GAAG,KAAK,mBAAmB,EAAE;cACtC,OACEb,KAAK,CAAC,wBAAwB,CAAC,GAAGU,SAAS,CAAC,IAAAN,YAAA,CAAAtB,aAAA,EAAAiC,WAAA;gBAAA,WAE/Bd,UAAU,CAACP,IAAI,CAAC;gBAAA,YACf,CAACA,IAAI,CAAC+B;cAAU;gBAExBpC,OAAO,EAAGgB,CAAa,IAAK;kBAC1BA,CAAC,CAACqB,eAAe,CAAC,CAAC;kBACnBxB,YAAY,CAACR,IAAI,CAAC;gBACpB;cAAC,SAGN;YAEL;YAEA,OAAOgB,SAAS,CAACJ,KAAK;UACxB;QAAC;MAIT,CAAC,CAAC;IAGV,CAAC,CAAC;EACJ;AACF,CAAC,CAAC"}
|
|
@@ -33,9 +33,13 @@ $table-cell-border-bottom-color: rgba(var(--y-theme-outline-rgb), var(--y-theme-
|
|
|
33
33
|
top: 0;
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
-
&--fixed-head.y-table &__container &__wrapper > table > thead
|
|
37
|
-
z-index: 1;
|
|
36
|
+
&--fixed-head.y-table &__container &__wrapper > table > thead {
|
|
38
37
|
background: $table-head-background;
|
|
38
|
+
|
|
39
|
+
> tr > th {
|
|
40
|
+
z-index: 1;
|
|
41
|
+
background: $table-head-background;
|
|
42
|
+
}
|
|
39
43
|
}
|
|
40
44
|
|
|
41
45
|
.y-table__wrapper {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/table/types/index.ts"],"sourcesContent":["import { ComputedRef, Ref, UnwrapRef } from
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/table/types/index.ts"],"sourcesContent":["import { ComputedRef, Ref, UnwrapRef } from 'vue';\n\nimport { SelectableItem, provideSelection } from '../composibles/selection';\n\nexport type DataTableCompareFn<T = any> = (a: T, b: T) => number;\n\nexport type DataTableHeader = {\n key: string;\n text: string;\n value?: any;\n\n colspan?: number;\n rowspan?: number;\n fixed?: boolean;\n\n classes?: string | string[];\n align?: 'start' | 'end' | 'center';\n width?: number | string;\n minWidth?: string;\n maxWidth?: string;\n sortable?: boolean;\n sort?: DataTableCompareFn;\n mustSort?: boolean;\n};\n\nexport type InternalDataTableHeader = DataTableHeader & {\n sortable: boolean;\n fixedOffset?: number;\n lastFixed?: boolean;\n};\n\nexport interface DataTableItem<T = any> extends SelectableItem {\n index: number;\n columns: Record<string, any>;\n raw: T;\n}\n\nexport type SortOption = { key: string; order?: boolean | 'asc' | 'desc' };\n\nexport type DataTableProvideSortingData = {\n sortBy: Ref<readonly SortOption[]>;\n toggleSort: (column: InternalDataTableHeader) => void;\n isSorted: (column: InternalDataTableHeader) => boolean;\n};\n\nexport interface DataTableProvidePaginationData {\n page: Ref<number>;\n pageSize: Ref<number>;\n startIndex: ComputedRef<number>;\n endIndex: ComputedRef<number>;\n pageLength: ComputedRef<number>;\n total: Ref<number>;\n nextPage: () => void;\n prevPage: () => void;\n setPage: (value: number) => void;\n setPageSize: (value: number) => void;\n}\n\nexport interface DataTableProvideSelectionData {\n toggleSelect: (item: SelectableItem) => void;\n select: (items: SelectableItem[], value: boolean) => void;\n selectAll: (value: boolean) => void;\n isSelected: (items: SelectableItem | SelectableItem[]) => any;\n isSomeSelected: (items: SelectableItem | SelectableItem[]) => any;\n someSelected: ComputedRef<boolean>;\n allSelected: ComputedRef<any>;\n showSelectAll: boolean;\n selectables: ComputedRef<SelectableItem[]>;\n}\n\nexport type YDataTableSlotProps = {\n // pagination\n page: number;\n pageSize: number;\n pageLength: number;\n setPageSize: DataTableProvidePaginationData['setPageSize'];\n // sorting\n sortBy: UnwrapRef<DataTableProvideSortingData['sortBy']>;\n toggleSort: DataTableProvideSortingData['toggleSort'];\n // selection\n someSelected: boolean;\n allSelected: boolean;\n isSelected: DataTableProvideSelectionData['isSelected'];\n select: DataTableProvideSelectionData['select'];\n selectAll: DataTableProvideSelectionData['selectAll'];\n toggleSelect: DataTableProvideSelectionData['toggleSelect'];\n //\n items: readonly DataTableItem[];\n columns: InternalDataTableHeader[];\n headers: InternalDataTableHeader[][];\n};\n\ntype ItemSlotBase<T> = {\n index: number;\n item: T;\n internalItem: DataTableItem<T>;\n selected: boolean;\n isSelected: ReturnType<typeof provideSelection>['isSelected'];\n toggleSelect: ReturnType<typeof provideSelection>['toggleSelect'];\n};\n\nexport type ItemKeySlot<T> = ItemSlotBase<T> & {\n value: any;\n column: InternalDataTableHeader;\n};\n\nexport type CellProps<T = any> =\n | Record<string, any>\n | ((\n data: Pick<\n ItemKeySlot<T>,\n 'index' | 'item' | 'internalItem' | 'value' | 'column' | 'selected'\n >,\n ) => Record<string, any>);\n"],"mappings":""}
|
package/lib/util/ui.mjs
CHANGED
|
@@ -46,11 +46,13 @@ export function pixelCeil(val) {
|
|
|
46
46
|
}
|
|
47
47
|
export function toStyleSizeValue(size) {
|
|
48
48
|
let unit = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'px';
|
|
49
|
-
if (size
|
|
49
|
+
if (size == null || size === '') {
|
|
50
50
|
return undefined;
|
|
51
51
|
}
|
|
52
52
|
let value = Number(size);
|
|
53
|
-
if (
|
|
53
|
+
if (typeof size === 'string' && isNaN(value)) {
|
|
54
|
+
return size;
|
|
55
|
+
} else if (!isFinite(value)) {
|
|
54
56
|
return undefined;
|
|
55
57
|
}
|
|
56
58
|
return `${value}${unit}`;
|
package/lib/util/ui.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ui.mjs","names":["getBoundingPureRect","el","rect","getBoundingClientRect","style","getComputedStyle","tx","transform","sx","sy","dx","dy","startsWith","ta","slice","split","to","transformOrigin","x","parseFloat","y","indexOf","w","width","offsetWidth","h","height","offsetHeight","top","right","bottom","left","pixelRound","val","Math","round","devicePixelRatio","pixelCeil","ceil","toStyleSizeValue","size","unit","arguments","length","undefined","value","Number","isNaN","isFinite"],"sources":["../../src/util/ui.ts"],"sourcesContent":["export function getBoundingPureRect(el: HTMLElement) {\r\n const rect = el.getBoundingClientRect();\r\n const style = getComputedStyle(el);\r\n const tx = style.transform;\r\n\r\n if (tx) {\r\n let sx, sy, dx, dy;\r\n if (tx.startsWith('matrix3d(')) {\r\n const ta = tx.slice(9, -1).split(/, /);\r\n sx = +ta[0];\r\n sy = +ta[5];\r\n dx = +ta[12];\r\n dy = +ta[13];\r\n } else if (tx.startsWith('matrix(')) {\r\n const ta = tx.slice(7, -1).split(/, /);\r\n sx = +ta[0];\r\n sy = +ta[3];\r\n dx = +ta[4];\r\n dy = +ta[5];\r\n } else {\r\n return rect;\r\n }\r\n\r\n const to = style.transformOrigin;\r\n const x = rect.x - dx - (1 - sx) * parseFloat(to);\r\n const y =\r\n rect.y - dy - (1 - sy) * parseFloat(to.slice(to.indexOf(' ') + 1));\r\n const w = sx ? rect.width / sx : el.offsetWidth;\r\n const h = sy ? rect.height / sy : el.offsetHeight;\r\n return {\r\n x: x,\r\n y: y,\r\n width: w,\r\n height: h,\r\n top: y,\r\n right: x + w,\r\n bottom: y + h,\r\n left: x,\r\n } as DOMRect;\r\n } else {\r\n return rect;\r\n }\r\n}\r\n\r\nexport function pixelRound (val: number) {\r\n return Math.round(val * devicePixelRatio) / devicePixelRatio\r\n}\r\n\r\nexport function pixelCeil (val: number) {\r\n return Math.ceil(val * devicePixelRatio) / devicePixelRatio\r\n}\r\n\r\nexport function toStyleSizeValue(\r\n size: number | string | null | undefined,\r\n unit = 'px',\r\n): string | undefined {\r\n if (size
|
|
1
|
+
{"version":3,"file":"ui.mjs","names":["getBoundingPureRect","el","rect","getBoundingClientRect","style","getComputedStyle","tx","transform","sx","sy","dx","dy","startsWith","ta","slice","split","to","transformOrigin","x","parseFloat","y","indexOf","w","width","offsetWidth","h","height","offsetHeight","top","right","bottom","left","pixelRound","val","Math","round","devicePixelRatio","pixelCeil","ceil","toStyleSizeValue","size","unit","arguments","length","undefined","value","Number","isNaN","isFinite"],"sources":["../../src/util/ui.ts"],"sourcesContent":["export function getBoundingPureRect(el: HTMLElement) {\r\n const rect = el.getBoundingClientRect();\r\n const style = getComputedStyle(el);\r\n const tx = style.transform;\r\n\r\n if (tx) {\r\n let sx, sy, dx, dy;\r\n if (tx.startsWith('matrix3d(')) {\r\n const ta = tx.slice(9, -1).split(/, /);\r\n sx = +ta[0];\r\n sy = +ta[5];\r\n dx = +ta[12];\r\n dy = +ta[13];\r\n } else if (tx.startsWith('matrix(')) {\r\n const ta = tx.slice(7, -1).split(/, /);\r\n sx = +ta[0];\r\n sy = +ta[3];\r\n dx = +ta[4];\r\n dy = +ta[5];\r\n } else {\r\n return rect;\r\n }\r\n\r\n const to = style.transformOrigin;\r\n const x = rect.x - dx - (1 - sx) * parseFloat(to);\r\n const y =\r\n rect.y - dy - (1 - sy) * parseFloat(to.slice(to.indexOf(' ') + 1));\r\n const w = sx ? rect.width / sx : el.offsetWidth;\r\n const h = sy ? rect.height / sy : el.offsetHeight;\r\n return {\r\n x: x,\r\n y: y,\r\n width: w,\r\n height: h,\r\n top: y,\r\n right: x + w,\r\n bottom: y + h,\r\n left: x,\r\n } as DOMRect;\r\n } else {\r\n return rect;\r\n }\r\n}\r\n\r\nexport function pixelRound (val: number) {\r\n return Math.round(val * devicePixelRatio) / devicePixelRatio\r\n}\r\n\r\nexport function pixelCeil (val: number) {\r\n return Math.ceil(val * devicePixelRatio) / devicePixelRatio\r\n}\r\n\r\nexport function toStyleSizeValue(\r\n size: number | string | null | undefined,\r\n unit = 'px',\r\n): string | undefined {\r\n if (size == null || size === '') {\r\n return undefined;\r\n }\r\n let value = Number(size);\r\n if (typeof(size) === 'string' && isNaN(value)) {\r\n return size;\r\n } else if (!isFinite(value)) {\r\n return undefined;\r\n }\r\n\r\n return `${value}${unit}`;\r\n}\r\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -13,6 +13,9 @@ export declare const YDataTableCell: import("vue").DefineComponent<{
|
|
|
13
13
|
width: {
|
|
14
14
|
type: PropType<string | number>;
|
|
15
15
|
};
|
|
16
|
+
maxWidth: {
|
|
17
|
+
type: PropType<string | number>;
|
|
18
|
+
};
|
|
16
19
|
height: {
|
|
17
20
|
type: PropType<string | number>;
|
|
18
21
|
};
|
|
@@ -34,6 +37,9 @@ export declare const YDataTableCell: import("vue").DefineComponent<{
|
|
|
34
37
|
width: {
|
|
35
38
|
type: PropType<string | number>;
|
|
36
39
|
};
|
|
40
|
+
maxWidth: {
|
|
41
|
+
type: PropType<string | number>;
|
|
42
|
+
};
|
|
37
43
|
height: {
|
|
38
44
|
type: PropType<string | number>;
|
|
39
45
|
};
|
|
@@ -1,18 +1,13 @@
|
|
|
1
1
|
import { PropType } from 'vue';
|
|
2
|
-
import { DataTableItem } from './types';
|
|
2
|
+
import { CellProps, DataTableItem } from './types';
|
|
3
3
|
export declare const pressYDataTableRowProps: <Defaults extends {
|
|
4
4
|
index?: unknown;
|
|
5
|
-
item?: unknown;
|
|
6
5
|
onClick?: unknown;
|
|
7
6
|
} = {}>(defaults?: Defaults | undefined) => {
|
|
8
7
|
index: unknown extends Defaults["index"] ? PropType<number> : {
|
|
9
8
|
type: PropType<unknown extends Defaults["index"] ? number : number | Defaults["index"]>;
|
|
10
9
|
default: unknown extends Defaults["index"] ? number : number | Defaults["index"];
|
|
11
10
|
};
|
|
12
|
-
item: unknown extends Defaults["item"] ? PropType<DataTableItem<any>> : {
|
|
13
|
-
type: PropType<unknown extends Defaults["item"] ? DataTableItem<any> : DataTableItem<any> | Defaults["item"]>;
|
|
14
|
-
default: unknown extends Defaults["item"] ? DataTableItem<any> : DataTableItem<any> | Defaults["item"];
|
|
15
|
-
};
|
|
16
11
|
onClick: unknown extends Defaults["onClick"] ? PropType<(e: MouseEvent) => void> : {
|
|
17
12
|
type: PropType<unknown extends Defaults["onClick"] ? (e: MouseEvent) => void : ((e: MouseEvent) => void) | Defaults["onClick"]>;
|
|
18
13
|
default: unknown extends Defaults["onClick"] ? (e: MouseEvent) => void : ((e: MouseEvent) => void) | Defaults["onClick"];
|
|
@@ -20,11 +15,13 @@ export declare const pressYDataTableRowProps: <Defaults extends {
|
|
|
20
15
|
};
|
|
21
16
|
export declare const YDataTableRow: import("vue").DefineComponent<{
|
|
22
17
|
index: PropType<number>;
|
|
23
|
-
item: PropType<DataTableItem<any>>;
|
|
24
18
|
onClick: PropType<(e: MouseEvent) => void>;
|
|
19
|
+
item: PropType<DataTableItem<any>>;
|
|
20
|
+
cellProps: PropType<CellProps>;
|
|
25
21
|
}, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
26
22
|
index: PropType<number>;
|
|
27
|
-
item: PropType<DataTableItem<any>>;
|
|
28
23
|
onClick: PropType<(e: MouseEvent) => void>;
|
|
24
|
+
item: PropType<DataTableItem<any>>;
|
|
25
|
+
cellProps: PropType<CellProps>;
|
|
29
26
|
}>>, {}, {}>;
|
|
30
27
|
export type YDataTableRow = InstanceType<typeof YDataTableRow>;
|
|
@@ -31,6 +31,7 @@ export declare function createHeader(props: HeaderProps, options?: {
|
|
|
31
31
|
colspan?: number | undefined;
|
|
32
32
|
rowspan?: number | undefined;
|
|
33
33
|
fixed?: boolean | undefined;
|
|
34
|
+
classes?: string | string[] | undefined;
|
|
34
35
|
align?: "end" | "start" | "center" | undefined;
|
|
35
36
|
width?: string | number | undefined;
|
|
36
37
|
minWidth?: string | undefined;
|
|
@@ -48,6 +49,7 @@ export declare function createHeader(props: HeaderProps, options?: {
|
|
|
48
49
|
colspan?: number | undefined;
|
|
49
50
|
rowspan?: number | undefined;
|
|
50
51
|
fixed?: boolean | undefined;
|
|
52
|
+
classes?: string | string[] | undefined;
|
|
51
53
|
align?: "end" | "start" | "center" | undefined;
|
|
52
54
|
width?: string | number | undefined;
|
|
53
55
|
minWidth?: string | undefined;
|