@linagora/twake-mui 4.1.1 → 4.3.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.
Files changed (13) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/components/Chip/index.d.ts +8 -0
  3. package/dist/components/Chip/index.js +11 -0
  4. package/dist/index.d.ts +2 -0
  5. package/dist/index.js +1 -0
  6. package/dist/lib/makeLightOverrides.js +9 -0
  7. package/dist/lib/makePalette.d.ts +5 -2
  8. package/dist/lib/makePalette.js +112 -30
  9. package/dist/lib/palette.json +64 -70
  10. package/dist/lib/types.d.ts +0 -1
  11. package/dist/stories/Chip.stories.d.ts +7 -0
  12. package/dist/stories/Chip.stories.js +100 -0
  13. package/package.json +5 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
1
+ # @linagora/twake-mui [4.3.0](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@4.2.0...@linagora/twake-mui@4.3.0) (2026-08-27)
2
+
3
+
4
+ ### Features
5
+
6
+ * Override chip component ([70b6e72](https://github.com/linagora/twake-ui/commit/70b6e720bff2e672940ef01963877671de531121))
7
+
8
+ # @linagora/twake-mui [4.2.0](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@4.1.1...@linagora/twake-mui@4.2.0) (2026-08-27)
9
+
10
+
11
+ ### Features
12
+
13
+ * Update palette to match cozy-ui palette ([1102658](https://github.com/linagora/twake-ui/commit/11026581150e966982672a724aaa2c7c099cc896))
14
+
1
15
  ## @linagora/twake-mui [4.1.1](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@4.1.0...@linagora/twake-mui@4.1.1) (2026-08-27)
2
16
 
3
17
 
package/dist/components/Chip/index.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import { ChipProps as MuiChipProps } from '@mui/material';
2
+ import React from 'react';
3
+ export interface ChipProps extends MuiChipProps {
4
+ endIcon?: React.ReactNode;
5
+ square?: boolean;
6
+ }
7
+ export declare const Chip: React.FC<ChipProps>;
8
+ export default Chip;
package/dist/components/Chip/index.js ADDED
@@ -0,0 +1,11 @@
1
+ import { Icon, CrossSmall } from '@linagora/twake-icons';
2
+ import { Box, Chip as MuiChip, IconButton } from '@mui/material';
3
+ import cx from 'classnames';
4
+ import React from 'react';
5
+ export const Chip = ({ className, deleteIcon = (React.createElement(IconButton, null,
6
+ React.createElement(Icon, { icon: CrossSmall }))), label, endIcon, square = false, ...props }) => {
7
+ return (React.createElement(MuiChip, { className: cx(className, { square }), deleteIcon: deleteIcon, label: endIcon ? (React.createElement(Box, { component: "span", sx: { display: 'flex', alignItems: 'center', gap: 1 } },
8
+ label,
9
+ React.createElement("span", null, endIcon))) : (label), ...props }));
10
+ };
11
+ export default Chip;
package/dist/index.d.ts CHANGED
@@ -7,7 +7,9 @@ export { theme } from './lib/theme';
7
7
  export { radius } from './lib/radius';
8
8
  export { TwakeMuiThemeProvider } from './components/ThemeProvider';
9
9
  export { Avatar, default as AvatarDefault } from './components/Avatar';
10
+ export { default as Chip } from './components/Chip';
10
11
  export { nameToColor, supportedColors } from './components/Avatar/helpers';
11
12
  export { default as AccordionExpandIcon } from './components/AccordionExpandIcon';
12
13
  export type { TwakeTheme } from './lib/theme';
13
14
  export type { AvatarProps } from './components/Avatar';
15
+ export type { ChipProps } from './components/Chip';
package/dist/index.js CHANGED
@@ -10,5 +10,6 @@ export { radius } from './lib/radius';
10
10
  // COMPONENTS & HELPERS
11
11
  export { TwakeMuiThemeProvider } from './components/ThemeProvider';
12
12
  export { Avatar, default as AvatarDefault } from './components/Avatar';
13
+ export { default as Chip } from './components/Chip';
13
14
  export { nameToColor, supportedColors } from './components/Avatar/helpers';
14
15
  export { default as AccordionExpandIcon } from './components/AccordionExpandIcon';
package/dist/lib/makeLightOverrides.js CHANGED
@@ -272,6 +272,15 @@ export const makeLightOverrides = (theme) => {
272
272
  }
273
273
  }
274
274
  },
275
+ MuiChip: {
276
+ styleOverrides: {
277
+ root: {
278
+ '&.square': {
279
+ borderRadius: radius.md
280
+ }
281
+ }
282
+ }
283
+ },
275
284
  MuiAvatar: {
276
285
  styleOverrides: {
277
286
  root: {
package/dist/lib/makePalette.d.ts CHANGED
@@ -1,3 +1,6 @@
1
1
  import { PaletteOptions } from '@mui/material/styles';
2
- import { PaletteJson } from './types';
3
- export declare const makePalette: (mode?: "light" | "dark", palette?: PaletteJson) => PaletteOptions;
2
+ import { PaletteJson, BackgroundPalette, GreyPalette } from './types';
3
+ export declare const makePalette: (mode?: "light" | "dark", palette?: PaletteJson) => PaletteOptions & {
4
+ background: BackgroundPalette;
5
+ grey: GreyPalette;
6
+ };
package/dist/lib/makePalette.js CHANGED
@@ -2,42 +2,124 @@ import { alpha } from '@mui/material/styles';
2
2
  import paletteJson from './palette.json';
3
3
  const paletteData = paletteJson;
4
4
  export const makePalette = (mode = 'light', palette = paletteData) => {
5
+ if (mode === 'dark') {
6
+ return {
7
+ mode,
8
+ primary: {
9
+ light: palette.Primary[300],
10
+ main: palette.Primary[400],
11
+ dark: palette.Primary[500],
12
+ contrastText: alpha(palette.Grey[900], 0.9)
13
+ },
14
+ secondary: {
15
+ light: palette.Grey[300],
16
+ main: palette.Grey[400],
17
+ dark: palette.Grey[500],
18
+ contrastText: alpha(palette.Grey[900], 0.9)
19
+ },
20
+ error: {
21
+ light: palette.Error[300],
22
+ main: palette.Error[400],
23
+ dark: palette.Error[500],
24
+ contrastText: alpha(palette.Grey[900], 0.9)
25
+ },
26
+ warning: {
27
+ light: palette.Warning[300],
28
+ main: palette.Warning[400],
29
+ dark: palette.Warning[500],
30
+ contrastText: alpha(palette.Grey[900], 0.9)
31
+ },
32
+ success: {
33
+ light: palette.Success[300],
34
+ main: palette.Success[400],
35
+ dark: palette.Success[500],
36
+ contrastText: alpha(palette.Grey[900], 0.9)
37
+ },
38
+ info: {
39
+ light: palette.Info[300],
40
+ main: palette.Info[400],
41
+ dark: palette.Info[500],
42
+ contrastText: alpha(palette.Grey[900], 0.9)
43
+ },
44
+ grey: {
45
+ 50: palette.Grey[50],
46
+ 100: palette.Grey[100],
47
+ 200: palette.Grey[200],
48
+ 300: palette.Grey[300],
49
+ 400: palette.Grey[400],
50
+ 500: palette.Grey[500],
51
+ 600: palette.Grey[600],
52
+ 700: palette.Grey[700],
53
+ 800: palette.Grey[800],
54
+ 900: palette.Grey[900],
55
+ A100: palette.Grey.A100,
56
+ A200: palette.Grey.A200,
57
+ A400: palette.Grey.A400,
58
+ A700: palette.Grey.A700,
59
+ A900: palette.Grey.A900
60
+ },
61
+ text: {
62
+ primary: palette.Common.white,
63
+ secondary: alpha(palette.Common.white, 0.64),
64
+ disabled: alpha(palette.Common.white, 0.4)
65
+ },
66
+ background: {
67
+ default: palette.Grey.A400,
68
+ paper: palette.Grey[800],
69
+ contrast: alpha(palette.Common.white, 0.072)
70
+ },
71
+ divider: alpha(palette.Common.white, 0.16),
72
+ action: {
73
+ active: palette.Common.white,
74
+ hover: alpha(palette.Common.white, 0.08),
75
+ hoverOpacity: 0.08,
76
+ selected: alpha(palette.Common.white, 0.16),
77
+ selectedOpacity: 0.18,
78
+ disabled: alpha(palette.Common.white, 0.32),
79
+ disabledOpacity: 0.32,
80
+ disabledBackground: alpha(palette.Common.white, 0.12),
81
+ focus: alpha(palette.Common.white, 0.24),
82
+ focusOpacity: 0.24,
83
+ activatedOpacity: 0.24
84
+ }
85
+ };
86
+ }
5
87
  return {
6
88
  mode,
7
89
  primary: {
8
- light: palette.Primary[300],
90
+ light: palette.Primary[200],
9
91
  main: palette.Primary[600],
10
- dark: palette.Primary[800],
92
+ dark: palette.Primary[700],
11
93
  contrastText: palette.Primary.ContrastText
12
94
  },
13
95
  secondary: {
14
- light: palette.Secondary[300],
96
+ light: palette.Secondary[200],
15
97
  main: palette.Secondary[600],
16
- dark: palette.Secondary[800],
98
+ dark: palette.Secondary[700],
17
99
  contrastText: palette.Secondary.ContrastText
18
100
  },
19
101
  error: {
20
- light: palette.Error[300],
102
+ light: palette.Error[200],
21
103
  main: palette.Error[600],
22
- dark: palette.Error[800],
104
+ dark: palette.Error[700],
23
105
  contrastText: palette.Error.ContrastText
24
106
  },
25
107
  warning: {
26
- light: palette.Warning[300],
27
- main: palette.Warning[500],
108
+ light: palette.Warning[200],
109
+ main: palette.Warning[600],
28
110
  dark: palette.Warning[700],
29
111
  contrastText: palette.Warning.ContrastText
30
112
  },
31
113
  success: {
32
- light: palette.Success[300],
114
+ light: palette.Success[200],
33
115
  main: palette.Success[600],
34
- dark: palette.Success[800],
116
+ dark: palette.Success[700],
35
117
  contrastText: palette.Success.ContrastText
36
118
  },
37
119
  info: {
38
- light: palette.Info[300],
120
+ light: palette.Info[200],
39
121
  main: palette.Info[600],
40
- dark: palette.Info[800],
122
+ dark: palette.Info[700],
41
123
  contrastText: '#fff'
42
124
  },
43
125
  grey: {
@@ -58,28 +140,28 @@ export const makePalette = (mode = 'light', palette = paletteData) => {
58
140
  A900: palette.Grey.A900
59
141
  },
60
142
  text: {
61
- primary: mode === 'dark'
62
- ? palette.Common['white']
63
- : alpha(palette.Grey[900], 0.9),
64
- secondary: mode === 'dark'
65
- ? alpha(palette.Common['white'], 0.64)
66
- : alpha(palette.Grey['900'], 0.64),
67
- disabled: mode === 'dark'
68
- ? alpha(palette.Common['white'], 0.4)
69
- : alpha(palette.Grey['900'], 0.32)
143
+ primary: alpha(palette.Grey[900], 0.9),
144
+ secondary: alpha(palette.Grey[900], 0.64),
145
+ disabled: alpha(palette.Grey[900], 0.32)
70
146
  },
71
147
  background: {
72
- default: '#FFFFFF',
73
- paper: '#FFFFFF'
148
+ default: palette.Grey[100],
149
+ paper: palette.Common.white,
150
+ contrast: alpha(palette.Grey[900], 0.048)
74
151
  },
75
- divider: '#E1E3E6',
152
+ divider: alpha(palette.Grey[900], 0.12),
76
153
  action: {
77
- active: palette.Primary['A400'],
78
- hover: 'rgba(246, 126, 53, 0.04)',
79
- selected: 'rgba(246, 126, 53, 0.08)',
80
- disabled: 'rgba(0, 0, 0, 0.32)',
81
- disabledBackground: 'rgba(0, 0, 0, 0.12)',
82
- focus: 'rgba(246, 126, 53, 0.12)'
154
+ active: alpha(palette.Grey[900], 0.56),
155
+ hover: alpha(palette.Grey[900], 0.04),
156
+ hoverOpacity: 0.04,
157
+ selected: alpha(palette.Grey[900], 0.08),
158
+ selectedOpacity: 0.18,
159
+ disabled: alpha(palette.Grey[900], 0.24),
160
+ disabledOpacity: 0.32,
161
+ disabledBackground: alpha(palette.Grey[900], 0.12),
162
+ focus: alpha(palette.Grey[900], 0.12),
163
+ focusOpacity: 0.12,
164
+ activatedOpacity: 0.12
83
165
  }
84
166
  };
85
167
  };
package/dist/lib/palette.json CHANGED
@@ -1,86 +1,80 @@
1
1
  {
2
2
  "Primary": {
3
- "50": "#FFF9F6",
4
- "100": "#FFF5F0",
5
- "200": "#FFF1E3",
6
- "300": "#FFD8BF",
7
- "400": "#FFAE7B",
8
- "500": "#FF8D46",
9
- "600": "#F67E35",
10
- "700": "#F66F35",
11
- "800": "#E55B31",
12
- "900": "#7A411E",
13
- "ContrastText": "#fff",
14
- "A400": "#2C3039"
3
+ "50": "#f6fbff",
4
+ "100": "#e3f1ff",
5
+ "200": "#d2e9ff",
6
+ "300": "#bfdfff",
7
+ "400": "#7bbdff",
8
+ "500": "#46a2ff",
9
+ "600": "#0a84ff",
10
+ "700": "#006bd8",
11
+ "800": "#0157ad",
12
+ "900": "#082139",
13
+ "ContrastText": "#fff"
15
14
  },
16
15
  "Secondary": {
17
- "50": "#F9FCFF",
18
- "100": "#F6F9FC",
19
- "200": "#F3F6F9",
20
- "300": "#F2F6FA",
21
- "400": "#F1F4F7",
22
- "500": "#F0F2F5",
23
- "600": "#EDF0F2",
24
- "700": "#DAD9DB",
25
- "800": "#BEBEBF",
26
- "900": "#7A797A",
27
- "ContrastText": "#fff",
28
- "A400": "#343439"
16
+ "50": "#f1f5fa",
17
+ "100": "#e8f0fa",
18
+ "200": "#d1e0f2",
19
+ "300": "#b5d1f1",
20
+ "400": "#96bce8",
21
+ "500": "#85b5ec",
22
+ "600": "#5c9ce6",
23
+ "700": "#5085c3",
24
+ "800": "#243b55",
25
+ "900": "#081f39",
26
+ "ContrastText": "#fff"
29
27
  },
30
28
  "Error": {
31
- "50": "#FFFBFE",
32
- "100": "#FCEEEE",
33
- "200": "#FFD2D7",
34
- "300": "#FF939D",
35
- "400": "#FF7A87",
36
- "500": "#FF4D5E",
37
- "600": "#FF3347",
38
- "700": "#D32C3C",
39
- "800": "#B52C39",
40
- "900": "#7A1E27",
41
- "ContrastText": "#fff",
42
- "A400": "#550F0F"
29
+ "50": "#fffbfe",
30
+ "100": "#fceeee",
31
+ "200": "#ffd2d7",
32
+ "300": "#ff939d",
33
+ "400": "#ff7a87",
34
+ "500": "#ff4d5e",
35
+ "600": "#ff3347",
36
+ "700": "#d32c3c",
37
+ "800": "#b52c39",
38
+ "900": "#7a1e27",
39
+ "ContrastText": "#fff"
43
40
  },
44
41
  "Warning": {
45
- "50": "#FFF8E1",
46
- "100": "#FFECB3",
47
- "200": "#FFE082",
48
- "300": "#FFD54F",
49
- "400": "#FFCA28",
50
- "500": "#FFB300",
51
- "600": "#FF8F00",
52
- "700": "#FF6F00",
53
- "800": "#B5672C",
54
- "900": "#281C07",
55
- "ContrastText": "#fff",
56
- "A400": "#3F2B06"
42
+ "50": "#fff8e1",
43
+ "100": "#ffecb3",
44
+ "200": "#ffe082",
45
+ "300": "#ffd54f",
46
+ "400": "#ffca28",
47
+ "500": "#ffb300",
48
+ "600": "#ff8f00",
49
+ "700": "#ff6f00",
50
+ "800": "#b5672c",
51
+ "900": "#281c07",
52
+ "ContrastText": "#fff"
57
53
  },
58
54
  "Success": {
59
- "50": "#F3FFF5",
60
- "100": "#E3FFE7",
61
- "200": "#B9F6CA",
62
- "300": "#97ECA1",
63
- "400": "#66E475",
64
- "500": "#38C949",
65
- "600": "#00C853",
66
- "700": "#00AD48",
55
+ "50": "#f3fff5",
56
+ "100": "#e3ffe7",
57
+ "200": "#b9f6ca",
58
+ "300": "#97eca1",
59
+ "400": "#66e475",
60
+ "500": "#38c949",
61
+ "600": "#00c853",
62
+ "700": "#00ad48",
67
63
  "800": "#245538",
68
- "900": "#08250B",
69
- "ContrastText": "#fff",
70
- "A400": "#07390D"
64
+ "900": "#08250b",
65
+ "ContrastText": "#fff"
71
66
  },
72
67
  "Info": {
73
- "50": "#EDFFFF",
74
- "100": "#D4FEFF",
75
- "200": "#AFFDFF",
76
- "300": "#86F5F7",
77
- "400": "#4EE2E5",
78
- "500": "#1DE9B6",
79
- "600": "#00BFA5",
80
- "700": "#00796B",
68
+ "50": "#edffff",
69
+ "100": "#d4feff",
70
+ "200": "#affdff",
71
+ "300": "#86f5f7",
72
+ "400": "#4ee2e5",
73
+ "500": "#1de9b6",
74
+ "600": "#00bfa5",
75
+ "700": "#00796b",
81
76
  "800": "#004345",
82
- "900": "#002526",
83
- "A400": "#013436"
77
+ "900": "#002526"
84
78
  },
85
79
  "Grey": {
86
80
  "50": "#FBFDFF",
@@ -95,7 +89,7 @@
95
89
  "900": "#424244",
96
90
  "A100": "#FCFCFC",
97
91
  "A200": "#E5ECF3",
98
- "A400": "#37383A",
92
+ "A400": "#2C3039",
99
93
  "A700": "#5D6169",
100
94
  "A900": "#1C1B1F"
101
95
  },
package/dist/lib/types.d.ts CHANGED
@@ -15,7 +15,6 @@ export interface PaletteColor {
15
15
  800: string;
16
16
  900: string;
17
17
  ContrastText?: string;
18
- A400?: string;
19
18
  }
20
19
  export interface GreyPalette {
21
20
  50: string;
package/dist/stories/Chip.stories.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ import type { Meta, StoryObj } from '@storybook/react-vite';
2
+ import { Chip } from '../components/Chip';
3
+ declare const meta: Meta<typeof Chip>;
4
+ export default meta;
5
+ type Story = StoryObj<typeof meta>;
6
+ export declare const Default: Story;
7
+ export declare const Screenshot: Story;
package/dist/stories/Chip.stories.js ADDED
@@ -0,0 +1,100 @@
1
+ /* eslint-disable no-console */
2
+ import { Icon, FileOutline, Openwith, Right } from '@linagora/twake-icons';
3
+ import { Avatar, Grid, Stack, Typography, IconButton } from '@mui/material';
4
+ import React from 'react';
5
+ import { Chip } from '../components/Chip';
6
+ const meta = {
7
+ title: 'Chip',
8
+ component: Chip,
9
+ parameters: { layout: 'centered' },
10
+ tags: ['autodocs'],
11
+ argTypes: {
12
+ color: {
13
+ control: 'select',
14
+ options: [
15
+ 'default',
16
+ 'primary',
17
+ 'secondary',
18
+ 'error',
19
+ 'warning',
20
+ 'success'
21
+ ]
22
+ },
23
+ variant: {
24
+ control: 'select',
25
+ options: ['filled', 'outlined']
26
+ },
27
+ disabled: {
28
+ control: 'boolean'
29
+ },
30
+ size: {
31
+ control: 'select',
32
+ options: ['small', 'medium']
33
+ }
34
+ }
35
+ };
36
+ export default meta;
37
+ export const Default = {
38
+ args: {
39
+ color: 'default',
40
+ variant: 'filled',
41
+ label: 'Chip Content'
42
+ },
43
+ render: args => React.createElement(Chip, { ...args })
44
+ };
45
+ export const Screenshot = {
46
+ tags: ['argos'],
47
+ render: () => {
48
+ const colors = [
49
+ 'default',
50
+ 'primary',
51
+ 'secondary',
52
+ 'success',
53
+ 'error',
54
+ 'warning',
55
+ 'info'
56
+ ];
57
+ const variants = ['filled', 'outlined'];
58
+ const squareProps = [false, true];
59
+ const sizeProps = ['small', 'medium'];
60
+ return (React.createElement(Stack, { spacing: 4 }, sizeProps.map(size => (React.createElement("div", { key: size },
61
+ React.createElement(Typography, { variant: "h3", sx: { mb: 2 } }, size),
62
+ squareProps.map(square => (React.createElement("div", { key: String(square) },
63
+ React.createElement(Typography, { variant: "h4", sx: { mb: 2 } }, square ? 'Square' : 'Rounded'),
64
+ colors.map(color => (React.createElement("div", { key: color },
65
+ React.createElement(Typography, { variant: "h4", sx: { textTransform: 'capitalize', mt: 2 } }, color),
66
+ React.createElement(Grid, { container: true, spacing: 4 }, variants.map(variant => (React.createElement(Grid, { key: variant, size: { xs: 12, sm: 6 } },
67
+ React.createElement(Stack, { spacing: 2 },
68
+ React.createElement(Typography, { variant: "h6", sx: { textTransform: 'capitalize' } }, variant),
69
+ React.createElement(Stack, { spacing: 1 },
70
+ React.createElement(Typography, { variant: "caption", sx: { color: 'text.secondary' } }, "default"),
71
+ React.createElement("div", null,
72
+ React.createElement(Chip, { color: color, variant: variant, label: "Simple Chip", square: square, size: size })),
73
+ React.createElement("div", null,
74
+ React.createElement(Chip, { color: color, variant: variant, label: "Clickable Chip", clickable: true, onClick: () => console.info('click'), square: square, size: size })),
75
+ React.createElement("div", null,
76
+ React.createElement(Chip, { color: color, variant: variant, label: "Deletable chip", onDelete: () => console.info('delete'), square: square, size: size })),
77
+ React.createElement("div", null,
78
+ React.createElement(Chip, { color: color, variant: variant, label: "Chip with Icon", icon: React.createElement(Icon, { icon: FileOutline }), square: square, size: size })),
79
+ React.createElement("div", null,
80
+ React.createElement(Chip, { color: color, variant: variant, label: "Deletable chip with icon", icon: React.createElement(Icon, { icon: FileOutline }), onDelete: () => console.info('delete'), square: square, size: size })),
81
+ React.createElement("div", null,
82
+ React.createElement(Chip, { color: color, variant: variant, label: "Avatar Chip", avatar: React.createElement(Avatar, null, "M"), square: square, size: size })),
83
+ React.createElement("div", null,
84
+ React.createElement(Chip, { color: color, variant: variant, label: "Action chip", avatar: React.createElement(Avatar, null, "M"), deleteIcon: React.createElement(IconButton, null,
85
+ React.createElement(Icon, { icon: Right })), endIcon: React.createElement(IconButton, { sx: {
86
+ color: color === 'default'
87
+ ? `${color}.main`
88
+ : `inherit`
89
+ }, onClick: () => console.info('end adornment clicked') },
90
+ React.createElement(Icon, { icon: Openwith })), onDelete: () => console.info('delete'), square: square, size: size }))),
91
+ React.createElement(Stack, { spacing: 1 },
92
+ React.createElement(Typography, { variant: "caption", sx: { color: 'text.secondary' } }, "disabled"),
93
+ React.createElement("div", null,
94
+ React.createElement(Chip, { color: color, variant: variant, label: "Chip Content", disabled: true, square: square, size: size })),
95
+ React.createElement("div", null,
96
+ React.createElement(Chip, { color: color, variant: variant, label: "Chip Content", onDelete: () => { }, disabled: true, square: square, size: size })),
97
+ React.createElement("div", null,
98
+ React.createElement(Chip, { color: color, variant: variant, label: "Chip Content", icon: React.createElement(Icon, { icon: FileOutline }), disabled: true, square: square, size: size })))))))))))))))))));
99
+ }
100
+ };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@linagora/twake-mui",
3
3
  "type": "module",
4
- "version": "4.1.1",
4
+ "version": "4.3.0",
5
5
  "description": "MUI v9 theme system for Twake applications",
6
6
  "author": "Twake",
7
7
  "license": "MIT",
@@ -56,6 +56,9 @@
56
56
  "react": "^18",
57
57
  "react-dom": "^18"
58
58
  },
59
+ "dependencies": {
60
+ "classnames": "^2.5.1"
61
+ },
59
62
  "devDependencies": {
60
63
  "@argos-ci/cli": "4.2.0",
61
64
  "@argos-ci/storybook": "5.3.2",
@@ -70,6 +73,7 @@
70
73
  "@storybook/builder-vite": "10.3.5",
71
74
  "@storybook/react": "10.3.5",
72
75
  "@storybook/react-vite": "10.3.5",
76
+ "@types/classnames": "^2.3.1",
73
77
  "@types/lodash": "4.17.24",
74
78
  "@types/react": "18.2.0",
75
79
  "@types/react-dom": "^18.2.0",