@dpa-id-components/dpa-shared-components 17.0.2 → 17.0.4

package/dist/{union-DAqrFTNC.js → union-D3gpS7c4.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as t, createElementVNode as o } from "vue";
-import { _ as n } from "./index-DsevSZCZ.js";
+import { _ as n } from "./index-p6g8sztL.js";
 const r = {}, s = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 24 24"

package/dist/{upload-9IooO4ZK.js → upload-BSUl-gyx.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as o, createElementVNode as r } from "vue";
-import { _ as C } from "./index-DsevSZCZ.js";
+import { _ as C } from "./index-p6g8sztL.js";
 const n = {}, l = {
   width: "24",
   height: "24",

package/dist/{video overlay-BZowCEIQ.js → video overlay-C5PTDf3d.js }

@@ -1,5 +1,5 @@
 import { createElementBlock as o, openBlock as t, createElementVNode as r } from "vue";
-import { _ as n } from "./index-DsevSZCZ.js";
+import { _ as n } from "./index-p6g8sztL.js";
 const l = {}, s = {
   width: "24",
   height: "24",

package/dist/{video-C612Onji.js → video-4DedruE-.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as t, createElementVNode as o } from "vue";
-import { _ as r } from "./index-DsevSZCZ.js";
+import { _ as r } from "./index-p6g8sztL.js";
 const n = {}, s = {
   width: "24",
   height: "24",

package/dist/{video-circled-DvgaZwID.js → video-circled-C9VHt1Kb.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as t, openBlock as o, createElementVNode as r } from "vue";
-import { _ as C } from "./index-DsevSZCZ.js";
+import { _ as C } from "./index-p6g8sztL.js";
 const n = {}, s = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 16 16",

package/dist/{video-filled-CdSIQilZ.js → video-filled-Dne6YsRs.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as t, openBlock as o, createElementVNode as r } from "vue";
-import { _ as n } from "./index-DsevSZCZ.js";
+import { _ as n } from "./index-p6g8sztL.js";
 const s = {}, C = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 16 16",

package/dist/{video-rounded-DMqRkph6.js → video-rounded-Cw_swRDw.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as t, openBlock as o, createElementVNode as r } from "vue";
-import { _ as n } from "./index-DsevSZCZ.js";
+import { _ as n } from "./index-p6g8sztL.js";
 const s = {}, c = {
   width: "24",
   height: "24",

package/dist/{view-kXd83ohh.js → view-fGBBmPng.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as t, createElementVNode as o } from "vue";
-import { _ as r } from "./index-DsevSZCZ.js";
+import { _ as r } from "./index-p6g8sztL.js";
 const n = {}, s = {
   width: "24",
   height: "24",

package/dist/{view-off-CW7A0hbt.js → view-off-XitxxGQh.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as t, createElementVNode as o } from "vue";
-import { _ as r } from "./index-DsevSZCZ.js";
+import { _ as r } from "./index-p6g8sztL.js";
 const n = {}, s = {
   width: "24",
   height: "24",

package/dist/{volume-up-C6O9fq_h.js → volume-up-RQTvQfNe.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as t, createElementVNode as o } from "vue";
-import { _ as r } from "./index-DsevSZCZ.js";
+import { _ as r } from "./index-p6g8sztL.js";
 const n = {}, l = {
   width: "24",
   height: "24",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dpa-id-components/dpa-shared-components",
-  "version": "17.0.2",
+  "version": "17.0.4",
   "description": "Shared Vue components library for dpa projects",
   "files": [
     "src",

package/{dist/src/components/UiCheckBox → src/components/UiCheckbox}/README.md

@@ -4,9 +4,9 @@
 
 ```vue
 <template>
-  <UiCheckBox required name="terms" color="blue">
+  <UiCheckbox required name="terms" color="blue">
     Accept terms and conditions
-  </UiCheckBox>
+  </UiCheckbox>
 </template>
 
 <script setup lang="ts">

package/src/components/UiIcon/UiIcon.vue

@@ -7,14 +7,14 @@
 </template>
 
 <script lang="ts">
-export type UiIconName = (typeof iconNames)[number];
+export type UiIconName = keyof typeof icons;
 </script>
 
 <script setup lang="ts">
 import { computed, defineAsyncComponent, watchEffect } from "vue";
 
 import UiIconLoading from "./UiIconLoading.vue";
-import { iconNames } from "./iconNames.js";
+import { icons } from "./icons.js";
 
 const props = withDefaults(
   defineProps<{
@@ -30,7 +30,7 @@ const props = withDefaults(
 
 const iconComponent = computed(() =>
   defineAsyncComponent({
-    loader: () => import(`../../assets/icons/${props.name}.vue`),
+    loader: icons[props.name] ?? icons.close,
     // Render a substitute element while loading for classes to attach to.
     loadingComponent: UiIconLoading,
     // Immediately render the loadingComponent so that it can receive classes.
@@ -53,7 +53,7 @@ const sizeClass = computed(() => {
 });
 
 watchEffect(() => {
-  if (!iconNames.includes(props.name)) {
+  if (!icons[props.name]) {
     throw new Error(`UiIcon: No icon named “${props.name}” exists.`);
   }
 });

package/src/components/UiIcon/icons.ts

@@ -0,0 +1,187 @@
+export const icons = {
+  activities: () => import("../../assets/icons/activities.vue"),
+  alert: () => import("../../assets/icons/alert.vue"),
+  "alert-fill": () => import("../../assets/icons/alert-fill.vue"),
+  "alert-octagon": () => import("../../assets/icons/alert-octagon.vue"),
+  ai: () => import("../../assets/icons/ai.vue"),
+  apps: () => import("../../assets/icons/apps.vue"),
+  archive: () => import("../../assets/icons/archive.vue"),
+  "arrow-left": () => import("../../assets/icons/arrow-left.vue"),
+  "arrow-nav-left": () => import("../../assets/icons/arrow-nav-left.vue"),
+  "arrow-nav-right": () => import("../../assets/icons/arrow-nav-right.vue"),
+  "arrow-up": () => import("../../assets/icons/arrow-up.vue"),
+  "arrow-right": () => import("../../assets/icons/arrow-right.vue"),
+  "arrow-down": () => import("../../assets/icons/arrow-down.vue"),
+  "arrowhead-left": () => import("../../assets/icons/arrowhead-left.vue"),
+  "arrowhead-right": () => import("../../assets/icons/arrowhead-right.vue"),
+  "arrowhead-top": () => import("../../assets/icons/arrowhead-top.vue"),
+  atmo: () => import("../../assets/icons/atmo.vue"),
+  audio: () => import("../../assets/icons/audio.vue"),
+  "audio-circled": () => import("../../assets/icons/audio-circled.vue"),
+  "audio-filled": () => import("../../assets/icons/audio-filled.vue"),
+  bag: () => import("../../assets/icons/bag.vue"),
+  bell: () => import("../../assets/icons/bell.vue"),
+  "bell-fill": () => import("../../assets/icons/bell-fill.vue"),
+  book: () => import("../../assets/icons/book.vue"),
+  bookmark: () => import("../../assets/icons/bookmark.vue"),
+  "bookmark-fill": () => import("../../assets/icons/bookmark-fill.vue"),
+  "bookmark-outlined": () => import("../../assets/icons/bookmark-outlined.vue"),
+  box: () => import("../../assets/icons/box.vue"),
+  bulb: () => import("../../assets/icons/bulb.vue"),
+  call: () => import("../../assets/icons/call.vue"),
+  camera: () => import("../../assets/icons/camera.vue"),
+  check: () => import("../../assets/icons/check.vue"),
+  checklist: () => import("../../assets/icons/checklist.vue"),
+  checkmark: () => import("../../assets/icons/checkmark.vue"),
+  "checkmark-double": () => import("../../assets/icons/checkmark-double.vue"),
+  "chevron-down": () => import("../../assets/icons/chevron-down.vue"),
+  "chevron-left": () => import("../../assets/icons/chevron-left.vue"),
+  "chevron-right": () => import("../../assets/icons/chevron-right.vue"),
+  "chevron-up": () => import("../../assets/icons/chevron-up.vue"),
+  clipboard: () => import("../../assets/icons/clipboard.vue"),
+  clock: () => import("../../assets/icons/clock.vue"),
+  close: () => import("../../assets/icons/close.vue"),
+  "cloud-save": () => import("../../assets/icons/cloud-save.vue"),
+  code: () => import("../../assets/icons/code.vue"),
+  collapse: () => import("../../assets/icons/collapse.vue"),
+  "color-palette": () => import("../../assets/icons/color-palette.vue"),
+  comment: () => import("../../assets/icons/comment.vue"),
+  "comment-fill": () => import("../../assets/icons/comment-fill.vue"),
+  copy: () => import("../../assets/icons/copy.vue"),
+  "copy-link": () => import("../../assets/icons/copy-link.vue"),
+  delete: () => import("../../assets/icons/delete.vue"),
+  download: () => import("../../assets/icons/download.vue"),
+  "dpa-id": () => import("../../assets/icons/dpa-id.vue"),
+  edit: () => import("../../assets/icons/edit.vue"),
+  "edit-add": () => import("../../assets/icons/edit-add.vue"),
+  eil: () => import("../../assets/icons/eil.vue"),
+  emoji: () => import("../../assets/icons/emoji.vue"),
+  "emoji-add": () => import("../../assets/icons/emoji-add.vue"),
+  envelope: () => import("../../assets/icons/envelope.vue"),
+  event: () => import("../../assets/icons/event.vue"),
+  expand: () => import("../../assets/icons/expand.vue"),
+  "external-link": () => import("../../assets/icons/external-link.vue"),
+  file: () => import("../../assets/icons/file.vue"),
+  "file-pdf": () => import("../../assets/icons/file-pdf.vue"),
+  filter: () => import("../../assets/icons/filter.vue"),
+  "filter-outline": () => import("../../assets/icons/filter-outline.vue"),
+  flag: () => import("../../assets/icons/flag.vue"),
+  "flag-fill": () => import("../../assets/icons/flag-fill.vue"),
+  "flag-filled": () => import("../../assets/icons/flag-filled.vue"),
+  "flag-outline": () => import("../../assets/icons/flag-outline.vue"),
+  flags: () => import("../../assets/icons/flags.vue"),
+  flash: () => import("../../assets/icons/flash.vue"),
+  folder: () => import("../../assets/icons/folder.vue"),
+  "folder-add": () => import("../../assets/icons/folder-add.vue"),
+  "folder-fill": () => import("../../assets/icons/folder-fill.vue"),
+  "folder-filled": () => import("../../assets/icons/folder-filled.vue"),
+  gallery: () => import("../../assets/icons/gallery.vue"),
+  graphic: () => import("../../assets/icons/graphic.vue"),
+  "graphic-circled": () => import("../../assets/icons/graphic-circled.vue"),
+  "graphic-filled": () => import("../../assets/icons/graphic-filled.vue"),
+  graphics: () => import("../../assets/icons/graphics.vue"),
+  "grid-1": () => import("../../assets/icons/grid-1.vue"),
+  "grid-2": () => import("../../assets/icons/grid-2.vue"),
+  "grid-3": () => import("../../assets/icons/grid-3.vue"),
+  "grid-4": () => import("../../assets/icons/grid-4.vue"),
+  "grid-6": () => import("../../assets/icons/grid-6.vue"),
+  "grid-9": () => import("../../assets/icons/grid-9.vue"),
+  "grid-masonry": () => import("../../assets/icons/grid-masonry.vue"),
+  "grid-masonry-9": () => import("../../assets/icons/grid-masonry-9.vue"),
+  help: () => import("../../assets/icons/help.vue"),
+  home: () => import("../../assets/icons/home.vue"),
+  image: () => import("../../assets/icons/image.vue"),
+  "image focus point": () => import("../../assets/icons/image focus point.vue"),
+  "impact-high": () => import("../../assets/icons/impact-high.vue"),
+  "impact-low": () => import("../../assets/icons/impact-low.vue"),
+  "impact-medium": () => import("../../assets/icons/impact-medium.vue"),
+  "impact-very-high": () => import("../../assets/icons/impact-very-high.vue"),
+  "impact-very-low": () => import("../../assets/icons/impact-very-low.vue"),
+  info: () => import("../../assets/icons/info.vue"),
+  "info-fill": () => import("../../assets/icons/info-fill.vue"),
+  "info-filled": () => import("../../assets/icons/info-filled.vue"),
+  label: () => import("../../assets/icons/label.vue"),
+  "label-filled": () => import("../../assets/icons/label-filled.vue"),
+  language: () => import("../../assets/icons/language.vue"),
+  latest: () => import("../../assets/icons/latest.vue"),
+  lightbulb: () => import("../../assets/icons/lightbulb.vue"),
+  list: () => import("../../assets/icons/list.vue"),
+  "list-search": () => import("../../assets/icons/list-search.vue"),
+  lock: () => import("../../assets/icons/lock.vue"),
+  "lock-filled": () => import("../../assets/icons/lock-filled.vue"),
+  mail: () => import("../../assets/icons/mail.vue"),
+  map: () => import("../../assets/icons/map.vue"),
+  "map-outline": () => import("../../assets/icons/map-outline.vue"),
+  menu: () => import("../../assets/icons/menu.vue"),
+  minus: () => import("../../assets/icons/minus.vue"),
+  "more-horizontal": () => import("../../assets/icons/more-horizontal.vue"),
+  "more-vertical": () => import("../../assets/icons/more-vertical.vue"),
+  move: () => import("../../assets/icons/move.vue"),
+  "move-up-down": () => import("../../assets/icons/move-up-down.vue"),
+  navigation: () => import("../../assets/icons/navigation.vue"),
+  note: () => import("../../assets/icons/note.vue"),
+  offline: () => import("../../assets/icons/offline.vue"),
+  package: () => import("../../assets/icons/package.vue"),
+  "paper-plane": () => import("../../assets/icons/paper-plane.vue"),
+  paperplane: () => import("../../assets/icons/paperplane.vue"),
+  pause: () => import("../../assets/icons/pause.vue"),
+  "pause-circle": () => import("../../assets/icons/pause-circle.vue"),
+  pdf: () => import("../../assets/icons/pdf.vue"),
+  pen: () => import("../../assets/icons/pen.vue"),
+  "pen-check": () => import("../../assets/icons/pen-check.vue"),
+  people: () => import("../../assets/icons/people.vue"),
+  phone: () => import("../../assets/icons/phone.vue"),
+  picture: () => import("../../assets/icons/picture.vue"),
+  "picture-circled": () => import("../../assets/icons/picture-circled.vue"),
+  "picture-filled": () => import("../../assets/icons/picture-filled.vue"),
+  pin: () => import("../../assets/icons/pin.vue"),
+  planning: () => import("../../assets/icons/planning.vue"),
+  play: () => import("../../assets/icons/play.vue"),
+  "play-circle": () => import("../../assets/icons/play-circle.vue"),
+  "play-fill": () => import("../../assets/icons/play-fill.vue"),
+  plus: () => import("../../assets/icons/plus.vue"),
+  "plus-circle": () => import("../../assets/icons/plus-circle.vue"),
+  print: () => import("../../assets/icons/print.vue"),
+  refresh: () => import("../../assets/icons/refresh.vue"),
+  reset: () => import("../../assets/icons/reset.vue"),
+  responsive: () => import("../../assets/icons/responsive.vue"),
+  "rubix-thema": () => import("../../assets/icons/rubix-thema.vue"),
+  save: () => import("../../assets/icons/save.vue"),
+  "saved-search": () => import("../../assets/icons/saved-search.vue"),
+  "saved-search-fill": () => import("../../assets/icons/saved-search-fill.vue"),
+  search: () => import("../../assets/icons/search.vue"),
+  settings: () => import("../../assets/icons/settings.vue"),
+  share: () => import("../../assets/icons/share.vue"),
+  "share-alternative": () => import("../../assets/icons/share-alternative.vue"),
+  sidebar: () => import("../../assets/icons/sidebar.vue"),
+  "sidebar-fill": () => import("../../assets/icons/sidebar-fill.vue"),
+  slack: () => import("../../assets/icons/slack.vue"),
+  "slider-config": () => import("../../assets/icons/slider-config.vue"),
+  spellcheck: () => import("../../assets/icons/spellcheck.vue"),
+  spinner: () => import("../../assets/icons/spinner.vue"),
+  "standard-view": () => import("../../assets/icons/standard-view.vue"),
+  star: () => import("../../assets/icons/star.vue"),
+  "star-fill": () => import("../../assets/icons/star-fill.vue"),
+  "star-filled": () => import("../../assets/icons/star-filled.vue"),
+  stop: () => import("../../assets/icons/stop.vue"),
+  story: () => import("../../assets/icons/story.vue"),
+  sync: () => import("../../assets/icons/sync.vue"),
+  tasks: () => import("../../assets/icons/tasks.vue"),
+  text: () => import("../../assets/icons/text.vue"),
+  "text-circled": () => import("../../assets/icons/text-circled.vue"),
+  "text-filled": () => import("../../assets/icons/text-filled.vue"),
+  "thumbs-down": () => import("../../assets/icons/thumbs-down.vue"),
+  "thumbs-up": () => import("../../assets/icons/thumbs-up.vue"),
+  "thumbs-up-double": () => import("../../assets/icons/thumbs-up-double.vue"),
+  topic: () => import("../../assets/icons/topic.vue"),
+  union: () => import("../../assets/icons/union.vue"),
+  upload: () => import("../../assets/icons/upload.vue"),
+  video: () => import("../../assets/icons/video.vue"),
+  "video overlay": () => import("../../assets/icons/video overlay.vue"),
+  "video-circled": () => import("../../assets/icons/video-circled.vue"),
+  "video-filled": () => import("../../assets/icons/video-filled.vue"),
+  "video-rounded": () => import("../../assets/icons/video-rounded.vue"),
+  view: () => import("../../assets/icons/view.vue"),
+  "view-off": () => import("../../assets/icons/view-off.vue"),
+  "volume-up": () => import("../../assets/icons/volume-up.vue"),
+} as const;

package/src/components/UiIconButton/README.md

@@ -17,13 +17,6 @@ Color is set by text color:
 
 ## API
 
-iconName: typeof iconNames[number];
-title: string;
-disabled: boolean;
-backgroundColor: "blue" | "none";
-iconColor: "blue" | "white" | "gray";
-size: "small" | "medium" | "large" | "xl";
-
 ### Props
 
 | Name              | Type                                                 | Default  | Description                                                                           |

package/src/components/UiListItem/UiListItem.vue

@@ -14,7 +14,7 @@
     >
       <span class="flex items-center" data-testid="innerText">
         <span v-if="checkBoxMenu" class="inset-y-0 flex items-center pr-2">
-          <UiCheckBox
+          <UiCheckbox
             :color="checkBoxColor"
             :checked="isChecked"
             :disabled="disabled"
@@ -52,7 +52,7 @@
 
 <script setup lang="ts">
 import { computed } from "vue";
-import UiCheckBox from "../UiCheckBox/UiCheckBox.vue";
+import UiCheckbox from "../UiCheckbox/UiCheckbox.vue";
 import UiIcon, { type UiIconName } from "../UiIcon/UiIcon.vue";
 import { cn } from "../../utils/cn.js";
 

package/src/components/UiMenu/README.md

@@ -82,11 +82,11 @@ Wraps the UiListItem and uses the same settings as in the original UiMenu, helps
 |------------------|-----------------------|-------------|-----------------------------------------------------------|
 | `class?`         | `string`              | `''`        | Classes for the menu, get merged with original classes    |
 | `option?`        | `UiMenuOptionType<T>` | `undefined` | Option like within the `options` array prop of UiMenu.vue |
-| `listVariant?`   | `UiMenuListVariant`   | `blank`     | Provide the list variant, same as in UiMenu.vue           |
-| `iconSize?`      | `UiMenuIconSize`      | `small`     | Provide the icon size, same as in UiMenu.vue              |
-| `imageShape?`    | `UiMenuImageShape`    | `square`    | Provide the imageShape, same as in UiMenu.vue             |
-| `checkboxSize?`  | `UiMenuCheckboxSize`  | `medium`    | Provide the checkboxSize, same as in UiMenu.vue           |
-| `checkboxColor?` | `UiMenuCheckboxColor` | `blue`      | Provide the checkboxColor, same as in UiMenu.vue          |
+| `listVariant?`   | `"checkbox" &#124; "selectable" &#124; "blank"`   | `blank`     | Provide the list variant, same as in UiMenu.vue           |
+| `iconSize?`      | `"small" &#124; "medium" &#124; "large"`      | `small`     | Provide the icon size, same as in UiMenu.vue              |
+| `imageShape?`    | `"rounded" &#124; "square"`    | `square`    | Provide the imageShape, same as in UiMenu.vue             |
+| `checkboxSize?`  | `"small" &#124; "medium"`  | `medium`    | Provide the checkboxSize, same as in UiMenu.vue           |
+| `checkboxColor?` | `"blue" &#124; "gray"` | `blue`      | Provide the checkboxColor, same as in UiMenu.vue          |
 
 #### Slots
 

package/src/components/UiMenu/UiMenu.vue

@@ -149,6 +149,7 @@
     </Transition>
   </div>
 </template>
+
 <script setup lang="ts" generic="Value">
 import { computed, type HTMLAttributes, ref, watchPostEffect } from "vue";
 import {
@@ -165,27 +166,33 @@ import UiListItem from "../UiListItem/UiListItem.vue";
 import { vClickAway } from "../../directives/vClickAway.js";
 import UiButton from "../UiButton/UiButton.vue";
 import UiSimpleInput from "../UiSimpleInput/UiSimpleInput.vue";
-import type {
-  UiMenuCheckboxColor,
-  UiMenuCheckboxSize,
-  UiMenuGroupedOption,
-  UiMenuIconSize,
-  UiMenuImageShape,
-  UiMenuListVariant,
-  UiMenuOptionType,
-  UiMenuSelectedOption,
-} from "./UiMenuTypes";
 import { cn } from "../../utils/cn.js";
 import type { UiIconName } from "../UiIcon/UiIcon.vue";
 
+export type UiMenuOptionType<Value = unknown> = {
+  label: string;
+  imageSrc?: string | undefined;
+  selected: boolean;
+  value: Value;
+};
+
+export type UiMenuSelectedOption<Value = unknown> = UiMenuOptionType<Value> & {
+  index: number;
+};
+
+export type UiMenuGroupedOption<Value = unknown> = {
+  groupLabel: string;
+  options: UiMenuOptionType<Value>[];
+};
+
 defineSlots<{
   // Marking the slot as optional avoids inexplicable TypeScript errors in the storybook story (see https://github.com/vuejs/core/issues/10647).
   default?(props: {
-    checkboxColor: UiMenuCheckboxColor;
-    checkboxSize: UiMenuCheckboxSize;
-    iconSize: UiMenuIconSize;
-    imageShape: UiMenuImageShape;
-    listVariant: UiMenuListVariant;
+    checkboxColor: "blue" | "gray";
+    checkboxSize: "small" | "medium";
+    iconSize: "small" | "medium" | "large";
+    imageShape: "rounded" | "square";
+    listVariant: "checkbox" | "selectable" | "blank";
     options: UiMenuOptionType<Value>[];
     groupedOptions: UiMenuGroupedOption<Value>[];
   }): any;
@@ -204,17 +211,17 @@ const props = withDefaults(
     noTitle?: boolean;
     multiLabel?: string;
     filterButtonSize?: "small" | "xs";
-    iconSize?: UiMenuIconSize;
+    iconSize?: "small" | "medium" | "large";
     iconLeft?: UiIconName | null;
-    imageShape?: UiMenuImageShape;
-    checkboxSize?: UiMenuCheckboxSize;
+    imageShape?: "rounded" | "square";
+    checkboxSize?: "small" | "medium";
     buttonVariant?:
       | "blue-rounded"
       | "white-rounded"
       | "transparent-rounded"
       | "blank";
-    listVariant?: UiMenuListVariant;
-    checkboxColor?: UiMenuCheckboxColor;
+    listVariant?: "checkbox" | "selectable" | "blank";
+    checkboxColor?: "blue" | "gray";
     hasResetOption?: boolean;
     disabledReset?: boolean;
     resetLabel?: string;

package/src/components/UiMenu/UiMenuItem.vue

@@ -23,14 +23,7 @@
 
 <script setup lang="ts" generic="Value">
 import UiListItem from "../UiListItem/UiListItem.vue";
-import type {
-  UiMenuCheckboxColor,
-  UiMenuCheckboxSize,
-  UiMenuIconSize,
-  UiMenuImageShape,
-  UiMenuListVariant,
-  UiMenuOptionType,
-} from "./UiMenuTypes";
+import type { UiMenuOptionType } from "./UiMenu.vue";
 import type { HTMLAttributes } from "vue";
 import { cn } from "../../utils/cn.js";
 
@@ -38,11 +31,11 @@ const props = withDefaults(
   defineProps<{
     class?: HTMLAttributes["class"];
     option?: UiMenuOptionType<Value>;
-    listVariant?: UiMenuListVariant;
-    iconSize?: UiMenuIconSize;
-    imageShape?: UiMenuImageShape;
-    checkboxSize?: UiMenuCheckboxSize;
-    checkboxColor?: UiMenuCheckboxColor;
+    listVariant?: "checkbox" | "selectable" | "blank";
+    iconSize?: "small" | "medium" | "large";
+    imageShape?: "rounded" | "square";
+    checkboxSize?: "small" | "medium";
+    checkboxColor?: "blue" | "gray";
   }>(),
   {
     class: undefined,

package/src/components/index.ts

@@ -4,7 +4,7 @@ import UiBadge from "./UiBadge/UiBadge.vue";
 import UiButton from "./UiButton/UiButton.vue";
 import UiButtonGroup from "./UiButtonGroup/UiButtonGroup.vue";
 import UiCard from "./UiCard/UiCard.vue";
-import UiCheckbox from "./UiCheckBox/UiCheckBox.vue";
+import UiCheckbox from "./UiCheckbox/UiCheckbox.vue";
 import UiCheckBoxGroup from "./UiCheckBoxGroup/UiCheckBoxGroup.vue";
 import UiChip from "./UiChip/UiChip.vue";
 import UiCollapseNavigation from "./UiCollapseNavigation/UiCollapseNavigation.vue";
@@ -25,7 +25,7 @@ export type {
   UiMenuOptionType,
   UiMenuSelectedOption,
   UiMenuGroupedOption,
-} from "./UiMenu/UiMenuTypes.js";
+} from "./UiMenu/UiMenu.vue";
 import UiMenuList from "./UiMenu/UiMenuList.vue";
 import UiMenuItem from "./UiMenu/UiMenuItem.vue";
 import UiOverlay from "./UiOverlay/UiOverlay.vue";

package/dist/components/UiIcon/iconNames.d.ts

@@ -1 +0,0 @@
-export declare const iconNames: readonly ["activities", "alert", "alert-fill", "alert-octagon", "ai", "apps", "archive", "arrow-left", "arrow-nav-left", "arrow-nav-right", "arrow-up", "arrow-right", "arrow-down", "arrowhead-left", "arrowhead-right", "arrowhead-top", "atmo", "audio", "audio-circled", "audio-filled", "bag", "bell", "bell-fill", "book", "bookmark", "bookmark-fill", "bookmark-outlined", "box", "bulb", "call", "camera", "check", "checklist", "checkmark", "checkmark-double", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "clipboard", "clock", "close", "cloud-save", "code", "collapse", "color-palette", "comment", "comment-fill", "copy", "copy-link", "delete", "download", "dpa-id", "edit", "edit-add", "eil", "emoji", "emoji-add", "envelope", "event", "expand", "external-link", "file", "file-pdf", "filter", "filter-outline", "flag", "flag-fill", "flag-filled", "flag-outline", "flags", "flash", "folder", "folder-add", "folder-fill", "folder-filled", "gallery", "graphic", "graphic-circled", "graphic-filled", "graphics", "grid-1", "grid-2", "grid-3", "grid-4", "grid-6", "grid-9", "grid-masonry", "grid-masonry-9", "help", "home", "image", "image focus point", "impact-high", "impact-low", "impact-medium", "impact-very-high", "impact-very-low", "info", "info-fill", "info-filled", "label", "label-filled", "language", "latest", "lightbulb", "list", "list-search", "lock", "lock-filled", "mail", "map", "map-outline", "menu", "minus", "more-horizontal", "more-vertical", "move", "move-up-down", "navigation", "note", "offline", "package", "paper-plane", "paperplane", "pause", "pause-circle", "pdf", "pen", "pen-check", "people", "phone", "picture", "picture-circled", "picture-filled", "pin", "planning", "play", "play-circle", "play-fill", "plus", "plus-circle", "print", "refresh", "reset", "responsive", "rubix-thema", "save", "saved-search", "saved-search-fill", "search", "settings", "share", "share-alternative", "sidebar", "sidebar-fill", "slack", "slider-config", "spellcheck", "spinner", "standard-view", "star", "star-fill", "star-filled", "stop", "story", "sync", "tasks", "text", "text-circled", "text-filled", "thumbs-down", "thumbs-up", "thumbs-up-double", "topic", "union", "upload", "video", "video overlay", "video-circled", "video-filled", "video-rounded", "view", "view-off", "volume-up"];

package/dist/components/UiMenu/UiMenuTypes.d.ts

@@ -1,18 +0,0 @@
-export type UiMenuOptionType<Value = unknown> = {
-    label: string;
-    imageSrc?: string | undefined;
-    selected: boolean;
-    value: Value;
-};
-export type UiMenuSelectedOption<Value = unknown> = UiMenuOptionType<Value> & {
-    index: number;
-};
-export type UiMenuGroupedOption<Value = unknown> = {
-    groupLabel: string;
-    options: UiMenuOptionType<Value>[];
-};
-export type UiMenuListVariant = "checkbox" | "selectable" | "blank";
-export type UiMenuIconSize = "small" | "medium" | "large";
-export type UiMenuImageShape = "rounded" | "square";
-export type UiMenuCheckboxSize = "small" | "medium";
-export type UiMenuCheckboxColor = "blue" | "gray";