draft-components 2.3.2 → 2.4.0

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.
@@ -2639,6 +2639,7 @@
2639
2639
  .dc-form-field {
2640
2640
  color-scheme: light;
2641
2641
  display: block;
2642
+ min-width: 0;
2642
2643
  text-align: left;
2643
2644
  }
2644
2645
 
@@ -2647,7 +2648,6 @@
2647
2648
  }
2648
2649
 
2649
2650
  .dc-form-field__input {
2650
- min-width: 0;
2651
2651
  }
2652
2652
 
2653
2653
  .dc-form-field__error,
@@ -1,4 +1,4 @@
1
- import { ComponentPropsWithRef, ReactNode } from 'react';
1
+ import { ComponentPropsWithRef } from 'react';
2
2
  type AvatarHTMLProps = ComponentPropsWithRef<'div'>;
3
3
  export type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
4
4
  export type AvatarFill = 'gray' | 'pink' | 'red' | 'orange' | 'yellow' | 'green' | 'teal' | 'blue' | 'indigo' | 'violet';
@@ -8,7 +8,7 @@ export type AvatarProps = {
8
8
  fill?: AvatarFill;
9
9
  src?: string;
10
10
  altText?: string;
11
- initials?: ReactNode;
11
+ initials?: string;
12
12
  } & AvatarHTMLProps;
13
13
  export declare const Avatar: import("react").ForwardRefExoticComponent<Omit<AvatarProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
14
14
  export {};
@@ -25,7 +25,13 @@ export const Avatar = forwardRef(function Avatar({ square, size = 'md', fill = '
25
25
  });
26
26
  let children;
27
27
  if (type === 'image') {
28
- children = (_jsx("img", { className: "dc-avatar__image", src: src, alt: altText, width: sizePx, height: sizePx, onError: () => setType(initials ? 'initials' : 'silhouette') }));
28
+ children = (_jsx("img", { className: "dc-avatar__image", src: src, width: sizePx, height: sizePx, alt: "", loading: "lazy", onLoad: (event) => {
29
+ if (altText) {
30
+ event.currentTarget.setAttribute('alt', altText);
31
+ }
32
+ }, onError: () => {
33
+ setType(initials ? 'initials' : 'silhouette');
34
+ } }));
29
35
  }
30
36
  else if (type === 'initials') {
31
37
  children = (_jsx("span", { className: "dc-avatar__initials", "aria-label": altText, children: initials }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "draft-components",
3
- "version": "2.3.2",
3
+ "version": "2.4.0",
4
4
  "description": "The React based UI components library.",
5
5
  "type": "module",
6
6
  "exports": {
@@ -51,44 +51,45 @@
51
51
  "react-dom": ">= 18"
52
52
  },
53
53
  "devDependencies": {
54
- "@alexzimakov/eslint-config": "1.6.0",
54
+ "@alexzimakov/eslint-config": "1.7.0",
55
55
  "@heroicons/react": "2.0.18",
56
- "@storybook/addon-actions": "7.4.0",
57
- "@storybook/addon-essentials": "7.4.0",
58
- "@storybook/addon-links": "7.4.0",
59
- "@storybook/react": "7.4.0",
60
- "@storybook/react-vite": "7.4.0",
61
- "@testing-library/dom": "9.3.1",
62
- "@testing-library/jest-dom": "6.1.2",
56
+ "@storybook/addon-actions": "7.4.6",
57
+ "@storybook/addon-essentials": "7.4.6",
58
+ "@storybook/addon-links": "7.4.6",
59
+ "@storybook/addon-themes": "7.4.6",
60
+ "@storybook/react": "7.4.6",
61
+ "@storybook/react-vite": "7.4.6",
62
+ "@testing-library/dom": "9.3.3",
63
+ "@testing-library/jest-dom": "6.1.4",
63
64
  "@testing-library/react": "14.0.0",
64
- "@testing-library/user-event": "14.4.3",
65
- "@types/node": "18.17.12",
66
- "@types/react": "18.2.21",
67
- "@types/react-dom": "18.2.7",
68
- "@typescript-eslint/eslint-plugin": "6.5.0",
69
- "@typescript-eslint/parser": "6.5.0",
70
- "@vitest/coverage-istanbul": "0.34.3",
71
- "autoprefixer": "10.4.15",
72
- "eslint": "8.48.0",
65
+ "@testing-library/user-event": "14.5.1",
66
+ "@types/node": "18.18.5",
67
+ "@types/react": "18.2.28",
68
+ "@types/react-dom": "18.2.13",
69
+ "@typescript-eslint/eslint-plugin": "6.7.5",
70
+ "@typescript-eslint/parser": "6.7.5",
71
+ "@vitest/coverage-istanbul": "0.34.6",
72
+ "autoprefixer": "10.4.16",
73
+ "eslint": "8.51.0",
73
74
  "eslint-plugin-jsx-a11y": "6.7.1",
74
75
  "eslint-plugin-react": "7.33.2",
75
76
  "eslint-plugin-react-hooks": "4.6.0",
76
- "eslint-plugin-storybook": "0.6.13",
77
- "eslint-plugin-testing-library": "6.0.1",
77
+ "eslint-plugin-storybook": "0.6.15",
78
+ "eslint-plugin-testing-library": "6.1.0",
78
79
  "husky": "8.0.3",
79
80
  "jsdom": "22.1.0",
80
- "lint-staged": "14.0.1",
81
- "postcss": "8.4.29",
81
+ "lint-staged": "15.0.1",
82
+ "postcss": "8.4.31",
82
83
  "postcss-import": "15.1.0",
83
84
  "react": "18.2.0",
84
85
  "react-dom": "18.2.0",
85
- "storybook": "7.4.0",
86
+ "storybook": "7.4.6",
86
87
  "stylelint": "15.10.3",
87
88
  "stylelint-config-standard": "34.0.0",
88
89
  "stylelint-order": "6.0.3",
89
90
  "typescript": "5.2.2",
90
- "vite": "4.4.9",
91
- "vitest": "0.34.3"
91
+ "vite": "4.4.11",
92
+ "vitest": "0.34.6"
92
93
  },
93
94
  "lint-staged": {
94
95
  "*.ts?(x)": "npm run lint-js",