@channel.io/bezier-react 2.5.0 → 2.6.0

package/dist/cjs/components/ListItem/ListItem.js

@@ -30,19 +30,21 @@ const ListItem = /*#__PURE__*/React.forwardRef(function ListItem({
   active = false,
   focused = false,
   disabled = false,
+  clickable: clickableProp = false,
   href,
   onClick,
   ...rest
 }, forwardedRef) {
   const isLink = !type.isEmpty(href);
   const Comp = isLink ? 'a' : as !== null && as !== void 0 ? as : 'div';
+  const clickable = isLink || clickableProp || !type.isNil(onClick);
   return /*#__PURE__*/React.createElement(Comp, Object.assign({}, isLink && {
     href,
     draggable: false,
     target: '_blank',
     rel: 'noopener noreferrer'
   }, {
-    className: index.default(ListItem_module.default.ListItem, ListItem_module.default[`size-${size}`], ListItem_module.default[`variant-${variant}`], disabled && ListItem_module.default.disabled, focused && ListItem_module.default.focused, active && ListItem_module.default.active, className),
+    className: index.default(ListItem_module.default.ListItem, ListItem_module.default[`size-${size}`], ListItem_module.default[`variant-${variant}`], disabled && ListItem_module.default.disabled, focused && ListItem_module.default.focused, active && ListItem_module.default.active, clickable && ListItem_module.default.clickable, className),
     ref: forwardedRef,
     onClick: !disabled ? onClick : undefined,
     "data-testid": LIST_ITEM_TEST_ID

package/dist/cjs/components/ListItem/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sources":["../../../../src/components/ListItem/ListItem.tsx"],"sourcesContent":["'use client'\n\nimport React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { isEmpty, isNil, isString } from '~/src/utils/type'\n\nimport { Icon } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport { type ListItemProps } from './ListItem.types'\n\nimport styles from './ListItem.module.scss'\n\ntype ListItemRef = HTMLDivElement & HTMLAnchorElement\n\nfunction renderNewLineComponent(value: string) {\n  return value.split('\\n').map((str, index) => (\n    // eslint-disable-next-line react/no-array-index-key\n    <React.Fragment key={index}>\n      {index !== 0 && <br />}\n      {str}\n    </React.Fragment>\n  ))\n}\n\nexport const LIST_ITEM_TEST_ID = 'bezier-list-item'\n\nexport const ListItem = forwardRef<ListItemRef, ListItemProps>(\n  function ListItem(\n    {\n      className,\n      as,\n      variant = 'monochrome',\n      size = 's',\n      content,\n      description,\n      descriptionMaxLines,\n      leftContent,\n      rightContent,\n      active = false,\n      focused = false,\n      disabled = false,\n      href,\n      onClick,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const isLink = !isEmpty(href)\n    const Comp = isLink ? 'a' : ((as ?? 'div') as 'div')\n\n    return (\n      <Comp\n        {...(isLink && {\n          href,\n          draggable: false,\n          target: '_blank',\n          rel: 'noopener noreferrer',\n        })}\n        className={classNames(\n          styles.ListItem,\n          styles[`size-${size}`],\n          styles[`variant-${variant}`],\n          disabled && styles.disabled,\n          focused && styles.focused,\n          active && styles.active,\n          className\n        )}\n        ref={forwardedRef}\n        onClick={!disabled ? onClick : undefined}\n        data-testid={LIST_ITEM_TEST_ID}\n        {...rest}\n      >\n        <div className={styles.ListItemContent}>\n          {!isNil(leftContent) && (\n            <div className={styles.ListItemLeftContent}>\n              {isBezierIcon(leftContent) ? (\n                <Icon\n                  className={styles.ListItemLeftIcon}\n                  source={leftContent}\n                  size=\"s\"\n                />\n              ) : (\n                leftContent\n              )}\n            </div>\n          )}\n\n          <div className={styles.ListItemTitle}>\n            {isString(content) ? (\n              <Text\n                truncated\n                typo={size === 'l' ? '16' : '14'}\n              >\n                {content}\n              </Text>\n            ) : (\n              content\n            )}\n          </div>\n\n          {description && (\n            <div className={styles.ListItemDescription}>\n              <Text\n                typo=\"12\"\n                color=\"txt-black-darker\"\n                truncated={descriptionMaxLines}\n              >\n                {isString(description)\n                  ? renderNewLineComponent(description)\n                  : description}\n              </Text>\n            </div>\n          )}\n        </div>\n\n        {rightContent && (\n          <div className={styles.ListItemRightContent}>{rightContent}</div>\n        )}\n      </Comp>\n    )\n  }\n)\n"],"names":["renderNewLineComponent","value","split","map","str","index","React","createElement","Fragment","key","LIST_ITEM_TEST_ID","ListItem","forwardRef","className","as","variant","size","content","description","descriptionMaxLines","leftContent","rightContent","active","focused","disabled","href","onClick","rest","forwardedRef","isLink","isEmpty","Comp","Object","assign","draggable","target","rel","classNames","styles","ref","undefined","ListItemContent","isNil","ListItemLeftContent","isBezierIcon","Icon","ListItemLeftIcon","source","ListItemTitle","isString","Text","truncated","typo","ListItemDescription","color","ListItemRightContent"],"mappings":"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"}
+{"version":3,"file":"ListItem.js","sources":["../../../../src/components/ListItem/ListItem.tsx"],"sourcesContent":["'use client'\n\nimport React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { isEmpty, isNil, isString } from '~/src/utils/type'\n\nimport { Icon } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport { type ListItemProps } from './ListItem.types'\n\nimport styles from './ListItem.module.scss'\n\ntype ListItemRef = HTMLDivElement & HTMLAnchorElement\n\nfunction renderNewLineComponent(value: string) {\n  return value.split('\\n').map((str, index) => (\n    // eslint-disable-next-line react/no-array-index-key\n    <React.Fragment key={index}>\n      {index !== 0 && <br />}\n      {str}\n    </React.Fragment>\n  ))\n}\n\nexport const LIST_ITEM_TEST_ID = 'bezier-list-item'\n\nexport const ListItem = forwardRef<ListItemRef, ListItemProps>(\n  function ListItem(\n    {\n      className,\n      as,\n      variant = 'monochrome',\n      size = 's',\n      content,\n      description,\n      descriptionMaxLines,\n      leftContent,\n      rightContent,\n      active = false,\n      focused = false,\n      disabled = false,\n      clickable: clickableProp = false,\n      href,\n      onClick,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const isLink = !isEmpty(href)\n    const Comp = isLink ? 'a' : ((as ?? 'div') as 'div')\n    const clickable = isLink || clickableProp || !isNil(onClick)\n\n    return (\n      <Comp\n        {...(isLink && {\n          href,\n          draggable: false,\n          target: '_blank',\n          rel: 'noopener noreferrer',\n        })}\n        className={classNames(\n          styles.ListItem,\n          styles[`size-${size}`],\n          styles[`variant-${variant}`],\n          disabled && styles.disabled,\n          focused && styles.focused,\n          active && styles.active,\n          clickable && styles.clickable,\n          className\n        )}\n        ref={forwardedRef}\n        onClick={!disabled ? onClick : undefined}\n        data-testid={LIST_ITEM_TEST_ID}\n        {...rest}\n      >\n        <div className={styles.ListItemContent}>\n          {!isNil(leftContent) && (\n            <div className={styles.ListItemLeftContent}>\n              {isBezierIcon(leftContent) ? (\n                <Icon\n                  className={styles.ListItemLeftIcon}\n                  source={leftContent}\n                  size=\"s\"\n                />\n              ) : (\n                leftContent\n              )}\n            </div>\n          )}\n\n          <div className={styles.ListItemTitle}>\n            {isString(content) ? (\n              <Text\n                truncated\n                typo={size === 'l' ? '16' : '14'}\n              >\n                {content}\n              </Text>\n            ) : (\n              content\n            )}\n          </div>\n\n          {description && (\n            <div className={styles.ListItemDescription}>\n              <Text\n                typo=\"12\"\n                color=\"txt-black-darker\"\n                truncated={descriptionMaxLines}\n              >\n                {isString(description)\n                  ? renderNewLineComponent(description)\n                  : description}\n              </Text>\n            </div>\n          )}\n        </div>\n\n        {rightContent && (\n          <div className={styles.ListItemRightContent}>{rightContent}</div>\n        )}\n      </Comp>\n    )\n  }\n)\n"],"names":["renderNewLineComponent","value","split","map","str","index","React","createElement","Fragment","key","LIST_ITEM_TEST_ID","ListItem","forwardRef","className","as","variant","size","content","description","descriptionMaxLines","leftContent","rightContent","active","focused","disabled","clickable","clickableProp","href","onClick","rest","forwardedRef","isLink","isEmpty","Comp","isNil","Object","assign","draggable","target","rel","classNames","styles","ref","undefined","ListItemContent","ListItemLeftContent","isBezierIcon","Icon","ListItemLeftIcon","source","ListItemTitle","isString","Text","truncated","typo","ListItemDescription","color","ListItemRightContent"],"mappings":"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"}

package/dist/cjs/components/ListItem/ListItem.module.scss.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"ListItemLeftIcon":"b-VVQ4r","ListItem":"b--YGnT","variant-monochrome":"b-rFKfG","size-xs":"b-Aklfx","size-s":"b-bUl-D","size-m":"b-nVB-T","size-l":"b-8OVWw","disabled":"b-eQ9bA","active":"b-RcPOk","focused":"b-N5dtL","variant-blue":"b-eF9qy","variant-red":"b-45lcS","variant-green":"b-pjx7F","variant-cobalt":"b-eMoOR","ListItemContent":"b-GJz9e","ListItemRightContent":"b-qnwpN","ListItemTitle":"b-3Wym5","ListItemDescription":"b-BuVX1","ListItemLeftContent":"b-cqOmY"};
+var styles = {"ListItemLeftIcon":"b-VVQ4r","ListItem":"b--YGnT","variant-monochrome":"b-rFKfG","size-xs":"b-Aklfx","size-s":"b-bUl-D","size-m":"b-nVB-T","size-l":"b-8OVWw","clickable":"b-u3ZAD","disabled":"b-eQ9bA","active":"b-RcPOk","focused":"b-N5dtL","variant-blue":"b-eF9qy","variant-red":"b-45lcS","variant-green":"b-pjx7F","variant-cobalt":"b-eMoOR","ListItemContent":"b-GJz9e","ListItemRightContent":"b-qnwpN","ListItemTitle":"b-3Wym5","ListItemDescription":"b-BuVX1","ListItemLeftContent":"b-cqOmY"};
 
 exports.default = styles;
 //# sourceMappingURL=ListItem.module.scss.js.map

package/dist/cjs/components/OutlineItem/OutlineItem.js

@@ -21,10 +21,12 @@ const OutlineItem = /*#__PURE__*/React.forwardRef(function OutlineItem({
   disableChevron = false,
   active = false,
   focused = false,
+  clickable: clickableProp = false,
   leftContent,
   content,
   rightContent,
   href,
+  onClick,
   ...rest
 }, forwardedRef) {
   const context = useOutlineItemContext();
@@ -32,6 +34,7 @@ const OutlineItem = /*#__PURE__*/React.forwardRef(function OutlineItem({
   const indent = isRoot ? 0 : context.indent + DEFAULT_INDENT;
   const isLink = !type.isEmpty(href);
   const Comp = isLink ? 'a' : as !== null && as !== void 0 ? as : 'div';
+  const clickable = isLink || clickableProp || !type.isNil(onClick);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Comp, Object.assign({}, isLink && {
     href,
     target: '_blank',
@@ -41,9 +44,10 @@ const OutlineItem = /*#__PURE__*/React.forwardRef(function OutlineItem({
       ...style,
       '--b-outline-item-indent': `${indent}px`
     },
-    className: index.default(OutlineItem_module.default.OutlineItem, active && OutlineItem_module.default.active, focused && OutlineItem_module.default.focused, className),
+    className: index.default(OutlineItem_module.default.OutlineItem, active && OutlineItem_module.default.active, focused && OutlineItem_module.default.focused, clickable && OutlineItem_module.default.clickable, className),
     ref: forwardedRef,
-    "data-testid": OUTLINE_ITEM_TEST_ID
+    "data-testid": OUTLINE_ITEM_TEST_ID,
+    onClick: onClick
   }, rest), !disableChevron && /*#__PURE__*/React.createElement("div", {
     className: OutlineItem_module.default.Chevron
   }, !type.isNil(children) && /*#__PURE__*/React.createElement(Icon.Icon, {

package/dist/cjs/components/OutlineItem/OutlineItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"OutlineItem.js","sources":["../../../../src/components/OutlineItem/OutlineItem.tsx"],"sourcesContent":["'use client'\n\nimport React, { forwardRef, useMemo } from 'react'\n\nimport {\n  ChevronSmallDownIcon,\n  ChevronSmallRightIcon,\n  isBezierIcon,\n} from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { createContext } from '~/src/utils/react'\nimport { isEmpty, isNil } from '~/src/utils/type'\n\nimport { Icon } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport {\n  type OutlineItemContextProps,\n  type OutlineItemProps,\n} from './OutlineItem.types'\n\nimport styles from './OutlineItem.module.scss'\n\nconst [OutlineItemContextProvider, useOutlineItemContext] = createContext<\n  OutlineItemContextProps | undefined\n>(undefined)\n\nconst DEFAULT_INDENT = 16\n\nexport const OUTLINE_ITEM_TEST_ID = 'bezier-outline-item'\n\nexport const OutlineItem = forwardRef<\n  HTMLDivElement & HTMLAnchorElement,\n  OutlineItemProps\n>(function OutlineItem(\n  {\n    children,\n    style,\n    className,\n    as,\n    open = false,\n    disableChevron = false,\n    active = false,\n    focused = false,\n    leftContent,\n    content,\n    rightContent,\n    href,\n    ...rest\n  },\n  forwardedRef\n) {\n  const context = useOutlineItemContext()\n  const isRoot = isNil(context)\n  const indent = isRoot ? 0 : context.indent + DEFAULT_INDENT\n\n  const isLink = !isEmpty(href)\n  const Comp = isLink ? 'a' : ((as ?? 'div') as 'div')\n\n  return (\n    <>\n      <Comp\n        {...(isLink && {\n          href,\n          target: '_blank',\n          rel: 'noopener noreferrer',\n        })}\n        style={\n          {\n            ...style,\n            '--b-outline-item-indent': `${indent}px`,\n          } as React.CSSProperties\n        }\n        className={classNames(\n          styles.OutlineItem,\n          active && styles.active,\n          focused && styles.focused,\n          className\n        )}\n        ref={forwardedRef}\n        data-testid={OUTLINE_ITEM_TEST_ID}\n        {...rest}\n      >\n        {!disableChevron && (\n          <div className={styles.Chevron}>\n            {!isNil(children) && (\n              <Icon\n                className={styles.Icon}\n                source={open ? ChevronSmallDownIcon : ChevronSmallRightIcon}\n                size=\"s\"\n                color=\"txt-black-dark\"\n              />\n            )}\n          </div>\n        )}\n\n        {leftContent && (\n          <div className={styles.LeftContent}>\n            {isBezierIcon(leftContent) ? (\n              <Icon\n                className={styles.Icon}\n                size=\"s\"\n                source={leftContent}\n                color=\"txt-black-dark\"\n              />\n            ) : (\n              leftContent\n            )}\n          </div>\n        )}\n\n        <Text\n          className={styles.Content}\n          typo=\"14\"\n          truncated\n        >\n          {content}\n        </Text>\n\n        {rightContent}\n      </Comp>\n\n      <OutlineItemContextProvider value={useMemo(() => ({ indent }), [indent])}>\n        {open && children}\n      </OutlineItemContextProvider>\n    </>\n  )\n})\n"],"names":["OutlineItemContextProvider","useOutlineItemContext","createContext","undefined","DEFAULT_INDENT","OUTLINE_ITEM_TEST_ID","OutlineItem","forwardRef","children","style","className","as","open","disableChevron","active","focused","leftContent","content","rightContent","href","rest","forwardedRef","context","isRoot","isNil","indent","isLink","isEmpty","Comp","React","createElement","Fragment","Object","assign","target","rel","classNames","styles","ref","Chevron","Icon","source","ChevronSmallDownIcon","ChevronSmallRightIcon","size","color","LeftContent","isBezierIcon","Text","Content","typo","truncated","value","useMemo"],"mappings":"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"}
+{"version":3,"file":"OutlineItem.js","sources":["../../../../src/components/OutlineItem/OutlineItem.tsx"],"sourcesContent":["'use client'\n\nimport React, { forwardRef, useMemo } from 'react'\n\nimport {\n  ChevronSmallDownIcon,\n  ChevronSmallRightIcon,\n  isBezierIcon,\n} from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { createContext } from '~/src/utils/react'\nimport { isEmpty, isNil } from '~/src/utils/type'\n\nimport { Icon } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport {\n  type OutlineItemContextProps,\n  type OutlineItemProps,\n} from './OutlineItem.types'\n\nimport styles from './OutlineItem.module.scss'\n\nconst [OutlineItemContextProvider, useOutlineItemContext] = createContext<\n  OutlineItemContextProps | undefined\n>(undefined)\n\nconst DEFAULT_INDENT = 16\n\nexport const OUTLINE_ITEM_TEST_ID = 'bezier-outline-item'\n\nexport const OutlineItem = forwardRef<\n  HTMLDivElement & HTMLAnchorElement,\n  OutlineItemProps\n>(function OutlineItem(\n  {\n    children,\n    style,\n    className,\n    as,\n    open = false,\n    disableChevron = false,\n    active = false,\n    focused = false,\n    clickable: clickableProp = false,\n    leftContent,\n    content,\n    rightContent,\n    href,\n    onClick,\n    ...rest\n  },\n  forwardedRef\n) {\n  const context = useOutlineItemContext()\n  const isRoot = isNil(context)\n  const indent = isRoot ? 0 : context.indent + DEFAULT_INDENT\n\n  const isLink = !isEmpty(href)\n  const Comp = isLink ? 'a' : ((as ?? 'div') as 'div')\n  const clickable = isLink || clickableProp || !isNil(onClick)\n\n  return (\n    <>\n      <Comp\n        {...(isLink && {\n          href,\n          target: '_blank',\n          rel: 'noopener noreferrer',\n        })}\n        style={\n          {\n            ...style,\n            '--b-outline-item-indent': `${indent}px`,\n          } as React.CSSProperties\n        }\n        className={classNames(\n          styles.OutlineItem,\n          active && styles.active,\n          focused && styles.focused,\n          clickable && styles.clickable,\n          className\n        )}\n        ref={forwardedRef}\n        data-testid={OUTLINE_ITEM_TEST_ID}\n        onClick={onClick}\n        {...rest}\n      >\n        {!disableChevron && (\n          <div className={styles.Chevron}>\n            {!isNil(children) && (\n              <Icon\n                className={styles.Icon}\n                source={open ? ChevronSmallDownIcon : ChevronSmallRightIcon}\n                size=\"s\"\n                color=\"txt-black-dark\"\n              />\n            )}\n          </div>\n        )}\n\n        {leftContent && (\n          <div className={styles.LeftContent}>\n            {isBezierIcon(leftContent) ? (\n              <Icon\n                className={styles.Icon}\n                size=\"s\"\n                source={leftContent}\n                color=\"txt-black-dark\"\n              />\n            ) : (\n              leftContent\n            )}\n          </div>\n        )}\n\n        <Text\n          className={styles.Content}\n          typo=\"14\"\n          truncated\n        >\n          {content}\n        </Text>\n\n        {rightContent}\n      </Comp>\n\n      <OutlineItemContextProvider value={useMemo(() => ({ indent }), [indent])}>\n        {open && children}\n      </OutlineItemContextProvider>\n    </>\n  )\n})\n"],"names":["OutlineItemContextProvider","useOutlineItemContext","createContext","undefined","DEFAULT_INDENT","OUTLINE_ITEM_TEST_ID","OutlineItem","forwardRef","children","style","className","as","open","disableChevron","active","focused","clickable","clickableProp","leftContent","content","rightContent","href","onClick","rest","forwardedRef","context","isRoot","isNil","indent","isLink","isEmpty","Comp","React","createElement","Fragment","Object","assign","target","rel","classNames","styles","ref","Chevron","Icon","source","ChevronSmallDownIcon","ChevronSmallRightIcon","size","color","LeftContent","isBezierIcon","Text","Content","typo","truncated","value","useMemo"],"mappings":"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"}

package/dist/cjs/components/OutlineItem/OutlineItem.module.scss.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"OutlineItem":"b-7mfMF","active":"b-iHGhq","Icon":"b-Q9M64","focused":"b-AwnNB","Chevron":"b-EPVDz","LeftContent":"b-nM-L1","Content":"b-5NJ15"};
+var styles = {"OutlineItem":"b-7mfMF","clickable":"b-4Bduz","active":"b-iHGhq","Icon":"b-Q9M64","focused":"b-AwnNB","Chevron":"b-EPVDz","LeftContent":"b-nM-L1","Content":"b-5NJ15"};
 
 exports.default = styles;
 //# sourceMappingURL=OutlineItem.module.scss.js.map