@rimelight/ui 0.0.32 → 0.0.33

package/src/themes/dashboard-sidebar-toggle.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createDashboardSidebarToggleTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createDashboardSidebarToggleTheme()

package/src/themes/dashboard-sidebar.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createDashboardSidebarTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createDashboardSidebarTheme()

package/src/themes/dashboard-toolbar.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createDashboardToolbarTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createDashboardToolbarTheme()

package/src/themes/dock.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createDockTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createDockTheme()

package/src/themes/drawer.theme.ts

@@ -1,44 +1,61 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const drawerTheme = defineTheme({
-  slots: ["root", "trigger", "backdrop", "content", "handle", "header", "title", "description", "footer", "closeButton"],
-  base: {
-    root: "relative inline-block",
-    trigger: "",
-    backdrop: "fixed inset-0 z-50 bg-black/60 backdrop-blur-sm transition-all duration-300",
-    content: [
-      "fixed z-50 bg-background p-6 shadow-xl border-border transition-all duration-300 outline-none",
-      "data-[state=open]:animate-in data-[state=closed]:animate-out"
-    ],
-    handle: "mx-auto h-1.5 w-[100px] rounded-full bg-muted mb-4",
-    header: "flex flex-col gap-1.5 mb-4 text-center",
-    title: "text-lg font-semibold leading-none tracking-tight text-foreground",
-    description: "text-sm text-muted-foreground leading-relaxed",
-    footer: "flex flex-col gap-2 mt-6",
-    closeButton: [
-      "absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100",
-      "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none"
-    ]
-  },
-  variants: {
-    direction: {
-      top: {
-        content: "inset-x-0 top-0 border-b rounded-b-xl data-[state=open]:slide-in-from-top data-[state=closed]:slide-out-to-top"
-      },
-      bottom: {
-        content: "inset-x-0 bottom-0 border-t rounded-t-xl data-[state=open]:slide-in-from-bottom data-[state=closed]:slide-out-to-bottom"
-      },
-      left: {
-        content: "inset-y-0 left-0 h-full w-3/4 max-w-sm border-r rounded-r-xl data-[state=open]:slide-in-from-left data-[state=closed]:slide-out-to-left"
-      },
-      right: {
-        content: "inset-y-0 right-0 h-full w-3/4 max-w-sm border-l rounded-l-xl data-[state=open]:slide-in-from-right data-[state=closed]:slide-out-to-right"
-      }
-    }
-  },
-  defaultVariants: {
-    direction: "bottom"
-  }
-})
-
-export default drawerTheme
+import { defaultColors } from "../presets/defaults"
+import { defineTheme } from "../utils/defineTheme"
+
+export const createDrawerTheme = (colors: string[] = defaultColors) =>
+  defineTheme({
+    slots: [
+      "root",
+      "trigger",
+      "backdrop",
+      "content",
+      "handle",
+      "header",
+      "title",
+      "description",
+      "footer",
+      "closeButton"
+    ],
+    base: {
+      root: "relative inline-block",
+      trigger: "",
+      backdrop: "fixed inset-0 z-50 bg-black/60 backdrop-blur-sm transition-all duration-300",
+      content: [
+        "fixed z-50 bg-background p-6 shadow-xl border-border transition-all duration-300 outline-none",
+        "data-[state=open]:animate-in data-[state=closed]:animate-out"
+      ],
+      handle: "mx-auto h-1.5 w-[100px] rounded-full bg-muted mb-4",
+      header: "flex flex-col gap-1.5 mb-4 text-center",
+      title: "text-lg font-semibold leading-none tracking-tight text-foreground",
+      description: "text-sm text-muted-foreground leading-relaxed",
+      footer: "flex flex-col gap-2 mt-6",
+      closeButton: [
+        "absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100",
+        "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none"
+      ]
+    },
+    variants: {
+      direction: {
+        top: {
+          content:
+            "inset-x-0 top-0 border-b rounded-b-xl data-[state=open]:slide-in-from-top data-[state=closed]:slide-out-to-top"
+        },
+        bottom: {
+          content:
+            "inset-x-0 bottom-0 border-t rounded-t-xl data-[state=open]:slide-in-from-bottom data-[state=closed]:slide-out-to-bottom"
+        },
+        left: {
+          content:
+            "inset-y-0 left-0 h-full w-3/4 max-w-sm border-r rounded-r-xl data-[state=open]:slide-in-from-left data-[state=closed]:slide-out-to-left"
+        },
+        right: {
+          content:
+            "inset-y-0 right-0 h-full w-3/4 max-w-sm border-l rounded-l-xl data-[state=open]:slide-in-from-right data-[state=closed]:slide-out-to-right"
+        }
+      }
+    },
+    defaultVariants: {
+      direction: "bottom"
+    }
+  })
+
+export default createDrawerTheme()

package/src/themes/dropdown-menu.theme.ts

@@ -1,27 +1,29 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createDropdownMenuTheme = () =>
-  defineTheme({
-    slots: ["root", "trigger", "content", "item", "shortcut", "separator", "label"],
-    base: {
-      root: "relative inline-block text-left",
-      trigger: "inline-flex justify-center w-full rounded-md border border-input bg-background px-4 py-2 text-sm font-medium shadow-sm hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
-      content: "absolute right-0 z-50 mt-2 w-56 origin-top-right rounded-md border bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-black ring-opacity-5 focus:outline-none",
-      item: "group flex w-full items-center rounded-md px-2 py-1.5 text-sm hover:bg-accent hover:text-accent-foreground cursor-pointer disabled:pointer-events-none disabled:opacity-50",
-      shortcut: "ml-auto text-xs tracking-widest opacity-60",
-      separator: "-mx-1 my-1 h-px bg-muted",
-      label: "px-2 py-1.5 text-xs font-semibold tracking-wider text-muted-foreground uppercase"
-    },
-    variants: {
-      size: {
-        sm: { trigger: "px-3 py-1.5 text-xs", item: "px-2 py-1 text-xs" },
-        md: { trigger: "px-4 py-2 text-sm", item: "px-2 py-1.5 text-sm" },
-        lg: { trigger: "px-5 py-2.5 text-base", item: "px-3 py-2 text-base" }
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  })
-
-export default createDropdownMenuTheme()
+import { defineTheme } from "../utils/defineTheme"
+
+export const createDropdownMenuTheme = () =>
+  defineTheme({
+    slots: ["root", "trigger", "content", "item", "shortcut", "separator", "label"],
+    base: {
+      root: "relative inline-block text-left",
+      trigger:
+        "inline-flex justify-center w-full rounded-md border border-input bg-background px-4 py-2 text-sm font-medium shadow-sm hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+      content:
+        "absolute right-0 z-50 mt-2 w-56 origin-top-right rounded-md border bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-black ring-opacity-5 focus:outline-none",
+      item: "group flex w-full items-center rounded-md px-2 py-1.5 text-sm hover:bg-accent hover:text-accent-foreground cursor-pointer disabled:pointer-events-none disabled:opacity-50",
+      shortcut: "ml-auto text-xs tracking-widest opacity-60",
+      separator: "-mx-1 my-1 h-px bg-muted",
+      label: "px-2 py-1.5 text-xs font-semibold tracking-wider text-muted-foreground uppercase"
+    },
+    variants: {
+      size: {
+        sm: { trigger: "px-3 py-1.5 text-xs", item: "px-2 py-1 text-xs" },
+        md: { trigger: "px-4 py-2 text-sm", item: "px-2 py-1.5 text-sm" },
+        lg: { trigger: "px-5 py-2.5 text-base", item: "px-3 py-2 text-base" }
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  })
+
+export default createDropdownMenuTheme()

package/src/themes/editor.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createEditorTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createEditorTheme()

package/src/themes/empty.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createEmptyTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createEmptyTheme()

package/src/themes/error.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createErrorTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createErrorTheme()

package/src/themes/field-group.theme.ts

@@ -1,23 +1,24 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export const createFieldGroupTheme = () =>
-  defineTheme({
-    slots: ["root", "prepend", "append"],
-    base: {
-      root: "relative flex items-stretch w-full rounded-md border border-input bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 overflow-hidden",
-      prepend: "flex items-center bg-muted px-3 text-sm text-muted-foreground border-r border-input",
-      append: "flex items-center bg-muted px-3 text-sm text-muted-foreground border-l border-input"
-    },
-    variants: {
-      size: {
-        sm: { prepend: "px-2 text-xs", append: "px-2 text-xs" },
-        md: { prepend: "px-3 text-sm", append: "px-3 text-sm" },
-        lg: { prepend: "px-4 text-base", append: "px-4 text-base" }
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  })
-
-export default createFieldGroupTheme()
+import { defineTheme } from "../utils/defineTheme"
+
+export const createFieldGroupTheme = () =>
+  defineTheme({
+    slots: ["root", "prepend", "append"],
+    base: {
+      root: "relative flex items-stretch w-full rounded-md border border-input bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 overflow-hidden",
+      prepend:
+        "flex items-center bg-muted px-3 text-sm text-muted-foreground border-r border-input",
+      append: "flex items-center bg-muted px-3 text-sm text-muted-foreground border-l border-input"
+    },
+    variants: {
+      size: {
+        sm: { prepend: "px-2 text-xs", append: "px-2 text-xs" },
+        md: { prepend: "px-3 text-sm", append: "px-3 text-sm" },
+        lg: { prepend: "px-4 text-base", append: "px-4 text-base" }
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  })
+
+export default createFieldGroupTheme()

package/src/themes/fieldset.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createFieldsetTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createFieldsetTheme()

package/src/themes/floating-action.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createFloatingActionTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createFloatingActionTheme()

package/src/themes/footer.theme.ts

@@ -1,27 +1,30 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root", "container", "left", "center", "right"],
-  base: {
-    root: "py-8 lg:py-12",
-    container:
-      "flex flex-col justify-between gap-xl lg:flex-row lg:items-stretch px-4 md:px-6 lg:px-8",
-    left: "order-last flex flex-col items-center justify-between gap-xl lg:order-1 lg:flex-none lg:items-start",
-    center: "flex flex-col items-center justify-start lg:order-2 lg:flex-1",
-    right:
-      "order-first flex flex-col items-center justify-between gap-xl lg:order-3 lg:flex-none lg:items-end"
-  },
-  variants: {
-    contain: {
-      true: {
-        container: "mx-auto max-w-7xl"
-      },
-      false: {
-        container: "w-full"
-      }
-    }
-  },
-  defaultVariants: {
-    contain: false
-  }
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createFooterTheme = () =>
+  defineTheme({
+    slots: ["root", "container", "left", "center", "right"],
+    base: {
+      root: "py-8 lg:py-12 overflow-hidden",
+      container:
+        "box-border flex flex-col justify-between gap-xl lg:flex-row lg:items-stretch px-4 md:px-6 lg:px-8 w-full",
+      left: "order-last flex flex-col items-center justify-between gap-xl lg:order-1 lg:flex-none lg:items-start",
+      center: "flex flex-col items-center justify-start lg:order-2 lg:flex-1",
+      right:
+        "order-first flex flex-col items-center justify-between gap-xl lg:order-3 lg:flex-none lg:items-end"
+    },
+    variants: {
+      contain: {
+        true: {
+          container: "mx-auto max-w-7xl"
+        },
+        false: {
+          container: "w-full"
+        }
+      }
+    },
+    defaultVariants: {
+      contain: false
+    }
+  })
+
+export default createFooterTheme()

package/src/themes/form.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createFormTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: "space-y-6"
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createFormTheme()

package/src/themes/gallery.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createGalleryTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createGalleryTheme()

package/src/themes/head.theme.ts

@@ -1,10 +1,13 @@
-import { defineTheme } from "../utils/defineTheme"
-
-export default defineTheme({
-  slots: ["root"],
-  base: {
-    root: ""
-  },
-  variants: {},
-  defaultVariants: {}
-})
+import { defineTheme } from "../utils/defineTheme"
+
+export const createHeadTheme = () =>
+  defineTheme({
+    slots: ["root"],
+    base: {
+      root: ""
+    },
+    variants: {},
+    defaultVariants: {}
+  })
+
+export default createHeadTheme()