ui-thing 0.1.29 → 0.1.31
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/.github/dependabot.yml +12 -0
- package/CHANGELOG.md +33 -0
- package/dist/index.js +54 -20
- package/dist/index.js.map +1 -1
- package/package.json +6 -6
- package/src/comps.ts +6 -6
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ui-thing",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.31",
|
|
4
4
|
"description": "CLI used to add Nuxt 3 components to a project",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"cli",
|
|
@@ -50,22 +50,22 @@
|
|
|
50
50
|
"kleur": "^4.1.5",
|
|
51
51
|
"lodash": "^4.17.21",
|
|
52
52
|
"nypm": "^0.3.12",
|
|
53
|
-
"ora": "^8.1.
|
|
53
|
+
"ora": "^8.1.1",
|
|
54
54
|
"prompts": "^2.4.2"
|
|
55
55
|
},
|
|
56
56
|
"devDependencies": {
|
|
57
57
|
"@gmrchk/cli-testing-library": "^0.1.2",
|
|
58
|
-
"@ianvs/prettier-plugin-sort-imports": "^4.
|
|
58
|
+
"@ianvs/prettier-plugin-sort-imports": "^4.4.0",
|
|
59
59
|
"@types/figlet": "^1.7.0",
|
|
60
60
|
"@types/fs-extra": "^11.0.4",
|
|
61
61
|
"@types/lodash": "^4.17.13",
|
|
62
|
-
"@types/node": "^22.
|
|
62
|
+
"@types/node": "^22.9.0",
|
|
63
63
|
"@types/prompts": "^2.4.9",
|
|
64
|
-
"@vitest/coverage-v8": "^2.1.
|
|
64
|
+
"@vitest/coverage-v8": "^2.1.5",
|
|
65
65
|
"magicast": "^0.3.5",
|
|
66
66
|
"tsup": "^8.3.5",
|
|
67
67
|
"typescript": "^5.6.3",
|
|
68
|
-
"vitest": "^2.1.
|
|
68
|
+
"vitest": "^2.1.5"
|
|
69
69
|
},
|
|
70
70
|
"publishConfig": {
|
|
71
71
|
"access": "public"
|
package/src/comps.ts
CHANGED
|
@@ -300,7 +300,7 @@ export default [
|
|
|
300
300
|
fileName: "Badge.vue",
|
|
301
301
|
dirPath: "components/UI",
|
|
302
302
|
fileContent:
|
|
303
|
-
'<template>\n <component\n :is="elementType"\n :
|
|
303
|
+
'<template>\n <component\n :is="elementType"\n :class="badgeVariants({ disabled, size, variant, class: props.class })"\n v-bind="forwarded"\n @click="onClick"\n >\n <slot />\n </component>\n</template>\n\n<script lang="ts">\n import { reactiveOmit } from "@vueuse/core";\n import { useForwardProps } from "radix-vue";\n import type { NuxtLinkProps } from "#app/components";\n</script>\n<script lang="ts" setup>\n const badgeVariants = tv({\n base: "inline-flex items-center rounded-full border font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",\n variants: {\n variant: {\n default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",\n secondary:\n "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",\n destructive:\n "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",\n outline: "text-foreground",\n },\n disabled: {\n true: "cursor-not-allowed opacity-50",\n },\n size: {\n sm: "px-2.5 py-0.5 text-xs font-medium",\n md: "px-2.5 py-1 text-sm font-semibold",\n lg: "px-3 py-1.5 text-sm font-semibold",\n },\n },\n defaultVariants: {\n variant: "default",\n disabled: false,\n size: "sm",\n },\n });\n\n type BadgeProps = VariantProps<typeof badgeVariants>;\n\n const props = defineProps<\n NuxtLinkProps & {\n /** Any additional class that should be added to the badge */\n class?: any;\n /** The variant of the badge */\n variant?: BadgeProps["variant"];\n /** The size of the badge */\n size?: BadgeProps["size"];\n /** The action to perform when the badge is clicked */\n onClick?: () => void;\n /** Should the badge be disabled or not */\n disabled?: boolean;\n /** The element to render the badge as */\n tag?: string;\n }\n >();\n\n const forwarded = useForwardProps(reactiveOmit(props, "class", "variant", "onClick", "disabled"));\n\n const elementType = computed(() => {\n if (props.tag) return props.tag;\n if (props.href || props.to) return resolveComponent("NuxtLink");\n if (props.onClick) return "button";\n return props.tag || "div";\n });\n</script>\n',
|
|
304
304
|
},
|
|
305
305
|
],
|
|
306
306
|
utils: [],
|
|
@@ -1295,7 +1295,7 @@ export default [
|
|
|
1295
1295
|
fileName: "Label.vue",
|
|
1296
1296
|
dirPath: "components/UI",
|
|
1297
1297
|
fileContent:
|
|
1298
|
-
'<template>\n <Label :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n <slot name="hint">\n <span v-if="hint">\n {{ hint }}\n </span>\n </slot>\n </Label>\n</template>\n\n<script lang="ts" setup>\n import { Label } from "radix-vue";\n import type { LabelProps } from "radix-vue";\n\n const props = defineProps<\n LabelProps & {\n /** Custom class(es) to add to the label */\n class?: any;\n hint?: string;\n }\n >();\n\n const forwarded = reactiveOmit(props, "class", "hint");\n\n const styles = tv({\n base: "flex items-center justify-between text-[15px] font-medium leading-none hover:cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70 sm:text-sm",\n });\n</script>\n',
|
|
1298
|
+
'<template>\n <Label :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n <slot name="hint">\n <span v-if="hint" class="text-muted-foreground">\n {{ hint }}\n </span>\n </slot>\n </Label>\n</template>\n\n<script lang="ts" setup>\n import { Label } from "radix-vue";\n import type { LabelProps } from "radix-vue";\n\n const props = defineProps<\n LabelProps & {\n /** Custom class(es) to add to the label */\n class?: any;\n hint?: string;\n }\n >();\n\n const forwarded = reactiveOmit(props, "class", "hint");\n\n const styles = tv({\n base: "flex items-center justify-between text-[15px] font-medium leading-none hover:cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70 sm:text-sm",\n });\n</script>\n',
|
|
1299
1299
|
},
|
|
1300
1300
|
],
|
|
1301
1301
|
utils: [],
|
|
@@ -2227,7 +2227,7 @@ export default [
|
|
|
2227
2227
|
fileName: "Table/Cell.vue",
|
|
2228
2228
|
dirPath: "components/UI",
|
|
2229
2229
|
fileContent:
|
|
2230
|
-
'<template>\n <td :class="styles({ class: props.class })">\n <slot />\n </td>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n class?: any;\n }>();\n\n const styles = tv({\n base: "whitespace-nowrap p-4 align-middle",\n });\n</script>\n',
|
|
2230
|
+
'<template>\n <td :class="styles({ class: props.class })">\n <slot />\n </td>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n class?: any;\n }>();\n\n const styles = tv({\n base: "whitespace-nowrap p-4 align-middle [&:has([role=checkbox])]:pr-0",\n });\n</script>\n',
|
|
2231
2231
|
},
|
|
2232
2232
|
{
|
|
2233
2233
|
fileName: "Table/Empty.vue",
|
|
@@ -2239,13 +2239,13 @@ export default [
|
|
|
2239
2239
|
fileName: "Table/Footer.vue",
|
|
2240
2240
|
dirPath: "components/UI",
|
|
2241
2241
|
fileContent:
|
|
2242
|
-
'<template>\n <tfoot :class="styles({ class: props.class })">\n <slot />\n </tfoot>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n class?: any;\n }>();\n\n const styles = tv({\n base: "bg-
|
|
2242
|
+
'<template>\n <tfoot :class="styles({ class: props.class })">\n <slot />\n </tfoot>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n class?: any;\n }>();\n\n const styles = tv({\n base: "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",\n });\n</script>\n',
|
|
2243
2243
|
},
|
|
2244
2244
|
{
|
|
2245
2245
|
fileName: "Table/Head.vue",
|
|
2246
2246
|
dirPath: "components/UI",
|
|
2247
2247
|
fileContent:
|
|
2248
|
-
'<template>\n <th :class="styles({ class: props.class })">\n <slot />\n </th>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n class?: any;\n }>();\n\n const styles = tv({\n base: "h-12 px-4 text-left align-middle font-medium text-muted-foreground
|
|
2248
|
+
'<template>\n <th :class="styles({ class: props.class })">\n <slot />\n </th>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n class?: any;\n }>();\n\n const styles = tv({\n base: "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",\n });\n</script>\n',
|
|
2249
2249
|
},
|
|
2250
2250
|
{
|
|
2251
2251
|
fileName: "Table/Header.vue",
|
|
@@ -2667,7 +2667,7 @@ export default [
|
|
|
2667
2667
|
fileName: "Vee/Input.vue",
|
|
2668
2668
|
dirPath: "components/UI",
|
|
2669
2669
|
fileContent:
|
|
2670
|
-
'<template>\n <div class="w-full">\n <UiLabel\n v-if="label"\n :for="inputId"\n :hint="labelHint"\n :class="[disabled && \'text-muted-foreground\', errorMessage && \'text-destructive\', \'mb-2\']"\n ><span>{{ label }} <span v-if="required" class="text-destructive">*</span></span></UiLabel\n >\n <div class="relative">\n <slot name="icon">\n <span v-if="hasIcon" class="absolute inset-y-0 left-3 flex items-center justify-center">\n <Icon v-if="icon" :name="icon" class="h-4 w-4 text-muted-foreground/70" />\n </span>\n </slot>\n <UiInput\n :id="inputId"\n v-model="value"\n :type="type"\n :required="required"\n :name="name"\n :disabled="disabled"\n v-bind="$attrs"\n :class="[hasIcon && \'pl-9\']"\n :placeholder="placeholder"\n @blur="handleBlur"\n />\n </div>\n <TransitionSlide group tag="div">\n <p v-if="hint && !errorMessage" key="hint" class="mt-1.5 text-sm text-muted-foreground">\n {{ hint }}\n </p>\n\n <p v-if="errorMessage" key="errorMessage" class="mt-1.5 text-sm text-destructive">\n {{ errorMessage }}\n </p>\n </TransitionSlide>\n </div>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n label?: string;\n labelHint?: string;\n icon?: string;\n hint?: string;\n disabled?: boolean;\n modelValue?: string;\n name?: string;\n id?: string;\n rules?: any;\n validateOnMount?: boolean;\n type?: string;\n placeholder?: string;\n required?: boolean;\n }>();\n\n const inputId = props.id || useId();\n\n const hasIcon = computed(() => Boolean(props.icon) || Boolean(useSlots().icon));\n\n const { errorMessage, value, handleBlur } = useField(() => props.name || inputId, props.rules, {\n initialValue: props.modelValue,\n label: props.label,\n validateOnMount: props.validateOnMount,\n syncVModel: true,\n });\n</script>\n',
|
|
2670
|
+
'<template>\n <div class="w-full">\n <UiLabel\n v-if="label"\n :for="inputId"\n :hint="labelHint"\n :class="[disabled && \'text-muted-foreground\', errorMessage && \'text-destructive\', \'mb-2\']"\n ><span>{{ label }} <span v-if="required" class="text-destructive">*</span></span></UiLabel\n >\n <div class="relative">\n <slot name="icon">\n <span v-if="hasIcon" class="absolute inset-y-0 left-3 flex items-center justify-center">\n <Icon v-if="icon" :name="icon" class="h-4 w-4 text-muted-foreground/70" />\n </span>\n </slot>\n <slot name="trailingIcon">\n <span\n v-if="hasTrailingIcon"\n class="absolute inset-y-0 right-3 flex items-center justify-center"\n >\n <Icon v-if="trailingIcon" :name="trailingIcon" class="h-4 w-4 text-muted-foreground/70" />\n </span>\n </slot>\n <UiInput\n :id="inputId"\n v-model="value"\n :type="type"\n :required="required"\n :name="name"\n :disabled="disabled"\n v-bind="$attrs"\n :class="[hasIcon && \'pl-9\', hasTrailingIcon && \'pr-9\']"\n :placeholder="placeholder"\n @blur="handleBlur"\n />\n </div>\n <TransitionSlide group tag="div">\n <p v-if="hint && !errorMessage" key="hint" class="mt-1.5 text-sm text-muted-foreground">\n {{ hint }}\n </p>\n\n <p v-if="errorMessage" key="errorMessage" class="mt-1.5 text-sm text-destructive">\n {{ errorMessage }}\n </p>\n </TransitionSlide>\n </div>\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n label?: string;\n labelHint?: string;\n icon?: string;\n trailingIcon?: string;\n hint?: string;\n disabled?: boolean;\n modelValue?: string;\n name?: string;\n id?: string;\n rules?: any;\n validateOnMount?: boolean;\n type?: string;\n placeholder?: string;\n required?: boolean;\n }>();\n\n defineOptions({ inheritAttrs: false });\n\n const inputId = props.id || useId();\n\n const hasIcon = computed(() => Boolean(props.icon) || Boolean(useSlots().icon));\n const hasTrailingIcon = computed(\n () => Boolean(props.trailingIcon) || Boolean(useSlots().trailingIcon)\n );\n\n const { errorMessage, value, handleBlur } = useField(() => props.name || inputId, props.rules, {\n initialValue: props.modelValue,\n label: props.label,\n validateOnMount: props.validateOnMount,\n syncVModel: true,\n });\n</script>\n',
|
|
2671
2671
|
},
|
|
2672
2672
|
],
|
|
2673
2673
|
utils: [],
|