get-elementa-ui 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 deriva
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,39 @@
+deriva-ui/
+├── .storybook/                 # Storybook config (for dev & documentation)
+│   ├── main.ts
+│   └── preview.tsx
+│
+├── src/                        # SOURCE CODE
+│   ├── components/             # Base Shadcn Components (Atoms)
+│   │   ├── ui/                 # The actual components
+│   │   │   ├── button.tsx
+│   │   │   ├── input.tsx
+│   │   │   ├── ...
+│   │   │   └── index.ts        # Barrel file for UI components
+│   │
+│   ├── patterns/               # "Deriva Specials" (Molecules/Organisms)
+│   │   ├── DerivaGlowCard.tsx  # The cool neon card
+│   │   ├── EnergyToggle.tsx    # Theme switcher
+│   │   ├── NeonChart.tsx       # Recharts wrapper
+│   │   └── index.ts
+│   │
+│   ├── theme/                  # Theming Engine
+│   │   ├── colors.ts           # The raw hex codes (100-1100 scale)
+│   │   ├── preset.ts           # The Tailwind Preset (Critical!)
+│   │   ├── plugin.ts           # Tailwind plugin for CSS vars
+│   │   └── ThemeProvider.tsx   # React Context for switching energies
+│   │
+│   ├── lib/                    # Utilities
+│   │   └── utils.ts            # standard cn() helper
+│   │
+│   ├── styles/                 # Global CSS
+│   │   └── globals.css         # Base Tailwind directives (@tailwind base...)
+│   │
+│   └── index.ts                # MAIN ENTRY POINT (Exports everything)
+│
+├── dist/                       # Build output (Generated by tsup)
+│   ├── index.js
+│   ├── index.d.ts
+│   └── index.css
+│
+└── tsup.config.ts              # Builder config (Best for libraries)

package/dist/components/button.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from 'class-variance-authority';
+import { Slot } from 'radix-ui';
+import { cn } from '@/src/lib/utils';
+const buttonVariants = cva("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 aria-invalid:ring-3 [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none", {
+    variants: {
+        variant: {
+            default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
+            outline: 'border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground',
+            secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
+            ghost: 'hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground',
+            destructive: 'bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30',
+            link: 'text-primary underline-offset-4 hover:underline'
+        },
+        size: {
+            default: 'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',
+            xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+            sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+            lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3',
+            icon: 'size-8',
+            'icon-xs': "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+            'icon-sm': 'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',
+            'icon-lg': 'size-9'
+        }
+    },
+    defaultVariants: {
+        variant: 'default',
+        size: 'default'
+    }
+});
+function Button({ className, variant = 'default', size = 'default', asChild = false, ...props }) {
+    const Comp = asChild ? Slot.Root : 'button';
+    return (_jsx(Comp, { "data-slot": "button", "data-variant": variant, "data-size": size, className: cn(buttonVariants({ variant, size, className })), ...props }));
+}
+export { Button, buttonVariants };

package/dist/index.esm.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";import{Slot as i}from"radix-ui";import{clsx as a}from"clsx";import{twMerge as t}from"tailwind-merge";function n(...e){return t(a(e))}const d=r("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 aria-invalid:ring-3 [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none",{variants:{variant:{default:"bg-primary text-primary-foreground [a]:hover:bg-primary/80",outline:"border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground",secondary:"bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",ghost:"hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground",destructive:"bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",xs:"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",sm:"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",lg:"h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3",icon:"size-8","icon-xs":"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3","icon-sm":"size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg","icon-lg":"size-9"}},defaultVariants:{variant:"default",size:"default"}});function o({className:r,variant:a="default",size:t="default",asChild:o=!1,...s}){const u=o?i.Root:"button";return e(u,{"data-slot":"button","data-variant":a,"data-size":t,className:n(d({variant:a,size:t,className:r})),...s})}export{o as Button};

package/dist/index.js

@@ -0,0 +1,2 @@
+import { Button } from '@/src/components/button';
+export { Button };

package/dist/lib/utils.js

@@ -0,0 +1,5 @@
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+export function cn(...inputs) {
+    return twMerge(clsx(inputs));
+}

package/dist/types/components/button.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export { Button, buttonVariants };

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+import { Button } from '@/src/components/button';
+export { Button };

package/dist/types/lib/utils.d.ts

@@ -0,0 +1,2 @@
+import { type ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;

package/package.json

@@ -0,0 +1,94 @@
+{
+    "name": "get-elementa-ui",
+    "version": "1.0.0",
+    "description": "Elementa UI components library.",
+    "homepage": "https://deriva.xyz/branding",
+    "main": "dist/index.js",
+    "module": "dist/index.esm.js",
+    "types": "dist/types/index.d.ts",
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/deriva-inc/elementa-ui.git"
+    },
+    "author": "Aayush Goyal <aayushgoyal.mps@gmail.com>",
+    "license": "MIT",
+    "private": false,
+    "publishConfig": {
+        "access": "public"
+    },
+    "files": [
+        "dist/**/*",
+        "src/index.ts",
+        "README.md",
+        "LICENSE"
+    ],
+    "keywords": [
+        "react",
+        "library",
+        "nodejs",
+        "shadcn-ui",
+        "shadcnui",
+        "javascript",
+        "typescript",
+        "component-library",
+        "elementa",
+        "elementa-ui"
+    ],
+    "scripts": {
+        "build": "rollup -c && tsc",
+        "build:watch": "rollup -c -w",
+        "prepublishOnly": "npm run build",
+        "publish:npm": "npm publish --access public",
+        "svgr": "svgr src/icons/*.svg --stdin-filepath .prettierrc --template src/lib/template.js --expand-props none --ignore-existing"
+    },
+    "peerDependencies": {
+        "react": "^19.1.0"
+    },
+    "devDependencies": {
+        "@babel/core": "^7.27.4",
+        "@babel/preset-react": "^7.27.1",
+        "@babel/preset-typescript": "^7.27.1",
+        "@babel/template": "^7.27.2",
+        "@rollup/plugin-babel": "^6.0.4",
+        "@rollup/plugin-commonjs": "^28.0.6",
+        "@rollup/plugin-json": "^6.1.0",
+        "@rollup/plugin-node-resolve": "^16.0.1",
+        "@rollup/plugin-typescript": "^12.1.3",
+        "@svgr/cli": "^8.1.0",
+        "@types/babel__core": "^7.20.5",
+        "@types/babel__template": "^7.4.4",
+        "@types/node": "^20.12.2",
+        "@types/react": "^19.1.8",
+        "@typescript-eslint/eslint-plugin": "^7.5.0",
+        "@typescript-eslint/parser": "^7.5.0",
+        "autoprefixer": "^10.4.19",
+        "eslint": "^8.57.0",
+        "eslint-config-airbnb": "^19.0.4",
+        "eslint-config-prettier": "^9.1.0",
+        "eslint-plugin-import": "^2.29.1",
+        "eslint-plugin-jsx-a11y": "^6.8.0",
+        "eslint-plugin-prettier": "^5.1.3",
+        "eslint-plugin-react": "^7.34.1",
+        "eslint-plugin-react-hooks": "^4.6.0",
+        "husky": "^9.0.11",
+        "prettier": "^3.2.4",
+        "prettier-plugin-tailwind": "^2.2.12",
+        "prettier-plugin-tailwindcss": "^0.6.14",
+        "rollup": "^4.44.0",
+        "rollup-plugin-dts": "^6.2.1",
+        "rollup-plugin-terser": "^7.0.2",
+        "tailwindcss": "^4.2.1",
+        "tslib": "^2.8.1",
+        "typescript": "^5.8.3"
+    },
+    "dependencies": {
+        "class-variance-authority": "^0.7.1",
+        "clsx": "^2.1.1",
+        "lucide-react": "^0.575.0",
+        "radix-ui": "^1.4.3",
+        "shadcn": "^3.8.5",
+        "tailwind-merge": "^3.5.0",
+        "ts-node": "^10.9.2",
+        "tw-animate-css": "^1.4.0"
+    }
+}

package/src/index.ts

@@ -0,0 +1,3 @@
+import { Button } from '@/src/components/button';
+
+export { Button };