@firecms/ui 3.0.0-beta.1 → 3.0.0-beta.2-pre.1

package/dist/styles.d.ts

@@ -8,5 +8,5 @@ export declare const fieldBackgroundHoverMixin = "hover:bg-opacity-70 dark:hover
 export declare const defaultBorderMixin = "border-gray-100 dark:border-gray-800 dark:border-opacity-80";
 export declare const paperMixin = "bg-white rounded-md dark:bg-gray-950 border dark:border-gray-800 dark:border-opacity-90 border-gray-100";
 export declare const cardMixin = "bg-white rounded-md dark:bg-gray-950 dark:border-gray-800 dark:border-opacity-50 transition duration-200 ease-in-out m-1 -p-1 border border-transparent";
-export declare const cardClickableMixin = "hover:bg-blue-100 dark:hover:bg-blue-900 hover:bg-opacity-20 dark:hover:bg-opacity-20 hover:ring-2 cursor-pointer";
-export declare const cardSelectedMixin = "bg-blue-100 dark:bg-blue-900 bg-opacity-30 dark:bg-opacity-10 ring-1 ring-primary ring-opacity-75";
+export declare const cardClickableMixin = "hover:bg-primary-bg dark:hover:bg-primary-bg hover:bg-opacity-20 dark:hover:bg-opacity-20 hover:ring-2 hover:ring-primary cursor-pointer";
+export declare const cardSelectedMixin = "bg-primary-bg dark:bg-primary-bg bg-opacity-30 dark:bg-opacity-10 ring-1 ring-primary ring-opacity-75";

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@firecms/ui",
     "type": "module",
-    "version": "3.0.0-beta.1",
+    "version": "3.0.0-beta.2-pre.1",
     "description": "Awesome Firebase/Firestore-based headless open-source CMS",
     "funding": {
         "url": "https://github.com/sponsors/firecmsco"
@@ -50,7 +50,7 @@
         "@radix-ui/react-switch": "^1.0.3",
         "@radix-ui/react-tabs": "^1.0.4",
         "@radix-ui/react-tooltip": "^1.0.7",
-        "cmdk": "^0.2.0",
+        "cmdk": "^0.2.1",
         "react-datepicker": "^4.24.0",
         "react-dropzone": "^14.2.3",
         "react-fast-compare": "^3.2.2",
@@ -69,39 +69,39 @@
     "devDependencies": {
         "@jest/globals": "^29.7.0",
         "@testing-library/jest-dom": "^5.17.0",
-        "@testing-library/react": "^14.0.0",
-        "@testing-library/user-event": "^14.5.1",
-        "@types/jest": "^29.5.6",
-        "@types/node": "^20.8.9",
+        "@testing-library/react": "^14.2.1",
+        "@testing-library/user-event": "^14.5.2",
+        "@types/jest": "^29.5.12",
+        "@types/node": "^20.11.16",
         "@types/object-hash": "^3.0.6",
-        "@types/react": "^18.2.45",
-        "@types/react-dom": "^18.2.17",
+        "@types/react": "^18.2.54",
+        "@types/react-dom": "^18.2.18",
         "@types/react-measure": "^2.0.12",
         "@typescript-eslint/eslint-plugin": "^5.62.0",
         "@typescript-eslint/parser": "^5.62.0",
         "@vitejs/plugin-react": "^4.2.1",
         "cross-env": "^7.0.3",
-        "eslint": "^8.55.0",
+        "eslint": "^8.56.0",
         "eslint-config-standard": "^17.1.0",
         "eslint-plugin-import": "^2.29.1",
         "eslint-plugin-n": "^15.7.0",
         "eslint-plugin-promise": "^6.1.1",
         "eslint-plugin-react": "^7.33.2",
         "eslint-plugin-react-hooks": "^4.6.0",
-        "firebase": "^10.7.1",
+        "firebase": "^10.8.0",
         "jest": "^29.7.0",
         "npm-run-all": "^4.1.5",
-        "ts-jest": "^29.1.1",
+        "ts-jest": "^29.1.2",
         "ts-node": "^10.9.2",
         "tsd": "^0.28.1",
         "typescript": "^5.3.3",
-        "vite": "^4.5.1"
+        "vite": "^4.5.2"
     },
     "files": [
         "dist",
         "src"
     ],
-    "gitHead": "71db60591860441e5c0d2b6cbc11198870257c7e",
+    "gitHead": "84f61eb3868f008f9c7c892881f12f0e79b566a0",
     "publishConfig": {
         "access": "public"
     }

package/src/components/Alert.tsx

@@ -58,7 +58,7 @@ export const Alert: React.FC<AlertProps> = ({
                 "rounded-md flex items-center gap-2",
                 classes,
                 className)}>
-            <span className={"flex-grow"}>{children}</span>
+            <div className={"flex-grow"}>{children}</div>
             {onDismiss && (
                 <button className="text-slate-400 hover:text-slate-600 dark:text-slate-500 dark:hover:text-slate-400"
                         onClick={onDismiss}>

package/src/components/Button.tsx

@@ -37,7 +37,7 @@ export function Button<P extends React.ElementType>({
             "border-transparent bg-primary hover:bg-primary-dark focus:ring-primary !text-white shadow hover:ring-1 hover:ring-primary": variant === "filled" && !disabled,
             "border-transparent !text-primary !hover:text-primary-dark hover:bg-primary hover:bg-primary-bg": variant === "text" && !disabled,
             "border-primary !text-primary hover:bg-primary-bg hover:border-primary-dark !hover:text-primary-dark focus:ring-primary hover:ring-1 hover:ring-primary": variant === "outlined" && !disabled,
-            "border-primary-dark border-opacity-50 dark:border-blue-500 dark:border-opacity-50 opacity-50 !text-primary-dark !dark:text-blue-500 text-opacity-50 dark:text-opacity-50": variant === "outlined" && disabled,
+            "border-primary-dark border-opacity-50 dark:border-primary dark:border-opacity-50 opacity-50 !text-primary-dark !dark:text-primary text-opacity-50 dark:text-opacity-50": variant === "outlined" && disabled,
             "border-transparent outline-none opacity-50 !text-slate-600 !dark:text-slate-500": (variant === "filled" || variant === "text") && disabled
         }
     );

package/src/components/Spinner.tsx

@@ -1,4 +1,5 @@
 import React from "react";
+
 export function Spinner() {
     return (
         <div role="status">

package/src/components/TextField.tsx

@@ -159,7 +159,7 @@ export function TextField<T extends string | number>({
 
             {input}
 
-            {endAdornment && <div className="flex absolute right-0 top-3 mr-3 ">{endAdornment}</div>}
+            {endAdornment && <div className="flex flex-row justify-center items-center absolute h-full right-0 top-0 mr-4 ">{endAdornment}</div>}
 
         </div>
     );

package/src/components/Tooltip.tsx

@@ -9,15 +9,17 @@ export type TooltipProps = {
     side?: "top" | "bottom" | "left" | "right",
     sideOffset?: number,
     title?: string,
+    delayDuration?: number;
     className?: string,
     tooltipClassName?: string,
     children: React.ReactNode,
-    style?: React.CSSProperties
+    style?: React.CSSProperties;
 };
 
 export const Tooltip = ({
                             open,
                             side = "bottom",
+                            delayDuration = 250,
                             sideOffset,
                             onOpenChange,
                             title,
@@ -33,7 +35,7 @@ export const Tooltip = ({
         return <>{children}</>;
 
     return (
-        <TooltipPrimitive.Provider delayDuration={250}>
+        <TooltipPrimitive.Provider delayDuration={delayDuration}>
             <TooltipPrimitive.Root open={open} onOpenChange={onOpenChange}>
                 <TooltipPrimitive.Trigger asChild>
                     <div className={className} style={style}>

package/src/icons/GitHubIcon.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 
 import { IconProps } from "./Icon";
+
 export function GitHubIcon(props: IconProps) {
     return <svg xmlns="http://www.w3.org/2000/svg"
                 className={props.className}

package/src/scripts/generateIconKeys.ts

@@ -1,4 +1,3 @@
-
 import fs from "fs";
 import path from "path";
 import { fileURLToPath } from "url";

package/src/scripts/saveIconFiles.ts

@@ -8,6 +8,7 @@ import path from "path";
 
 import { fileURLToPath } from "url";
 import { keyToIconComponent } from "../util/key_to_icon_component.ts";
+
 // import { iconKeys } from "../icons/icon_keys.ts";
 
 

package/src/styles.ts

@@ -8,5 +8,5 @@ export const fieldBackgroundHoverMixin = "hover:bg-opacity-70 dark:hover:bg-opac
 export const defaultBorderMixin = "border-gray-100 dark:border-gray-800 dark:border-opacity-80";
 export const paperMixin = "bg-white rounded-md dark:bg-gray-950 border dark:border-gray-800 dark:border-opacity-90 border-gray-100";
 export const cardMixin = "bg-white rounded-md dark:bg-gray-950 dark:border-gray-800 dark:border-opacity-50 transition duration-200 ease-in-out m-1 -p-1 border border-transparent";
-export const cardClickableMixin = "hover:bg-blue-100 dark:hover:bg-blue-900 hover:bg-opacity-20 dark:hover:bg-opacity-20 hover:ring-2 cursor-pointer";
-export const cardSelectedMixin = "bg-blue-100 dark:bg-blue-900 bg-opacity-30 dark:bg-opacity-10 ring-1 ring-primary ring-opacity-75";
+export const cardClickableMixin = "hover:bg-primary-bg dark:hover:bg-primary-bg hover:bg-opacity-20 dark:hover:bg-opacity-20 hover:ring-2 hover:ring-primary cursor-pointer";
+export const cardSelectedMixin = "bg-primary-bg dark:bg-primary-bg bg-opacity-30 dark:bg-opacity-10 ring-1 ring-primary ring-opacity-75";