@bl33dz/fa814698dcde12f86a37ac31dd3aedf9 1.0.4 → 1.0.6

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "1.0.4",
+  "version": "1.0.6",
   "main": "dist/perisai-ui.umd.js",
   "module": "dist/perisai-ui.es.js",
   "scripts": {

package/src/{global.css → globals.css}

@@ -1,3 +1,5 @@
+@source "../src/**/*.{vue,js,ts,jsx,tsx,html}";
+
 @custom-variant dark (&:is(.dark *));
 
 :root {
@@ -216,7 +218,7 @@
     0 0 0 1px rgba(255, 255, 255, 0.05);
 }
 
-@theme inline {
+@theme {
   /* Base Theme Colors */
   --color-background: var(--background);
   --color-foreground: var(--foreground);
@@ -571,5 +573,3 @@ html {
 .switch-thumb {
   background-color: var(--switch-thumb) !important;
 }
-
-

package/src/index.ts

@@ -1,10 +1,11 @@
 // Auto-generated — DO NOT EDIT MANUALLY
 
-import './global.css'
+import './globals.css'
 
 // Default shadcn
 export * from './shadcn/breadcrumb';
-export * from './shadcn/accordion'
+export * from './shadcn/accordion';
+export * from './shadcn/spinner';
 
 export { default as InputOTP } from './ui/InputOTP.vue';
 export { default as InputOTPGroup } from './ui/InputOTPGroup.vue';
@@ -13,9 +14,6 @@ export { default as InputOTPSlot } from './ui/InputOTPSlot.vue';
 export { default as PopoverContent } from './ui/PopoverContent.vue';
 export { default as PopoverTrigger } from './ui/PopoverTrigger.vue';
 export { default as SelectContent } from './ui/SelectContent.vue';
-export { default as SelectGroup } from './ui/SelectGroup.vue';
-export { default as SelectItem } from './ui/SelectItem.vue';
-export { default as SelectLabel } from './ui/SelectLabel.vue';
 export { default as SelectSeparator } from './ui/SelectSeparator.vue';
 export { default as SelectTrigger } from './ui/SelectTrigger.vue';
 export { default as SelectValue } from './ui/SelectValue.vue';

package/src/shadcn/spinner/Spinner.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import { Loader2Icon } from "lucide-vue-next"
+import { cn } from "@/lib/utils"
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"]
+}>()
+</script>
+
+<template>
+  <Loader2Icon
+    role="status"
+    aria-label="Loading"
+    :class="cn('size-4 animate-spin', props.class)"
+  />
+</template>

package/src/shadcn/spinner/index.ts

@@ -0,0 +1 @@
+export { default as Spinner } from "./Spinner.vue"

package/src/ui/SelectGroup.vue

@@ -1,22 +1,12 @@
 <script setup lang="ts">
-import { defineAsyncComponent } from 'vue';
-let SelectPrimitiveGroup: any = null;
-try {
-  SelectPrimitiveGroup = defineAsyncComponent(() => import('shadcn-vue').then(m => m.SelectGroup));
-} catch (e) {
-  SelectPrimitiveGroup = null;
-}
+import { SelectGroup as RekaSelectGroup } from "reka-ui"
 </script>
+
 <template>
-  <component
-    v-if="SelectPrimitiveGroup"
-    :is="SelectPrimitiveGroup"
+  <RekaSelectGroup
     data-slot="select-group"
     v-bind="$attrs"
   >
     <slot />
-  </component>
-  <div v-else data-slot="select-group" v-bind="$attrs">
-    <slot />
-  </div>
+  </RekaSelectGroup>
 </template>

package/src/ui/SelectLabel.vue

@@ -1,27 +1,16 @@
-<script setup lang="ts">
-import { defineAsyncComponent } from 'vue';
-import { cn } from './utils';
-let SelectPrimitiveLabel: any = null;
-try {
-  SelectPrimitiveLabel = defineAsyncComponent(() => import('shadcn-vue').then(m => m.SelectLabel));
-} catch (e) {
-  SelectPrimitiveLabel = null;
-}
-defineProps({
-  class: String,
-});
+<script setup>
+import { SelectLabel } from "reka-ui"
+import { cn } from "./utils"
+const props = defineProps({ class: String })
 </script>
+
 <template>
-  <component
-    v-if="SelectPrimitiveLabel"
-    :is="SelectPrimitiveLabel"
+  <SelectLabel
     data-slot="select-label"
-    :class="cn('text-muted-foreground px-2 py-1.5 text-xs', $props.class)"
+    :class="cn('text-muted-foreground px-2 py-1.5 text-xs', props.class)"
     v-bind="$attrs"
   >
     <slot />
-  </component>
-  <div v-else data-slot="select-label" :class="cn('text-muted-foreground px-2 py-1.5 text-xs', $props.class)" v-bind="$attrs">
-    <slot />
-  </div>
+  </SelectLabel>
 </template>
+

package/src/ui/SelectSeparator.vue

@@ -1,23 +1,17 @@
-<script setup lang="ts">
-import { defineAsyncComponent } from 'vue';
-import { cn } from './utils';
-let SelectPrimitiveSeparator: any = null;
-try {
-  SelectPrimitiveSeparator = defineAsyncComponent(() => import('shadcn-vue').then(m => m.SelectSeparator));
-} catch (e) {
-  SelectPrimitiveSeparator = null;
-}
-defineProps({
-  class: String,
-});
+<script setup>
+import { SelectSeparator } from "reka-ui"
+import { cn } from "./utils"
+
+const props = defineProps({
+  class: String
+})
 </script>
+
 <template>
-  <component
-    v-if="SelectPrimitiveSeparator"
-    :is="SelectPrimitiveSeparator"
+  <SelectSeparator
     data-slot="select-separator"
-    :class="cn('bg-border pointer-events-none -mx-1 my-1 h-px', $props.class)"
+    :class="cn('bg-border pointer-events-none -mx-1 my-1 h-px', props.class)"
     v-bind="$attrs"
   />
-  <div v-else data-slot="select-separator" :class="cn('bg-border pointer-events-none -mx-1 my-1 h-px', $props.class)" v-bind="$attrs" />
 </template>
+

package/src/ui/button.vue

@@ -42,7 +42,7 @@ const props = defineProps({
 const $attrs = useAttrs();
 const emit = defineEmits(['click']);
 
-const baseClass = 'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive';
+const baseClass = 'cursor-pointer inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive';
 
 const variantClass = computed(() => {
   switch (props.variant) {