ui-arreya-components 0.0.14 → 0.0.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-arreya-components",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "type": "module",
   "types": "dist/index.d.ts",
   "exports": {
@@ -24,7 +24,7 @@
     "build-storybook": "concurrently 'npm run build-storybook:css' 'storybook build'",
     "build-storybook:css": "tailwindcss -m -i ./src/styles/tailwind.css -o ./src/index.css",
     "prepublish": "npm run build",
-    "test": "echo 'setup unit testing'"
+    "publish": "npm publish"
   },
   "peerDependencies": {
     "react": "^18.0.0",

package/scripts/template.sh

@@ -13,21 +13,21 @@ COMPONENT_OR_FEATURE_NAME=$2
 case $TEMPLATE_TYPE in
   feature)
     echo "Creating feature template..."
-    mkdir -p src/components/feature/${COMPONENT_OR_FEATURE_NAME}
+    mkdir -p src/components/features/${COMPONENT_OR_FEATURE_NAME}
 
-    cat <<EOF > src/components/feature/${COMPONENT_OR_FEATURE_NAME}/index.ts 
+    cat <<EOF > src/components/features/${COMPONENT_OR_FEATURE_NAME}/index.ts 
 export * from './${COMPONENT_OR_FEATURE_NAME}'
 EOF
 
-    cat <<EOF >> src/components/feature/index.ts 
+    cat <<EOF >> src/components/features/index.ts 
 export * from './${COMPONENT_OR_FEATURE_NAME}'
 EOF
 
     cat <<EOF >> src/components/index.ts 
-export * from './feature/${COMPONENT_OR_FEATURE_NAME}'
+export * from './features/${COMPONENT_OR_FEATURE_NAME}'
 EOF
 
-    touch src/components/feature/${COMPONENT_OR_FEATURE_NAME}/{${COMPONENT_OR_FEATURE_NAME}.stories.tsx,${COMPONENT_OR_FEATURE_NAME}.tsx}
+    touch src/components/features/${COMPONENT_OR_FEATURE_NAME}/{${COMPONENT_OR_FEATURE_NAME}.stories.tsx,${COMPONENT_OR_FEATURE_NAME}.tsx}
     ;;
   component)
     echo "Creating component template"

package/src/components/feature/header.stories.tsx

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from "@storybook/react"
 import { Header } from "./header"
 
 const meta: Meta<typeof Header> = {
-  title: "Feature/Header",
+  title: "Components/Header",
   component: Header,
   parameters: {
     layout: "fullscreen",

package/src/components/feature/header.tsx

@@ -9,7 +9,7 @@ import {
 } from "@/components/ui/breadcrumb"
 import { ChevronRight, Home } from "lucide-react"
 
-type BreadcrumbItem = {
+export type BreadcrumbItem = {
   label: string
   href?: string
   isCurrentPage?: boolean
@@ -26,7 +26,7 @@ interface HeaderProps {
 export function Header({ title, breadcrumbItems = [], showHomeLink = true, className = "", children }: HeaderProps) {
   return (
     <header className={`border-b pb-4 ${className}`}>
-      <div className="container mx-auto p-4">
+      <div className="container mx-auto px-4">
         {(breadcrumbItems.length > 0 || showHomeLink) && (
           <Breadcrumb className="mb-2">
             <BreadcrumbList>
@@ -66,9 +66,10 @@ export function Header({ title, breadcrumbItems = [], showHomeLink = true, class
           </Breadcrumb>
         )}
 
-        {title && <h1 className="text-2xl font-bold tracking-tight">{title}</h1>}
-
-        {children}
+        <div className="flex items-center justify-between">
+          {title && <h1 className="text-2xl font-bold tracking-tight">{title}</h1>}
+          {children && <div className="flex items-center">{children}</div>}
+        </div>
       </div>
     </header>
   )

package/src/components/index.ts

@@ -0,0 +1 @@
+export * from './ui/accordion'

package/src/components/ui/index.ts

@@ -0,0 +1 @@
+export * from './accordion'

package/src/components/ui/input.tsx

@@ -8,7 +8,7 @@ const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
       <input
         type={type}
         className={cn(
-          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          "flex h-9 w-full rounded-md border focus:border-[--primary] border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
           className
         )}
         ref={ref}

package/src/components/ui/sheet.tsx

@@ -1,3 +1,5 @@
+"use client"
+
 import * as React from "react"
 import * as SheetPrimitive from "@radix-ui/react-dialog"
 import { cva, type VariantProps } from "class-variance-authority"

package/src/components/ui/sonner.tsx

@@ -3,7 +3,7 @@ import { Toaster as Sonner } from "sonner"
 
 type ToasterProps = React.ComponentProps<typeof Sonner>
 
-const SonnerToaster = ({ ...props }: ToasterProps) => {
+const Toaster = ({ ...props }: ToasterProps) => {
   const { theme = "system" } = useTheme()
 
   return (
@@ -26,4 +26,4 @@ const SonnerToaster = ({ ...props }: ToasterProps) => {
   )
 }
 
-export { SonnerToaster }
+export { Toaster }

package/src/index.css

@@ -888,18 +888,6 @@ body{
   margin-bottom: 0.5rem;
 }
 
-.mb-4{
-  margin-bottom: 1rem;
-}
-
-.mb-6{
-  margin-bottom: 1.5rem;
-}
-
-.mb-8{
-  margin-bottom: 2rem;
-}
-
 .ml-1{
   margin-left: 0.25rem;
 }
@@ -912,14 +900,6 @@ body{
   margin-right: 0.25rem;
 }
 
-.mt-0\.5{
-  margin-top: 0.125rem;
-}
-
-.mt-1{
-  margin-top: 0.25rem;
-}
-
 .mt-1\.5{
   margin-top: 0.375rem;
 }
@@ -936,10 +916,6 @@ body{
   margin-top: 1rem;
 }
 
-.mt-6{
-  margin-top: 1.5rem;
-}
-
 .mt-auto{
   margin-top: auto;
 }
@@ -981,10 +957,6 @@ body{
   height: 1rem;
 }
 
-.h-0\.5{
-  height: 0.125rem;
-}
-
 .h-1\.5{
   height: 0.375rem;
 }
@@ -1037,18 +1009,10 @@ body{
   height: 2.25rem;
 }
 
-.h-\[180px\]{
-  height: 180px;
-}
-
 .h-\[1px\]{
   height: 1px;
 }
 
-.h-\[240px\]{
-  height: 240px;
-}
-
 .h-\[var\(--radix-navigation-menu-viewport-height\)\]{
   height: var(--radix-navigation-menu-viewport-height);
 }
@@ -1137,10 +1101,6 @@ body{
   width: 1rem;
 }
 
-.w-48{
-  width: 12rem;
-}
-
 .w-5{
   width: 1.25rem;
 }
@@ -1242,10 +1202,6 @@ body{
   min-width: var(--radix-select-trigger-width);
 }
 
-.max-w-2xl{
-  max-width: 42rem;
-}
-
 .max-w-\[--skeleton-width\]{
   max-width: var(--skeleton-width);
 }
@@ -1263,10 +1219,6 @@ body{
   max-width: 24rem;
 }
 
-.max-w-xl{
-  max-width: 36rem;
-}
-
 .max-w-xs{
   max-width: 20rem;
 }
@@ -1409,10 +1361,6 @@ body{
   list-style-type: none;
 }
 
-.grid-cols-2{
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-}
-
 .flex-row{
   flex-direction: row;
 }
@@ -1509,12 +1457,6 @@ body{
   margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
 }
 
-.space-y-4 > :not([hidden]) ~ :not([hidden]){
-  --tw-space-y-reverse: 0;
-  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
-}
-
 .self-center{
   align-self: center;
 }
@@ -1596,10 +1538,6 @@ body{
   border-width: 2px;
 }
 
-.border-4{
-  border-width: 4px;
-}
-
 .border-\[1\.5px\]{
   border-width: 1.5px;
 }
@@ -1633,11 +1571,6 @@ body{
   border-color: var(--color-border);
 }
 
-.border-blue-100{
-  --tw-border-opacity: 1;
-  border-color: rgb(219 234 254 / var(--tw-border-opacity, 1));
-}
-
 .border-border\/50{
   border-color: hsl(var(--border) / 0.5);
 }
@@ -1650,19 +1583,10 @@ body{
   border-color: hsl(var(--destructive) / 0.5);
 }
 
-.border-gray-200{
-  --tw-border-opacity: 1;
-  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
-}
-
 .border-input{
   border-color: hsl(var(--input));
 }
 
-.border-muted{
-  border-color: hsl(var(--muted));
-}
-
 .border-primary{
   border-color: var(--primary);
 }
@@ -1739,20 +1663,10 @@ body{
   background-color: hsl(var(--sidebar-border));
 }
 
-.bg-slate-200{
-  --tw-bg-opacity: 1;
-  background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));
-}
-
 .bg-transparent{
   background-color: transparent;
 }
 
-.bg-white{
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
-}
-
 .fill-current{
   fill: currentColor;
 }
@@ -1773,10 +1687,6 @@ body{
   padding: 0.5rem;
 }
 
-.p-3{
-  padding: 0.75rem;
-}
-
 .p-4{
   padding: 1rem;
 }
@@ -1854,19 +1764,10 @@ body{
   padding-bottom: 1rem;
 }
 
-.py-8{
-  padding-top: 2rem;
-  padding-bottom: 2rem;
-}
-
 .pb-0{
   padding-bottom: 0px;
 }
 
-.pb-2{
-  padding-bottom: 0.5rem;
-}
-
 .pb-3{
   padding-bottom: 0.75rem;
 }
@@ -2023,25 +1924,10 @@ body{
   color: hsl(var(--destructive-foreground));
 }
 
-.text-emerald-500{
-  --tw-text-opacity: 1;
-  color: rgb(16 185 129 / var(--tw-text-opacity, 1));
-}
-
 .text-foreground{
   color: var(--foreground);
 }
 
-.text-gray-500{
-  --tw-text-opacity: 1;
-  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
-}
-
-.text-gray-700{
-  --tw-text-opacity: 1;
-  color: rgb(55 65 81 / var(--tw-text-opacity, 1));
-}
-
 .text-muted-foreground{
   color: hsl(var(--muted-foreground));
 }
@@ -2058,11 +1944,6 @@ body{
   color: hsl(var(--primary-foreground));
 }
 
-.text-red-500{
-  --tw-text-opacity: 1;
-  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
-}
-
 .text-secondary-foreground{
   color: var(--secondary-foreground);
 }
@@ -2445,11 +2326,6 @@ h1, h2, h3, h4 {
   background-color: hsl(var(--destructive) / 0.9);
 }
 
-.hover\:bg-gray-50:hover{
-  --tw-bg-opacity: 1;
-  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
-}
-
 .hover\:bg-muted:hover{
   background-color: hsl(var(--muted));
 }
@@ -2501,6 +2377,10 @@ h1, h2, h3, h4 {
   background-color: hsl(var(--sidebar-border));
 }
 
+.focus\:border-\[--primary\]:focus{
+  border-color: var(--primary);
+}
+
 .focus\:bg-accent:focus{
   background-color: var(--accent);
 }
@@ -2575,6 +2455,10 @@ h1, h2, h3, h4 {
   --tw-ring-offset-color: var(--background);
 }
 
+.active\:border-\[--primary\]:active{
+  border-color: var(--primary);
+}
+
 .active\:bg-sidebar-accent:active{
   background-color: hsl(var(--sidebar-accent));
 }

package/src/index.ts

@@ -1,51 +1,51 @@
-export * from "./components/ui/accordion"
-export * from "./components/ui/alert-dialog"
-export * from "./components/ui/alert"
-export * from "./components/ui/aspect-ratio"
-export * from "./components/ui/avatar"
-export * from "./components/ui/badge"
-export * from "./components/ui/breadcrumb"
-export * from "./components/ui/button"
-export * from "./components/ui/card"
-export * from "./components/ui/carousel"
-export * from "./components/ui/chart"
-export * from "./components/ui/checkbox"
-export * from "./components/ui/collapsible"
-export * from "./components/ui/context-menu"
-export * from "./components/ui/dialog"
-export * from "./components/ui/drawer"
-export * from "./components/ui/dropdown-menu"
-export * from "./components/ui/form"
-export * from "./components/ui/hover-card"
-export * from "./components/ui/input-otp"
-export * from "./components/ui/input"
-export * from "./components/ui/label"
-export * from "./components/ui/menubar"
-export * from "./components/ui/navigation-menu"
-export * from "./components/ui/pagination"
-export * from "./components/ui/popover"
-export * from "./components/ui/progress"
-export * from "./components/ui/radio-group"
-export * from "./components/ui/resizable"
-export * from "./components/ui/scroll-area"
-export * from "./components/ui/select"
-export * from "./components/ui/separator"
-export * from "./components/ui/sheet"
-export * from "./components/ui/sidebar"
-export * from "./components/ui/skeleton"
-export * from "./components/ui/slider"
-export * from "./components/ui/sonner"
-export * from "./components/ui/switch"
-export * from "./components/ui/table"
-export * from "./components/ui/tabs"
-export * from "./components/ui/textarea"
-export * from "./components/ui/toast"
-export * from "./components/ui/toaster"
-export * from "./components/ui/toggle-group"
-export * from "./components/ui/toggle"
-export * from "./components/ui/tooltip"
-export * from "./components/feature/graph-card"
-export * from "./components/feature/header"
-export * from "./components/feature/login-form"
-export * from "./components/feature/search-bar"
-export * from "./components/feature/wizard"
+export { Button } from './components/ui/button';
+export { 
+  Dialog,
+  DialogPortal,
+  DialogOverlay,
+  DialogTrigger,
+  DialogClose,
+  DialogContent,
+  DialogHeader,
+  DialogFooter,
+  DialogTitle,
+  DialogDescription,
+} from './components/ui/dialog';
+export {
+  Sidebar,
+  SidebarContent,
+  SidebarFooter,
+  SidebarGroup,
+  SidebarGroupAction,
+  SidebarGroupContent,
+  SidebarGroupLabel,
+  SidebarHeader,
+  SidebarInput,
+  SidebarInset,
+  SidebarMenu,
+  SidebarMenuAction,
+  SidebarMenuBadge,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  SidebarMenuSkeleton,
+  SidebarMenuSub,
+  SidebarMenuSubButton,
+  SidebarMenuSubItem,
+  SidebarProvider,
+  SidebarRail,
+  SidebarSeparator,
+  SidebarTrigger,
+  useSidebar,
+} from './components/ui/sidebar';
+export {
+  Breadcrumb,
+  BreadcrumbList,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbPage,
+  BreadcrumbSeparator,
+  BreadcrumbEllipsis,
+} from './components/ui/breadcrumb';
+export {
+  Header
+} from './components/feature/header'

package/tailwind.config.js

@@ -92,3 +92,5 @@ const config: Config = {
 }
 
 export default config
+
+

package/.github/workflows/npm-publish.yml

@@ -1,35 +0,0 @@
-# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
-# For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages
-
-name: Node.js Package
-
-on:
-  release:
-    types: [created]
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-      - run: npm ci
-      - run: npm test
-      - run: npm prepublish
-
-  publish-npm:
-    needs: build
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-          registry-url: https://registry.npmjs.org/
-      - run: npm ci
-      - run: npm prepublish
-      - run: npm publish
-        env:
-          NODE_AUTH_TOKEN: ${{secrets.npm_token}}

package/scripts/build-index-ts.sh

@@ -1,16 +0,0 @@
-#!/bin/bash
-
-# Starting fresh
-rm src/index.ts
-
-# Add Components
-for import in `ls src/components/ui/ | grep -v '.stories.' | cut -f1 -d\.`;
-do 
-  echo 'export * from "./components/ui/'$import'"' >> src/index.ts 
-done
-
-# Add Features
-for import in `ls src/components/feature/ | grep -v '.stories.' | cut -f1 -d\.`;
-do 
-  echo 'export * from "./components/feature/'${import}'"' >> src/index.ts 
-done