element-plus/es/components/space/src/space.mjs.map

A Component Library for Vue 3

{"version":3,"file":"space.mjs","sources":["../../../../../../packages/components/space/src/space.ts"],"sourcesContent":["import {\n  defineComponent,\n  renderSlot,\n  createVNode,\n  createTextVNode,\n  isVNode,\n} from 'vue'\nimport { isString } from '@vue/shared'\nimport {\n  PatchFlags,\n  isFragment,\n  isValidElementNode,\n} from '@element-plus/utils/vnode'\nimport { isArray, isNumber } from '@element-plus/utils/util'\nimport {\n  buildProps,\n  componentSize,\n  definePropType,\n} from '@element-plus/utils/props'\nimport Item from './item.vue'\nimport { useSpace } from './use-space'\n\nimport type { VNode, StyleValue, ExtractPropTypes, VNodeChild } from 'vue'\nimport type { AlignItemsProperty } from 'csstype'\n\nexport const spaceProps = buildProps({\n  direction: {\n    type: String,\n    values: ['horizontal', 'vertical'],\n    default: 'horizontal',\n  },\n\n  class: {\n    type: definePropType<string | string[] | Record<string, boolean>>([\n      String,\n      Object,\n      Array,\n    ]),\n    default: '',\n  },\n\n  style: {\n    type: definePropType<StyleValue>([String, Array, Object]),\n    default: '',\n  },\n\n  alignment: {\n    type: definePropType<AlignItemsProperty>(String),\n    default: 'center',\n  },\n\n  prefixCls: {\n    type: String,\n  },\n\n  spacer: {\n    type: definePropType<VNodeChild>([Object, String, Number, Array]),\n    default: null,\n    validator: (val: unknown) => isVNode(val) || isNumber(val) || isString(val),\n  },\n\n  wrap: {\n    type: Boolean,\n    default: false,\n  },\n\n  fill: {\n    type: Boolean,\n    default: false,\n  },\n\n  fillRatio: {\n    type: Number,\n    default: 100,\n  },\n\n  size: {\n    type: [String, Array, Number],\n    values: componentSize,\n    validator: (val: unknown): val is [number, number] | number => {\n      return (\n        isNumber(val) ||\n        (isArray(val) && val.length === 2 && val.every((i) => isNumber(i)))\n      )\n    },\n  },\n} as const)\nexport type SpaceProps = ExtractPropTypes<typeof spaceProps>\n\nexport default defineComponent({\n  name: 'ElSpace',\n\n  props: spaceProps,\n\n  setup(props, { slots }) {\n    const { classes, containerStyle, itemStyle } = useSpace(props)\n\n    return () => {\n      const { spacer, prefixCls, direction } = props\n\n      const children = renderSlot(slots, 'default', { key: 0 }, () => [])\n      // retrieve the children out via a simple for loop\n      // the edge case here is that when users uses directives like <v-for>, <v-if>\n      // we need to go one layer deeper\n\n      if ((children.children ?? []).length === 0) return null\n\n      // loop the children, if current children is rendered via `renderList` or `<v-for>`\n      if (isArray(children.children)) {\n        let extractedChildren: VNode[] = []\n        children.children.forEach((child, loopKey) => {\n          if (isFragment(child)) {\n            if (isArray(child.children)) {\n              child.children.forEach((nested, key) => {\n                extractedChildren.push(\n                  createVNode(\n                    Item,\n                    {\n                      style: itemStyle.value,\n                      prefixCls,\n                      key: `nested-${key}`,\n                    },\n                    {\n                      default: () => [nested],\n                    },\n                    PatchFlags.PROPS | PatchFlags.STYLE,\n                    ['style', 'prefixCls']\n                  )\n                )\n              })\n            }\n            // if the current child is valid vnode, then append this current vnode\n            // to item as child node.\n          } else if (isValidElementNode(child)) {\n            extractedChildren.push(\n              createVNode(\n                Item,\n                {\n                  style: itemStyle.value,\n                  prefixCls,\n                  key: `LoopKey${loopKey}`,\n                },\n                {\n                  default: () => [child],\n                },\n                PatchFlags.PROPS | PatchFlags.STYLE,\n                ['style', 'prefixCls']\n              )\n            )\n          }\n        })\n\n        if (spacer) {\n          // track the current rendering index, when encounters the last element\n          // then no need to add a spacer after it.\n          const len = extractedChildren.length - 1\n          extractedChildren = extractedChildren.reduce<VNode[]>(\n            (acc, child, idx) => {\n              const children = [...acc, child]\n              if (idx !== len) {\n                children.push(\n                  createVNode(\n                    'span',\n                    // adding width 100% for vertical alignment,\n                    // when the spacer inherit the width from the\n                    // parent, this span's width was not set, so space\n                    // might disappear\n                    {\n                      style: [\n                        itemStyle.value,\n                        direction === 'vertical' ? 'width: 100%' : null,\n                      ],\n                      key: idx,\n                    },\n                    [\n                      // if spacer is already a valid vnode, then append it to the current\n                      // span element.\n                      // otherwise, treat it as string.\n                      isVNode(spacer)\n                        ? spacer\n                        : createTextVNode(spacer as string, PatchFlags.TEXT),\n                    ],\n                    PatchFlags.STYLE\n                  )\n                )\n              }\n              return children\n            },\n            []\n          )\n        }\n\n        // spacer container.\n        return createVNode(\n          'div',\n          {\n            class: classes.value,\n            style: containerStyle.value,\n          },\n          extractedChildren,\n          PatchFlags.STYLE | PatchFlags.CLASS\n        )\n      }\n\n      return children.children\n    }\n  },\n})\n"],"names":["Item"],"mappings":";;;;;;;;;MAyBa,aAAa,WAAW;AAAA,EACnC,WAAW;AAAA,IACT,MAAM;AAAA,IACN,QAAQ,CAAC,cAAc;AAAA,IACvB,SAAS;AAAA;AAAA,EAGX,OAAO;AAAA,IACL,MAAM,eAA4D;AAAA,MAChE;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF,SAAS;AAAA;AAAA,EAGX,OAAO;AAAA,IACL,MAAM,eAA2B,CAAC,QAAQ,OAAO;AAAA,IACjD,SAAS;AAAA;AAAA,EAGX,WAAW;AAAA,IACT,MAAM,eAAmC;AAAA,IACzC,SAAS;AAAA;AAAA,EAGX,WAAW;AAAA,IACT,MAAM;AAAA;AAAA,EAGR,QAAQ;AAAA,IACN,MAAM,eAA2B,CAAC,QAAQ,QAAQ,QAAQ;AAAA,IAC1D,SAAS;AAAA,IACT,WAAW,CAAC,QAAiB,QAAQ,QAAQ,SAAS,QAAQ,SAAS;AAAA;AAAA,EAGzE,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAGX,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAGX,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAGX,MAAM;AAAA,IACJ,MAAM,CAAC,QAAQ,OAAO;AAAA,IACtB,QAAQ;AAAA,IACR,WAAW,CAAC,QAAmD;AAC7D,aACE,SAAS,QACR,QAAQ,QAAQ,IAAI,WAAW,KAAK,IAAI,MAAM,CAAC,MAAM,SAAS;AAAA;AAAA;AAAA;AAOvE,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,SAAS;AACtB,UAAM,EAAE,SAAS,gBAAgB,cAAc,SAAS;AAExD,WAAO,MAAM;AAjGjB;AAkGM,YAAM,EAAE,QAAQ,WAAW,cAAc;AAEzC,YAAM,WAAW,WAAW,OAAO,WAAW,EAAE,KAAK,KAAK,MAAM;AAKhE,UAAK,gBAAS,aAAT,YAAqB,IAAI,WAAW;AAAG,eAAO;AAGnD,UAAI,QAAQ,SAAS,WAAW;AAC9B,YAAI,oBAA6B;AACjC,iBAAS,SAAS,QAAQ,CAAC,OAAO,YAAY;AAC5C,cAAI,WAAW,QAAQ;AACrB,gBAAI,QAAQ,MAAM,WAAW;AAC3B,oBAAM,SAAS,QAAQ,CAAC,QAAQ,QAAQ;AACtC,kCAAkB,KAChB,YACEA,QACA;AAAA,kBACE,OAAO,UAAU;AAAA,kBACjB;AAAA,kBACA,KAAK,UAAU;AAAA,mBAEjB;AAAA,kBACE,SAAS,MAAM,CAAC;AAAA,mBAElB,WAAW,QAAQ,WAAW,OAC9B,CAAC,SAAS;AAAA;AAAA;AAAA,qBAOT,mBAAmB,QAAQ;AACpC,8BAAkB,KAChB,YACEA,QACA;AAAA,cACE,OAAO,UAAU;AAAA,cACjB;AAAA,cACA,KAAK,UAAU;AAAA,eAEjB;AAAA,cACE,SAAS,MAAM,CAAC;AAAA,eAElB,WAAW,QAAQ,WAAW,OAC9B,CAAC,SAAS;AAAA;AAAA;AAMlB,YAAI,QAAQ;AAGV,gBAAM,MAAM,kBAAkB,SAAS;AACvC,8BAAoB,kBAAkB,OACpC,CAAC,KAAK,OAAO,QAAQ;AACnB,kBAAM,YAAW,CAAC,GAAG,KAAK;AAC1B,gBAAI,QAAQ,KAAK;AACf,wBAAS,KACP,YACE,QAKA;AAAA,gBACE,OAAO;AAAA,kBACL,UAAU;AAAA,kBACV,cAAc,aAAa,gBAAgB;AAAA;AAAA,gBAE7C,KAAK;AAAA,iBAEP;AAAA,gBAIE,QAAQ,UACJ,SACA,gBAAgB,QAAkB,WAAW;AAAA,iBAEnD,WAAW;AAAA;AAIjB,mBAAO;AAAA,aAET;AAAA;AAKJ,eAAO,YACL,OACA;AAAA,UACE,OAAO,QAAQ;AAAA,UACf,OAAO,eAAe;AAAA,WAExB,mBACA,WAAW,QAAQ,WAAW;AAAA;AAIlC,aAAO,SAAS;AAAA;AAAA;AAAA;;;;"}