@firecms/ui 3.0.0-canary.152 → 3.0.0-canary.154

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/icons/Icon.d.ts +1 -1
  2. package/dist/index.es.js +6 -6
  3. package/dist/index.es.js.map +1 -1
  4. package/dist/index.umd.js +6 -6
  5. package/dist/index.umd.js.map +1 -1
  6. package/package.json +7 -3
  7. package/src/components/DateTimeField.tsx +1 -1
  8. package/src/components/IconButton.tsx +0 -1
  9. package/src/components/Select.tsx +52 -51
  10. package/src/icons/Icon.tsx +3 -1
package/package.json CHANGED
@@ -1,14 +1,18 @@
1
1
  {
2
2
  "name": "@firecms/ui",
3
3
  "type": "module",
4
- "version": "3.0.0-canary.152",
4
+ "version": "3.0.0-canary.154",
5
5
  "description": "Awesome Firebase/Firestore-based headless open-source CMS",
6
6
  "funding": {
7
7
  "url": "https://github.com/sponsors/firecmsco"
8
8
  },
9
9
  "author": "FireCMS",
10
10
  "license": "MIT",
11
- "repository": "git@github.com:FireCMSco/firecms.git",
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "git+https://github.com/firecmsco/firecms.git",
14
+ "directory": "packages/ui"
15
+ },
12
16
  "main": "./dist/index.umd.js",
13
17
  "module": "./dist/index.es.js",
14
18
  "types": "./dist/index.d.ts",
@@ -108,7 +112,7 @@
108
112
  "index.css",
109
113
  "tailwind.config.js"
110
114
  ],
111
- "gitHead": "be8e639101ee20faccf85a5b0225a7ead151d2d9",
115
+ "gitHead": "52858cb15cdbbbb9c1b6ed8368e133304321cf49",
112
116
  "publishConfig": {
113
117
  "access": "public"
114
118
  }
package/src/components/DateTimeField.tsx CHANGED
@@ -180,7 +180,7 @@ export const DateTimeField: React.FC<DateTimeFieldProps> = ({
180
180
  <div className="flex items-center m-2">
181
181
  <ErrorIcon size={"medium"} color={"error"}/>
182
182
  <div className="pl-2">
183
- <Typography variant={"body2"} className="font-large">
183
+ <Typography variant={"body2"}>
184
184
  Invalid date value for this field
185
185
  </Typography>
186
186
  <Typography variant={"body2"}>
package/src/components/IconButton.tsx CHANGED
@@ -61,6 +61,5 @@ const IconButtonInner = <C extends React.ElementType = "button">({
61
61
  </Component>
62
62
  );
63
63
  };
64
- // React.ForwardRefRenderFunction<HTMLButtonElement, IconButtonProps<C>>
65
64
 
66
65
  export const IconButton = React.forwardRef(IconButtonInner as React.ForwardRefRenderFunction<HTMLButtonElement, IconButtonProps<any>>) as React.ComponentType<IconButtonProps<any>>;
package/src/components/Select.tsx CHANGED
@@ -111,7 +111,9 @@ export const Select = forwardRef<HTMLDivElement, SelectProps>(({
111
111
  <SelectPrimitive.Trigger
112
112
  ref={inputRef}
113
113
  id={id}
114
- className={cls(
114
+ asChild
115
+ >
116
+ <div className={cls(
115
117
  "w-full h-full",
116
118
  padding ? {
117
119
  "px-4": size === "large",
@@ -131,61 +133,60 @@ export const Select = forwardRef<HTMLDivElement, SelectProps>(({
131
133
  },
132
134
  inputClassName
133
135
  )}>
136
+ <div
137
+ ref={ref}
138
+ className={cls(
139
+ "flex-grow w-full max-w-full flex flex-row gap-2 items-center",
140
+ "overflow-visible",
141
+ {
142
+ "min-h-[28px]": size === "small",
143
+ "min-h-[42px]": size === "medium",
144
+ "min-h-[64px]": size === "large"
145
+ }
146
+ )}>
147
+ <SelectPrimitive.Value
148
+ onClick={(e) => {
149
+ e.preventDefault();
150
+ e.stopPropagation();
151
+ }}
152
+ placeholder={placeholder}
153
+ className={"w-full"}>
154
+ {hasValue && value && renderValue ? renderValue(value) : placeholder}
155
+ {/*{hasValue && !renderValue && value}*/}
156
+ {hasValue && !renderValue && (() => {
134
157
 
135
- <div
136
- ref={ref}
137
- className={cls(
138
- "flex-grow w-full max-w-full flex flex-row gap-2 items-center",
139
- "overflow-visible",
140
- {
141
- "min-h-[28px]": size === "small",
142
- "min-h-[42px]": size === "medium",
143
- "min-h-[64px]": size === "large"
144
- }
145
- )}
146
- >
147
- <SelectPrimitive.Value
148
- onClick={(e) => {
149
- e.preventDefault();
150
- e.stopPropagation();
151
- }}
152
- placeholder={placeholder}
153
- className={"w-full"}>
154
- {hasValue && value && renderValue ? renderValue(value) : placeholder}
155
- {/*{hasValue && !renderValue && value}*/}
156
- {hasValue && !renderValue && (() => {
158
+ // @ts-ignore
159
+ const childrenProps: SelectItemProps[] = Children.map(children, (child) => {
160
+ if (React.isValidElement(child)) {
161
+ return child.props;
162
+ }
163
+ }).filter(Boolean);
157
164
 
158
- // @ts-ignore
159
- const childrenProps: SelectItemProps[] = Children.map(children, (child) => {
160
- if (React.isValidElement(child)) {
161
- return child.props;
162
- }
163
- }).filter(Boolean);
165
+ const option = childrenProps.find((o) => o.value === value);
166
+ return option?.children;
167
+ })()}
164
168
 
165
- const option = childrenProps.find((o) => o.value === value);
166
- return option?.children;
167
- })()}
169
+ </SelectPrimitive.Value>
170
+ </div>
168
171
 
169
- </SelectPrimitive.Value>
172
+ {endAdornment && (
173
+ <div
174
+ className={cls("h-full flex items-center")}
175
+ onClick={(e) => {
176
+ e.preventDefault();
177
+ e.stopPropagation();
178
+ }}>
179
+ {endAdornment}
180
+ </div>
181
+ )}
182
+ <SelectPrimitive.Icon asChild>
183
+ <ExpandMoreIcon size={"medium"}
184
+ className={cls("transition", open ? "rotate-180" : "", {
185
+ "px-2": size === "large",
186
+ "px-1": size === "medium" || size === "small",
187
+ })}/>
188
+ </SelectPrimitive.Icon>
170
189
  </div>
171
-
172
- {endAdornment && (
173
- <div
174
- className={cls("h-full flex items-center")}
175
- onClick={(e) => {
176
- e.preventDefault();
177
- e.stopPropagation();
178
- }}>
179
- {endAdornment}
180
- </div>
181
- )}
182
- <SelectPrimitive.Icon asChild>
183
- <ExpandMoreIcon size={"medium"}
184
- className={cls("transition", open ? "rotate-180" : "", {
185
- "px-2": size === "large",
186
- "px-1": size === "medium" || size === "small",
187
- })}/>
188
- </SelectPrimitive.Icon>
189
190
  </SelectPrimitive.Trigger>
190
191
 
191
192
  </div>
package/src/icons/Icon.tsx CHANGED
@@ -1,6 +1,8 @@
1
+ "use client";
2
+
1
3
  import * as React from "react";
2
4
  import { cls } from "../util";
3
- import 'material-icons/iconfont/filled.css';
5
+ import "material-icons/iconfont/filled.css";
4
6
 
5
7
  export type IconColor = "inherit" | "primary" | "secondary" | "disabled" | "error" | "success" | "warning";
6
8
  export type IconProps = {