@firecms/ui 3.0.0-canary.15 → 3.0.0-canary.150

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 (110) hide show
  1. package/README.md +3 -3
  2. package/dist/components/Avatar.d.ts +1 -0
  3. package/dist/components/BooleanSwitch.d.ts +1 -1
  4. package/dist/components/BooleanSwitchWithLabel.d.ts +4 -1
  5. package/dist/components/Button.d.ts +1 -1
  6. package/dist/components/CenteredView.d.ts +4 -2
  7. package/dist/components/Checkbox.d.ts +3 -2
  8. package/dist/components/Chip.d.ts +3 -2
  9. package/dist/components/DateTimeField.d.ts +5 -7
  10. package/dist/components/Dialog.d.ts +4 -1
  11. package/dist/components/DialogTitle.d.ts +9 -0
  12. package/dist/components/ExpandablePanel.d.ts +2 -1
  13. package/dist/components/FileUpload.d.ts +1 -1
  14. package/dist/components/InputLabel.d.ts +2 -2
  15. package/dist/components/Label.d.ts +4 -1
  16. package/dist/components/Markdown.d.ts +1 -0
  17. package/dist/components/Menu.d.ts +6 -2
  18. package/dist/components/Menubar.d.ts +79 -0
  19. package/dist/components/MultiSelect.d.ts +32 -16
  20. package/dist/components/Popover.d.ts +2 -1
  21. package/dist/components/RadioGroup.d.ts +26 -3
  22. package/dist/components/Select.d.ts +6 -10
  23. package/dist/components/Separator.d.ts +2 -1
  24. package/dist/components/Sheet.d.ts +6 -0
  25. package/dist/components/Slider.d.ts +21 -0
  26. package/dist/components/Table.d.ts +10 -10
  27. package/dist/components/Tabs.d.ts +4 -2
  28. package/dist/components/TextField.d.ts +1 -1
  29. package/dist/components/TextareaAutosize.d.ts +3 -34
  30. package/dist/components/Tooltip.d.ts +6 -2
  31. package/dist/components/Typography.d.ts +5 -4
  32. package/dist/components/index.d.ts +3 -1
  33. package/dist/hooks/index.d.ts +3 -0
  34. package/dist/icons/Icon.d.ts +3 -3
  35. package/dist/index.css +73 -0
  36. package/dist/index.d.ts +1 -0
  37. package/dist/index.es.js +13410 -14466
  38. package/dist/index.es.js.map +1 -1
  39. package/dist/index.umd.js +19802 -857
  40. package/dist/index.umd.js.map +1 -1
  41. package/dist/styles.d.ts +9 -9
  42. package/dist/util/{cn.d.ts → cls.d.ts} +4 -0
  43. package/dist/util/index.d.ts +1 -3
  44. package/package.json +112 -118
  45. package/src/components/Alert.tsx +4 -4
  46. package/src/components/Autocomplete.tsx +7 -5
  47. package/src/components/Avatar.tsx +40 -26
  48. package/src/components/Badge.tsx +2 -2
  49. package/src/components/BooleanSwitch.tsx +19 -19
  50. package/src/components/BooleanSwitchWithLabel.tsx +20 -11
  51. package/src/components/Button.tsx +30 -23
  52. package/src/components/Card.tsx +4 -3
  53. package/src/components/CenteredView.tsx +25 -15
  54. package/src/components/Checkbox.tsx +16 -14
  55. package/src/components/Chip.tsx +10 -7
  56. package/src/components/CircularProgress.tsx +3 -3
  57. package/src/components/Collapse.tsx +4 -2
  58. package/src/components/Container.tsx +2 -2
  59. package/src/components/DateTimeField.tsx +142 -921
  60. package/src/components/DebouncedTextField.tsx +1 -0
  61. package/src/components/Dialog.tsx +17 -7
  62. package/src/components/DialogActions.tsx +3 -3
  63. package/src/components/DialogContent.tsx +2 -2
  64. package/src/components/DialogTitle.tsx +35 -0
  65. package/src/components/ExpandablePanel.tsx +20 -12
  66. package/src/components/FileUpload.tsx +8 -10
  67. package/src/components/IconButton.tsx +6 -10
  68. package/src/components/InfoLabel.tsx +2 -2
  69. package/src/components/InputLabel.tsx +11 -9
  70. package/src/components/Label.tsx +17 -4
  71. package/src/components/Markdown.tsx +15 -3
  72. package/src/components/Menu.tsx +49 -31
  73. package/src/components/Menubar.tsx +322 -0
  74. package/src/components/MultiSelect.tsx +342 -168
  75. package/src/components/Paper.tsx +2 -2
  76. package/src/components/Popover.tsx +19 -15
  77. package/src/components/RadioGroup.tsx +41 -9
  78. package/src/components/SearchBar.tsx +12 -11
  79. package/src/components/Select.tsx +99 -126
  80. package/src/components/Separator.tsx +10 -4
  81. package/src/components/Sheet.tsx +53 -31
  82. package/src/components/Skeleton.tsx +9 -6
  83. package/src/components/Slider.tsx +109 -0
  84. package/src/components/Table.tsx +52 -35
  85. package/src/components/Tabs.tsx +19 -15
  86. package/src/components/TextField.tsx +16 -18
  87. package/src/components/TextareaAutosize.tsx +4 -3
  88. package/src/components/Tooltip.tsx +33 -16
  89. package/src/components/Typography.tsx +42 -26
  90. package/src/components/common/SelectInputLabel.tsx +3 -3
  91. package/src/components/index.tsx +3 -1
  92. package/src/hooks/index.ts +3 -0
  93. package/src/icons/Icon.tsx +46 -43
  94. package/src/icons/icon_keys.ts +114 -1301
  95. package/src/index.css +73 -0
  96. package/src/index.ts +1 -0
  97. package/src/scripts/generateIconKeys.ts +20 -11
  98. package/src/styles.ts +9 -9
  99. package/src/util/cls.ts +14 -0
  100. package/src/util/index.ts +1 -3
  101. package/tailwind.config.js +42 -26
  102. package/dist/components/Spinner.d.ts +0 -1
  103. package/src/components/Spinner.tsx +0 -18
  104. package/src/util/cn.ts +0 -6
  105. /package/dist/{util → hooks}/useDebounceValue.d.ts +0 -0
  106. /package/dist/{util → hooks}/useInjectStyles.d.ts +0 -0
  107. /package/dist/{util → hooks}/useOutsideAlerter.d.ts +0 -0
  108. /package/src/{util → hooks}/useDebounceValue.tsx +0 -0
  109. /package/src/{util → hooks}/useInjectStyles.tsx +0 -0
  110. /package/src/{util → hooks}/useOutsideAlerter.tsx +0 -0
@@ -1,15 +1,19 @@
1
1
  import React from "react";
2
2
  export type TooltipProps = {
3
3
  open?: boolean;
4
+ defaultOpen?: boolean;
4
5
  onOpenChange?: (open: boolean) => void;
5
6
  side?: "top" | "bottom" | "left" | "right";
6
7
  align?: "start" | "center" | "end";
7
8
  sideOffset?: number;
8
9
  title?: string | React.ReactNode;
9
10
  delayDuration?: number;
10
- className?: string;
11
+ asChild?: boolean;
11
12
  tooltipClassName?: string;
13
+ tooltipStyle?: React.CSSProperties;
12
14
  children: React.ReactNode;
15
+ className?: string;
16
+ container?: HTMLElement;
13
17
  style?: React.CSSProperties;
14
18
  };
15
- export declare const Tooltip: ({ open, side, delayDuration, sideOffset, align, onOpenChange, title, className, style, tooltipClassName, children }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
19
+ export declare const Tooltip: ({ open, defaultOpen, side, delayDuration, sideOffset, align, onOpenChange, title, tooltipClassName, tooltipStyle, children, asChild, container, className, style }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,5 +1,6 @@
1
1
  import React, { ReactEventHandler } from "react";
2
- export type TextProps<C extends React.ElementType> = {
2
+ export type TypographyVariant = keyof typeof typographyVariants;
3
+ export type TypographyProps<C extends React.ElementType = "span"> = {
3
4
  align?: "center" | "inherit" | "justify" | "left" | "right";
4
5
  children?: React.ReactNode;
5
6
  className?: string;
@@ -7,7 +8,7 @@ export type TextProps<C extends React.ElementType> = {
7
8
  gutterBottom?: boolean;
8
9
  noWrap?: boolean;
9
10
  paragraph?: boolean;
10
- variant?: keyof typeof defaultVariantMapping;
11
+ variant?: TypographyVariant;
11
12
  variantMapping?: {
12
13
  [key: string]: string;
13
14
  };
@@ -15,7 +16,7 @@ export type TextProps<C extends React.ElementType> = {
15
16
  onClick?: ReactEventHandler<HTMLElement>;
16
17
  style?: React.CSSProperties;
17
18
  } & React.ComponentPropsWithoutRef<C>;
18
- declare const defaultVariantMapping: {
19
+ declare const typographyVariants: {
19
20
  h1: string;
20
21
  h2: string;
21
22
  h3: string;
@@ -31,5 +32,5 @@ declare const defaultVariantMapping: {
31
32
  caption: string;
32
33
  button: string;
33
34
  };
34
- export declare function Typography<C extends React.ElementType>({ align, color, children, className, component, gutterBottom, noWrap, paragraph, variant, variantMapping, style, onClick, ...other }: TextProps<C>): import("react/jsx-runtime").JSX.Element;
35
+ export declare function Typography<C extends React.ElementType = "span">({ align, color, children, className, component, gutterBottom, noWrap, paragraph, variant, variantMapping, style, onClick, ...other }: TypographyProps<C>): import("react/jsx-runtime").JSX.Element;
35
36
  export {};
@@ -15,6 +15,7 @@ export * from "./DateTimeField";
15
15
  export * from "./Dialog";
16
16
  export * from "./DialogActions";
17
17
  export * from "./DialogContent";
18
+ export * from "./DialogTitle";
18
19
  export * from "./ExpandablePanel";
19
20
  export * from "./FileUpload";
20
21
  export * from "./IconButton";
@@ -24,14 +25,15 @@ export * from "./Label";
24
25
  export * from "./LoadingButton";
25
26
  export * from "./Markdown";
26
27
  export * from "./Menu";
28
+ export * from "./Menubar";
27
29
  export * from "./MultiSelect";
28
30
  export * from "./Paper";
29
31
  export * from "./RadioGroup";
30
32
  export * from "./SearchBar";
31
33
  export * from "./Select";
32
34
  export * from "./Separator";
35
+ export * from "./Slider";
33
36
  export * from "./Sheet";
34
- export * from "./Spinner";
35
37
  export * from "./TextareaAutosize";
36
38
  export * from "./TextField";
37
39
  export * from "./Tooltip";
@@ -0,0 +1,3 @@
1
+ export * from "./useInjectStyles";
2
+ export * from "./useOutsideAlerter";
3
+ export * from "./useDebounceValue";
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- import "@material-design-icons/font/filled.css";
2
+ import 'material-icons/iconfont/filled.css';
3
3
  export type IconColor = "inherit" | "primary" | "secondary" | "disabled" | "error" | "success" | "warning";
4
4
  export type IconProps = {
5
5
  size?: "smallest" | "small" | "medium" | "large" | number;
@@ -8,6 +8,6 @@ export type IconProps = {
8
8
  onClick?: (e: React.SyntheticEvent) => void;
9
9
  style?: React.CSSProperties;
10
10
  };
11
- export declare function Icon({ iconKey, size, color, className, onClick, style }: IconProps & {
11
+ export declare const Icon: React.ForwardRefExoticComponent<IconProps & {
12
12
  iconKey: string;
13
- }): import("react/jsx-runtime").JSX.Element;
13
+ } & React.RefAttributes<HTMLSpanElement>>;
package/dist/index.css ADDED
@@ -0,0 +1,73 @@
1
+ /* Chrome, Safari and Opera */
2
+ .no-scrollbar::-webkit-scrollbar {
3
+ display: none;
4
+ }
5
+
6
+ .no-scrollbar {
7
+ -ms-overflow-style: none; /* IE and Edge */
8
+ scrollbar-width: none; /* Firefox */
9
+ }
10
+
11
+ .typography-h1 {
12
+ @apply text-6xl font-headers font-light;
13
+ }
14
+
15
+ .typography-h2 {
16
+ @apply text-5xl font-headers font-light;
17
+ }
18
+
19
+ .typography-h3 {
20
+ @apply text-4xl font-headers font-normal;
21
+ }
22
+
23
+ .typography-h4 {
24
+ @apply text-3xl font-headers font-normal;
25
+ }
26
+
27
+ .typography-h5 {
28
+ @apply text-2xl font-headers font-normal;
29
+ }
30
+
31
+ .typography-h6 {
32
+ @apply text-xl font-headers font-medium;
33
+ }
34
+
35
+ .typography-subtitle1 {
36
+ @apply text-lg font-headers font-medium;
37
+ }
38
+
39
+ .typography-subtitle2 {
40
+ @apply text-base font-headers font-medium;
41
+ }
42
+
43
+ .typography-body1 {
44
+ }
45
+
46
+ .typography-body2 {
47
+ @apply text-sm;
48
+ }
49
+
50
+ .typography-caption {
51
+ @apply text-xs;
52
+ }
53
+
54
+ .typography-label {
55
+ @apply text-sm font-medium;
56
+ }
57
+
58
+ .typography-inherit {
59
+ @apply text-inherit;
60
+ }
61
+
62
+ .typography-button {
63
+ @apply text-sm font-semibold uppercase;
64
+ }
65
+
66
+
67
+ :focus-visible {
68
+ @apply outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-opacity-75 focus-visible:ring-offset-2 focus-visible:ring-offset-transparent
69
+ }
70
+
71
+ a {
72
+ @apply text-blue-600 dark:text-blue-400 dark:hover:text-blue-600 hover:text-blue-800
73
+ }
package/dist/index.d.ts CHANGED
@@ -2,3 +2,4 @@ export * from "./components";
2
2
  export * from "./styles";
3
3
  export * from "./util";
4
4
  export * from "./icons";
5
+ export * from "./hooks";