@fastkit/vui 0.6.40 → 0.6.41

package/dist/vui.cjs.js

@@ -9,7 +9,6 @@ var vueUtils = require('@fastkit/vue-utils');
 var vueScroller = require('@fastkit/vue-scroller');
 var vueColorScheme = require('@fastkit/vue-color-scheme');
 var vueLoading = require('@fastkit/vue-loading');
-var mediaMatch = require('@fastkit/media-match');
 var iconFont = require('@fastkit/icon-font');
 var helpers = require('@fastkit/helpers');
 var vueAppLayout = require('@fastkit/vue-app-layout');
@@ -292,7 +291,8 @@ const VGridItem = vue.defineComponent({
       type: String,
       default: 'div'
     },
-    ...undefined,
+    // ...(undefined as unknown as MQSizeProps),
+    size: undefined,
     align: undefined,
     justify: undefined,
     order: undefined
@@ -304,26 +304,26 @@ const VGridItem = vue.defineComponent({
       const attrs = { ...ctx.attrs
       };
       const {
+        size,
         align,
         justify,
         order
       } = props;
+      delete attrs.size;
       delete attrs.align;
       delete attrs.justify;
       delete attrs.order;
+      size != null && classes.push(extractRawGridValueClasses(size, 'grid-size-'));
       align && classes.push(extractRawGridValueClasses(align, 'self-align-'));
       justify && classes.push(extractRawGridValueClasses(justify, 'self-justify-'));
-      order != null && classes.push(extractRawGridValueClasses(order, 'order-'));
-      mediaMatch.MEDIA_MATCH_CONDITIONS.forEach(({
-        key
-      }) => {
-        const v = attrs[key];
-        delete attrs[key];
+      order != null && classes.push(extractRawGridValueClasses(order, 'order-')); // MEDIA_MATCH_CONDITIONS.forEach(({ key }) => {
+      //   const v = attrs[key];
+      //   delete attrs[key];
+      //   if (v != null) {
+      //     classes.push(`grid-size-${v}--${key}`);
+      //   }
+      // });
 
-        if (v != null) {
-          classes.push(`grid-size-${v}--${key}`);
-        }
-      });
       return {
         classes,
         attrs

package/dist/vui.cjs.prod.js

@@ -9,7 +9,6 @@ var vueUtils = require('@fastkit/vue-utils');
 var vueScroller = require('@fastkit/vue-scroller');
 var vueColorScheme = require('@fastkit/vue-color-scheme');
 var vueLoading = require('@fastkit/vue-loading');
-var mediaMatch = require('@fastkit/media-match');
 var iconFont = require('@fastkit/icon-font');
 var helpers = require('@fastkit/helpers');
 var vueAppLayout = require('@fastkit/vue-app-layout');
@@ -292,7 +291,8 @@ const VGridItem = vue.defineComponent({
       type: String,
       default: 'div'
     },
-    ...undefined,
+    // ...(undefined as unknown as MQSizeProps),
+    size: undefined,
     align: undefined,
     justify: undefined,
     order: undefined
@@ -304,26 +304,26 @@ const VGridItem = vue.defineComponent({
       const attrs = { ...ctx.attrs
       };
       const {
+        size,
         align,
         justify,
         order
       } = props;
+      delete attrs.size;
       delete attrs.align;
       delete attrs.justify;
       delete attrs.order;
+      size != null && classes.push(extractRawGridValueClasses(size, 'grid-size-'));
       align && classes.push(extractRawGridValueClasses(align, 'self-align-'));
       justify && classes.push(extractRawGridValueClasses(justify, 'self-justify-'));
-      order != null && classes.push(extractRawGridValueClasses(order, 'order-'));
-      mediaMatch.MEDIA_MATCH_CONDITIONS.forEach(({
-        key
-      }) => {
-        const v = attrs[key];
-        delete attrs[key];
+      order != null && classes.push(extractRawGridValueClasses(order, 'order-')); // MEDIA_MATCH_CONDITIONS.forEach(({ key }) => {
+      //   const v = attrs[key];
+      //   delete attrs[key];
+      //   if (v != null) {
+      //     classes.push(`grid-size-${v}--${key}`);
+      //   }
+      // });
 
-        if (v != null) {
-          classes.push(`grid-size-${v}--${key}`);
-        }
-      });
       return {
         classes,
         attrs

package/dist/vui.d.ts

@@ -3574,14 +3574,14 @@ export declare const VGridContainer: DefineComponent<{
 }>;
 
 export declare const VGridItem: DefineComponent<{
-    align: RawGridValueProp<GridItemAlignValue>;
-    justify: RawGridValueProp<GridItemJustifyValue>;
-    order: RawGridValueProp<string | number>;
-    __MediaMatchKey__: PropType<GridItemSizeValue | undefined>;
     tag: {
         type: StringConstructor;
         default: string;
     };
+    size: RawGridValueProp<GridItemSizeValue>;
+    align: RawGridValueProp<GridItemAlignValue>;
+    justify: RawGridValueProp<GridItemJustifyValue>;
+    order: RawGridValueProp<string | number>;
     innerHTML: PropType<string | undefined>;
     class: PropType<any>;
     style: PropType<StyleValue | undefined>;
@@ -3753,11 +3753,11 @@ export declare const VGridItem: DefineComponent<{
     onTransitionend: PropType<((payload: TransitionEvent) => void) | undefined>;
     onTransitionstart: PropType<((payload: TransitionEvent) => void) | undefined>;
 }, () => JSX.Element, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, Record<string, any>, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<{
+    tag?: unknown;
+    size?: unknown;
     align?: unknown;
     justify?: unknown;
     order?: unknown;
-    __MediaMatchKey__?: unknown;
-    tag?: unknown;
     innerHTML?: unknown;
     class?: unknown;
     style?: unknown;
@@ -3931,7 +3931,6 @@ export declare const VGridItem: DefineComponent<{
 } & {
     tag: string;
 } & {
-    __MediaMatchKey__?: GridItemSizeValue | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -4102,6 +4101,7 @@ export declare const VGridItem: DefineComponent<{
     "aria-valuemin"?: (string | number) | undefined;
     "aria-valuenow"?: (string | number) | undefined;
     "aria-valuetext"?: string | undefined;
+    size?: RawGridValue<GridItemSizeValue>;
     align?: RawGridValue<GridItemAlignValue>;
     justify?: RawGridValue<GridItemJustifyValue>;
     order?: RawGridValue<string | number>;

package/dist/vui.esm-bundler.js

@@ -8,7 +8,6 @@ import { getDocumentScroller as getDocumentScroller$1 } from '@fastkit/vue-scrol
 import { useScopeColorClass, colorSchemeProps, useColorClasses, toScopeColorClass } from '@fastkit/vue-color-scheme';
 import { VProgressCircular } from '@fastkit/vue-loading';
 export * from '@fastkit/vue-loading';
-import { MEDIA_MATCH_CONDITIONS } from '@fastkit/media-match';
 export { ICON_NAMES } from '@fastkit/icon-font';
 import { isPromise } from '@fastkit/helpers';
 import { VAppContainer, VAppLayoutControl } from '@fastkit/vue-app-layout';
@@ -287,7 +286,8 @@ const VGridItem = defineComponent({
       type: String,
       default: 'div'
     },
-    ...undefined,
+    // ...(undefined as unknown as MQSizeProps),
+    size: undefined,
     align: undefined,
     justify: undefined,
     order: undefined
@@ -299,26 +299,26 @@ const VGridItem = defineComponent({
       const attrs = { ...ctx.attrs
       };
       const {
+        size,
         align,
         justify,
         order
       } = props;
+      delete attrs.size;
       delete attrs.align;
       delete attrs.justify;
       delete attrs.order;
+      size != null && classes.push(extractRawGridValueClasses(size, 'grid-size-'));
       align && classes.push(extractRawGridValueClasses(align, 'self-align-'));
       justify && classes.push(extractRawGridValueClasses(justify, 'self-justify-'));
-      order != null && classes.push(extractRawGridValueClasses(order, 'order-'));
-      MEDIA_MATCH_CONDITIONS.forEach(({
-        key
-      }) => {
-        const v = attrs[key];
-        delete attrs[key];
+      order != null && classes.push(extractRawGridValueClasses(order, 'order-')); // MEDIA_MATCH_CONDITIONS.forEach(({ key }) => {
+      //   const v = attrs[key];
+      //   delete attrs[key];
+      //   if (v != null) {
+      //     classes.push(`grid-size-${v}--${key}`);
+      //   }
+      // });
 
-        if (v != null) {
-          classes.push(`grid-size-${v}--${key}`);
-        }
-      });
       return {
         classes,
         attrs

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fastkit/vui",
-  "version": "0.6.40",
+  "version": "0.6.41",
   "description": "@fastkit/vui",
   "buildOptions": {
     "name": "Vui",
@@ -32,11 +32,11 @@
     "vue": "^3.2.20"
   },
   "dependencies": {
-    "@fastkit/color-scheme": "0.6.40",
-    "@fastkit/icon-font": "0.6.40",
-    "@fastkit/tiny-logger": "0.6.40",
-    "@fastkit/vite-kit": "0.6.40",
-    "@fastkit/vue-kit": "0.6.40",
+    "@fastkit/color-scheme": "0.6.41",
+    "@fastkit/icon-font": "0.6.41",
+    "@fastkit/tiny-logger": "0.6.41",
+    "@fastkit/vite-kit": "0.6.41",
+    "@fastkit/vue-kit": "0.6.41",
     "eta": "^1.12.3",
     "fs-extra": "^9.1.0",
     "@tiptap/extension-link": "^2.0.0-beta.33",

package/src/components/VGrid/VGridItem.tsx

@@ -1,7 +1,7 @@
 import './VGridItem.scss';
 
-import { defineComponent, PropType, computed } from 'vue';
-import { MediaMatchKey, MEDIA_MATCH_CONDITIONS } from '@fastkit/media-match';
+import { defineComponent, computed } from 'vue';
+// import { MediaMatchKey, MEDIA_MATCH_CONDITIONS } from '@fastkit/media-match';
 import { htmlAttributesPropOptions } from '@fastkit/vue-utils';
 import { RawGridValueProp, extractRawGridValueClasses } from './schemes';
 
@@ -21,10 +21,10 @@ export type GridItemNumberSizeValue =
 
 export type GridItemSizeValue = GridItemNumberSizeValue | 'auto';
 
-type MQSizeProps = Record<
-  MediaMatchKey,
-  PropType<GridItemSizeValue | undefined>
->;
+// type MQSizeProps = Record<
+//   MediaMatchKey,
+//   PropType<GridItemSizeValue | undefined>
+// >;
 
 export type GridItemAlignValue =
   | 'flex-start'
@@ -55,7 +55,8 @@ export const VGridItem = defineComponent({
       type: String,
       default: 'div',
     },
-    ...(undefined as unknown as MQSizeProps),
+    // ...(undefined as unknown as MQSizeProps),
+    size: undefined as unknown as RawGridValueProp<GridItemSizeValue>,
     align: undefined as unknown as RawGridValueProp<GridItemAlignValue>,
     justify: undefined as unknown as RawGridValueProp<GridItemJustifyValue>,
     order: undefined as unknown as RawGridValueProp<number | string>,
@@ -68,25 +69,28 @@ export const VGridItem = defineComponent({
         ...ctx.attrs,
       };
 
-      const { align, justify, order } = props;
+      const { size, align, justify, order } = props;
 
+      delete attrs.size;
       delete attrs.align;
       delete attrs.justify;
       delete attrs.order;
 
+      size != null &&
+        classes.push(extractRawGridValueClasses(size, 'grid-size-'));
       align && classes.push(extractRawGridValueClasses(align, 'self-align-'));
       justify &&
         classes.push(extractRawGridValueClasses(justify, 'self-justify-'));
       order != null &&
         classes.push(extractRawGridValueClasses(order, 'order-'));
 
-      MEDIA_MATCH_CONDITIONS.forEach(({ key }) => {
-        const v = attrs[key];
-        delete attrs[key];
-        if (v != null) {
-          classes.push(`grid-size-${v}--${key}`);
-        }
-      });
+      // MEDIA_MATCH_CONDITIONS.forEach(({ key }) => {
+      //   const v = attrs[key];
+      //   delete attrs[key];
+      //   if (v != null) {
+      //     classes.push(`grid-size-${v}--${key}`);
+      //   }
+      // });
 
       return {
         classes,