@chayns-components/core 5.0.0-beta.435 → 5.0.0-beta.437

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.
@@ -38,9 +38,7 @@ const Icon = _ref => {
38
38
  onDoubleClick(event);
39
39
  }
40
40
  };
41
- const {
42
- iconStyle
43
- } = (0, _styledComponents.useTheme)();
41
+ const theme = (0, _styledComponents.useTheme)();
44
42
  let maxStackSizeFactor = 1;
45
43
  icons.forEach(icon => {
46
44
  const stackSizeFactor = (0, _icon.getStackSizeFactor)(icon);
@@ -59,7 +57,7 @@ const Icon = _ref => {
59
57
  size: size
60
58
  }, icons.map(icon => {
61
59
  const stackSizeFactor = (0, _icon.getStackSizeFactor)(icon);
62
- const iconClasses = (0, _clsx.default)(`${iconStyle} ${icon}`, {
60
+ const iconClasses = (0, _clsx.default)(`${theme && theme.iconStyle ? theme.iconStyle : 'fa-regular'} ${icon}`, {
63
61
  'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined
64
62
  });
65
63
  return /*#__PURE__*/_react.default.createElement(_Icon.StyledIcon, {
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.js","names":["_clsx","_interopRequireDefault","require","_react","_Icon","_icon","_styledComponents","obj","__esModule","default","Icon","_ref","className","color","icons","isDisabled","onClick","onDoubleClick","onMouseDown","size","shouldStopPropagation","handleClick","event","stopPropagation","handleDoubleClick","iconStyle","useTheme","maxStackSizeFactor","forEach","icon","stackSizeFactor","getStackSizeFactor","shouldUseStackedIcon","length","wrapperClasses","clsx","createElement","StyledIconWrapper","undefined","map","iconClasses","StyledIcon","includes","fontSize","isStacked","key","displayName","_default","exports"],"sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEventHandler } from 'react';\nimport { StyledIcon, StyledIconWrapper } from './Icon.styles';\nimport { getStackSizeFactor } from '../../utils/icon';\nimport { useTheme } from 'styled-components';\n\nexport type IconProps = {\n /**\n * Additional class names for the root element\n */\n className?: string;\n /**\n * The color of the icon\n */\n color?: string;\n /**\n * The FontAwesome or tobit icons to render. Multiple icons are stacked.\n */\n icons: string[];\n /**\n * Disables the icon so that it cannot be clicked anymore\n */\n isDisabled?: boolean;\n /**\n * Function to be executed when the icon was clicked\n */\n onClick?: MouseEventHandler<HTMLSpanElement>;\n /**\n * Function to be executed when the icon was double-clicked\n */\n onDoubleClick?: MouseEventHandler<HTMLSpanElement>;\n /**\n * Function to be executed when a mouse button is pressed on the icon\n */\n onMouseDown?: MouseEventHandler<HTMLSpanElement>;\n /**\n * Size of the icon in pixel\n */\n size?: number;\n /**\n * Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Icon: FC<IconProps> = ({\n className,\n color,\n icons,\n isDisabled,\n onClick,\n onDoubleClick,\n onMouseDown,\n size = 15,\n shouldStopPropagation,\n}) => {\n const handleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n if (typeof onClick === 'function') {\n onClick(event);\n }\n };\n\n const handleDoubleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n if (typeof onDoubleClick === 'function') {\n onDoubleClick(event);\n }\n };\n\n const { iconStyle } = useTheme();\n\n let maxStackSizeFactor = 1;\n\n icons.forEach((icon) => {\n const stackSizeFactor = getStackSizeFactor(icon);\n\n if (stackSizeFactor && stackSizeFactor > maxStackSizeFactor) {\n maxStackSizeFactor = stackSizeFactor;\n }\n });\n\n const shouldUseStackedIcon = icons.length > 1;\n\n const wrapperClasses = clsx(\n 'beta-chayns-icon',\n shouldUseStackedIcon ? 'fa-stack' : '',\n className,\n );\n\n return (\n <StyledIconWrapper\n className={wrapperClasses}\n isDisabled={isDisabled}\n onClick={typeof onClick === 'function' ? handleClick : undefined}\n onDoubleClick={typeof onDoubleClick === 'function' ? handleDoubleClick : undefined}\n onMouseDown={onMouseDown}\n size={size}\n >\n {icons.map((icon) => {\n const stackSizeFactor = getStackSizeFactor(icon);\n\n const iconClasses = clsx(`${iconStyle as string} ${icon}`, {\n 'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined,\n });\n\n return (\n <StyledIcon\n className={iconClasses}\n color={icon.includes('fa-inverse') ? 'white' : color}\n fontSize={((stackSizeFactor || 1) / maxStackSizeFactor) * size}\n isStacked={shouldUseStackedIcon}\n key={icon}\n size={size}\n />\n );\n })}\n </StyledIconWrapper>\n );\n};\n\nIcon.displayName = 'Icon';\n\nexport default Icon;\n"],"mappings":"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"}
1
+ {"version":3,"file":"Icon.js","names":["_clsx","_interopRequireDefault","require","_react","_Icon","_icon","_styledComponents","obj","__esModule","default","Icon","_ref","className","color","icons","isDisabled","onClick","onDoubleClick","onMouseDown","size","shouldStopPropagation","handleClick","event","stopPropagation","handleDoubleClick","theme","useTheme","maxStackSizeFactor","forEach","icon","stackSizeFactor","getStackSizeFactor","shouldUseStackedIcon","length","wrapperClasses","clsx","createElement","StyledIconWrapper","undefined","map","iconClasses","iconStyle","StyledIcon","includes","fontSize","isStacked","key","displayName","_default","exports"],"sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { FC, MouseEventHandler } from 'react';\nimport { StyledIcon, StyledIconWrapper } from './Icon.styles';\nimport { getStackSizeFactor } from '../../utils/icon';\nimport { useTheme } from 'styled-components';\n\nexport type IconProps = {\n /**\n * Additional class names for the root element\n */\n className?: string;\n /**\n * The color of the icon\n */\n color?: string;\n /**\n * The FontAwesome or tobit icons to render. Multiple icons are stacked.\n */\n icons: string[];\n /**\n * Disables the icon so that it cannot be clicked anymore\n */\n isDisabled?: boolean;\n /**\n * Function to be executed when the icon was clicked\n */\n onClick?: MouseEventHandler<HTMLSpanElement>;\n /**\n * Function to be executed when the icon was double-clicked\n */\n onDoubleClick?: MouseEventHandler<HTMLSpanElement>;\n /**\n * Function to be executed when a mouse button is pressed on the icon\n */\n onMouseDown?: MouseEventHandler<HTMLSpanElement>;\n /**\n * Size of the icon in pixel\n */\n size?: number;\n /**\n * Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Icon: FC<IconProps> = ({\n className,\n color,\n icons,\n isDisabled,\n onClick,\n onDoubleClick,\n onMouseDown,\n size = 15,\n shouldStopPropagation,\n}) => {\n const handleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n if (typeof onClick === 'function') {\n onClick(event);\n }\n };\n\n const handleDoubleClick: MouseEventHandler<HTMLSpanElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n if (typeof onDoubleClick === 'function') {\n onDoubleClick(event);\n }\n };\n\n const theme = useTheme();\n\n let maxStackSizeFactor = 1;\n\n icons.forEach((icon) => {\n const stackSizeFactor = getStackSizeFactor(icon);\n\n if (stackSizeFactor && stackSizeFactor > maxStackSizeFactor) {\n maxStackSizeFactor = stackSizeFactor;\n }\n });\n\n const shouldUseStackedIcon = icons.length > 1;\n\n const wrapperClasses = clsx(\n 'beta-chayns-icon',\n shouldUseStackedIcon ? 'fa-stack' : '',\n className,\n );\n\n return (\n <StyledIconWrapper\n className={wrapperClasses}\n isDisabled={isDisabled}\n onClick={typeof onClick === 'function' ? handleClick : undefined}\n onDoubleClick={typeof onDoubleClick === 'function' ? handleDoubleClick : undefined}\n onMouseDown={onMouseDown}\n size={size}\n >\n {icons.map((icon) => {\n const stackSizeFactor = getStackSizeFactor(icon);\n\n const iconClasses = clsx(\n `${theme && theme.iconStyle ? (theme.iconStyle as string) : 'fa-regular'} ${icon}`,\n {\n 'fa-stack-1x': shouldUseStackedIcon && stackSizeFactor === undefined,\n },\n );\n\n return (\n <StyledIcon\n className={iconClasses}\n color={icon.includes('fa-inverse') ? 'white' : color}\n fontSize={((stackSizeFactor || 1) / maxStackSizeFactor) * size}\n isStacked={shouldUseStackedIcon}\n key={icon}\n size={size}\n />\n );\n })}\n </StyledIconWrapper>\n );\n};\n\nIcon.displayName = 'Icon';\n\nexport default Icon;\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/core",
3
- "version": "5.0.0-beta.435",
3
+ "version": "5.0.0-beta.437",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "keywords": [
6
6
  "chayns",
@@ -65,5 +65,5 @@
65
65
  "publishConfig": {
66
66
  "access": "public"
67
67
  },
68
- "gitHead": "91888d02bb6dbe58d754c129c8531f0941afb9e0"
68
+ "gitHead": "a3da3af3c48606b3409b5c1395e6043a02dcfbb2"
69
69
  }