col.mjs 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import { defineComponent, inject, computed, openBlock, createBlock, resolveDynamicComponent, normalizeClass, unref, normalizeStyle, withCtx, renderSlot } from 'vue';
  2. import { colProps } from './col2.mjs';
  3. import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
  4. import { rowContextKey } from '../../row/src/constants.mjs';
  5. import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
  6. import { isNumber } from '../../../utils/types.mjs';
  7. import { isObject } from '@vue/shared';
  8. const __default__ = defineComponent({
  9. name: "ElCol"
  10. });
  11. const _sfc_main = /* @__PURE__ */ defineComponent({
  12. ...__default__,
  13. props: colProps,
  14. setup(__props) {
  15. const props = __props;
  16. const { gutter } = inject(rowContextKey, { gutter: computed(() => 0) });
  17. const ns = useNamespace("col");
  18. const style = computed(() => {
  19. const styles = {};
  20. if (gutter.value) {
  21. styles.paddingLeft = styles.paddingRight = `${gutter.value / 2}px`;
  22. }
  23. return styles;
  24. });
  25. const colKls = computed(() => {
  26. const classes = [];
  27. const pos = ["span", "offset", "pull", "push"];
  28. pos.forEach((prop) => {
  29. const size = props[prop];
  30. if (isNumber(size)) {
  31. if (prop === "span")
  32. classes.push(ns.b(`${props[prop]}`));
  33. else if (size > 0)
  34. classes.push(ns.b(`${prop}-${props[prop]}`));
  35. }
  36. });
  37. const sizes = ["xs", "sm", "md", "lg", "xl"];
  38. sizes.forEach((size) => {
  39. if (isNumber(props[size])) {
  40. classes.push(ns.b(`${size}-${props[size]}`));
  41. } else if (isObject(props[size])) {
  42. Object.entries(props[size]).forEach(([prop, sizeProp]) => {
  43. classes.push(prop !== "span" ? ns.b(`${size}-${prop}-${sizeProp}`) : ns.b(`${size}-${sizeProp}`));
  44. });
  45. }
  46. });
  47. if (gutter.value) {
  48. classes.push(ns.is("guttered"));
  49. }
  50. return [ns.b(), classes];
  51. });
  52. return (_ctx, _cache) => {
  53. return openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
  54. class: normalizeClass(unref(colKls)),
  55. style: normalizeStyle(unref(style))
  56. }, {
  57. default: withCtx(() => [
  58. renderSlot(_ctx.$slots, "default")
  59. ]),
  60. _: 3
  61. }, 8, ["class", "style"]);
  62. };
  63. }
  64. });
  65. var Col = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "col.vue"]]);
  66. export { Col as default };
  67. //# sourceMappingURL=col.mjs.map