ui-thing 0.1.14 → 0.1.15

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## v0.1.15
+
+[compare changes](https://github.com/BayBreezy/ui-thing-cli/compare/v0.1.14...v0.1.15)
+
+### 🏡 Chore
+
+- **release:** V0.1.14 ([16a8485](https://github.com/BayBreezy/ui-thing-cli/commit/16a8485))
+- Update autocomplete component ([27f35dc](https://github.com/BayBreezy/ui-thing-cli/commit/27f35dc))
+- Install packages ([17e6d8a](https://github.com/BayBreezy/ui-thing-cli/commit/17e6d8a))
+
+### ❤️ Contributors
+
+- Behon Baker <behon.baker@yahoo.com>
+
 ## v0.1.14
 
 [compare changes](https://github.com/BayBreezy/ui-thing-cli/compare/v0.1.13...v0.1.14)

package/dist/index.js

@@ -628,18 +628,26 @@ export const buttonStyles = tv({
 
   const props = defineProps<AspectRatioProps>();
 </script>
-`}],utils:[],composables:[],plugins:[]},{name:"Autocomplete",value:"autocomplete",devDeps:["@vueuse/core"],files:[{fileName:"Autocomplete/Anchor.vue",dirPath:"components/UI",fileContent:`<template>
-  <ComboboxAnchor v-bind="props">
-    <slot />
-  </ComboboxAnchor>
-</template>
-
-<script lang="ts" setup>
-  import { ComboboxAnchor } from "radix-vue";
-  import type { ComboboxAnchorProps } from "radix-vue";
-
-  const props = defineProps<ComboboxAnchorProps>();
-</script>
+`}],utils:[],composables:[],plugins:[]},{name:"Autocomplete",value:"autocomplete",devDeps:["@vueuse/core"],files:[{fileName:"Autocomplete/Anchor.vue",dirPath:"components/UI",fileContent:`<template>\r
+  <ComboboxAnchor v-bind="props" :class="styles({ class: props.class })">\r
+    <slot />\r
+  </ComboboxAnchor>\r
+</template>\r
+\r
+<script lang="ts" setup>\r
+  import { ComboboxAnchor } from "radix-vue";\r
+  import type { ComboboxAnchorProps } from "radix-vue";\r
+\r
+  const props = defineProps<\r
+    ComboboxAnchorProps & {\r
+      class?: any;\r
+    }\r
+  >();\r
+\r
+  const styles = tv({\r
+    base: "flex h-10 w-full items-center rounded-md border border-input bg-background px-3 py-2 ring-offset-background focus-within:outline-none focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",\r
+  });\r
+</script>\r
 `},{fileName:"Autocomplete/Arrow.vue",dirPath:"components/UI",fileContent:`<template>
   <ComboboxArrow v-bind="props" :class="styles({ class: props.class })" />
 </template>
@@ -658,21 +666,28 @@ export const buttonStyles = tv({
     base: "rotate-45 border bg-muted",
   });
 </script>
-`},{fileName:"Autocomplete/Autocomplete.vue",dirPath:"components/UI",fileContent:`<template>
-  <ComboboxRoot v-bind="forwarded">
-    <slot />
-  </ComboboxRoot>
-</template>
-
-<script lang="ts" setup>
-  import { ComboboxRoot, useForwardPropsEmits } from "radix-vue";
-  import type { ComboboxRootEmits, ComboboxRootProps } from "radix-vue";
-
-  const props = defineProps<ComboboxRootProps>();
-
-  const emits = defineEmits<ComboboxRootEmits>();
-  const forwarded = useForwardPropsEmits(props, emits);
-</script>
+`},{fileName:"Autocomplete/Autocomplete.vue",dirPath:"components/UI",fileContent:`<template>\r
+  <ComboboxRoot v-bind="forwarded" :class="styles({ class: props.class })">\r
+    <slot />\r
+  </ComboboxRoot>\r
+</template>\r
+\r
+<script lang="ts" setup>\r
+  import { ComboboxRoot, useForwardPropsEmits } from "radix-vue";\r
+  import type { ComboboxRootEmits, ComboboxRootProps } from "radix-vue";\r
+\r
+  const props = defineProps<\r
+    ComboboxRootProps & {\r
+      class?: any;\r
+    }\r
+  >();\r
+\r
+  const emits = defineEmits<ComboboxRootEmits>();\r
+  const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);\r
+  const styles = tv({\r
+    base: "relative",\r
+  });\r
+</script>\r
 `},{fileName:"Autocomplete/Cancel.vue",dirPath:"components/UI",fileContent:`<template>
   <ComboboxCancel v-bind="props">
     <slot />
@@ -685,41 +700,43 @@ export const buttonStyles = tv({
 
   const props = defineProps<ComboboxCancelProps>();
 </script>
-`},{fileName:"Autocomplete/Content.vue",dirPath:"components/UI",fileContent:`<template>
-  <ComboboxContent v-bind="forwarded" :class="styles({ class: props.class })">
-    <UiAutocompleteViewport>
-      <slot />
-    </UiAutocompleteViewport>
-  </ComboboxContent>
-</template>
-
-<script lang="ts" setup>
-  import { ComboboxContent, useForwardPropsEmits } from "radix-vue";
-  import type { ComboboxContentEmits, ComboboxContentProps } from "radix-vue";
-
-  defineOptions({ inheritAttrs: false });
-  const props = withDefaults(
-    defineProps<
-      ComboboxContentProps & {
-        class?: any;
-      }
-    >(),
-    {
-      position: "popper",
-      bodyLock: true,
-      side: "bottom",
-      sideOffset: 8,
-      class: undefined,
-    }
-  );
-
-  const emits = defineEmits<ComboboxContentEmits>();
-  const forwarded = useForwardPropsEmits(props, emits);
-
-  const styles = tv({
-    base: "z-50 w-[var(--radix-combobox-trigger-width)] min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-  });
-</script>
+`},{fileName:"Autocomplete/Content.vue",dirPath:"components/UI",fileContent:`<template>\r
+  <!-- <UiAutocompletePortal> -->\r
+  <ComboboxContent v-bind="forwarded" :class="styles({ class: props.class })">\r
+    <UiAutocompleteViewport>\r
+      <slot />\r
+    </UiAutocompleteViewport>\r
+  </ComboboxContent>\r
+  <!-- </UiAutocompletePortal> -->\r
+</template>\r
+\r
+<script lang="ts" setup>\r
+  import { ComboboxContent, useForwardPropsEmits } from "radix-vue";\r
+  import type { ComboboxContentEmits, ComboboxContentProps } from "radix-vue";\r
+\r
+  defineOptions({ inheritAttrs: false });\r
+  const props = withDefaults(\r
+    defineProps<\r
+      ComboboxContentProps & {\r
+        class?: any;\r
+      }\r
+    >(),\r
+    {\r
+      position: "popper",\r
+      bodyLock: true,\r
+      side: "bottom",\r
+      sideOffset: 8,\r
+      class: undefined,\r
+    }\r
+  );\r
+\r
+  const emits = defineEmits<ComboboxContentEmits>();\r
+  const forwarded = useForwardPropsEmits(props, emits);\r
+\r
+  const styles = tv({\r
+    base: "z-50 max-h-[300px] w-[var(--radix-popper-anchor-width)] min-w-[8rem] overflow-hidden overflow-y-auto rounded-md border bg-popover p-1 text-accent-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",\r
+  });\r
+</script>\r
 `},{fileName:"Autocomplete/Empty.vue",dirPath:"components/UI",fileContent:`<template>
   <ComboboxEmpty v-bind="props">
     <slot />
@@ -744,27 +761,25 @@ export const buttonStyles = tv({
 
   const props = defineProps<ComboboxGroupProps>();
 </script>
-`},{fileName:"Autocomplete/Input.vue",dirPath:"components/UI",fileContent:`<template>
-  <ComboboxInput v-bind="props" :class="styles({ class: props.class })" />
-</template>
-
-<script lang="ts" setup>
-  import { ComboboxInput } from "radix-vue";
-  import type { ComboboxInputProps } from "radix-vue";
-
-  const props = defineProps<
-    ComboboxInputProps & {
-      type?: string;
-      disabled?: boolean;
-      autoFocus?: boolean;
-      class?: any;
-    }
-  >();
-
-  const styles = tv({
-    base: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground file:hover:cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",
-  });
-</script>
+`},{fileName:"Autocomplete/Input.vue",dirPath:"components/UI",fileContent:`<template>\r
+  <ComboboxInput v-bind="props" :class="styles({ class: props.class })" />\r
+</template>\r
+\r
+<script lang="ts" setup>\r
+  import { ComboboxInput } from "radix-vue";\r
+  import type { ComboboxInputProps } from "radix-vue";\r
+\r
+  const props = defineProps<\r
+    ComboboxInputProps & {\r
+      placeholder?: string;\r
+      class?: any;\r
+    }\r
+  >();\r
+\r
+  const styles = tv({\r
+    base: "size-full grow rounded-md bg-background placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\r
+  });\r
+</script>\r
 `},{fileName:"Autocomplete/Item.vue",dirPath:"components/UI",fileContent:`<template>
   <ComboboxItem v-bind="forwarded" :class="styles({ class: props.class })">
     <slot name="icon">
@@ -832,18 +847,18 @@ export const buttonStyles = tv({
     base: "px-2 py-1.5 pl-9 text-sm font-medium text-muted-foreground",
   });
 </script>
-`},{fileName:"Autocomplete/Portal.vue",dirPath:"components/UI",fileContent:`<template>
-  <ComboboxPortal v-bind="props">
-    <slot />
-  </ComboboxPortal>
-</template>
-
-<script lang="ts" setup>
-  import { ComboboxPortal } from "radix-vue";
-  import type { ComboboxPortalProps } from "radix-vue";
-
-  const props = defineProps<ComboboxPortalProps>();
-</script>
+`},{fileName:"Autocomplete/Portal.vue",dirPath:"components/UI",fileContent:`<template>\r
+  <ComboboxPortal position="popper" v-bind="props">\r
+    <slot />\r
+  </ComboboxPortal>\r
+</template>\r
+\r
+<script lang="ts" setup>\r
+  import { ComboboxPortal } from "radix-vue";\r
+  import type { ComboboxPortalProps } from "radix-vue";\r
+\r
+  const props = defineProps<ComboboxPortalProps>();\r
+</script>\r
 `},{fileName:"Autocomplete/Separator.vue",dirPath:"components/UI",fileContent:`<template>
   <ComboboxSeparator v-bind="props">
     <slot />
@@ -856,18 +871,26 @@ export const buttonStyles = tv({
 
   const props = defineProps<ComboboxSeparatorProps>();
 </script>
-`},{fileName:"Autocomplete/Trigger.vue",dirPath:"components/UI",fileContent:`<template>
-  <ComboboxTrigger v-bind="props">
-    <slot />
-  </ComboboxTrigger>
-</template>
-
-<script lang="ts" setup>
-  import { ComboboxTrigger } from "radix-vue";
-  import type { ComboboxTriggerProps } from "radix-vue";
-
-  const props = defineProps<ComboboxTriggerProps>();
-</script>
+`},{fileName:"Autocomplete/Trigger.vue",dirPath:"components/UI",fileContent:`<template>\r
+  <ComboboxTrigger v-bind="props">\r
+    <slot />\r
+  </ComboboxTrigger>\r
+</template>\r
+\r
+<script lang="ts" setup>\r
+  import { ComboboxTrigger } from "radix-vue";\r
+  import type { ComboboxTriggerProps } from "radix-vue";\r
+\r
+  const props = defineProps<\r
+    ComboboxTriggerProps & {\r
+      class?: any;\r
+    }\r
+  >();\r
+\r
+  const styles = tv({\r
+    base: "inline-flex shrink-0 cursor-pointer items-center justify-center",\r
+  });\r
+</script>\r
 `},{fileName:"Autocomplete/Viewport.vue",dirPath:"components/UI",fileContent:`<template>
   <ComboboxViewport v-bind="props">
     <slot />