VSheet.mjs 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import { createVNode as _createVNode, resolveDirective as _resolveDirective } from "vue";
  2. // Styles
  3. import "./VSheet.css";
  4. // Composables
  5. import { makeBorderProps, useBorder } from "../../composables/border.mjs";
  6. import { useBackgroundColor } from "../../composables/color.mjs";
  7. import { makeComponentProps } from "../../composables/component.mjs";
  8. import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs";
  9. import { makeElevationProps, useElevation } from "../../composables/elevation.mjs";
  10. import { makeLocationProps, useLocation } from "../../composables/location.mjs";
  11. import { makePositionProps, usePosition } from "../../composables/position.mjs";
  12. import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
  13. import { makeTagProps } from "../../composables/tag.mjs";
  14. import { makeThemeProps, provideTheme } from "../../composables/theme.mjs"; // Utilities
  15. import { toRef } from 'vue';
  16. import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
  17. export const makeVSheetProps = propsFactory({
  18. color: String,
  19. ...makeBorderProps(),
  20. ...makeComponentProps(),
  21. ...makeDimensionProps(),
  22. ...makeElevationProps(),
  23. ...makeLocationProps(),
  24. ...makePositionProps(),
  25. ...makeRoundedProps(),
  26. ...makeTagProps(),
  27. ...makeThemeProps()
  28. }, 'VSheet');
  29. export const VSheet = genericComponent()({
  30. name: 'VSheet',
  31. props: makeVSheetProps(),
  32. setup(props, _ref) {
  33. let {
  34. slots
  35. } = _ref;
  36. const {
  37. themeClasses
  38. } = provideTheme(props);
  39. const {
  40. backgroundColorClasses,
  41. backgroundColorStyles
  42. } = useBackgroundColor(toRef(props, 'color'));
  43. const {
  44. borderClasses
  45. } = useBorder(props);
  46. const {
  47. dimensionStyles
  48. } = useDimension(props);
  49. const {
  50. elevationClasses
  51. } = useElevation(props);
  52. const {
  53. locationStyles
  54. } = useLocation(props);
  55. const {
  56. positionClasses
  57. } = usePosition(props);
  58. const {
  59. roundedClasses
  60. } = useRounded(props);
  61. useRender(() => _createVNode(props.tag, {
  62. "class": ['v-sheet', themeClasses.value, backgroundColorClasses.value, borderClasses.value, elevationClasses.value, positionClasses.value, roundedClasses.value, props.class],
  63. "style": [backgroundColorStyles.value, dimensionStyles.value, locationStyles.value, props.style]
  64. }, slots));
  65. return {};
  66. }
  67. });
  68. //# sourceMappingURL=VSheet.mjs.map