Merge branch 'master' of github.com:DevoInc/genesys-ui

DevoInc · Oct 30, 2024 · 92cc625 · 92cc625
2 parents 658aed2 + f7d9462
commit 92cc625
Show file tree

Hide file tree

Showing 34 changed files with 499 additions and 160 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,21 @@
 # Changelog
 
+## [13.4.2](https://github.com/DevoInc/genesys-ui/compare/v13.4.1...v13.4.2) (2024-10-29)
+
+
+### Bug Fixes
+
+* **table:** sortable only header cell ([5e02e17](https://github.com/DevoInc/genesys-ui/commit/5e02e17bfa7dd66912cda2ed7158bb5a33197b55))
+
+## [13.4.1](https://github.com/DevoInc/genesys-ui/compare/v13.4.0...v13.4.1) (2024-10-29)
+
+## [13.4.0](https://github.com/DevoInc/genesys-ui/compare/v13.3.3...v13.4.0) (2024-10-28)
+
+
+### Features
+
+* added new collapsable variant for FormGroup ([5d02410](https://github.com/DevoInc/genesys-ui/commit/5d02410f9267efd4192c7f4baf69cd65a77ed183))
+
 ## [13.3.3](https://github.com/DevoInc/genesys-ui/compare/v13.3.2...v13.3.3) (2024-10-24)
 
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "genesys-ui",
-  "version": "13.3.3",
+  "version": "13.4.2",
   "description": "",
   "type": "module",
   "private": true,
@@ -63,7 +63,6 @@
     "happy-dom": "^15.7.4",
     "identity-obj-proxy": "^3.0.0",
     "js-cookie": "^3.0.5",
-    "lodash": "^4.17.21",
     "mermaid": "^11.2.1",
     "oxlint": "^0.9.8",
     "polished": "^4.3.1",
@@ -74,6 +73,7 @@
     "release-it": "^17.6.0",
     "remark-gfm": "^4.0.0",
     "sass": "^1.79.3",
+    "semver": "^7.6.3",
     "storybook": "^8.3.1",
     "tocbot": "^4.29.0",
     "ts-node": "^10.9.2",
@@ -96,8 +96,5 @@
   "engines": {
     "node": ">=18",
     "npm": ">=7"
-  },
-  "overrides": {
-    "@types/lodash": "4.14.197"
   }
 }
diff --git a/packages/code/package.json b/packages/code/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devoinc/genesys-ui-code",
-  "version": "13.3.3",
+  "version": "13.4.2",
   "description": "",
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -30,7 +30,7 @@
     "dpdm": "dpdm --exit-code circular:1 ./src/index.ts"
   },
   "peerDependencies": {
-    "@devoinc/genesys-ui": "^13.3.3",
+    "@devoinc/genesys-ui": "^13.4.2",
     "ahooks": "3.x.x",
     "monaco-editor-core": "0.x.x",
     "react": "16.x || 17.x || 18.x",

diff --git a/packages/color/package.json b/packages/color/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devoinc/genesys-ui-color",
-  "version": "13.3.3",
+  "version": "13.4.2",
   "description": "",
   "type": "module",
   "scripts": {
@@ -29,7 +29,7 @@
   "author": "",
   "license": "MIT",
   "peerDependencies": {
-    "@devoinc/genesys-ui": "^13.3.3",
+    "@devoinc/genesys-ui": "^13.4.2",
     "polished": "4.x.x",
     "react": "16.x || 17.x || 18.x",
     "react-color": "2.x.x",

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@devoinc/genesys-ui",
-  "version": "13.3.3",
+  "version": "13.4.2",
   "description": "",
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -34,7 +34,6 @@
     "@dnd-kit/sortable": "7.x.x",
     "@popperjs/core": "2.x.x",
     "ahooks": "3.x.x",
-    "lodash": "4.x.x",
     "polished": "4.x.x",
     "react": "16.x || 17.x || 18.x",
     "react-dock": "0.x.x",

diff --git a/packages/core/src/components/Avatar/components/AvatarContainer/StyledAvatarContainer.ts b/packages/core/src/components/Avatar/components/AvatarContainer/StyledAvatarContainer.ts
@@ -1,11 +1,11 @@
 import styled, { css } from 'styled-components';
-import { camelCase } from 'lodash';
 
 import type { IAvatarStyled } from '../../declarations';
 
 import { getAvatarSizeConfig } from '../../utils';
 
 import { typoMixin } from '../../../../styled/';
+import { getTokenKeyFromColorScheme } from '../../../../helpers';
 
 export interface StyledAvatarContainerProps
   extends Pick<
@@ -30,7 +30,7 @@ export const StyledAvatarContainer = styled.span<StyledAvatarContainerProps>`
     theme,
     $variant,
   }) => {
-    const colorSchemeForTokens = camelCase($colorScheme);
+    const colorSchemeForTokens = getTokenKeyFromColorScheme($colorScheme);
     const cmpTokens = theme.cmp.avatar;
     const bgColor = cmpTokens.color.background[colorSchemeForTokens];
     const color = cmpTokens.color.text[colorSchemeForTokens];

diff --git a/packages/core/src/components/Badge/components/BadgeContainer/StyledBadgeContainer.ts b/packages/core/src/components/Badge/components/BadgeContainer/StyledBadgeContainer.ts
@@ -1,7 +1,10 @@
 import styled, { css } from 'styled-components';
-import { camelCase } from 'lodash';
 
-import { isValidColor, getAccTextColor } from '../../../../helpers';
+import {
+  isValidColor,
+  getAccTextColor,
+  getTokenKeyFromColorScheme,
+} from '../../../../helpers';
 import { getBadgeInverseModeColor } from '../../helpers';
 
 import type { IBadgeContainer } from './declarations';
@@ -28,7 +31,7 @@ export const StyledBadgeContainer = styled.span<StyledBadgeContainerProps>`
     $size = 'md',
     theme,
   }) => {
-    const colorSchemeForTokens = camelCase($colorScheme);
+    const colorSchemeForTokens = getTokenKeyFromColorScheme($colorScheme);
     const contentType = $hasContent ? 'hasContent' : 'isEmpty';
     const cmpTokens = theme.cmp.badge;
     const squareSize = cmpTokens.size.square[contentType][$size];

diff --git a/packages/core/src/components/Button/components/ButtonContainer/StyledButtonContainer.ts b/packages/core/src/components/Button/components/ButtonContainer/StyledButtonContainer.ts
@@ -1,5 +1,4 @@
 import styled, { css } from 'styled-components';
-import { camelCase } from 'lodash';
 
 import {
   typoMixin,
@@ -8,6 +7,7 @@ import {
 } from '../../../../styled/mixins';
 import { loadingAnimationMixin } from '../../helpers';
 import type { IButtonContainerStyled } from './declarations';
+import { getTokenKeyFromColorScheme } from '../../../../helpers';
 
 export interface StyledButtonContainerProps extends IButtonContainerStyled {}
 
@@ -25,7 +25,7 @@ export const StyledButtonContainer = styled.button<StyledButtonContainerProps>`
     theme,
   }) => {
     const isIconButtonDropdown = $icon && $squared && $hasDropdown;
-    const colorSchemeForTokens = camelCase($colorScheme);
+    const colorSchemeForTokens = getTokenKeyFromColorScheme($colorScheme);
     const buttonTokens = theme.cmp.button;
     const IconButtonDropdownTokens = theme.cmp.iconButtonDropdown;
     const boxShadowTokens = buttonTokens.elevation.boxShadow;

diff --git a/packages/core/src/components/Divider/StyledDivider.ts b/packages/core/src/components/Divider/StyledDivider.ts
@@ -1,8 +1,7 @@
 import styled, { css } from 'styled-components';
-import { camelCase } from 'lodash';
 
 import type { IDividerStyled } from './declarations';
-import { getSpacingPropCss } from '../../helpers';
+import { getSpacingPropCss, getTokenKeyFromColorScheme } from '../../helpers';
 
 export interface StyledDividerProps extends IDividerStyled {}
 
@@ -21,7 +20,7 @@ export const StyledDivider = styled.hr<StyledDividerProps>`
     $width,
   }) => {
     const cmpTokens = theme.cmp.divider;
-    const colorSchemeForTokens = camelCase($colorScheme);
+    const colorSchemeForTokens = getTokenKeyFromColorScheme($colorScheme);
     const defaultSpacing =
       cmpTokens.space.margin[$vertical ? 'vertical' : 'base'];
     const spacing = $margin

diff --git a/packages/core/src/components/Panel/helpers.ts b/packages/core/src/components/Panel/helpers.ts
@@ -3,7 +3,7 @@ import { css, DefaultTheme } from 'styled-components';
 
 import type { BoxProps } from '../Box';
 import { pseudoElementOverlayMixin } from '../../styled';
-import { camelCase } from 'lodash';
+import { getTokenKeyFromColorScheme } from '../../helpers';
 
 export interface PanelMixinProps
   extends Pick<BoxProps, 'display' | 'elevation'> {
@@ -19,7 +19,7 @@ export interface PanelMixinProps
 export const panelMixin =
   (theme: DefaultTheme) =>
   ({ bordered, colorScheme, display, elevation }: PanelMixinProps) => {
-    const elevationForTokens = camelCase(elevation);
+    const elevationForTokens = getTokenKeyFromColorScheme(elevation);
     const tokens = theme.cmp.panel;
     const borderColor = tokens.color.border[elevationForTokens];
     const borderWidth = tokens.shape.borderSize;

diff --git a/packages/core/src/components/Partitions/components/PartitionsItem/StyledPartitionsItem.tsx b/packages/core/src/components/Partitions/components/PartitionsItem/StyledPartitionsItem.tsx
@@ -1,8 +1,7 @@
 import styled, { css } from 'styled-components';
-import { camelCase } from 'lodash';
 
 import type { IPartitionsItem, TPartitionsSize } from '../../declarations';
-import { isValidColor } from '../../../../helpers';
+import { getTokenKeyFromColorScheme, isValidColor } from '../../../../helpers';
 
 export interface StyledPartitionsItemProps {
   /** The size of the partition item. */
@@ -16,7 +15,7 @@ export interface StyledPartitionsItemProps {
 export const StyledPartitionsItem = styled.li<StyledPartitionsItemProps>`
   transition: all 0.15s ease;
   background-color: ${({ $color, theme }) => {
-    const colorSchemeForTokens = camelCase($color);
+    const colorSchemeForTokens = getTokenKeyFromColorScheme($color);
     return isValidColor($color)
       ? $color
       : theme.cmp.partitions.color.background[colorSchemeForTokens];

diff --git a/packages/core/src/components/SelectControl/SelectControl.tsx b/packages/core/src/components/SelectControl/SelectControl.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { get } from 'lodash';
 import {
   CSSObjectWithLabel,
   GroupBase,
@@ -134,7 +133,7 @@ export const SelectControl = <
       // react-select will be constantly changing the state and re-rendering
       // all the selects, even the closed ones.
       ev != null &&
-      get(ev, 'srcElement.classList') != null &&
+      ev?.srcElement?.classList != null &&
       ev.srcElement.getElementsByClassName(
         `${rest.classNamePrefix}__control--menu-is-open`,
       ).length &&

diff --git a/packages/core/src/components/Tag/components/TagContainer/StyledTagContainer.ts b/packages/core/src/components/Tag/components/TagContainer/StyledTagContainer.ts
@@ -1,8 +1,11 @@
 import styled, { css } from 'styled-components';
-import { camelCase } from 'lodash';
 
 import { typoMixin } from '../../../../styled';
-import { getAccTextColor, isValidColor } from '../../../../helpers';
+import {
+  getAccTextColor,
+  getTokenKeyFromColorScheme,
+  isValidColor,
+} from '../../../../helpers';
 import type { ITag } from '../../declarations';
 
 export interface StyledTagContainerProps {
@@ -22,7 +25,7 @@ export const StyledTagContainer = styled.span<StyledTagContainerProps>`
     $size = 'md',
     theme,
   }) => {
-    const colorSchemeForTokens = camelCase($colorScheme);
+    const colorSchemeForTokens = getTokenKeyFromColorScheme($colorScheme);
 
     const isBlendColorScheme =
       $colorScheme === 'blend-base' || $colorScheme === 'blend-inverse';

diff --git a/packages/core/src/helpers/color/index.ts b/packages/core/src/helpers/color/index.ts
@@ -1,4 +1,5 @@
 export * from './accessibility';
 export * from './colors';
 export * from './getters';
+export * from './tokens';
 export * from './validation';