@una-ui/preset 0.10.1-beta.1 → 0.12.0-beta.1

package/README.md

@@ -14,6 +14,14 @@
 
 Visit https://www.unaui.com for full documentation.
 
+## 🌠 Star History
+
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=una-ui/una-ui&type=Date&theme=dark" />
+  <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=una-ui/una-ui&type=Date" />
+  <img alt="Star History Chart" src="https://api.star-history.com/svg?repos=una-ui/una-ui&type=Date" />
+</picture>
+
 ## 🌻 Sponsors
 
 <p align="center">

package/dist/prefixes.cjs

@@ -1,5 +1,5 @@
 'use strict';
 
-const prefixes = ["accordion", "alert", "avatar", "avatar-group", "badge", "button", "icon", "indicator", "kbd", "link", "progress", "separator", "skeleton", "theme-switcher", "checkbox", "form-group", "input", "radio", "slider", "switch", "nav-link", "nav-link-group", "tabs", "tabs-content", "tabs-list", "tabs-root", "tabs-trigger", "select", "select-content", "select-group", "select-item", "select-item-indicator", "select-item-text", "select-label", "select-root", "select-scroll-down-button", "select-scroll-up-button", "select-separator", "select-trigger", "select-value", "resize", "size", "btn"];
+const prefixes = ["theme-switcher", "accordion", "alert", "avatar", "avatar-group", "badge", "button", "icon", "indicator", "kbd", "link", "progress", "separator", "skeleton", "checkbox", "form-group", "input", "radio", "slider", "switch", "nav-link", "nav-link-group", "card", "card-about", "card-content", "card-description", "card-footer", "card-header", "card-title", "tabs", "tabs-content", "tabs-list", "tabs-root", "tabs-trigger", "select", "select-content", "select-group", "select-item", "select-item-indicator", "select-item-text", "select-label", "select-root", "select-scroll-down-button", "select-scroll-up-button", "select-separator", "select-trigger", "select-value", "table", "table-body", "table-caption", "table-cell", "table-empty", "table-footer", "table-head", "table-header", "table-loading", "table-root", "table-row", "resize", "size", "btn"];
 
 module.exports = prefixes;

package/dist/prefixes.mjs

@@ -1,3 +1,3 @@
-const prefixes = ["accordion", "alert", "avatar", "avatar-group", "badge", "button", "icon", "indicator", "kbd", "link", "progress", "separator", "skeleton", "theme-switcher", "checkbox", "form-group", "input", "radio", "slider", "switch", "nav-link", "nav-link-group", "tabs", "tabs-content", "tabs-list", "tabs-root", "tabs-trigger", "select", "select-content", "select-group", "select-item", "select-item-indicator", "select-item-text", "select-label", "select-root", "select-scroll-down-button", "select-scroll-up-button", "select-separator", "select-trigger", "select-value", "resize", "size", "btn"];
+const prefixes = ["theme-switcher", "accordion", "alert", "avatar", "avatar-group", "badge", "button", "icon", "indicator", "kbd", "link", "progress", "separator", "skeleton", "checkbox", "form-group", "input", "radio", "slider", "switch", "nav-link", "nav-link-group", "card", "card-about", "card-content", "card-description", "card-footer", "card-header", "card-title", "tabs", "tabs-content", "tabs-list", "tabs-root", "tabs-trigger", "select", "select-content", "select-group", "select-item", "select-item-indicator", "select-item-text", "select-label", "select-root", "select-scroll-down-button", "select-scroll-up-button", "select-separator", "select-trigger", "select-value", "table", "table-body", "table-caption", "table-cell", "table-empty", "table-footer", "table-head", "table-header", "table-loading", "table-root", "table-row", "resize", "size", "btn"];
 
 export { prefixes as default };

package/dist/shortcuts.cjs

@@ -521,7 +521,8 @@ const staticProgress = {
   "progress": "progress-primary",
   // components
   "progress-root": "progress relative h-0.5em w-full overflow-hidden rounded-full bg-muted",
-  "progress-indicator": "h-full w-full flex-1 bg-brand transition-all"
+  "progress-indicator": "h-full w-full flex-1 bg-brand transition-all",
+  "progress-indeterminate": "absolute bg-brand h-full"
 };
 const dynamicProgress = [
   [/^progress-(.*)$/, ([, body], { theme }) => {
@@ -573,7 +574,7 @@ const tabs = [
 const staticSelect = {
   // configurations
   "select": "",
-  "select-default-variant": "btn-outline-white",
+  "select-default-variant": "btn-solid-white",
   "select-disabled": "n-disabled",
   "select-scroll": "flex cursor-default items-center justify-center py-1",
   "select-trigger-info-icon": "i-info",
@@ -645,6 +646,72 @@ const separator = [
   staticSeparator
 ];
 
+const staticCard = {
+  // base
+  "card": "relative flex flex-col rounded-lg overflow-hidden shadow-sm",
+  "card-default-variant": "card-outline-gray",
+  // components
+  "card-header": "",
+  "card-title": "text-2xl font-semibold leading-none tracking-tight",
+  "card-description": "text-sm text-muted",
+  "card-content": "px-4 py-5 pt-0 sm:p-6 sm:pt-0",
+  "card-footer": "flex items-center p-6 pt-0",
+  "card-about": "flex flex-col gap-y-1.5 px-4 py-5 sm:p-6",
+  // static variants
+  "card-soft-gray": "bg-muted border border-base",
+  "card-outline-gray": "bg-base border border-base"
+};
+const dynamicCard = [
+  // dynamic variants
+  [/^card-soft(-(\S+))?$/, ([, , c = "gray"]) => `bg-${c}-50 dark:bg-${c}-900 border-${c}-200 dark:border-${c}-700/58`],
+  [/^card-outline(-(\S+))?$/, ([, , c = "gray"]) => `border border-${c}-200 dark:border-${c}-700/58`]
+];
+const card = [
+  ...dynamicCard,
+  staticCard
+];
+
+const staticTable = {
+  // config
+  "table-default-variant": "table-solid-gray",
+  "table": "",
+  // table-root
+  "table-root": "w-full caption-bottom text-sm",
+  "table-root-wrapper": "relative w-full overflow-x-auto overflow-y-hidden border border-base rounded-md",
+  "table-body": "[&_tr:last-child]:border-0 border-base",
+  "table-caption": "mt-4 text-sm text-muted",
+  // table-head
+  "table-head": "h-12 px-4 text-left align-middle font-medium text-muted [&:has([role=checkbox])]:pr-0",
+  "table-head-pinned": "sticky bg-base",
+  "table-head-pinned-left": "left-0",
+  "table-head-pinned-right": "right-0",
+  // table-header
+  "table-header": "[&_tr]:border-b border-base relative",
+  // table-row
+  "table-row": "border-b border-base hover:bg-muted data-[filter=true]:hover:bg-base data-[state=selected]:bg-muted",
+  // table-cell
+  "table-cell": "p-4 align-middle [&:has([role=checkbox])]:pr-0",
+  "table-cell-pinned": "sticky z-10 bg-base",
+  "table-cell-pinned-left": "left-0",
+  "table-cell-pinned-right": "right-0",
+  // table-empty
+  "table-empty-row": "",
+  "table-empty-cell": "p-4 whitespace-nowrap align-middle text-sm text-muted hover:bg-base",
+  "table-empty": "flex items-center justify-center py-10",
+  // table-loading
+  "table-loading-icon": "i-lucide-refresh-ccw animate-spin text-lg",
+  "table-loading-row": "data-[loading=true]:border-0",
+  "table-loading-cell": "",
+  "table-loading": "absolute inset-x-0 overflow-hidden p-0",
+  // table-footer
+  "table-footer": "border-t border-base bg-muted font-medium [&>tr]:last:border-b-0"
+};
+const dynamicTable = [];
+const table = [
+  ...dynamicTable,
+  staticTable
+];
+
 const shortcuts = [
   ...general,
   ...accordion,
@@ -669,7 +736,9 @@ const shortcuts = [
   ...skeleton,
   ...tabs,
   ...select,
-  ...separator
+  ...separator,
+  ...card,
+  ...table
 ];
 
 exports.shortcuts = shortcuts;

package/dist/shortcuts.mjs

@@ -519,7 +519,8 @@ const staticProgress = {
   "progress": "progress-primary",
   // components
   "progress-root": "progress relative h-0.5em w-full overflow-hidden rounded-full bg-muted",
-  "progress-indicator": "h-full w-full flex-1 bg-brand transition-all"
+  "progress-indicator": "h-full w-full flex-1 bg-brand transition-all",
+  "progress-indeterminate": "absolute bg-brand h-full"
 };
 const dynamicProgress = [
   [/^progress-(.*)$/, ([, body], { theme }) => {
@@ -571,7 +572,7 @@ const tabs = [
 const staticSelect = {
   // configurations
   "select": "",
-  "select-default-variant": "btn-outline-white",
+  "select-default-variant": "btn-solid-white",
   "select-disabled": "n-disabled",
   "select-scroll": "flex cursor-default items-center justify-center py-1",
   "select-trigger-info-icon": "i-info",
@@ -643,6 +644,72 @@ const separator = [
   staticSeparator
 ];
 
+const staticCard = {
+  // base
+  "card": "relative flex flex-col rounded-lg overflow-hidden shadow-sm",
+  "card-default-variant": "card-outline-gray",
+  // components
+  "card-header": "",
+  "card-title": "text-2xl font-semibold leading-none tracking-tight",
+  "card-description": "text-sm text-muted",
+  "card-content": "px-4 py-5 pt-0 sm:p-6 sm:pt-0",
+  "card-footer": "flex items-center p-6 pt-0",
+  "card-about": "flex flex-col gap-y-1.5 px-4 py-5 sm:p-6",
+  // static variants
+  "card-soft-gray": "bg-muted border border-base",
+  "card-outline-gray": "bg-base border border-base"
+};
+const dynamicCard = [
+  // dynamic variants
+  [/^card-soft(-(\S+))?$/, ([, , c = "gray"]) => `bg-${c}-50 dark:bg-${c}-900 border-${c}-200 dark:border-${c}-700/58`],
+  [/^card-outline(-(\S+))?$/, ([, , c = "gray"]) => `border border-${c}-200 dark:border-${c}-700/58`]
+];
+const card = [
+  ...dynamicCard,
+  staticCard
+];
+
+const staticTable = {
+  // config
+  "table-default-variant": "table-solid-gray",
+  "table": "",
+  // table-root
+  "table-root": "w-full caption-bottom text-sm",
+  "table-root-wrapper": "relative w-full overflow-x-auto overflow-y-hidden border border-base rounded-md",
+  "table-body": "[&_tr:last-child]:border-0 border-base",
+  "table-caption": "mt-4 text-sm text-muted",
+  // table-head
+  "table-head": "h-12 px-4 text-left align-middle font-medium text-muted [&:has([role=checkbox])]:pr-0",
+  "table-head-pinned": "sticky bg-base",
+  "table-head-pinned-left": "left-0",
+  "table-head-pinned-right": "right-0",
+  // table-header
+  "table-header": "[&_tr]:border-b border-base relative",
+  // table-row
+  "table-row": "border-b border-base hover:bg-muted data-[filter=true]:hover:bg-base data-[state=selected]:bg-muted",
+  // table-cell
+  "table-cell": "p-4 align-middle [&:has([role=checkbox])]:pr-0",
+  "table-cell-pinned": "sticky z-10 bg-base",
+  "table-cell-pinned-left": "left-0",
+  "table-cell-pinned-right": "right-0",
+  // table-empty
+  "table-empty-row": "",
+  "table-empty-cell": "p-4 whitespace-nowrap align-middle text-sm text-muted hover:bg-base",
+  "table-empty": "flex items-center justify-center py-10",
+  // table-loading
+  "table-loading-icon": "i-lucide-refresh-ccw animate-spin text-lg",
+  "table-loading-row": "data-[loading=true]:border-0",
+  "table-loading-cell": "",
+  "table-loading": "absolute inset-x-0 overflow-hidden p-0",
+  // table-footer
+  "table-footer": "border-t border-base bg-muted font-medium [&>tr]:last:border-b-0"
+};
+const dynamicTable = [];
+const table = [
+  ...dynamicTable,
+  staticTable
+];
+
 const shortcuts = [
   ...general,
   ...accordion,
@@ -667,7 +734,9 @@ const shortcuts = [
   ...skeleton,
   ...tabs,
   ...select,
-  ...separator
+  ...separator,
+  ...card,
+  ...table
 ];
 
 export { shortcuts };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@una-ui/preset",
-  "version": "0.10.1-beta.1",
+  "version": "0.12.0-beta.1",
   "description": "The default preset for @una-ui",
   "author": "Phojie Rengel <phojrengel@gmail.com>",
   "license": "MIT",
@@ -49,9 +49,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@unocss/core": "^0.61.5",
-    "@unocss/preset-mini": "^0.61.5",
-    "unocss": "^0.61.5"
+    "@unocss/core": "^0.61.9",
+    "@unocss/preset-mini": "^0.61.9",
+    "unocss": "^0.61.9"
   },
   "scripts": {
     "build": "unbuild",