ui-thing 0.1.14 → 0.1.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/dist/index.js +297 -127
  3. package/dist/index.js.map +1 -1
  4. package/package.json +1 -1
  5. package/src/comps.ts +63 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ui-thing",
3
- "version": "0.1.14",
3
+ "version": "0.1.16",
4
4
  "description": "CLI used to add Nuxt 3 components to a project",
5
5
  "type": "module",
6
6
  "types": "./dist/index.d.ts",
package/src/comps.ts CHANGED
@@ -174,7 +174,7 @@ export default [
174
174
  fileName: "Autocomplete/Anchor.vue",
175
175
  dirPath: "components/UI",
176
176
  fileContent:
177
- '<template>\n <ComboboxAnchor v-bind="props">\n <slot />\n </ComboboxAnchor>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxAnchor } from "radix-vue";\n import type { ComboboxAnchorProps } from "radix-vue";\n\n const props = defineProps<ComboboxAnchorProps>();\n</script>\n',
177
+ '<template>\r\n <ComboboxAnchor v-bind="props" :class="styles({ class: props.class })">\r\n <slot />\r\n </ComboboxAnchor>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ComboboxAnchor } from "radix-vue";\r\n import type { ComboboxAnchorProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n ComboboxAnchorProps & {\r\n class?: any;\r\n }\r\n >();\r\n\r\n const styles = tv({\r\n 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\n });\r\n</script>\r\n',
178
178
  },
179
179
  {
180
180
  fileName: "Autocomplete/Arrow.vue",
@@ -186,7 +186,7 @@ export default [
186
186
  fileName: "Autocomplete/Autocomplete.vue",
187
187
  dirPath: "components/UI",
188
188
  fileContent:
189
- '<template>\n <ComboboxRoot v-bind="forwarded">\n <slot />\n </ComboboxRoot>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxRoot, useForwardPropsEmits } from "radix-vue";\n import type { ComboboxRootEmits, ComboboxRootProps } from "radix-vue";\n\n const props = defineProps<ComboboxRootProps>();\n\n const emits = defineEmits<ComboboxRootEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n</script>\n',
189
+ '<template>\r\n <ComboboxRoot v-bind="forwarded" :class="styles({ class: props.class })">\r\n <slot />\r\n </ComboboxRoot>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ComboboxRoot, useForwardPropsEmits } from "radix-vue";\r\n import type { ComboboxRootEmits, ComboboxRootProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n ComboboxRootProps & {\r\n class?: any;\r\n }\r\n >();\r\n\r\n const emits = defineEmits<ComboboxRootEmits>();\r\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);\r\n const styles = tv({\r\n base: "relative",\r\n });\r\n</script>\r\n',
190
190
  },
191
191
  {
192
192
  fileName: "Autocomplete/Cancel.vue",
@@ -198,7 +198,7 @@ export default [
198
198
  fileName: "Autocomplete/Content.vue",
199
199
  dirPath: "components/UI",
200
200
  fileContent:
201
- '<template>\n <ComboboxContent v-bind="forwarded" :class="styles({ class: props.class })">\n <UiAutocompleteViewport>\n <slot />\n </UiAutocompleteViewport>\n </ComboboxContent>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxContent, useForwardPropsEmits } from "radix-vue";\n import type { ComboboxContentEmits, ComboboxContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = withDefaults(\n defineProps<\n ComboboxContentProps & {\n class?: any;\n }\n >(),\n {\n position: "popper",\n bodyLock: true,\n side: "bottom",\n sideOffset: 8,\n class: undefined,\n }\n );\n\n const emits = defineEmits<ComboboxContentEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n 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",\n });\n</script>\n',
201
+ '<template>\r\n <!-- <UiAutocompletePortal> -->\r\n <ComboboxContent v-bind="forwarded" :class="styles({ class: props.class })">\r\n <UiAutocompleteViewport>\r\n <slot />\r\n </UiAutocompleteViewport>\r\n </ComboboxContent>\r\n <!-- </UiAutocompletePortal> -->\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ComboboxContent, useForwardPropsEmits } from "radix-vue";\r\n import type { ComboboxContentEmits, ComboboxContentProps } from "radix-vue";\r\n\r\n defineOptions({ inheritAttrs: false });\r\n const props = withDefaults(\r\n defineProps<\r\n ComboboxContentProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n position: "popper",\r\n bodyLock: true,\r\n side: "bottom",\r\n sideOffset: 8,\r\n class: undefined,\r\n }\r\n );\r\n\r\n const emits = defineEmits<ComboboxContentEmits>();\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n\r\n const styles = tv({\r\n 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\n });\r\n</script>\r\n',
202
202
  },
203
203
  {
204
204
  fileName: "Autocomplete/Empty.vue",
@@ -216,7 +216,7 @@ export default [
216
216
  fileName: "Autocomplete/Input.vue",
217
217
  dirPath: "components/UI",
218
218
  fileContent:
219
- '<template>\n <ComboboxInput v-bind="props" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { ComboboxInput } from "radix-vue";\n import type { ComboboxInputProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxInputProps & {\n type?: string;\n disabled?: boolean;\n autoFocus?: boolean;\n class?: any;\n }\n >();\n\n const styles = tv({\n 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",\n });\n</script>\n',
219
+ '<template>\r\n <ComboboxInput v-bind="props" :class="styles({ class: props.class })" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ComboboxInput } from "radix-vue";\r\n import type { ComboboxInputProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n ComboboxInputProps & {\r\n placeholder?: string;\r\n class?: any;\r\n }\r\n >();\r\n\r\n const styles = tv({\r\n 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\n });\r\n</script>\r\n',
220
220
  },
221
221
  {
222
222
  fileName: "Autocomplete/Item.vue",
@@ -240,7 +240,7 @@ export default [
240
240
  fileName: "Autocomplete/Portal.vue",
241
241
  dirPath: "components/UI",
242
242
  fileContent:
243
- '<template>\n <ComboboxPortal v-bind="props">\n <slot />\n </ComboboxPortal>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxPortal } from "radix-vue";\n import type { ComboboxPortalProps } from "radix-vue";\n\n const props = defineProps<ComboboxPortalProps>();\n</script>\n',
243
+ '<template>\r\n <ComboboxPortal position="popper" v-bind="props">\r\n <slot />\r\n </ComboboxPortal>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ComboboxPortal } from "radix-vue";\r\n import type { ComboboxPortalProps } from "radix-vue";\r\n\r\n const props = defineProps<ComboboxPortalProps>();\r\n</script>\r\n',
244
244
  },
245
245
  {
246
246
  fileName: "Autocomplete/Separator.vue",
@@ -252,7 +252,7 @@ export default [
252
252
  fileName: "Autocomplete/Trigger.vue",
253
253
  dirPath: "components/UI",
254
254
  fileContent:
255
- '<template>\n <ComboboxTrigger v-bind="props">\n <slot />\n </ComboboxTrigger>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxTrigger } from "radix-vue";\n import type { ComboboxTriggerProps } from "radix-vue";\n\n const props = defineProps<ComboboxTriggerProps>();\n</script>\n',
255
+ '<template>\r\n <ComboboxTrigger v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\r\n <slot />\r\n </ComboboxTrigger>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ComboboxTrigger } from "radix-vue";\r\n import type { ComboboxTriggerProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n ComboboxTriggerProps & {\r\n class?: any;\r\n }\r\n >();\r\n\r\n const styles = tv({\r\n base: "inline-flex shrink-0 cursor-pointer items-center justify-center",\r\n });\r\n</script>\r\n',
256
256
  },
257
257
  {
258
258
  fileName: "Autocomplete/Viewport.vue",
@@ -1209,6 +1209,63 @@ export default [
1209
1209
  composables: [],
1210
1210
  plugins: [],
1211
1211
  },
1212
+ {
1213
+ name: "Listbox",
1214
+ value: "listbox",
1215
+ files: [
1216
+ {
1217
+ fileName: "Listbox/Content.vue",
1218
+ dirPath: "components/UI",
1219
+ fileContent:
1220
+ '<template>\n <ListboxContent v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </ListboxContent>\n</template>\n\n<script lang="ts" setup>\n import { ListboxContent, useForwardProps } from "radix-vue";\n import type { ListboxContentProps } from "radix-vue";\n\n const props = defineProps<ListboxContentProps & { class?: any }>();\n const forwarded = useForwardProps(reactiveOmit(props));\n\n const styles = tv({\n base: "max-h-[300px] w-full overflow-y-auto rounded-md border bg-popover px-4 py-2",\n });\n</script>\n',
1221
+ },
1222
+ {
1223
+ fileName: "Listbox/Filter.vue",
1224
+ dirPath: "components/UI",
1225
+ fileContent:
1226
+ '<template>\n <ListboxFilter v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { ListboxFilter, useForwardPropsEmits } from "radix-vue";\n import type { ListboxFilterEmits, ListboxFilterProps } from "radix-vue";\n\n const props = defineProps<ListboxFilterProps & { class?: any; placeholder?: string }>();\n const emits = defineEmits<ListboxFilterEmits>();\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);\n\n const styles = tv({\n base: "h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-[16px] 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",\n });\n</script>\n',
1227
+ },
1228
+ {
1229
+ fileName: "Listbox/Group.vue",
1230
+ dirPath: "components/UI",
1231
+ fileContent:
1232
+ '<template>\n <ListboxGroup v-bind="forwarded">\n <slot />\n </ListboxGroup>\n</template>\n\n<script lang="ts" setup>\n import { ListboxGroup, useForwardPropsEmits } from "radix-vue";\n import type { ListboxGroupProps } from "radix-vue";\n\n const props = defineProps<ListboxGroupProps>();\n const forwarded = useForwardPropsEmits(props);\n</script>\n',
1233
+ },
1234
+ {
1235
+ fileName: "Listbox/GroupLabel.vue",
1236
+ dirPath: "components/UI",
1237
+ fileContent:
1238
+ '<template>\n <ListboxGroupLabel v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </ListboxGroupLabel>\n</template>\n\n<script lang="ts" setup>\n import { ListboxGroupLabel, useForwardProps } from "radix-vue";\n import type { ListboxGroupLabelProps } from "radix-vue";\n\n const props = defineProps<ListboxGroupLabelProps & { class?: any }>();\n const forwarded = useForwardProps(reactiveOmit(props, "class"));\n\n const styles = tv({\n base: "py-1.5 pl-1 pr-8 text-sm font-semibold",\n });\n</script>\n',
1239
+ },
1240
+ {
1241
+ fileName: "Listbox/Item.vue",
1242
+ dirPath: "components/UI",
1243
+ fileContent:
1244
+ '<template>\n <ListboxItem v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n <span class="absolute right-2 flex h-3.5 w-3.5 items-center justify-center">\n <UiListboxItemIndicator :icon="icon" />\n </span>\n </ListboxItem>\n</template>\n\n<script lang="ts" setup>\n import { ListboxItem, useForwardPropsEmits } from "radix-vue";\n import type { ListboxItemEmits, ListboxItemProps } from "radix-vue";\n\n const props = defineProps<\n ListboxItemProps & {\n class?: any;\n icon?: string;\n }\n >();\n const emits = defineEmits<ListboxItemEmits>();\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class", "icon"), emits);\n\n const styles = tv({\n base: "relative flex w-full cursor-pointer select-none items-center rounded-sm py-2 pl-3 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[highlighted]:ring-1 data-[highlighted]:ring-border",\n });\n</script>\n',
1245
+ },
1246
+ {
1247
+ fileName: "Listbox/ItemIndicator.vue",
1248
+ dirPath: "components/UI",
1249
+ fileContent:
1250
+ '<template>\n <ListboxItemIndicator v-bind="forwarded">\n <slot>\n <Icon :class="styles({ class: props.class })" :name="icon || \'lucide:circle-check\'" />\n </slot>\n </ListboxItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { ListboxItemIndicator, useForwardPropsEmits } from "radix-vue";\n import type { ListboxItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<ListboxItemIndicatorProps & { class?: any; icon?: string }>();\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"));\n\n const styles = tv({\n base: "size-5 shrink-0",\n });\n</script>\n',
1251
+ },
1252
+ {
1253
+ fileName: "Listbox/Listbox.vue",
1254
+ dirPath: "components/UI",
1255
+ fileContent:
1256
+ '<template>\n <ListboxRoot v-slot="{ modelValue }" v-bind="forwarded" :class="styles({ class: props.class })">\n <slot :model-value="modelValue" />\n </ListboxRoot>\n</template>\n\n<script lang="ts" setup>\n import { ListboxRoot, useForwardPropsEmits } from "radix-vue";\n import type { ListboxRootEmits, ListboxRootProps } from "radix-vue";\n\n const props = defineProps<ListboxRootProps & { class?: any }>();\n const emits = defineEmits<ListboxRootEmits>();\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);\n\n const styles = tv({\n base: "relative flex flex-col gap-4",\n });\n</script>\n',
1257
+ },
1258
+ {
1259
+ fileName: "Listbox/Virtualizer.vue",
1260
+ dirPath: "components/UI",
1261
+ fileContent:
1262
+ '<template>\n <ListboxVirtualizer\n v-slot="{ option }"\n v-bind="forwarded"\n :class="styles({ class: props.class })"\n >\n <slot :option="option" />\n </ListboxVirtualizer>\n</template>\n\n<script lang="ts" setup>\n import { ListboxVirtualizer, useForwardProps } from "radix-vue";\n import type { ListboxVirtualizerProps } from "radix-vue";\n\n const props = defineProps<ListboxVirtualizerProps & { class?: any }>();\n const forwarded = useForwardProps(reactiveOmit(props, "class"));\n\n const styles = tv({\n base: "",\n });\n</script>\n',
1263
+ },
1264
+ ],
1265
+ utils: [],
1266
+ composables: [],
1267
+ plugins: [],
1268
+ },
1212
1269
  {
1213
1270
  name: "Menubar",
1214
1271
  value: "menubar",