@justin_evo/evo-ui 1.2.0 → 1.2.1

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2026 Justin Khor
-
-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.
+MIT License
+
+Copyright (c) 2026 Justin Khor
+
+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

@@ -1,70 +1,70 @@
-# Evo UI
-
-**A high-performance, enterprise-grade React UI component library.**
-
-Evo UI ships 30+ accessible, themeable React components — with built-in light &
-dark mode, full TypeScript types, `forwardRef` + native attribute pass-through,
-and **zero runtime dependencies**.
-
-- 📚 **Documentation:** https://elevora-ui-document-3fb80.web.app
-- 💻 **GitHub:** https://github.com/jinchuen/evo
-- 📦 **npm:** https://www.npmjs.com/package/@justin_evo/evo-ui
-
-## Installation
-
-```bash
-npm install @justin_evo/evo-ui
-```
-
-`react` and `react-dom` (>= 17) are peer dependencies. Evo UI itself has no
-runtime dependencies.
-
-## Quick start
-
-```jsx
-// Import the stylesheet once in your app entry (includes the light/dark theme tokens)
-import '@justin_evo/evo-ui/dist/evo-ui.css'
-
-import { EvoThemeProvider, EvoButton } from '@justin_evo/evo-ui'
-
-export default function App() {
-  return (
-    <EvoThemeProvider defaultTheme="system">
-      <EvoButton variant="solid" severity="primary">Hello Evo</EvoButton>
-    </EvoThemeProvider>
-  )
-}
-```
-
-## Why Evo UI
-
-- 🌗 **Light & dark mode** out of the box — CSS-variable theming, no runtime cost.
-- 📱 **Mobile-ready** — ≥ 44px touch targets, responsive down to 375px.
-- 🔡 **Fully typed** — ships `.d.ts`; every component forwards `ref` and native attributes.
-- 🧩 **Composable, orthogonal APIs** — e.g. `<Form.Field><Form.Label /></Form.Field>`.
-- 🪶 **Zero runtime dependencies.**
-
-## Components
-
-Full props, variants, and live examples for every component live in the
-[documentation](https://elevora-ui-document-3fb80.web.app).
-
-| Category               | Components                                                                                                  |
-| ---------------------- | ---------------------------------------------------------------------------------------------------------- |
-| **Theming**            | `EvoThemeProvider`, `EvoThemeToggle`                                                                        |
-| **Layout & structure** | `EvoStack`, `EvoGrid`, `EvoDivider`, `EvoContainer`, `EvoCard`                                              |
-| **Navigation**         | `EvoTabs`, `EvoBreadcrumb`, `EvoNav`, `EvoTopNav`, `EvoPagination`, `EvoCommandPalette`                     |
-| **Forms & inputs**     | `EvoInput`, `EvoRichTextArea`, `EvoSelect`, `EvoTreeSelect`, `EvoAutoComplete`, `EvoCheckbox`, `EvoRadio`, `EvoToggle`, `EvoForm` |
-| **Feedback & overlays**| `EvoModal`, `EvoNotification`, `EvoTooltip`, `EvoAlert`                                                     |
-| **Data display**       | `EvoBadge`, `EvoSkeleton`, `EvoTable`                                                                       |
-| **General**            | `EvoButton`                                                                                                 |
-| **Media**              | `EvoImageCropper`                                                                                           |
-
-## Documentation
-
-Browse the full component catalogue, prop tables, and copy-paste examples at
-**https://elevora-ui-document-3fb80.web.app**.
-
-## License
-
-MIT © Justin Khor
+# Evo UI
+
+**A high-performance, enterprise-grade React UI component library.**
+
+Evo UI ships 30+ accessible, themeable React components — with built-in light &
+dark mode, full TypeScript types, `forwardRef` + native attribute pass-through,
+and **zero runtime dependencies**.
+
+- 📚 **Documentation:** https://docs.elevora.com.my
+- 💻 **GitHub:** https://github.com/jinchuen/evo
+- 📦 **npm:** https://www.npmjs.com/package/@justin_evo/evo-ui
+
+## Installation
+
+```bash
+npm install @justin_evo/evo-ui
+```
+
+`react` and `react-dom` (>= 17) are peer dependencies. Evo UI itself has no
+runtime dependencies.
+
+## Quick start
+
+```jsx
+// Import the stylesheet once in your app entry (includes the light/dark theme tokens)
+import '@justin_evo/evo-ui/dist/evo-ui.css'
+
+import { EvoThemeProvider, EvoButton } from '@justin_evo/evo-ui'
+
+export default function App() {
+  return (
+    <EvoThemeProvider defaultTheme="system">
+      <EvoButton variant="solid" severity="primary">Hello Evo</EvoButton>
+    </EvoThemeProvider>
+  )
+}
+```
+
+## Why Evo UI
+
+- 🌗 **Light & dark mode** out of the box — CSS-variable theming, no runtime cost.
+- 📱 **Mobile-ready** — ≥ 44px touch targets, responsive down to 375px.
+- 🔡 **Fully typed** — ships `.d.ts`; every component forwards `ref` and native attributes.
+- 🧩 **Composable, orthogonal APIs** — e.g. `<Form.Field><Form.Label /></Form.Field>`.
+- 🪶 **Zero runtime dependencies.**
+
+## Components
+
+Full props, variants, and live examples for every component live in the
+[documentation](https://docs.elevora.com.my).
+
+| Category               | Components                                                                                                  |
+| ---------------------- | ---------------------------------------------------------------------------------------------------------- |
+| **Theming**            | `EvoThemeProvider`, `EvoThemeToggle`                                                                        |
+| **Layout & structure** | `EvoStack`, `EvoGrid`, `EvoDivider`, `EvoContainer`, `EvoCard`                                              |
+| **Navigation**         | `EvoTabs`, `EvoBreadcrumb`, `EvoNav`, `EvoTopNav`, `EvoPagination`, `EvoCommandPalette`                     |
+| **Forms & inputs**     | `EvoInput`, `EvoRichTextArea`, `EvoSelect`, `EvoTreeSelect`, `EvoAutoComplete`, `EvoCheckbox`, `EvoRadio`, `EvoToggle`, `EvoForm` |
+| **Feedback & overlays**| `EvoModal`, `EvoNotification`, `EvoTooltip`, `EvoAlert`                                                     |
+| **Data display**       | `EvoBadge`, `EvoSkeleton`, `EvoTable`                                                                       |
+| **General**            | `EvoButton`                                                                                                 |
+| **Media**              | `EvoImageCropper`                                                                                           |
+
+## Documentation
+
+Browse the full component catalogue, prop tables, and copy-paste examples at
+**https://docs.elevora.com.my**.
+
+## License
+
+MIT © Justin Khor

package/dist/declarations.d.ts

@@ -1,6 +1,6 @@
-declare module '*.module.scss' {
-  const classes: Record<string, string>;
-  export default classes;
-}
-
-declare module '*.scss' {}
+declare module '*.module.scss' {
+  const classes: Record<string, string>;
+  export default classes;
+}
+
+declare module '*.scss' {}

package/package.json

@@ -1,52 +1,52 @@
-{
-  "name": "@justin_evo/evo-ui",
-  "version": "1.2.0",
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.es.js",
-  "types": "dist/index.d.ts",
-  "style": "dist/evo-ui.css",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.es.js",
-      "require": "./dist/index.cjs.js"
-    },
-    "./dist/evo-ui.css": "./dist/evo-ui.css"
-  },
-  "scripts": {
-    "dev": "tsup src/index.ts --format cjs,esm --watch --dts",
-    "build": "vite build",
-    "showcase": "vite"
-  },
-  "keywords": [
-    "react",
-    "ui",
-    "button",
-    "component",
-    "evo-ui"
-  ],
-  "author": "Justin Khor",
-  "license": "MIT",
-  "description": "A high-performance, enterprise-grade React UI component library.",
-  "peerDependencies": {
-    "react": ">=17.0.0",
-    "react-dom": ">=17.0.0"
-  },
-  "devDependencies": {
-    "@types/node": "^25.6.0",
-    "@types/react": "^19.2.14",
-    "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^4.3.4",
-    "sass": "^1.99.0",
-    "sass-embedded": "^1.99.0",
-    "tsup": "^8.5.1",
-    "typescript": "^6.0.3",
-    "vite": "^6.3.2",
-    "vite-plugin-dts": "^4.5.4"
-  },
-  "files": [
-    "dist",
-    "src",
-    "src/css"
-  ]
-}
+{
+  "name": "@justin_evo/evo-ui",
+  "version": "1.2.1",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "style": "dist/evo-ui.css",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.cjs.js"
+    },
+    "./dist/evo-ui.css": "./dist/evo-ui.css"
+  },
+  "scripts": {
+    "dev": "tsup src/index.ts --format cjs,esm --watch --dts",
+    "build": "vite build",
+    "showcase": "vite"
+  },
+  "keywords": [
+    "react",
+    "ui",
+    "button",
+    "component",
+    "evo-ui"
+  ],
+  "author": "Justin Khor",
+  "license": "MIT",
+  "description": "A high-performance, enterprise-grade React UI component library.",
+  "peerDependencies": {
+    "react": ">=17.0.0",
+    "react-dom": ">=17.0.0"
+  },
+  "devDependencies": {
+    "@types/node": "^25.6.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^4.3.4",
+    "sass": "^1.99.0",
+    "sass-embedded": "^1.99.0",
+    "tsup": "^8.5.1",
+    "typescript": "^6.0.3",
+    "vite": "^6.3.2",
+    "vite-plugin-dts": "^4.5.4"
+  },
+  "files": [
+    "dist",
+    "src",
+    "src/css"
+  ]
+}

package/src/Alert/Alert.tsx

@@ -1,49 +1,49 @@
-import React, { useState } from 'react';
-import styles from '../css/alert.module.scss';
-
-type AlertType = 'success' | 'error' | 'warning' | 'info';
-
-interface EvoAlertProps {
-  type?: AlertType;
-  title?: string;
-  children: React.ReactNode;
-  dismissible?: boolean;
-  className?: string;
-}
-
-const icons: Record<AlertType, string> = {
-  success: '✓', error: '✕', warning: '⚠', info: 'i',
-};
-
-export const EvoAlert = ({
-  type = 'info',
-  title,
-  children,
-  dismissible = false,
-  className = '',
-}: EvoAlertProps) => {
-  const [dismissed, setDismissed] = useState(false);
-  if (dismissed) return null;
-
-  return (
-    <div
-      className={[styles.alert, styles[type], className].filter(Boolean).join(' ')}
-      role="alert"
-    >
-      <span className={styles.alertIcon}>{icons[type]}</span>
-      <div className={styles.alertContent}>
-        {title && <p className={styles.alertTitle}>{title}</p>}
-        <div className={styles.alertDescription}>{children}</div>
-      </div>
-      {dismissible && (
-        <button
-          className={styles.dismissBtn}
-          onClick={() => setDismissed(true)}
-          aria-label="Dismiss alert"
-        >
-          ✕
-        </button>
-      )}
-    </div>
-  );
-};
+import React, { useState } from 'react';
+import styles from '../css/alert.module.scss';
+
+type AlertType = 'success' | 'error' | 'warning' | 'info';
+
+interface EvoAlertProps {
+  type?: AlertType;
+  title?: string;
+  children: React.ReactNode;
+  dismissible?: boolean;
+  className?: string;
+}
+
+const icons: Record<AlertType, string> = {
+  success: '✓', error: '✕', warning: '⚠', info: 'i',
+};
+
+export const EvoAlert = ({
+  type = 'info',
+  title,
+  children,
+  dismissible = false,
+  className = '',
+}: EvoAlertProps) => {
+  const [dismissed, setDismissed] = useState(false);
+  if (dismissed) return null;
+
+  return (
+    <div
+      className={[styles.alert, styles[type], className].filter(Boolean).join(' ')}
+      role="alert"
+    >
+      <span className={styles.alertIcon}>{icons[type]}</span>
+      <div className={styles.alertContent}>
+        {title && <p className={styles.alertTitle}>{title}</p>}
+        <div className={styles.alertDescription}>{children}</div>
+      </div>
+      {dismissible && (
+        <button
+          className={styles.dismissBtn}
+          onClick={() => setDismissed(true)}
+          aria-label="Dismiss alert"
+        >
+          ✕
+        </button>
+      )}
+    </div>
+  );
+};