@wavv/ui 2.3.11 → 2.3.12

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 (14) hide show
  1. package/build/components/Accordion/Accordion.d.ts +2 -1
  2. package/build/components/Accordion/Header.d.ts +3 -1
  3. package/build/components/Accordion/Header.js +22 -6
  4. package/build/components/DropdownMenu.d.ts +1 -1
  5. package/build/components/ImageViewer.js +1 -1
  6. package/build/components/ListHelpers/GridListHeader.d.ts +1 -1
  7. package/build/components/ListHelpers/ListHeader.d.ts +1 -1
  8. package/build/components/Modal.d.ts +3 -3
  9. package/build/components/Modal.js +4 -4
  10. package/build/hooks/useWindowSize.js +1 -1
  11. package/build/theme/core/dark/dark.js +2 -2
  12. package/build/theme/mono/dark/dark.js +2 -2
  13. package/build/utils/copyToClipboard.js +2 -2
  14. package/package.json +14 -14
package/build/components/Accordion/Accordion.d.ts CHANGED
@@ -26,8 +26,9 @@ declare const Accordion: {
26
26
  displayName: string;
27
27
  };
28
28
  Header: {
29
- ({ children, triggerIconPosition, background, title, iconLeft, iconRight, ...props }: {
29
+ ({ children, triggerIconPosition, background, title, subtitle, iconLeft, iconRight, ...props }: {
30
30
  title: React.ReactNode;
31
+ subtitle?: React.ReactNode;
31
32
  children?: React.ReactNode;
32
33
  background?: string;
33
34
  triggerIconPosition?: "left" | "right";
package/build/components/Accordion/Header.d.ts CHANGED
@@ -5,6 +5,8 @@ type ElAttributes = Omit<Attributes<HTMLDivElement>, 'title'>;
5
5
  type HeaderProps = {
6
6
  /** The header title of the item */
7
7
  title: React.ReactNode;
8
+ /** The subtitle of the item */
9
+ subtitle?: React.ReactNode;
8
10
  /** The content of the item (displayed to the right of the title) */
9
11
  children?: React.ReactNode;
10
12
  /** The background color of the header */
@@ -19,7 +21,7 @@ type HeaderProps = {
19
21
  style?: React.CSSProperties;
20
22
  } & Padding & Height & ElAttributes;
21
23
  declare const Header: {
22
- ({ children, triggerIconPosition, background, title, iconLeft, iconRight, ...props }: HeaderProps): import("react/jsx-runtime").JSX.Element;
24
+ ({ children, triggerIconPosition, background, title, subtitle, iconLeft, iconRight, ...props }: HeaderProps): import("react/jsx-runtime").JSX.Element;
23
25
  displayName: string;
24
26
  };
25
27
  export default Header;
package/build/components/Accordion/Header.js CHANGED
@@ -1,14 +1,14 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import styled from "@emotion/styled";
3
3
  import { useRef } from "react";
4
- import { Heading } from "react-aria-components";
4
+ import { Heading, Text } from "react-aria-components";
5
5
  import Ellipsis from "../Ellipsis.js";
6
6
  import getIcon from "../helpers/getIcon.js";
7
7
  import isPropAllowed from "../helpers/isPropAllowed.js";
8
8
  import { paddingProps } from "../helpers/styledProps.js";
9
9
  import Icon from "../Icon/index.js";
10
10
  import AriaButton from "../Inputs/helpers/AriaButton.js";
11
- const Header = ({ children, triggerIconPosition = 'right', background, title, iconLeft, iconRight, ...props })=>{
11
+ const Header = ({ children, triggerIconPosition = 'right', background, title, subtitle, iconLeft, iconRight, ...props })=>{
12
12
  const triggerRef = useRef(null);
13
13
  return /*#__PURE__*/ jsxs(HeaderContainer, {
14
14
  onClick: ()=>triggerRef.current?.click(),
@@ -21,13 +21,20 @@ const Header = ({ children, triggerIconPosition = 'right', background, title, ic
21
21
  }),
22
22
  iconLeft && getIcon(iconLeft),
23
23
  /*#__PURE__*/ jsx(Title, {
24
- children: /*#__PURE__*/ jsx(AriaButton, {
24
+ children: /*#__PURE__*/ jsxs(TitleButton, {
25
25
  slot: "trigger",
26
26
  ref: triggerRef,
27
27
  width: "100%",
28
- children: /*#__PURE__*/ jsx(Ellipsis, {
29
- children: title
30
- })
28
+ children: [
29
+ /*#__PURE__*/ jsx(Ellipsis, {
30
+ children: title
31
+ }),
32
+ subtitle && /*#__PURE__*/ jsx(Subtitle, {
33
+ children: /*#__PURE__*/ jsx(Ellipsis, {
34
+ children: subtitle
35
+ })
36
+ })
37
+ ]
31
38
  })
32
39
  }),
33
40
  /*#__PURE__*/ jsx(Content, {
@@ -58,6 +65,11 @@ const HeaderContainer = styled.div(({ theme, background, height })=>({
58
65
  transition: 'transform 300ms'
59
66
  }
60
67
  }), paddingProps);
68
+ const TitleButton = styled(AriaButton)({
69
+ display: 'flex',
70
+ alignItems: 'flex-start',
71
+ gap: 8
72
+ });
61
73
  const Title = styled(Heading, {
62
74
  shouldForwardProp: (prop)=>isPropAllowed(prop, [
63
75
  'reverse',
@@ -76,6 +88,10 @@ const Title = styled(Heading, {
76
88
  textAlign: 'left',
77
89
  overflow: 'hidden'
78
90
  }));
91
+ const Subtitle = styled(Text)(({ theme })=>({
92
+ fontSize: theme.font.size.md,
93
+ color: theme.scale6
94
+ }));
79
95
  const Content = styled.div({
80
96
  display: 'flex',
81
97
  alignItems: 'center',
package/build/components/DropdownMenu.d.ts CHANGED
@@ -52,7 +52,7 @@ declare const DropdownMenu: {
52
52
  title?: string;
53
53
  children: ReactNode;
54
54
  }) => import("react/jsx-runtime").JSX.Element;
55
- Separator: import("@emotion/styled").StyledComponent<import("react-aria-components").SeparatorProps & import("react").RefAttributes<object> & {
55
+ Separator: import("@emotion/styled").StyledComponent<import("react-aria-components").SeparatorProps & import("react").RefAttributes<HTMLElement> & {
56
56
  theme?: import("@emotion/react").Theme;
57
57
  } & ThemeProp, {}, {}>;
58
58
  };
package/build/components/ImageViewer.js CHANGED
@@ -41,7 +41,7 @@ const ImageViewer = ({ visible, close, images, startIndex, alt, maxWidth, maxHei
41
41
  }
42
42
  };
43
43
  useEffect(()=>{
44
- const ssr = 'undefined' == typeof window;
44
+ const ssr = "u" < typeof window;
45
45
  const cleanup = ssr ? ()=>null : ()=>window.removeEventListener('keydown', handleKeyPress);
46
46
  if (visible && !ssr) window.addEventListener('keydown', handleKeyPress);
47
47
  return cleanup;
package/build/components/ListHelpers/GridListHeader.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { ThemeProp } from '../types';
2
- declare const ListHeader: import("@emotion/styled").StyledComponent<import("react").HTMLAttributes<HTMLElement> & import("react").RefAttributes<object> & {
2
+ declare const ListHeader: import("@emotion/styled").StyledComponent<import("react").HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLDivElement> & {
3
3
  theme?: import("@emotion/react").Theme;
4
4
  } & ThemeProp, {}, {}>;
5
5
  export default ListHeader;
package/build/components/ListHelpers/ListHeader.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { ThemeProp } from '../types';
2
- declare const ListHeader: import("@emotion/styled").StyledComponent<import("react").HTMLAttributes<HTMLElement> & import("react").RefAttributes<object> & {
2
+ declare const ListHeader: import("@emotion/styled").StyledComponent<import("react").HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement> & {
3
3
  theme?: import("@emotion/react").Theme;
4
4
  } & ThemeProp, {}, {}>;
5
5
  export default ListHeader;
package/build/components/Modal.d.ts CHANGED
@@ -24,9 +24,9 @@ type ModalProps = {
24
24
  /** Overrides the overflow of the modal container */
25
25
  overflow?: CSSProperties['overflow'];
26
26
  /** Removes the overlay background, and allows the modal to be positioned anywhere on the page */
27
- noOverlay?: boolean;
27
+ showOverlay?: boolean;
28
28
  /** Removes the background color of the modal container */
29
- noBackground?: boolean;
29
+ showBackground?: boolean;
30
30
  /** Prevents the modal from being interacted with */
31
31
  inert?: boolean;
32
32
  /** Renders the Modal as a full-height sliding drawer */
@@ -55,7 +55,7 @@ type ModalProps = {
55
55
  'aria-label'?: string;
56
56
  } & WidthHeight & MaxWidthHeight & MinWidthHeight & Padding & DivAttributes;
57
57
  declare const Modal: {
58
- ({ children, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur, overlayColor, backgroundColor, noOverlay, noBackground, inert, drawer, drawerDirection, scopeRef, centerX, centerY, position, top, bottom, right, left, zIndex, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element;
58
+ ({ children, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur, overlayColor, backgroundColor, showOverlay, showBackground, inert, drawer, drawerDirection, scopeRef, centerX, centerY, position, top, bottom, right, left, zIndex, ...props }: ModalProps): import("react/jsx-runtime").JSX.Element;
59
59
  Header: {
60
60
  ({ children, ...props }: HeaderProps): import("react/jsx-runtime").JSX.Element;
61
61
  displayName: string;
package/build/components/Modal.js CHANGED
@@ -5,7 +5,7 @@ import { Dialog, Heading, Modal, ModalOverlay } from "react-aria-components";
5
5
  import { marginProps, maxWidthHeightProps, minWidthHeightProps, paddingProps } from "./helpers/styledProps.js";
6
6
  import Icon from "./Icon/index.js";
7
7
  import PortalScope from "./PortalScope.js";
8
- const Modal_Modal = ({ children, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur = true, overlayColor, backgroundColor, noOverlay, noBackground, inert, drawer, drawerDirection = 'right', scopeRef, centerX, centerY, position, top, bottom, right, left, zIndex, ...props })=>{
8
+ const Modal_Modal = ({ children, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur = true, overlayColor, backgroundColor, showOverlay = true, showBackground = true, inert, drawer, drawerDirection = 'right', scopeRef, centerX, centerY, position, top, bottom, right, left, zIndex, ...props })=>{
9
9
  const { 'aria-label': ariaLabel, ...rest } = props;
10
10
  const handleOpenChange = (open)=>{
11
11
  if (!open) onClose();
@@ -15,7 +15,7 @@ const Modal_Modal = ({ children, visible, width, height, onClose, closeIcon, pre
15
15
  isOpen: visible,
16
16
  onOpenChange: handleOpenChange,
17
17
  color: overlayColor,
18
- noOverlay: noOverlay,
18
+ noOverlay: !showOverlay,
19
19
  centerX: centerX,
20
20
  centerY: centerY,
21
21
  position: scopeRef ? 'absolute' : position,
@@ -41,8 +41,8 @@ const Modal_Modal = ({ children, visible, width, height, onClose, closeIcon, pre
41
41
  width: width,
42
42
  height: height,
43
43
  backgroundColor: backgroundColor,
44
- noBackground: noBackground,
45
- noOverlay: noOverlay,
44
+ noBackground: !showBackground,
45
+ noOverlay: !showOverlay,
46
46
  drawer: drawer,
47
47
  drawerDirection: drawerDirection,
48
48
  centerX: centerX,
package/build/hooks/useWindowSize.js CHANGED
@@ -6,7 +6,7 @@ const useWindowSize = ()=>{
6
6
  };
7
7
  const [windowSize, setWindowSize] = useState(initialState);
8
8
  useEffect(()=>{
9
- const ssr = 'undefined' == typeof window;
9
+ const ssr = "u" < typeof window;
10
10
  const handleResize = ()=>{
11
11
  if (ssr) return;
12
12
  setWindowSize({
package/build/theme/core/dark/dark.js CHANGED
@@ -198,9 +198,9 @@ const dark = {
198
198
  },
199
199
  link: {
200
200
  color: {
201
- default: darkScale.accentShade2,
201
+ default: darkScale.accent,
202
202
  hover: darkScale.accentShade1,
203
- active: darkScale.accent
203
+ active: darkScale.accentShade2
204
204
  },
205
205
  outlineColor: {
206
206
  default: colors.brandShade2,
package/build/theme/mono/dark/dark.js CHANGED
@@ -198,9 +198,9 @@ const dark = {
198
198
  },
199
199
  link: {
200
200
  color: {
201
- default: darkScale.accentShade2,
201
+ default: darkScale.accent,
202
202
  hover: darkScale.accentShade1,
203
- active: darkScale.accent
203
+ active: darkScale.accentShade2
204
204
  },
205
205
  outlineColor: {
206
206
  default: colors.brandShade2,
package/build/utils/copyToClipboard.js CHANGED
@@ -18,8 +18,8 @@ const legacyCopy = (text)=>{
18
18
  }
19
19
  };
20
20
  const copyToClipboard = (text)=>{
21
- if ('undefined' == typeof window || 'undefined' == typeof document) return;
22
- const canUseModernApi = 'undefined' != typeof navigator && navigator.clipboard && 'function' == typeof navigator.clipboard.writeText;
21
+ if ("u" < typeof window || "u" < typeof document) return;
22
+ const canUseModernApi = "u" > typeof navigator && navigator.clipboard && 'function' == typeof navigator.clipboard.writeText;
23
23
  if (canUseModernApi) return void navigator.clipboard.writeText(text).catch(()=>{
24
24
  legacyCopy(text);
25
25
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wavv/ui",
3
- "version": "2.3.11",
3
+ "version": "2.3.12",
4
4
  "type": "module",
5
5
  "exports": {
6
6
  ".": {
@@ -29,7 +29,7 @@
29
29
  "license": "MIT",
30
30
  "dependencies": {
31
31
  "@emotion/styled": "^11.14.1",
32
- "@internationalized/date": "3.10.0",
32
+ "@internationalized/date": "3.10.1",
33
33
  "@react-hook/resize-observer": "^2.0.2",
34
34
  "@tiptap/core": "^3.13.0",
35
35
  "@tiptap/extension-character-count": "^3.13.0",
@@ -46,11 +46,11 @@
46
46
  "draft-js": "^0.11.7",
47
47
  "es-toolkit": "^1.43.0",
48
48
  "libphonenumber-js": "^1.12.31",
49
- "lucide-react": "^0.561.0",
49
+ "lucide-react": "^0.562.0",
50
50
  "polished": "^4.1.4",
51
51
  "prism-react-renderer": "^2.4.1",
52
- "react-aria": "3.44.0",
53
- "react-aria-components": "1.13.0",
52
+ "react-aria": "3.45.0",
53
+ "react-aria-components": "1.14.0",
54
54
  "react-keyed-flatten-children": "^5.1.1",
55
55
  "react-phone-input-auto-format": "^0.1.0",
56
56
  "recharts": "^3.6.0",
@@ -61,17 +61,17 @@
61
61
  "@babel/core": "^7.28.5",
62
62
  "@babel/preset-env": "^7.28.5",
63
63
  "@babel/preset-typescript": "^7.28.5",
64
- "@biomejs/biome": "2.3.9",
64
+ "@biomejs/biome": "2.3.10",
65
65
  "@chromatic-com/storybook": "^4.1.3",
66
66
  "@emotion/babel-plugin": "^11.13.5",
67
67
  "@emotion/react": "^11.14.0",
68
- "@rsbuild/core": "1.6.14",
68
+ "@rsbuild/core": "1.6.15",
69
69
  "@rsbuild/plugin-react": "^1.4.2",
70
70
  "@rsbuild/plugin-svgr": "^1.2.3",
71
- "@rslib/core": "^0.18.4",
72
- "@storybook/addon-docs": "^10.1.9",
73
- "@storybook/addon-links": "^10.1.9",
74
- "@storybook/addon-themes": "^10.1.9",
71
+ "@rslib/core": "^0.18.5",
72
+ "@storybook/addon-docs": "^10.1.10",
73
+ "@storybook/addon-links": "^10.1.10",
74
+ "@storybook/addon-themes": "^10.1.10",
75
75
  "@storybook/test-runner": "^0.24.2",
76
76
  "@svgr/core": "^8.1.0",
77
77
  "@svgr/plugin-jsx": "^8.1.0",
@@ -80,7 +80,7 @@
80
80
  "@types/draft-js": "^0.11.20",
81
81
  "@types/jest": "^30.0.0",
82
82
  "@types/ncp": "^2.0.8",
83
- "@types/node": "^25.0.2",
83
+ "@types/node": "^25.0.3",
84
84
  "@types/prompts": "^2.4.9",
85
85
  "@types/randomcolor": "^0.5.9",
86
86
  "@types/react": "^19.2.7",
@@ -104,8 +104,8 @@
104
104
  "react-dom": "^19.2.3",
105
105
  "replace": "^1.2.2",
106
106
  "signale": "^1.4.0",
107
- "storybook": "^10.1.9",
108
- "storybook-react-rsbuild": "^3.1.0",
107
+ "storybook": "^10.1.10",
108
+ "storybook-react-rsbuild": "^3.2.0",
109
109
  "tsc-files": "^1.1.4",
110
110
  "tslib": "^2.8.1",
111
111
  "tsx": "^4.21.0",