design-system-next 2.11.15 → 2.11.17

package/src/components/tabs/tabs.ts

@@ -1,43 +1,43 @@
-import type { PropType, ExtractPropTypes, Component } from 'vue';
-
-export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
-
-type List = {
-  label: string;
-  icon?: string;
-  iconFill?: Component;
-  disabled?: boolean;
-};
-
-export const tabsPropTypes = {
-  /**
-   * @description Tabs List,
-   * option list: label, icon, iconFill, disabled
-   */
-  list: {
-    type: Array<List>,
-    default: () => [],
-  },
-  /**
-   * @description Tabs Type (underlined, not underlined)
-   */
-  underlined: {
-    type: Boolean,
-    default: false,
-  },
-  /**
-   * @description Active Tab
-   */
-  activeTab: {
-    type: String,
-    default: '',
-  },
-};
-
-export const tabsEmitTypes = {
-  tabIndex: (index: number): index is number => typeof index === 'number',
-};
-
-export type TabsPropTypes = ExtractPropTypes<typeof tabsPropTypes>;
-
-export type TabsEmitTypes = typeof tabsEmitTypes;
+import type { PropType, ExtractPropTypes, Component } from 'vue';
+
+export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
+
+type List = {
+  label: string;
+  icon?: string;
+  iconFill?: Component;
+  disabled?: boolean;
+};
+
+export const tabsPropTypes = {
+  /**
+   * @description Tabs List,
+   * option list: label, icon, iconFill, disabled
+   */
+  list: {
+    type: Array<List>,
+    default: () => [],
+  },
+  /**
+   * @description Tabs Type (underlined, not underlined)
+   */
+  underlined: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * @description Active Tab
+   */
+  activeTab: {
+    type: String,
+    default: '',
+  },
+};
+
+export const tabsEmitTypes = {
+  tabIndex: (index: number): index is number => typeof index === 'number',
+};
+
+export type TabsPropTypes = ExtractPropTypes<typeof tabsPropTypes>;
+
+export type TabsEmitTypes = typeof tabsEmitTypes;

package/src/components/textarea/textarea.ts

@@ -1,72 +1,72 @@
-import type { PropType, ExtractPropTypes } from 'vue';
-
-export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
-
-export const textAreaPropTypes = {
-  id: {
-    type: String,
-    default: '',
-  },
-  modelValue: {
-    type: String,
-    default: '',
-  },
-  label: {
-    type: String,
-    default: '',
-  },
-  placeholder: {
-    type: String,
-    default: '',
-  },
-  active: {
-    type: Boolean,
-    default: false,
-  },
-  disabled: {
-    type: Boolean,
-    default: false,
-  },
-  readonly: {
-    type: Boolean,
-    default: false,
-  },
-  error: {
-    type: Boolean,
-    default: false,
-  },
-  minLength: {
-    type: Number,
-  },
-  maxLength: {
-    type: Number,
-  },
-  rows: {
-    type: Number,
-    default: 4,
-  },
-  displayHelper: {
-    type: Boolean,
-    default: false,
-  },
-  helperIcon: {
-    type: String,
-    default: null,
-  },
-  helperText: {
-    type: String,
-    default: '',
-  },
-  hasCounter: {
-    type: Boolean,
-    default: false,
-  },
-};
-
-export const textAreaEmitTypes = {
-  'update:modelValue': (value: string) => typeof value === 'string',
-};
-
-export type TextAreaEmitTypes = { 'update:modelValue': typeof textAreaEmitTypes };
-
-export type TextAreaPropTypes = ExtractPropTypes<typeof textAreaPropTypes>;
+import type { PropType, ExtractPropTypes } from 'vue';
+
+export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
+
+export const textAreaPropTypes = {
+  id: {
+    type: String,
+    default: '',
+  },
+  modelValue: {
+    type: String,
+    default: '',
+  },
+  label: {
+    type: String,
+    default: '',
+  },
+  placeholder: {
+    type: String,
+    default: '',
+  },
+  active: {
+    type: Boolean,
+    default: false,
+  },
+  disabled: {
+    type: Boolean,
+    default: false,
+  },
+  readonly: {
+    type: Boolean,
+    default: false,
+  },
+  error: {
+    type: Boolean,
+    default: false,
+  },
+  minLength: {
+    type: Number,
+  },
+  maxLength: {
+    type: Number,
+  },
+  rows: {
+    type: Number,
+    default: 4,
+  },
+  displayHelper: {
+    type: Boolean,
+    default: false,
+  },
+  helperIcon: {
+    type: String,
+    default: null,
+  },
+  helperText: {
+    type: String,
+    default: '',
+  },
+  hasCounter: {
+    type: Boolean,
+    default: false,
+  },
+};
+
+export const textAreaEmitTypes = {
+  'update:modelValue': (value: string) => typeof value === 'string',
+};
+
+export type TextAreaEmitTypes = { 'update:modelValue': typeof textAreaEmitTypes };
+
+export type TextAreaPropTypes = ExtractPropTypes<typeof textAreaPropTypes>;

package/src/components/textarea/textarea.vue

@@ -1,45 +1,45 @@
-<template>
-  <div :class="textareaClasses.wrapperClasses">
-    <label v-if="label" :for="id" :class="textareaClasses.labelClasses">{{ label }}</label>
-    <textarea
-      v-bind="$attrs"
-      :id="props.id"
-      :class="textareaClasses.textAreaClasses"
-      :rows="rows"
-      :placeholder="placeholder"
-      :value="modelValue"
-      :minlength="props.minLength"
-      :maxlength="props.maxLength"
-      :readonly="readonly"
-      :disabled="props.disabled"
-      @input="onInput"
-    ></textarea>
-
-    <div :class="textareaClasses.slotWrapperClasses">
-      <div v-if="props.displayHelper" :class="textareaClasses.helperClasses">
-        <slot name="helperMessage">
-          <Icon v-if="props.helperIcon" :icon="props.helperIcon" width="20px" height="20px" />
-          <span>{{ props.helperText }}</span>
-        </slot>
-      </div>
-
-      <div v-if="props.hasCounter && props.maxLength" :class="textareaClasses.helperClasses">
-        <slot name="counter">
-          <span>{{ `${modelValue.length}/${props.maxLength}` }}</span>
-        </slot>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { Icon } from '@iconify/vue';
-
-import { textAreaPropTypes, textAreaEmitTypes } from './textarea';
-import { useTextArea } from './use-textarea';
-
-const props = defineProps(textAreaPropTypes);
-const emit = defineEmits(textAreaEmitTypes);
-
-const { onInput, textareaClasses } = useTextArea(props, emit);
-</script>
+<template>
+  <div :class="textareaClasses.wrapperClasses">
+    <label v-if="label" :for="id" :class="textareaClasses.labelClasses">{{ label }}</label>
+    <textarea
+      v-bind="$attrs"
+      :id="props.id"
+      :class="textareaClasses.textAreaClasses"
+      :rows="rows"
+      :placeholder="placeholder"
+      :value="modelValue"
+      :minlength="props.minLength"
+      :maxlength="props.maxLength"
+      :readonly="readonly"
+      :disabled="props.disabled"
+      @input="onInput"
+    ></textarea>
+
+    <div :class="textareaClasses.slotWrapperClasses">
+      <div v-if="props.displayHelper" :class="textareaClasses.helperClasses">
+        <slot name="helperMessage">
+          <Icon v-if="props.helperIcon" :icon="props.helperIcon" width="20px" height="20px" />
+          <span>{{ props.helperText }}</span>
+        </slot>
+      </div>
+
+      <div v-if="props.hasCounter && props.maxLength" :class="textareaClasses.helperClasses">
+        <slot name="counter">
+          <span>{{ `${modelValue.length}/${props.maxLength}` }}</span>
+        </slot>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { Icon } from '@iconify/vue';
+
+import { textAreaPropTypes, textAreaEmitTypes } from './textarea';
+import { useTextArea } from './use-textarea';
+
+const props = defineProps(textAreaPropTypes);
+const emit = defineEmits(textAreaEmitTypes);
+
+const { onInput, textareaClasses } = useTextArea(props, emit);
+</script>

package/src/components/time-picker/time-picker.ts

@@ -1,69 +1,69 @@
-import type { PropType, ExtractPropTypes } from 'vue';
-
-export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
-
-export const timePickerPropTypes = {
-  modelValue: {
-    type: String,
-    required: true,
-  },
-  label: {
-    type: String,
-    default: '',
-  },
-  error: {
-    type: Boolean,
-    default: false,
-  },
-  disabled: {
-    type: Boolean,
-    default: false,
-  },
-  /**
-   * @description Interval in minutes
-   */
-  interval: {
-    type: Number,
-    default: 30,
-  },
-  /**
-   * @description '24' for 24-hour format, '12' for 12-hour format
-   */
-  format: {
-    type: String,
-    default: '24',
-  },
-  /**
-   * @description disable user to type
-   */
-  disableTyping: {
-    type: Boolean,
-    default: false,
-  },
-  /**
-   * @description disable user to type
-   */
-  fullWidth: {
-    type: Boolean,
-    default: false,
-  },
-  helperText: {
-    type: String,
-    default: '',
-  },
-  placeholder: {
-    type: String,
-    default: '',
-  },
-  id: {
-    type: String,
-    default: 'time-picker',
-  },
-};
-export const timePickerEmitTypes = {
-  'update:modelValue': (evt: MouseEvent): evt is MouseEvent => evt instanceof MouseEvent,
-};
-export type TimePickerEmitTypes = {
-  'update:modelValue': string;
-};
-export type TimePickerPropTypes = ExtractPropTypes<typeof timePickerPropTypes>;
+import type { PropType, ExtractPropTypes } from 'vue';
+
+export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
+
+export const timePickerPropTypes = {
+  modelValue: {
+    type: String,
+    required: true,
+  },
+  label: {
+    type: String,
+    default: '',
+  },
+  error: {
+    type: Boolean,
+    default: false,
+  },
+  disabled: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * @description Interval in minutes
+   */
+  interval: {
+    type: Number,
+    default: 30,
+  },
+  /**
+   * @description '24' for 24-hour format, '12' for 12-hour format
+   */
+  format: {
+    type: String,
+    default: '24',
+  },
+  /**
+   * @description disable user to type
+   */
+  disableTyping: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * @description disable user to type
+   */
+  fullWidth: {
+    type: Boolean,
+    default: false,
+  },
+  helperText: {
+    type: String,
+    default: '',
+  },
+  placeholder: {
+    type: String,
+    default: '',
+  },
+  id: {
+    type: String,
+    default: 'time-picker',
+  },
+};
+export const timePickerEmitTypes = {
+  'update:modelValue': (evt: MouseEvent): evt is MouseEvent => evt instanceof MouseEvent,
+};
+export type TimePickerEmitTypes = {
+  'update:modelValue': string;
+};
+export type TimePickerPropTypes = ExtractPropTypes<typeof timePickerPropTypes>;

package/src/components/tooltip/tooltip.ts

@@ -1,46 +1,46 @@
-import type { PropType, ExtractPropTypes } from 'vue';
-
-export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
-
-const PLACEMENTS = [
-  'top',
-  'top-start',
-  'top-end',
-  'bottom',
-  'bottom-start',
-  'bottom-end',
-  'left',
-  'left-start',
-  'left-end',
-  'right',
-  'right-start',
-  'right-end',
-] as const;
-
-export const tooltipPropTypes = {
-  /**
-   * @description Tooltip Label
-   */
-  text: {
-    type: String,
-    default: '',
-  },
-  /**
-   * @description Tooltip Placement
-   */
-  placement: {
-    type: String,
-    validator: (value: (typeof PLACEMENTS)[number]) => PLACEMENTS.includes(value),
-    default: 'top',
-  },
-  hasMaxWidth: {
-    type: Boolean,
-    default: true,
-  },
-  fitContent: {
-    type: Boolean,
-    default: true
-  }
-};
-
-export type TooltipPropTypes = ExtractPropTypes<typeof tooltipPropTypes>;
+import type { PropType, ExtractPropTypes } from 'vue';
+
+export const definePropType = <T>(val: unknown): PropType<T> => val as PropType<T>;
+
+const PLACEMENTS = [
+  'top',
+  'top-start',
+  'top-end',
+  'bottom',
+  'bottom-start',
+  'bottom-end',
+  'left',
+  'left-start',
+  'left-end',
+  'right',
+  'right-start',
+  'right-end',
+] as const;
+
+export const tooltipPropTypes = {
+  /**
+   * @description Tooltip Label
+   */
+  text: {
+    type: String,
+    default: '',
+  },
+  /**
+   * @description Tooltip Placement
+   */
+  placement: {
+    type: String,
+    validator: (value: (typeof PLACEMENTS)[number]) => PLACEMENTS.includes(value),
+    default: 'top',
+  },
+  hasMaxWidth: {
+    type: Boolean,
+    default: true,
+  },
+  fitContent: {
+    type: Boolean,
+    default: true
+  }
+};
+
+export type TooltipPropTypes = ExtractPropTypes<typeof tooltipPropTypes>;

package/src/components/tooltip/use-tooltip.ts

@@ -1,13 +1,13 @@
-import { ref } from 'vue';
-
-import { Placement } from 'floating-vue';
-
-import { TooltipPropTypes } from './tooltip';
-
-export const useTooltip = (props: TooltipPropTypes) => {
-  const placement = ref(props.placement as Placement);
-
-  return {
-    placement,
-  };
-};
+import { ref } from 'vue';
+
+import { Placement } from 'floating-vue';
+
+import { TooltipPropTypes } from './tooltip';
+
+export const useTooltip = (props: TooltipPropTypes) => {
+  const placement = ref(props.placement as Placement);
+
+  return {
+    placement,
+  };
+};