@bobbykim/mcl-forms 0.6.0 → 0.7.1

package/package.json

@@ -1,11 +1,23 @@
 {
   "name": "@bobbykim/mcl-forms",
-  "version": "0.6.0",
-  "description": "",
+  "version": "0.7.1",
+  "description": "form group components based on manguito-theme",
   "type": "module",
-  "main": "index.ts",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/mcl-forms.umd.cjs",
+  "module": "./dist/mcl-forms.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/mcl-forms.js",
+      "require": "./dist/mcl-forms.umd.cjs",
+      "types": "./dist/index.d.ts"
+    }
+  },
   "scripts": {
-    "build": "vue-tsc --project tsconfig.vue.json && tsc --project tsconfig.ts.json"
+    "build": "vite build"
   },
   "author": {
     "name": "Bobby Kim",
@@ -21,7 +33,18 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@bobbykim/manguito-theme": "^0.18.0"
+    "@bobbykim/manguito-theme": "0.20.0",
+    "@vueuse/core": "^10.8.0",
+    "vue": "^3.3.10"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^4.5.2",
+    "sass": "^1.69.5",
+    "typescript": "^5.3.3",
+    "vite": "^4.5.1",
+    "vite-plugin-css-injected-by-js": "^3.5.0",
+    "vite-plugin-dts": "^3.8.3",
+    "vue-tsc": "^1.8.25"
   },
-  "gitHead": "969800695a9a902bc9d0c19ad6ab002caace8061"
+  "gitHead": "2e677770b8628a9616237cd3812af2dcb20ee5bb"
 }

package/CHANGELOG.md

@@ -1,69 +0,0 @@
-# Change Log
-
-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
-
-# [0.6.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-forms@0.5.0...@bobbykim/mcl-forms@0.6.0) (2024-04-01)
-
-
-### Features
-
-* ready for production ([4e2fc04](https://github.com/bobbykim89/manguito-component-library/commit/4e2fc048edd67791b4e917e0a764f301d4c610cb))
-
-
-
-
-
-# [0.5.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-forms@0.3.0...@bobbykim/mcl-forms@0.5.0) (2024-03-24)
-
-
-### Features
-
-* build and release ([a372086](https://github.com/bobbykim89/manguito-component-library/commit/a3720861fb40dd6ec1d0e3dda1f06e2479967432))
-* **components/*:** prepublish build ([c8eb95a](https://github.com/bobbykim89/manguito-component-library/commit/c8eb95a0ede6727bf183d2e9ad634ae64af1411d))
-* **mcl-header:** move deprecated items to deprecated folder in root dir, update configs, init mcl-header-b component ([19aa842](https://github.com/bobbykim89/manguito-component-library/commit/19aa842faa7f1594f7be030b97d5093014efe7cb))
-* tsconfig update, slots and emits update ([c30ff80](https://github.com/bobbykim89/manguito-component-library/commit/c30ff804c961d205ac097e20cd51285a15ca8966))
-
-
-
-
-
-# [0.4.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-forms@0.3.0...@bobbykim/mcl-forms@0.4.0) (2024-03-21)
-
-
-### Features
-
-* **mcl-header:** move deprecated items to deprecated folder in root dir, update configs, init mcl-header-b component ([19aa842](https://github.com/bobbykim89/manguito-component-library/commit/19aa842faa7f1594f7be030b97d5093014efe7cb))
-* tsconfig update, slots and emits update ([c30ff80](https://github.com/bobbykim89/manguito-component-library/commit/c30ff804c961d205ac097e20cd51285a15ca8966))
-
-
-
-
-
-# [0.3.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-forms@0.2.0...@bobbykim/mcl-forms@0.3.0) (2024-02-27)
-
-
-### Features
-
-* **/components/**/README.md,/deprecated:** update readme files, move deprecated packages to deprecated folder ([c0f8f7d](https://github.com/bobbykim89/manguito-component-library/commit/c0f8f7df158b8fcd99b4e3d191e02e3c8a9c144d))
-
-
-
-
-
-# 0.2.0 (2024-02-27)
-
-
-### Features
-
-* **components/*:** run package:build ([fcc2d09](https://github.com/bobbykim89/manguito-component-library/commit/fcc2d0953d77ecaa317be27eb212c927dec33b17))
-* **manguito-theme,mcl-cards,mcl-header,mcl-footer,mcl-carousel:** add vueuse as one of dependencies, update code to make them ssr friendly ([119a327](https://github.com/bobbykim89/manguito-component-library/commit/119a327adf1ca9866e6ac063bce5acd4790db612))
-* **mcl-forms:** add mcl-form-group and mcl-text-area ([aa3f412](https://github.com/bobbykim89/manguito-component-library/commit/aa3f412334acc3793ad12303cad955b15ca79831))
-* **mcl-forms:** add mcl-input-file component inside mcl-forms package ([98e1464](https://github.com/bobbykim89/manguito-component-library/commit/98e14641061bd54c43d1d62dc5d80d66c02c5f90))
-* **mcl-forms:** add mcl-input-radio ([de8d9a7](https://github.com/bobbykim89/manguito-component-library/commit/de8d9a7a2e66a7c8abe7702adfad21f68d0767f6))
-* **mcl-forms:** add text-color props for mcl-input-text and mcl-text-area, fix glitch on mcl-select ([3381b10](https://github.com/bobbykim89/manguito-component-library/commit/3381b10babeed892717b4e4b21c218c7027d9a1a))
-* **mcl-forms:** init mcl-forms package ([c2512ac](https://github.com/bobbykim89/manguito-component-library/commit/c2512ac7c89c71f287fcd4cd12f8dc84150a5239))
-* **mcl-input-switch:** add mcl-input-switch component in mcl-forms library ([b3a9edf](https://github.com/bobbykim89/manguito-component-library/commit/b3a9edf8fcfecb0ab9f2f82aa79618133f6dd4fc))
-* **mcl-select:** finalize mcl-select component ([3521482](https://github.com/bobbykim89/manguito-component-library/commit/3521482a782313e0f3d8b83de10839097757e7eb))
-* **mcl-select:** wip) update mcl-select component to have combobox format ([cdce2ef](https://github.com/bobbykim89/manguito-component-library/commit/cdce2ef401d22c4f822633e996c3bcd4e06c3636))
-* **stories/*:** ran package:build to build type declaration, move deprecated story files into deprecated folder ([ffc487d](https://github.com/bobbykim89/manguito-component-library/commit/ffc487dbcc093be7a3ccfeae98c5e10e8372a0e3))

package/index.d.ts

@@ -1,10 +0,0 @@
-import MclFormGroup from './lib/mcl-form-group/MclFormGroup.vue';
-import MclInputFile from './lib/mcl-input-file/MclInputFile.vue';
-import MclInputRadio from './lib/mcl-input-radio/MclInputRadio.vue';
-import MclInputSwitch from './lib/mcl-input-switch/MclInputSwitch.vue';
-import MclInputText from './lib/mcl-input-text/MclInputText.vue';
-import MclSelect from './lib/mcl-select/MclSelect.vue';
-import MclTextArea from './lib/mcl-text-area/MclTextArea.vue';
-export * from './lib/mcl-input-radio/index.types';
-export * from './lib/mcl-select/index.types';
-export { MclFormGroup, MclInputFile, MclInputRadio, MclInputSwitch, MclInputText, MclSelect, MclTextArea, };

package/index.js

@@ -1,10 +0,0 @@
-import MclFormGroup from './lib/mcl-form-group/MclFormGroup.vue';
-import MclInputFile from './lib/mcl-input-file/MclInputFile.vue';
-import MclInputRadio from './lib/mcl-input-radio/MclInputRadio.vue';
-import MclInputSwitch from './lib/mcl-input-switch/MclInputSwitch.vue';
-import MclInputText from './lib/mcl-input-text/MclInputText.vue';
-import MclSelect from './lib/mcl-select/MclSelect.vue';
-import MclTextArea from './lib/mcl-text-area/MclTextArea.vue';
-export * from './lib/mcl-input-radio/index.types';
-export * from './lib/mcl-select/index.types';
-export { MclFormGroup, MclInputFile, MclInputRadio, MclInputSwitch, MclInputText, MclSelect, MclTextArea, };

package/index.ts

@@ -1,19 +0,0 @@
-import MclFormGroup from './lib/mcl-form-group/MclFormGroup.vue'
-import MclInputFile from './lib/mcl-input-file/MclInputFile.vue'
-import MclInputRadio from './lib/mcl-input-radio/MclInputRadio.vue'
-import MclInputSwitch from './lib/mcl-input-switch/MclInputSwitch.vue'
-import MclInputText from './lib/mcl-input-text/MclInputText.vue'
-import MclSelect from './lib/mcl-select/MclSelect.vue'
-import MclTextArea from './lib/mcl-text-area/MclTextArea.vue'
-
-export * from './lib/mcl-input-radio/index.types'
-export * from './lib/mcl-select/index.types'
-export {
-  MclFormGroup,
-  MclInputFile,
-  MclInputRadio,
-  MclInputSwitch,
-  MclInputText,
-  MclSelect,
-  MclTextArea,
-}

package/lib/assets/CaretDown.vue

@@ -1,14 +0,0 @@
-<template>
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 320 512"
-    fill="currentColor"
-    class="h-md w-md"
-    role="img"
-  >
-    <!-- !Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc. -->
-    <path
-      d="M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z"
-    />
-  </svg>
-</template>

package/lib/assets/CaretDown.vue.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
-export default _default;

package/lib/common/InputHighlight.vue

@@ -1,46 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-import generateClass from '@bobbykim/manguito-theme'
-import type { ColorPalette } from '@bobbykim/manguito-theme'
-
-type OffsetType = 1 | 2.5
-
-const props = withDefaults(
-  defineProps<{
-    color?: ColorPalette
-    rounded?: boolean
-    offset?: OffsetType
-  }>(),
-  {
-    color: 'primary',
-    rounded: false,
-    offset: 1,
-  }
-)
-
-const offsetOptions = {
-  1: '-top-1',
-  2.5: '-top-2.5',
-}
-
-const getHighlightClass = computed((): string => {
-  /**
-   * @param {ColorPalette} color - highlightColor
-   * @param {boolean} rounded - rounded
-   * @param {OffsetType} offset
-   */
-  const classArray: string[] = [generateClass('BEFOREBG', props.color)]
-  if (props.rounded) {
-    classArray.push('rounded-b-md')
-  }
-  classArray.push(offsetOptions[props.offset])
-  return classArray.join(' ')
-})
-</script>
-
-<template>
-  <div
-    class="relative h-3xs overflow-hidden before:absolute before:bottom-0 before:left-0 before:h-full before:w-0 peer-focus:before:w-full before:transition-[width] before:duration-300 before:ease-linear"
-    :class="getHighlightClass"
-  ></div>
-</template>

package/lib/common/InputHighlight.vue.d.ts

@@ -1,41 +0,0 @@
-import type { ColorPalette } from '@bobbykim/manguito-theme';
-type OffsetType = 1 | 2.5;
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
-    color?: ColorPalette | undefined;
-    rounded?: boolean | undefined;
-    offset?: OffsetType | undefined;
-}>, {
-    color: string;
-    rounded: boolean;
-    offset: number;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
-    color?: ColorPalette | undefined;
-    rounded?: boolean | undefined;
-    offset?: OffsetType | undefined;
-}>, {
-    color: string;
-    rounded: boolean;
-    offset: number;
-}>>>, {
-    color: ColorPalette;
-    rounded: boolean;
-    offset: OffsetType;
-}, {}>;
-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];
-} & {};

package/lib/common/index.types.d.ts

@@ -1,4 +0,0 @@
-import type { ColorPalette } from '@bobbykim/manguito-theme';
-export type ColorMap = {
-    [key in ColorPalette]: string;
-};

package/lib/common/index.types.js

@@ -1 +0,0 @@
-export {};

package/lib/common/index.types.ts

@@ -1,5 +0,0 @@
-import type { ColorPalette } from '@bobbykim/manguito-theme'
-
-export type ColorMap = {
-  [key in ColorPalette]: string
-}

package/lib/mcl-form-group/MclFormGroup.vue

@@ -1,48 +0,0 @@
-<script setup lang="ts">
-import generateClass from '@bobbykim/manguito-theme'
-import type { BodyText, ColorPalette } from '@bobbykim/manguito-theme'
-import { computed } from 'vue'
-const props = withDefaults(
-  defineProps<{
-    labelFor: string
-    textColor?: ColorPalette
-    textSize?: BodyText
-    textBold?: boolean
-    label?: string
-  }>(),
-  {
-    textColor: 'dark-3',
-    textSize: 'md',
-    textBold: false,
-  }
-)
-const handleLabelText = computed((): string => {
-  /**
-   * @param {ColorPalette} textColor - handles text color of label text
-   * @param {BodyText} textSize - handles text size of label text
-   * @param {boolean} textBold - controls whether or not to make label text bold
-   */
-  const { textColor, textSize, textBold } = props
-  const classArray = [
-    generateClass('TEXTCOLOR', textColor),
-    generateClass('BODYTEXT', textSize),
-  ]
-  if (textBold) {
-    classArray.push('font-bold')
-  }
-  return classArray.join(' ')
-})
-</script>
-
-<template>
-  <div>
-    <label :for="labelFor" class="inline-block">
-      <slot name="label">
-        <p class="mb-2xs" :class="handleLabelText">{{ label }}</p>
-      </slot>
-    </label>
-    <slot />
-  </div>
-</template>
-
-<style scoped></style>

package/lib/mcl-form-group/MclFormGroup.vue.d.ts

@@ -1,52 +0,0 @@
-import type { BodyText, ColorPalette } from '@bobbykim/manguito-theme';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
-    labelFor: string;
-    textColor?: ColorPalette | undefined;
-    textSize?: BodyText | undefined;
-    textBold?: boolean | undefined;
-    label?: string | undefined;
-}>, {
-    textColor: string;
-    textSize: string;
-    textBold: boolean;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
-    labelFor: string;
-    textColor?: ColorPalette | undefined;
-    textSize?: BodyText | undefined;
-    textBold?: boolean | undefined;
-    label?: string | undefined;
-}>, {
-    textColor: string;
-    textSize: string;
-    textBold: boolean;
-}>>>, {
-    textColor: ColorPalette;
-    textSize: BodyText;
-    textBold: boolean;
-}, {}>, {
-    label?(_: {}): any;
-    default?(_: {}): any;
-}>;
-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];
-} & {};
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/lib/mcl-input-file/MclInputFile.vue

@@ -1,151 +0,0 @@
-<script setup lang="ts">
-import type { ColorPalette } from '@bobbykim/manguito-theme'
-import generateClass from '@bobbykim/manguito-theme'
-import { computed, ref } from 'vue'
-
-const props = withDefaults(
-  defineProps<{
-    id: string
-    displayBorder?: boolean
-    borderColor?: ColorPalette
-    rounded?: boolean
-    bgColor?: ColorPalette
-    buttonText?: string
-    buttonTextColor?: ColorPalette
-    buttonColor?: ColorPalette
-    displayShadow?: boolean
-    textColor?: ColorPalette
-    displayClear?: boolean
-    isRequired?: boolean
-    accept?: string
-    modelValue?: File
-  }>(),
-  {
-    displayBorder: false,
-    borderColor: 'light-4',
-    rounded: false,
-    bgColor: 'light-1',
-    buttonText: 'Browse File',
-    buttonTextColor: 'dark-3',
-    buttonColor: 'light-4',
-    displayShadow: true,
-    textColor: 'black',
-    displayClear: false,
-    isRequired: false,
-    accept: 'image/jpg,image/jpeg,image/png',
-  }
-)
-
-const emit = defineEmits(['update:modelValue'])
-
-const inputRef = ref()
-const fileInputKey = ref<number>(0)
-const onButtonClick = () => {
-  inputRef.value.click()
-}
-const onChangeFile = (e: Event) => {
-  const file = (e.target as HTMLInputElement).files![0]
-  emit('update:modelValue', file)
-}
-
-const onClearFile = () => {
-  emit('update:modelValue', null)
-  fileInputKey.value++
-}
-
-const borderClass = computed<string>(() => {
-  const { rounded, displayBorder, borderColor, displayShadow, bgColor } = props
-  const classArray: string[] = [generateClass('BGCOLOR', bgColor)]
-  if (rounded) {
-    classArray.push('rounded-md')
-  }
-  if (displayBorder) {
-    classArray.push('border-2')
-    classArray.push(generateClass('BORDER', borderColor))
-  }
-  if (displayShadow) {
-    classArray.push('shadow-md')
-  }
-  return classArray.join(' ')
-})
-
-const inputClass = computed<string>(() => {
-  const { bgColor, textColor } = props
-  const classArray: string[] = [
-    // generateClass('BGCOLOR', bgColor),
-    generateClass('TEXTCOLOR', textColor),
-  ]
-  return classArray.join(' ')
-})
-
-const getButtonClass = computed(() => {
-  const { buttonColor, buttonTextColor, rounded } = props
-  const classArray: string[] = [
-    generateClass('BGCOLOR', buttonColor),
-    generateClass('TEXTCOLOR', buttonTextColor),
-  ]
-  if (rounded) {
-    classArray.push('rounded-l-md')
-  }
-  return classArray.join(' ')
-})
-
-const getClearButtonClass = computed<string>(() => {
-  const { buttonColor, rounded } = props
-  const classArray: string[] = [generateClass('BGCOLOR', buttonColor)]
-  if (rounded) {
-    classArray.push('rounded-r-md')
-  }
-  return classArray.join(' ')
-})
-</script>
-
-<template>
-  <div class="flex items-center overflow-hidden" :class="borderClass">
-    <!-- browse button -->
-    <div class="shrink-0 my-3xs ml-3xs mr-xs">
-      <button
-        class="px-xs py-2xs hover:bg-opacity-70 transition-all duration-200 ease-linear max-w-full"
-        :class="getButtonClass"
-        @click="onButtonClick"
-      >
-        {{ buttonText }}
-      </button>
-    </div>
-    <input
-      type="file"
-      :id="id"
-      ref="inputRef"
-      class="file:hidden w-full bg-transparent"
-      :class="[inputClass]"
-      :required="isRequired"
-      :accept="accept"
-      :key="fileInputKey"
-      @change="onChangeFile"
-    />
-    <!-- clear button -->
-    <div
-      v-if="displayClear"
-      class="self-stretch my-3xs mr-3xs"
-      @click="onClearFile"
-    >
-      <button
-        class="px-xs py-2xs h-full flex items-center hover:bg-opacity-70 transition-all duration-200 ease-linear"
-        aria-label="clear"
-        :class="[getClearButtonClass]"
-      >
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 384 512"
-          class="h-xs"
-          :class="generateClass('SVGFILL', buttonTextColor)"
-        >
-          <!-- !Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc. -->
-          <path
-            d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"
-          />
-        </svg>
-      </button>
-    </div>
-  </div>
-</template>

package/lib/mcl-input-file/MclInputFile.vue.d.ts

@@ -1,93 +0,0 @@
-import type { ColorPalette } from '@bobbykim/manguito-theme';
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
-    id: string;
-    displayBorder?: boolean | undefined;
-    borderColor?: ColorPalette | undefined;
-    rounded?: boolean | undefined;
-    bgColor?: ColorPalette | undefined;
-    buttonText?: string | undefined;
-    buttonTextColor?: ColorPalette | undefined;
-    buttonColor?: ColorPalette | undefined;
-    displayShadow?: boolean | undefined;
-    textColor?: ColorPalette | undefined;
-    displayClear?: boolean | undefined;
-    isRequired?: boolean | undefined;
-    accept?: string | undefined;
-    modelValue?: File | undefined;
-}>, {
-    displayBorder: boolean;
-    borderColor: string;
-    rounded: boolean;
-    bgColor: string;
-    buttonText: string;
-    buttonTextColor: string;
-    buttonColor: string;
-    displayShadow: boolean;
-    textColor: string;
-    displayClear: boolean;
-    isRequired: boolean;
-    accept: string;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
-    id: string;
-    displayBorder?: boolean | undefined;
-    borderColor?: ColorPalette | undefined;
-    rounded?: boolean | undefined;
-    bgColor?: ColorPalette | undefined;
-    buttonText?: string | undefined;
-    buttonTextColor?: ColorPalette | undefined;
-    buttonColor?: ColorPalette | undefined;
-    displayShadow?: boolean | undefined;
-    textColor?: ColorPalette | undefined;
-    displayClear?: boolean | undefined;
-    isRequired?: boolean | undefined;
-    accept?: string | undefined;
-    modelValue?: File | undefined;
-}>, {
-    displayBorder: boolean;
-    borderColor: string;
-    rounded: boolean;
-    bgColor: string;
-    buttonText: string;
-    buttonTextColor: string;
-    buttonColor: string;
-    displayShadow: boolean;
-    textColor: string;
-    displayClear: boolean;
-    isRequired: boolean;
-    accept: string;
-}>>> & {
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-}, {
-    rounded: boolean;
-    textColor: ColorPalette;
-    accept: string;
-    displayBorder: boolean;
-    bgColor: ColorPalette;
-    borderColor: ColorPalette;
-    buttonText: string;
-    buttonTextColor: ColorPalette;
-    buttonColor: ColorPalette;
-    displayShadow: boolean;
-    displayClear: boolean;
-    isRequired: boolean;
-}, {}>;
-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];
-} & {};