ui-thing 0.0.19 → 0.0.21
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.
- package/CHANGELOG.md +24 -0
- package/dist/index.js +134 -1
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/comps.ts +56 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ui-thing",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.21",
|
|
4
4
|
"description": "CLI used to add Nuxt 3 components to a project",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@types/figlet": "^1.5.8",
|
|
62
62
|
"@types/fs-extra": "^11.0.4",
|
|
63
63
|
"@types/lodash": "^4.14.202",
|
|
64
|
-
"@types/node": "^20.10.
|
|
64
|
+
"@types/node": "^20.10.5",
|
|
65
65
|
"@types/prompts": "^2.4.9",
|
|
66
66
|
"@vitest/coverage-v8": "^1.0.4",
|
|
67
67
|
"magicast": "^0.3.2",
|
package/src/comps.ts
CHANGED
|
@@ -568,6 +568,24 @@ export default [
|
|
|
568
568
|
composables: [],
|
|
569
569
|
plugins: [],
|
|
570
570
|
},
|
|
571
|
+
{
|
|
572
|
+
name: "Container",
|
|
573
|
+
value: "container",
|
|
574
|
+
deps: ["radix-vue", "tailwind-variants"],
|
|
575
|
+
devDeps: [],
|
|
576
|
+
nuxtModules: [],
|
|
577
|
+
files: [
|
|
578
|
+
{
|
|
579
|
+
fileName: "Container.vue",
|
|
580
|
+
dirPath: "components/UI",
|
|
581
|
+
fileContent:
|
|
582
|
+
'<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\r\n <slot></slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "div",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "container mx-auto",\r\n });\r\n</script>\r\n',
|
|
583
|
+
},
|
|
584
|
+
],
|
|
585
|
+
utils: [],
|
|
586
|
+
composables: [],
|
|
587
|
+
plugins: [],
|
|
588
|
+
},
|
|
571
589
|
{
|
|
572
590
|
name: "Context Menu",
|
|
573
591
|
value: "context-menu",
|
|
@@ -807,6 +825,25 @@ export default [
|
|
|
807
825
|
composables: [],
|
|
808
826
|
plugins: [],
|
|
809
827
|
},
|
|
828
|
+
{
|
|
829
|
+
name: "Divider",
|
|
830
|
+
value: "divider",
|
|
831
|
+
deps: ["radix-vue", "tailwind-variants"],
|
|
832
|
+
devDeps: ["nuxt-icon"],
|
|
833
|
+
nuxtModules: ["nuxt-icon"],
|
|
834
|
+
components: ["avatar"],
|
|
835
|
+
files: [
|
|
836
|
+
{
|
|
837
|
+
fileName: "Divider.vue",
|
|
838
|
+
dirPath: "components/UI",
|
|
839
|
+
fileContent:
|
|
840
|
+
'<template>\r\n <Primitive as="div" :class="base({ orientation, type, class: props.class })">\r\n <Separator :orientation="orientation" :class="border({ orientation, type })" />\r\n <template v-if="label || icon || avatar || $slots.default">\r\n <div :class="container({ orientation, type })">\r\n <slot>\r\n <slot name="label">\r\n <span v-if="label" :class="labelClass({ orientation, type })">\r\n {{ label }}\r\n </span>\r\n </slot>\r\n <slot name="icon">\r\n <Icon v-if="icon" :name="icon" :class="iconClass({ orientation, type })" />\r\n </slot>\r\n <slot name="avatar">\r\n <UiAvatar v-if="avatar" :src="avatar" />\r\n </slot>\r\n </slot>\r\n </div>\r\n </template>\r\n <Separator :orientation="orientation" :class="border({ orientation, type })" />\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive, Separator } from "radix-vue";\r\n\r\n const props = defineProps<{\r\n class?: any;\r\n type?: VariantProps<typeof style>["type"];\r\n orientation?: VariantProps<typeof style>["orientation"];\r\n icon?: string;\r\n label?: string;\r\n avatar?: string;\r\n }>();\r\n\r\n const style = tv({\r\n slots: {\r\n base: "flex w-full items-center text-center align-middle",\r\n container: "flex font-medium",\r\n border: "flex border-border",\r\n icon: "h-5 w-5 shrink-0",\r\n label: "text-sm",\r\n },\r\n variants: {\r\n orientation: {\r\n horizontal: {\r\n base: "flex-row",\r\n container: "mx-3 whitespace-nowrap",\r\n border: "w-full border-t",\r\n },\r\n vertical: {\r\n base: "h-full flex-col",\r\n container: "my-3",\r\n border: "h-full border-s",\r\n },\r\n },\r\n type: {\r\n solid: {\r\n border: "border-solid",\r\n },\r\n dashed: {\r\n border: "border-dashed",\r\n },\r\n dotted: {\r\n border: "border-dotted",\r\n },\r\n },\r\n },\r\n defaultVariants: {\r\n orientation: "horizontal",\r\n type: "solid",\r\n },\r\n });\r\n\r\n const { base, border, container, icon: iconClass, label: labelClass } = style();\r\n</script>\r\n',
|
|
841
|
+
},
|
|
842
|
+
],
|
|
843
|
+
utils: [],
|
|
844
|
+
composables: [],
|
|
845
|
+
plugins: [],
|
|
846
|
+
},
|
|
810
847
|
{
|
|
811
848
|
name: "Dropdown Menu",
|
|
812
849
|
value: "dropdown-menu",
|
|
@@ -1264,6 +1301,24 @@ export default [
|
|
|
1264
1301
|
composables: [],
|
|
1265
1302
|
plugins: [],
|
|
1266
1303
|
},
|
|
1304
|
+
{
|
|
1305
|
+
name: "Navbar",
|
|
1306
|
+
value: "navbar",
|
|
1307
|
+
deps: ["radix-vue", "tailwind-variants"],
|
|
1308
|
+
devDeps: [],
|
|
1309
|
+
nuxtModules: [],
|
|
1310
|
+
files: [
|
|
1311
|
+
{
|
|
1312
|
+
fileName: "Navbar.vue",
|
|
1313
|
+
dirPath: "components/UI",
|
|
1314
|
+
fileContent:
|
|
1315
|
+
'<template>\r\n <Primitive :class="styles({ sticky, class: props.class })" v-bind="reactiveOmit(props, \'class\')">\r\n <slot> </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n sticky?: boolean;\r\n }\r\n >(),\r\n {\r\n as: "header",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "z-20 border-b bg-background/90 backdrop-blur",\r\n variants: {\r\n sticky: {\r\n true: "sticky top-0",\r\n },\r\n },\r\n });\r\n</script>\r\n',
|
|
1316
|
+
},
|
|
1317
|
+
],
|
|
1318
|
+
utils: [],
|
|
1319
|
+
composables: [],
|
|
1320
|
+
plugins: [],
|
|
1321
|
+
},
|
|
1267
1322
|
{
|
|
1268
1323
|
name: "Navigation Menu",
|
|
1269
1324
|
value: "navigation-menu",
|
|
@@ -2095,7 +2150,7 @@ export default [
|
|
|
2095
2150
|
fileName: "Toast/Toast.vue",
|
|
2096
2151
|
dirPath: "components/UI",
|
|
2097
2152
|
fileContent:
|
|
2098
|
-
'<template>\r\n <ToastRoot\r\n v-bind="forwarded"\r\n :class="styles({ variant, class: props.class })"\r\n @update:open="onOpenChange"\r\n >\r\n <slot></slot>\r\n </ToastRoot>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ToastRoot, useForwardPropsEmits } from "radix-vue";\r\n import type { ToastRootEmits, ToastRootProps } from "radix-vue";\r\n\r\n export interface ToastProps extends ToastRootProps {\r\n /**\r\n * Custom class names to add to the toast.\r\n */\r\n class?: any;\r\n /**\r\n * The variant of the toast.\r\n */\r\n variant?: VariantProps<typeof styles>["variant"];\r\n /**\r\n * Callback that fires when the toast is closed.\r\n */\r\n onOpenChange?: ((value: boolean) => void) | undefined;\r\n }\r\n\r\n const props = withDefaults(defineProps<ToastProps>(), {});\r\n\r\n const emits = defineEmits<ToastRootEmits>();\r\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);\r\n\r\n const styles = tv({\r\n base: "group pointer-events-auto relative flex w-full items-center justify-between gap-4 overflow-hidden rounded-md border p-4 pr-9 shadow-sm transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",\r\n variants: {\r\n variant: {\r\n default: "border bg-background text-foreground",\r\n success:\r\n "success group border-[var(--success-border)] bg-[--success-bg] text-[--success-text]",\r\n info: "info group border-[var(--info-border)] bg-[--info-bg] text-[--info-text]",\r\n warning:\r\n "warning group border-[var(--warning-border)] bg-[--warning-bg] text-[--warning-text]",\r\n destructive:\r\n "destructive group border-[var(--error-border)] bg-[--error-bg] text-[--error-text]",\r\n },\r\n },\r\n defaultVariants: {\r\n variant: "default",\r\n },\r\n });\r\n</script>\r\n',
|
|
2153
|
+
'<template>\r\n <ToastRoot\r\n v-bind="forwarded"\r\n :class="styles({ variant, class: props.class })"\r\n @update:open="onOpenChange"\r\n >\r\n <slot></slot>\r\n </ToastRoot>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { ToastRoot, useForwardPropsEmits } from "radix-vue";\r\n import type { ToastRootEmits, ToastRootProps } from "radix-vue";\r\n\r\n export interface ToastProps extends ToastRootProps {\r\n /**\r\n * Custom class names to add to the toast.\r\n */\r\n class?: any;\r\n /**\r\n * The variant of the toast.\r\n */\r\n variant?: VariantProps<typeof styles>["variant"];\r\n /**\r\n * Callback that fires when the toast is closed.\r\n */\r\n onOpenChange?: ((value: boolean) => void) | undefined;\r\n }\r\n\r\n const props = withDefaults(defineProps<ToastProps>(), {});\r\n\r\n const emits = defineEmits<ToastRootEmits>();\r\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);\r\n\r\n const styles = tv({\r\n base: "group pointer-events-auto relative flex w-full items-center justify-between gap-4 overflow-hidden rounded-md border p-4 pr-9 shadow-sm transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:duration-300 data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=open]:fade-in-0 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",\r\n variants: {\r\n variant: {\r\n default: "border bg-background text-foreground",\r\n success:\r\n "success group border-[var(--success-border)] bg-[--success-bg] text-[--success-text]",\r\n info: "info group border-[var(--info-border)] bg-[--info-bg] text-[--info-text]",\r\n warning:\r\n "warning group border-[var(--warning-border)] bg-[--warning-bg] text-[--warning-text]",\r\n destructive:\r\n "destructive group border-[var(--error-border)] bg-[--error-bg] text-[--error-text]",\r\n },\r\n },\r\n defaultVariants: {\r\n variant: "default",\r\n },\r\n });\r\n</script>\r\n',
|
|
2099
2154
|
},
|
|
2100
2155
|
{
|
|
2101
2156
|
fileName: "Toast/Toaster.vue",
|