@vc-shell/framework 1.0.108 → 1.0.110

package/dist/ui/components/atoms/index.d.ts

@@ -16,5 +16,6 @@ export * from "./vc-row";
 export * from "./vc-status";
 export * from "./vc-status-icon";
 export * from "./vc-switch";
+export * from "./vc-video";
 export * from "./vc-widget";
 //# sourceMappingURL=index.d.ts.map

package/dist/ui/components/atoms/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../ui/components/atoms/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../ui/components/atoms/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC"}

package/dist/ui/components/atoms/vc-icon/index.d.ts

@@ -1,6 +1,6 @@
 export declare const VcIcon: import("vue").DefineComponent<{
     size: {
-        type: import("vue").PropType<"s" | "m" | "xs" | "l" | "xl" | "xxl">;
+        type: import("vue").PropType<"s" | "m" | "xs" | "l" | "xl" | "xxl" | "xxxl">;
         default: string;
     };
     icon: {
@@ -9,7 +9,7 @@ export declare const VcIcon: import("vue").DefineComponent<{
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     size: {
-        type: import("vue").PropType<"s" | "m" | "xs" | "l" | "xl" | "xxl">;
+        type: import("vue").PropType<"s" | "m" | "xs" | "l" | "xl" | "xxl" | "xxxl">;
         default: string;
     };
     icon: {
@@ -17,7 +17,7 @@ export declare const VcIcon: import("vue").DefineComponent<{
         default: string;
     };
 }>>, {
-    size: "s" | "m" | "xs" | "l" | "xl" | "xxl";
+    size: "s" | "m" | "xs" | "l" | "xl" | "xxl" | "xxxl";
     icon: string;
 }, {}>;
 //# sourceMappingURL=index.d.ts.map

package/dist/ui/components/atoms/vc-icon/vc-icon.vue.d.ts

@@ -1,6 +1,6 @@
 export interface Props {
     icon?: string;
-    size?: "xs" | "s" | "m" | "l" | "xl" | "xxl";
+    size?: "xs" | "s" | "m" | "l" | "xl" | "xxl" | "xxxl";
 }
 declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
     icon: string;
@@ -9,7 +9,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     icon: string;
     size: string;
 }>>>, {
-    size: "s" | "m" | "xs" | "l" | "xl" | "xxl";
+    size: "s" | "m" | "xs" | "l" | "xl" | "xxl" | "xxxl";
     icon: string;
 }, {}>;
 export default _default;

package/dist/ui/components/atoms/vc-icon/vc-icon.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vc-icon.vue.d.ts","sourceRoot":"","sources":["../../../../../ui/components/atoms/vc-icon/vc-icon.vue.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,KAAK;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,CAAC;CAC9C;;;;;;;;;;;AA8DD,wBAAkD;AAElD,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"vc-icon.vue.d.ts","sourceRoot":"","sources":["../../../../../ui/components/atoms/vc-icon/vc-icon.vue.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,KAAK;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,GAAG,MAAM,CAAC;CACvD;;;;;;;;;;;AA8DD,wBAAkD;AAElD,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/ui/components/atoms/vc-video/index.d.ts

@@ -0,0 +1,54 @@
+export declare const VcVideo: import("vue").DefineComponent<{
+    label: {
+        type: import("vue").PropType<string>;
+    };
+    size: {
+        type: import("vue").PropType<"s" | "m" | "auto" | "xs" | "l" | "xl" | "xxl">;
+        default: string;
+    };
+    source: {
+        type: import("vue").PropType<string>;
+    };
+    clickable: {
+        type: import("vue").PropType<boolean>;
+    };
+    tooltip: {
+        type: import("vue").PropType<string>;
+    };
+    rounded: {
+        type: import("vue").PropType<boolean>;
+    };
+    bordered: {
+        type: import("vue").PropType<boolean>;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    click: () => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    label: {
+        type: import("vue").PropType<string>;
+    };
+    size: {
+        type: import("vue").PropType<"s" | "m" | "auto" | "xs" | "l" | "xl" | "xxl">;
+        default: string;
+    };
+    source: {
+        type: import("vue").PropType<string>;
+    };
+    clickable: {
+        type: import("vue").PropType<boolean>;
+    };
+    tooltip: {
+        type: import("vue").PropType<string>;
+    };
+    rounded: {
+        type: import("vue").PropType<boolean>;
+    };
+    bordered: {
+        type: import("vue").PropType<boolean>;
+    };
+}>> & {
+    onClick?: () => any;
+}, {
+    size: "s" | "m" | "auto" | "xs" | "l" | "xl" | "xxl";
+}, {}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/components/atoms/vc-video/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../ui/components/atoms/vc-video/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAA0B,CAAC"}

package/dist/ui/components/atoms/vc-video/vc-video.vue.d.ts

@@ -0,0 +1,42 @@
+export interface Props {
+    label?: string;
+    tooltip?: string;
+    rounded?: boolean;
+    bordered?: boolean;
+    clickable?: boolean;
+    source?: string;
+    size?: "auto" | "xs" | "s" | "m" | "l" | "xl" | "xxl";
+}
+export interface Emits {
+    (event: "click"): void;
+}
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    size: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    click: () => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    size: string;
+}>>> & {
+    onClick?: () => any;
+}, {
+    size: "s" | "m" | "auto" | "xs" | "l" | "xl" | "xxl";
+}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+//# sourceMappingURL=vc-video.vue.d.ts.map

package/dist/ui/components/atoms/vc-video/vc-video.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-video.vue.d.ts","sourceRoot":"","sources":["../../../../../ui/components/atoms/vc-video/vc-video.vue.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,KAAK;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,CAAC;CACvD;AAED,MAAM,WAAW,KAAK;IACpB,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC;CACxB;;;;;;;;;;;;AAqLD,wBAAkD;AAElD,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AA6GN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vc-shell/framework",
-  "version": "1.0.108",
+  "version": "1.0.110",
   "main": "./dist/framework.mjs",
   "module": "./dist/framework.mjs",
   "types": "./dist/index.d.ts",
@@ -36,6 +36,7 @@
     "@vueuse/components": "^10.1.2",
     "@vueuse/core": "^10.1.2",
     "@vueuse/integrations": "^10.1.2",
+    "ace-builds": "^1.27.0",
     "buffer-esm": "^1.2.0",
     "client-oauth2": "^4.3.3",
     "moment": "^2.29.4",
@@ -55,8 +56,8 @@
     "whatwg-fetch": "^3.6.2"
   },
   "devDependencies": {
-    "@vc-shell/api-client-generator": "^1.0.108",
-    "@vc-shell/config-generator": "^1.0.108",
+    "@vc-shell/api-client-generator": "^1.0.110",
+    "@vc-shell/config-generator": "^1.0.110",
     "@vitejs/plugin-vue": "^4.2.3",
     "sass": "^1.62.1",
     "typescript": "~5.0.4",

package/ui/components/atoms/index.ts

@@ -16,4 +16,5 @@ export * from "./vc-row";
 export * from "./vc-status";
 export * from "./vc-status-icon";
 export * from "./vc-switch";
+export * from "./vc-video";
 export * from "./vc-widget";

package/ui/components/atoms/vc-icon/vc-icon.vue

@@ -5,7 +5,7 @@
 <script lang="ts" setup>
 export interface Props {
   icon?: string;
-  size?: "xs" | "s" | "m" | "l" | "xl" | "xxl";
+  size?: "xs" | "s" | "m" | "l" | "xl" | "xxl" | "xxxl";
 }
 
 withDefaults(defineProps<Props>(), {
@@ -22,9 +22,10 @@ withDefaults(defineProps<Props>(), {
   --icon-size-l: 20px;
   --icon-size-xl: 22px;
   --icon-size-xxl: 30px;
+  --icon-size-xxxl: 64px;
 }
 
-$sizes: xs, s, m, l, xl, xxl;
+$sizes: xs, s, m, l, xl, xxl, xxxl;
 
 .vc-icon {
   @each $size in $sizes {

package/ui/components/atoms/vc-video/index.ts

@@ -0,0 +1,3 @@
+import _Video from "./vc-video.vue";
+
+export const VcVideo = _Video as typeof _Video;

package/ui/components/atoms/vc-video/vc-video.vue

@@ -0,0 +1,102 @@
+<template>
+  <div
+    class="vc-video"
+    :class="[`vc-video_${size}`]"
+  >
+    <VcLabel
+      v-if="label"
+      class="tw-mb-2"
+    >
+      <span>{{ label }}</span>
+      <template
+        v-if="tooltip"
+        #tooltip
+        >{{ tooltip }}</template
+      >
+    </VcLabel>
+
+    <div
+      :class="[
+        `vc-video_auto`,
+        {
+          'tw-rounded-full tw-pb-[var(--video-padding-bottom-1x1)]': rounded,
+          'tw-rounded-[3px] tw-border tw-border-solid tw-border-[color:#efefef]': bordered,
+          'tw-cursor-pointer': clickable,
+        },
+        'tw-relative',
+      ]"
+    >
+      <div v-if="source">
+        <iframe
+          :src="`${source}`"
+          width="100%"
+          height="300"
+          frameborder="0"
+          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+          allowfullscreen="false"
+        >
+        </iframe>
+      </div>
+      <div
+        v-else
+        class="tw-absolute tw-w-full tw-h-full tw-flex tw-items-center tw-justify-center tw-text-[#83a3be]"
+      >
+        <VcIcon
+          icon="fas fa-film"
+          size="xl"
+        ></VcIcon>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { VcIcon, VcLabel } from "./../../";
+
+export interface Props {
+  label?: string;
+  tooltip?: string;
+  rounded?: boolean;
+  bordered?: boolean;
+  clickable?: boolean;
+  source?: string;
+  size?: "auto" | "xs" | "s" | "m" | "l" | "xl" | "xxl";
+}
+
+export interface Emits {
+  (event: "click"): void;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: "auto",
+});
+
+const emit = defineEmits<Emits>();
+</script>
+
+<style lang="scss">
+:root {
+  --image-size-xs: 32px;
+  --image-size-s: 48px;
+  --image-size-m: 64px;
+  --image-size-l: 96px;
+  --image-size-xl: 128px;
+  --image-size-xxl: 145px;
+}
+
+$paddings: xs, s, m, l, xl, xxl;
+
+.vc-video {
+  @apply tw-inline-block tw-relative;
+
+  @each $padding in $paddings {
+    &_#{$padding} {
+      @apply tw-w-[var(--image-size-#{$padding})];
+    }
+  }
+
+  &_auto {
+    @apply tw-w-full;
+  }
+}
+</style>