@os-design/core 1.0.230 → 1.0.231

package/dist/cjs/ButtonLink/index.js

@@ -12,6 +12,7 @@ var _react2 = _interopRequireWildcard(require("react"));
 var _Button = require("../Button");
 var _ButtonContent = _interopRequireDefault(require("../Button/ButtonContent"));
 var _useButtonColors2 = _interopRequireDefault(require("../Button/utils/useButtonColors"));
+var _Link = require("../Link");
 var _excluded = ["type", "danger", "left", "right", "wide", "loading", "disabled", "size", "as", "onMouseDown", "onKeyDown", "children"];
 var _templateObject, _templateObject2;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -57,7 +58,7 @@ var ButtonLink = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
     }),
     buttonColors = _useButtonColors.buttonColors,
     loadingColors = _useButtonColors.loadingColors;
-  return /*#__PURE__*/_react2["default"].createElement(StyledButtonLink, _extends({
+  var link = /*#__PURE__*/_react2["default"].createElement(StyledButtonLink, _extends({
     btnType: type,
     colors: buttonColors,
     wide: wide,
@@ -83,6 +84,10 @@ var ButtonLink = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
     loading: loading,
     loadingColors: loadingColors
   }, children));
+  if (disabled || loading) {
+    return /*#__PURE__*/_react2["default"].createElement(_Link.DisabledWrapper, null, link);
+  }
+  return link;
 });
 ButtonLink.displayName = 'ButtonLink';
 var _default = exports["default"] = ButtonLink;

package/dist/cjs/ButtonLink/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_utils","_react2","_interopRequireWildcard","_Button","_ButtonContent","_useButtonColors2","_excluded","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","disabledStyles","p","disabled","css","StyledButtonLink","styled","StyledButton","withComponent","omitEmotionProps","ButtonLink","forwardRef","_ref","ref","_ref$type","type","_ref$danger","danger","left","right","_ref$wide","wide","_ref$loading","loading","_ref$disabled","size","as","_ref$onMouseDown","onMouseDown","_ref$onKeyDown","onKeyDown","children","rest","_useButtonColors","useButtonColors","buttonColors","loadingColors","createElement","btnType","colors","preventDefault","displayName","_default","exports"],"sources":["../../../src/ButtonLink/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport { ButtonProps, StyledButton } from '../Button';\nimport ButtonContent from '../Button/ButtonContent';\nimport useButtonColors from '../Button/utils/useButtonColors';\nimport { LinkProps, ReactRouterLinkProps } from '../Link';\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'type' | 'ref'>;\nexport type ButtonLinkProps = JsxAProps &\n  ReactRouterLinkProps &\n  Pick<LinkProps, 'as'> &\n  ButtonProps;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    pointer-events: none;\n  `;\n\nconst StyledButtonLink = styled(\n  StyledButton.withComponent('a'),\n  omitEmotionProps('as', 'disabled')\n)`\n  text-decoration: none;\n  display: inline-flex;\n  ${disabledStyles};\n`;\n\n/**\n * The button that is rendered as a link.\n */\nconst ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(\n  (\n    {\n      type = 'primary',\n      danger = false,\n      left,\n      right,\n      wide = 'default',\n      loading = false,\n      disabled = false,\n      size,\n      as,\n      onMouseDown = () => {},\n      onKeyDown = () => {},\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const { buttonColors, loadingColors } = useButtonColors({\n      type,\n      danger,\n      disabled,\n    });\n\n    return (\n      <StyledButtonLink\n        btnType={type}\n        colors={buttonColors}\n        wide={wide}\n        loading={loading}\n        disabled={disabled || loading}\n        size={size}\n        as={as}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        onKeyDown={(e) => {\n          onKeyDown(e);\n          if (disabled || loading) e.preventDefault();\n        }}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        {...rest}\n        ref={ref}\n      >\n        <ButtonContent\n          left={left}\n          right={right}\n          loading={loading}\n          loadingColors={loadingColors}\n        >\n          {children}\n        </ButtonContent>\n      </StyledButtonLink>\n    );\n  }\n);\n\nButtonLink.displayName = 'ButtonLink';\n\nexport default ButtonLink;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_utils","_react2","_interopRequireWildcard","_Button","_ButtonContent","_useButtonColors2","_Link","_excluded","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","disabledStyles","p","disabled","css","StyledButtonLink","styled","StyledButton","withComponent","omitEmotionProps","ButtonLink","forwardRef","_ref","ref","_ref$type","type","_ref$danger","danger","left","right","_ref$wide","wide","_ref$loading","loading","_ref$disabled","size","as","_ref$onMouseDown","onMouseDown","_ref$onKeyDown","onKeyDown","children","rest","_useButtonColors","useButtonColors","buttonColors","loadingColors","link","createElement","btnType","colors","preventDefault","DisabledWrapper","displayName","_default","exports"],"sources":["../../../src/ButtonLink/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport { ButtonProps, StyledButton } from '../Button';\nimport ButtonContent from '../Button/ButtonContent';\nimport useButtonColors from '../Button/utils/useButtonColors';\nimport { DisabledWrapper, LinkProps, ReactRouterLinkProps } from '../Link';\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'type' | 'ref'>;\nexport type ButtonLinkProps = JsxAProps &\n  ReactRouterLinkProps &\n  Pick<LinkProps, 'as'> &\n  ButtonProps;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    pointer-events: none;\n  `;\n\nconst StyledButtonLink = styled(\n  StyledButton.withComponent('a'),\n  omitEmotionProps('as', 'disabled')\n)`\n  text-decoration: none;\n  display: inline-flex;\n  ${disabledStyles};\n`;\n\n/**\n * The button that is rendered as a link.\n */\nconst ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(\n  (\n    {\n      type = 'primary',\n      danger = false,\n      left,\n      right,\n      wide = 'default',\n      loading = false,\n      disabled = false,\n      size,\n      as,\n      onMouseDown = () => {},\n      onKeyDown = () => {},\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const { buttonColors, loadingColors } = useButtonColors({\n      type,\n      danger,\n      disabled,\n    });\n\n    const link = (\n      <StyledButtonLink\n        btnType={type}\n        colors={buttonColors}\n        wide={wide}\n        loading={loading}\n        disabled={disabled || loading}\n        size={size}\n        as={as}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        onKeyDown={(e) => {\n          onKeyDown(e);\n          if (disabled || loading) e.preventDefault();\n        }}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        {...rest}\n        ref={ref}\n      >\n        <ButtonContent\n          left={left}\n          right={right}\n          loading={loading}\n          loadingColors={loadingColors}\n        >\n          {children}\n        </ButtonContent>\n      </StyledButtonLink>\n    );\n\n    if (disabled || loading) {\n      return <DisabledWrapper>{link}</DisabledWrapper>;\n    }\n\n    return link;\n  }\n);\n\nButtonLink.displayName = 'ButtonLink';\n\nexport default ButtonLink;\n"],"mappings":"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"}

package/dist/cjs/Link/index.js

@@ -4,15 +4,15 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.underlineHoverStyles = exports.underlineAlwaysStyles = exports["default"] = void 0;
+exports.underlineHoverStyles = exports.underlineAlwaysStyles = exports["default"] = exports.DisabledWrapper = void 0;
 var _react = require("@emotion/react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _styles = require("@os-design/styles");
 var _theming = require("@os-design/theming");
 var _utils = require("@os-design/utils");
 var _react2 = _interopRequireWildcard(require("react"));
-var _excluded = ["underline", "as", "onMouseDown"];
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _excluded = ["underline", "disabled", "as", "onMouseDown"];
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -29,9 +29,13 @@ var underlineHoverStyles = exports.underlineHoverStyles = function underlineHove
 var underlineAlwaysStyles = exports.underlineAlwaysStyles = function underlineAlwaysStyles(p) {
   return p.underline === 'always' && (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    ", ";\n\n    &::after {\n      width: 100%;\n      opacity: 1;\n    }\n  "])), underlineBaseStyles(p));
 };
-var StyledLink = (0, _styled["default"])('a', (0, _utils.omitEmotionProps)('size', 'underline', 'as'))(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  ", ";\n\n  cursor: pointer;\n  text-decoration: none;\n  line-height: 1.2;\n\n  &,\n  &:active,\n  &:focus {\n    color: ", ";\n  }\n\n  ", ";\n  ", ";\n  ", ";\n"])), _styles.resetFocusStyles, function (p) {
+var disabledStyles = function disabledStyles(p) {
+  return p.disabled && (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    pointer-events: none;\n\n    &,\n    &:active,\n    &:focus {\n      color: ", ";\n    }\n  "])), (0, _theming.clr)(p.theme.inputColorPlaceholder));
+};
+var DisabledWrapper = exports.DisabledWrapper = _styled["default"].div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: inline-block;\n  cursor: not-allowed;\n"])));
+var StyledLink = (0, _styled["default"])('a', (0, _utils.omitEmotionProps)('size', 'underline', 'disabled', 'as'))(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  ", ";\n\n  cursor: pointer;\n  text-decoration: none;\n  line-height: 1.2;\n\n  &,\n  &:active,\n  &:focus {\n    color: ", ";\n  }\n\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n"])), _styles.resetFocusStyles, function (p) {
   return (0, _theming.clr)(p.theme.linkColor);
-}, underlineHoverStyles, underlineAlwaysStyles, _styles.sizeStyles);
+}, underlineHoverStyles, underlineAlwaysStyles, disabledStyles, _styles.sizeStyles);
 
 /**
  * The link component to navigate between pages.
@@ -39,10 +43,19 @@ var StyledLink = (0, _styled["default"])('a', (0, _utils.omitEmotionProps)('size
 var Link = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
   var _ref$underline = _ref.underline,
     underline = _ref$underline === void 0 ? 'hover' : _ref$underline,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     as = _ref.as,
     _ref$onMouseDown = _ref.onMouseDown,
     _onMouseDown = _ref$onMouseDown === void 0 ? function () {} : _ref$onMouseDown,
     rest = _objectWithoutProperties(_ref, _excluded);
+  if (disabled) {
+    return /*#__PURE__*/_react2["default"].createElement(DisabledWrapper, null, /*#__PURE__*/_react2["default"].createElement(StyledLink, _extends({
+      disabled: true
+    }, rest, {
+      ref: ref
+    })));
+  }
   return /*#__PURE__*/_react2["default"].createElement(StyledLink, _extends({
     underline: underline,
     as: as,

package/dist/cjs/Link/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_styles","_theming","_utils","_react2","_interopRequireWildcard","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","underlineBaseStyles","p","css","clr","theme","linkColor","underlineHoverStyles","exports","underline","transitionStyles","underlineAlwaysStyles","StyledLink","styled","omitEmotionProps","resetFocusStyles","sizeStyles","Link","forwardRef","_ref","ref","_ref$underline","as","_ref$onMouseDown","onMouseDown","rest","createElement","preventDefault","displayName","_default"],"sources":["../../../src/Link/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n  resetFocusStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nexport interface ReactRouterLinkProps {\n  to?: string;\n  replace?: boolean;\n}\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;\nexport interface LinkProps extends JsxAProps, ReactRouterLinkProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n  /**\n   * The custom link component.\n   * For example, the Link from react-router-dom.\n   * @default undefined\n   */\n  as?: React.ElementType;\n}\n\nconst underlineBaseStyles = (p) => css`\n  position: relative;\n  display: inline-block;\n  padding-bottom: 0.1em;\n\n  &::after {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    content: '';\n    height: 0.125em;\n    background-color: ${clr(p.theme.linkColor)};\n  }\n`;\n\nexport const underlineHoverStyles = (p) =>\n  p.underline === 'hover' &&\n  css`\n    @media (hover: hover) {\n      ${underlineBaseStyles(p)};\n\n      &::after {\n        width: 0;\n        opacity: 0;\n        ${transitionStyles('width', 'opacity')(p)};\n      }\n\n      &:hover::after,\n      &:focus::after {\n        width: 100%;\n        opacity: 1;\n      }\n    }\n  `;\n\nexport const underlineAlwaysStyles = (p) =>\n  p.underline === 'always' &&\n  css`\n    ${underlineBaseStyles(p)};\n\n    &::after {\n      width: 100%;\n      opacity: 1;\n    }\n  `;\n\nconst StyledLink = styled(\n  'a',\n  omitEmotionProps('size', 'underline', 'as')\n)<LinkProps>`\n  ${resetFocusStyles};\n\n  cursor: pointer;\n  text-decoration: none;\n  line-height: 1.2;\n\n  &,\n  &:active,\n  &:focus {\n    color: ${(p) => clr(p.theme.linkColor)};\n  }\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component to navigate between pages.\n */\nconst Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ underline = 'hover', as, onMouseDown = () => {}, ...rest }, ref) => (\n    <StyledLink\n      underline={underline}\n      as={as}\n      onMouseDown={(e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      }}\n      {...rest}\n      ref={ref}\n    />\n  )\n);\n\nLink.displayName = 'Link';\n\nexport default Link;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_styles","_theming","_utils","_react2","_interopRequireWildcard","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","underlineBaseStyles","p","css","clr","theme","linkColor","underlineHoverStyles","exports","underline","transitionStyles","underlineAlwaysStyles","disabledStyles","disabled","inputColorPlaceholder","DisabledWrapper","styled","div","StyledLink","omitEmotionProps","resetFocusStyles","sizeStyles","Link","forwardRef","_ref","ref","_ref$underline","_ref$disabled","as","_ref$onMouseDown","onMouseDown","rest","createElement","preventDefault","displayName","_default"],"sources":["../../../src/Link/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n  resetFocusStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nexport interface ReactRouterLinkProps {\n  to?: string;\n  replace?: boolean;\n}\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;\nexport interface LinkProps extends JsxAProps, ReactRouterLinkProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n  /**\n   * Whether the link is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * The custom link component.\n   * For example, the Link from react-router-dom.\n   * @default undefined\n   */\n  as?: React.ElementType;\n}\n\nconst underlineBaseStyles = (p) => css`\n  position: relative;\n  display: inline-block;\n  padding-bottom: 0.1em;\n\n  &::after {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    content: '';\n    height: 0.125em;\n    background-color: ${clr(p.theme.linkColor)};\n  }\n`;\n\nexport const underlineHoverStyles = (p) =>\n  p.underline === 'hover' &&\n  css`\n    @media (hover: hover) {\n      ${underlineBaseStyles(p)};\n\n      &::after {\n        width: 0;\n        opacity: 0;\n        ${transitionStyles('width', 'opacity')(p)};\n      }\n\n      &:hover::after,\n      &:focus::after {\n        width: 100%;\n        opacity: 1;\n      }\n    }\n  `;\n\nexport const underlineAlwaysStyles = (p) =>\n  p.underline === 'always' &&\n  css`\n    ${underlineBaseStyles(p)};\n\n    &::after {\n      width: 100%;\n      opacity: 1;\n    }\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    pointer-events: none;\n\n    &,\n    &:active,\n    &:focus {\n      color: ${clr(p.theme.inputColorPlaceholder)};\n    }\n  `;\n\nexport const DisabledWrapper = styled.div`\n  display: inline-block;\n  cursor: not-allowed;\n`;\n\nconst StyledLink = styled(\n  'a',\n  omitEmotionProps('size', 'underline', 'disabled', 'as')\n)<LinkProps>`\n  ${resetFocusStyles};\n\n  cursor: pointer;\n  text-decoration: none;\n  line-height: 1.2;\n\n  &,\n  &:active,\n  &:focus {\n    color: ${(p) => clr(p.theme.linkColor)};\n  }\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${disabledStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component to navigate between pages.\n */\nconst Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      underline = 'hover',\n      disabled = false,\n      as,\n      onMouseDown = () => {},\n      ...rest\n    },\n    ref\n  ) => {\n    if (disabled) {\n      return (\n        <DisabledWrapper>\n          <StyledLink disabled {...rest} ref={ref} />\n        </DisabledWrapper>\n      );\n    }\n\n    return (\n      <StyledLink\n        underline={underline}\n        as={as}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        {...rest}\n        ref={ref}\n      />\n    );\n  }\n);\n\nLink.displayName = 'Link';\n\nexport default Link;\n"],"mappings":"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"}

package/dist/cjs/LinkButton/index.js

@@ -5,14 +5,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _react = require("@emotion/react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _styles = require("@os-design/styles");
 var _theming = require("@os-design/theming");
 var _utils = require("@os-design/utils");
-var _react = _interopRequireWildcard(require("react"));
+var _react2 = _interopRequireWildcard(require("react"));
 var _Link = require("../Link");
-var _excluded = ["underline", "onMouseDown"];
-var _templateObject;
+var _excluded = ["underline", "disabled", "onMouseDown"];
+var _templateObject, _templateObject2;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -20,20 +21,32 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-var StyledButton = (0, _styled["default"])('button', (0, _utils.omitEmotionProps)('size', 'underline'))(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", ";\n\n  cursor: pointer;\n  text-align: left;\n  line-height: 1.2;\n  color: ", ";\n\n  ", ";\n  ", ";\n  ", ";\n"])), _styles.resetButtonStyles, function (p) {
+var disabledStyles = function disabledStyles(p) {
+  return p.disabled && (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    cursor: inherit;\n    color: ", ";\n  "])), (0, _theming.clr)(p.theme.inputColorPlaceholder));
+};
+var StyledButton = (0, _styled["default"])('button', (0, _utils.omitEmotionProps)('size', 'underline'))(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", ";\n\n  cursor: pointer;\n  text-align: left;\n  line-height: 1.2;\n  color: ", ";\n\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n"])), _styles.resetButtonStyles, function (p) {
   return (0, _theming.clr)(p.theme.linkColor);
-}, _Link.underlineHoverStyles, _Link.underlineAlwaysStyles, _styles.sizeStyles);
+}, _Link.underlineHoverStyles, _Link.underlineAlwaysStyles, disabledStyles, _styles.sizeStyles);
 
 /**
  * The link component that is rendered as a button.
  */
-var LinkButton = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+var LinkButton = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
   var _ref$underline = _ref.underline,
     underline = _ref$underline === void 0 ? 'hover' : _ref$underline,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     _ref$onMouseDown = _ref.onMouseDown,
     _onMouseDown = _ref$onMouseDown === void 0 ? function () {} : _ref$onMouseDown,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_react["default"].createElement(StyledButton, _extends({
+  if (disabled) {
+    return /*#__PURE__*/_react2["default"].createElement(_Link.DisabledWrapper, null, /*#__PURE__*/_react2["default"].createElement(StyledButton, _extends({
+      disabled: true
+    }, rest, {
+      ref: ref
+    })));
+  }
+  return /*#__PURE__*/_react2["default"].createElement(StyledButton, _extends({
     underline: underline,
     onMouseDown: function onMouseDown(e) {
       _onMouseDown(e);

package/dist/cjs/LinkButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_styled","_interopRequireDefault","require","_styles","_theming","_utils","_react","_interopRequireWildcard","_Link","_excluded","_templateObject","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","StyledButton","styled","omitEmotionProps","resetButtonStyles","p","clr","theme","linkColor","underlineHoverStyles","underlineAlwaysStyles","sizeStyles","LinkButton","forwardRef","_ref","ref","_ref$underline","underline","_ref$onMouseDown","onMouseDown","rest","createElement","preventDefault","displayName","_default","exports"],"sources":["../../../src/LinkButton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { resetButtonStyles, sizeStyles, WithSize } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport { underlineAlwaysStyles, underlineHoverStyles } from '../Link';\n\ntype JsxButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref'>;\n\nexport interface LinkButtonProps extends JsxButtonProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n}\n\nconst StyledButton = styled(\n  'button',\n  omitEmotionProps('size', 'underline')\n)<LinkButtonProps>`\n  ${resetButtonStyles};\n\n  cursor: pointer;\n  text-align: left;\n  line-height: 1.2;\n  color: ${(p) => clr(p.theme.linkColor)};\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component that is rendered as a button.\n */\nconst LinkButton = forwardRef<HTMLButtonElement, LinkButtonProps>(\n  ({ underline = 'hover', onMouseDown = () => {}, ...rest }, ref) => (\n    <StyledButton\n      underline={underline}\n      onMouseDown={(e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      }}\n      {...rest}\n      ref={ref}\n    />\n  )\n);\n\nLinkButton.displayName = 'LinkButton';\n\nexport default LinkButton;\n"],"mappings":";;;;;;;AAAA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAC,uBAAA,CAAAL,OAAA;AACA,IAAAM,KAAA,GAAAN,OAAA;AAAsE,IAAAO,SAAA;AAAA,IAAAC,eAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAL,wBAAAK,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,gBAAAK,OAAA,CAAAL,CAAA,0BAAAA,CAAA,sBAAAA,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,cAAAR,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAAA,SAAAnB,uBAAA+B,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAhB,UAAA,GAAAgB,GAAA,gBAAAA,GAAA;AAAA,SAAAC,SAAA,IAAAA,QAAA,GAAAV,MAAA,CAAAW,MAAA,GAAAX,MAAA,CAAAW,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAN,CAAA,MAAAA,CAAA,GAAAO,SAAA,CAAAC,MAAA,EAAAR,CAAA,UAAAS,MAAA,GAAAF,SAAA,CAAAP,CAAA,YAAAU,GAAA,IAAAD,MAAA,QAAAhB,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAU,MAAA,EAAAC,GAAA,KAAAJ,MAAA,CAAAI,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAJ,MAAA,YAAAH,QAAA,CAAAQ,KAAA,OAAAJ,SAAA;AAAA,SAAAK,yBAAAH,MAAA,EAAAI,QAAA,QAAAJ,MAAA,yBAAAH,MAAA,GAAAQ,6BAAA,CAAAL,MAAA,EAAAI,QAAA,OAAAH,GAAA,EAAAV,CAAA,MAAAP,MAAA,CAAAsB,qBAAA,QAAAC,gBAAA,GAAAvB,MAAA,CAAAsB,qBAAA,CAAAN,MAAA,QAAAT,CAAA,MAAAA,CAAA,GAAAgB,gBAAA,CAAAR,MAAA,EAAAR,CAAA,MAAAU,GAAA,GAAAM,gBAAA,CAAAhB,CAAA,OAAAa,QAAA,CAAAI,OAAA,CAAAP,GAAA,uBAAAjB,MAAA,CAAAI,SAAA,CAAAqB,oBAAA,CAAAnB,IAAA,CAAAU,MAAA,EAAAC,GAAA,aAAAJ,MAAA,CAAAI,GAAA,IAAAD,MAAA,CAAAC,GAAA,cAAAJ,MAAA;AAAA,SAAAQ,8BAAAL,MAAA,EAAAI,QAAA,QAAAJ,MAAA,yBAAAH,MAAA,WAAAa,UAAA,GAAA1B,MAAA,CAAA2B,IAAA,CAAAX,MAAA,OAAAC,GAAA,EAAAV,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAmB,UAAA,CAAAX,MAAA,EAAAR,CAAA,MAAAU,GAAA,GAAAS,UAAA,CAAAnB,CAAA,OAAAa,QAAA,CAAAI,OAAA,CAAAP,GAAA,kBAAAJ,MAAA,CAAAI,GAAA,IAAAD,MAAA,CAAAC,GAAA,YAAAJ,MAAA;AAAA,SAAAe,uBAAAC,OAAA,EAAAC,GAAA,SAAAA,GAAA,IAAAA,GAAA,GAAAD,OAAA,CAAAE,KAAA,cAAA/B,MAAA,CAAAgC,MAAA,CAAAhC,MAAA,CAAAiC,gBAAA,CAAAJ,OAAA,IAAAC,GAAA,IAAAI,KAAA,EAAAlC,MAAA,CAAAgC,MAAA,CAAAF,GAAA;AAYtE,IAAMK,YAAY,GAAG,IAAAC,kBAAM,EACzB,QAAQ,EACR,IAAAC,uBAAgB,EAAC,MAAM,EAAE,WAAW,CACtC,CAAC,CAAAlD,eAAA,KAAAA,eAAA,GAAAyC,sBAAA,iIACGU,yBAAiB,EAKV,UAACC,CAAC;EAAA,OAAK,IAAAC,YAAG,EAACD,CAAC,CAACE,KAAK,CAACC,SAAS,CAAC;AAAA,GAEpCC,0BAAoB,EACpBC,2BAAqB,EACrBC,kBAAU,CACb;;AAED;AACA;AACA;AACA,IAAMC,UAAU,gBAAG,IAAAC,iBAAU,EAC3B,UAAAC,IAAA,EAA2DC,GAAG;EAAA,IAAAC,cAAA,GAAAF,IAAA,CAA3DG,SAAS;IAATA,SAAS,GAAAD,cAAA,cAAG,OAAO,GAAAA,cAAA;IAAAE,gBAAA,GAAAJ,IAAA,CAAEK,WAAW;IAAXA,YAAW,GAAAD,gBAAA,cAAG,YAAM,CAAC,CAAC,GAAAA,gBAAA;IAAKE,IAAI,GAAAnC,wBAAA,CAAA6B,IAAA,EAAA9D,SAAA;EAAA,oBACrDH,MAAA,YAAAwE,aAAA,CAACpB,YAAY,EAAAzB,QAAA;IACXyC,SAAS,EAAEA,SAAU;IACrBE,WAAW,EAAE,SAAAA,YAAChE,CAAC,EAAK;MAClBgE,YAAW,CAAChE,CAAC,CAAC;MACdA,CAAC,CAACmE,cAAc,CAAC,CAAC;IACpB;EAAE,GACEF,IAAI;IACRL,GAAG,EAAEA;EAAI,EACV,CAAC;AAAA,CAEN,CAAC;AAEDH,UAAU,CAACW,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,cAEvBb,UAAU"}
+{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_styles","_theming","_utils","_react2","_interopRequireWildcard","_Link","_excluded","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","disabledStyles","p","disabled","css","clr","theme","inputColorPlaceholder","StyledButton","styled","omitEmotionProps","resetButtonStyles","linkColor","underlineHoverStyles","underlineAlwaysStyles","sizeStyles","LinkButton","forwardRef","_ref","ref","_ref$underline","underline","_ref$disabled","_ref$onMouseDown","onMouseDown","rest","createElement","DisabledWrapper","preventDefault","displayName","_default","exports"],"sources":["../../../src/LinkButton/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { resetButtonStyles, sizeStyles, WithSize } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport {\n  DisabledWrapper,\n  underlineAlwaysStyles,\n  underlineHoverStyles,\n} from '../Link';\n\ntype JsxButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref'>;\n\nexport interface LinkButtonProps extends JsxButtonProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n  /**\n   * Whether the link is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n}\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    cursor: inherit;\n    color: ${clr(p.theme.inputColorPlaceholder)};\n  `;\n\nconst StyledButton = styled(\n  'button',\n  omitEmotionProps('size', 'underline')\n)<LinkButtonProps>`\n  ${resetButtonStyles};\n\n  cursor: pointer;\n  text-align: left;\n  line-height: 1.2;\n  color: ${(p) => clr(p.theme.linkColor)};\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${disabledStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component that is rendered as a button.\n */\nconst LinkButton = forwardRef<HTMLButtonElement, LinkButtonProps>(\n  (\n    { underline = 'hover', disabled = false, onMouseDown = () => {}, ...rest },\n    ref\n  ) => {\n    if (disabled) {\n      return (\n        <DisabledWrapper>\n          <StyledButton disabled {...rest} ref={ref} />\n        </DisabledWrapper>\n      );\n    }\n\n    return (\n      <StyledButton\n        underline={underline}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        {...rest}\n        ref={ref}\n      />\n    );\n  }\n);\n\nLinkButton.displayName = 'LinkButton';\n\nexport default LinkButton;\n"],"mappings":"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"}

package/dist/esm/ButtonLink/index.js

@@ -6,6 +6,7 @@ import React, { forwardRef } from 'react';
 import { StyledButton } from '../Button';
 import ButtonContent from '../Button/ButtonContent';
 import useButtonColors from '../Button/utils/useButtonColors';
+import { DisabledWrapper } from '../Link';
 const disabledStyles = p => p.disabled && css`
     pointer-events: none;
   `;
@@ -41,7 +42,7 @@ const ButtonLink = /*#__PURE__*/forwardRef(({
     danger,
     disabled
   });
-  return /*#__PURE__*/React.createElement(StyledButtonLink, _extends({
+  const link = /*#__PURE__*/React.createElement(StyledButtonLink, _extends({
     btnType: type,
     colors: buttonColors,
     wide: wide,
@@ -67,6 +68,10 @@ const ButtonLink = /*#__PURE__*/forwardRef(({
     loading: loading,
     loadingColors: loadingColors
   }, children));
+  if (disabled || loading) {
+    return /*#__PURE__*/React.createElement(DisabledWrapper, null, link);
+  }
+  return link;
 });
 ButtonLink.displayName = 'ButtonLink';
 export default ButtonLink;

package/dist/esm/ButtonLink/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["css","styled","omitEmotionProps","React","forwardRef","StyledButton","ButtonContent","useButtonColors","disabledStyles","p","disabled","StyledButtonLink","withComponent","ButtonLink","type","danger","left","right","wide","loading","size","as","onMouseDown","onKeyDown","children","rest","ref","buttonColors","loadingColors","createElement","_extends","btnType","colors","e","preventDefault","displayName"],"sources":["../../../src/ButtonLink/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport { ButtonProps, StyledButton } from '../Button';\nimport ButtonContent from '../Button/ButtonContent';\nimport useButtonColors from '../Button/utils/useButtonColors';\nimport { LinkProps, ReactRouterLinkProps } from '../Link';\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'type' | 'ref'>;\nexport type ButtonLinkProps = JsxAProps &\n  ReactRouterLinkProps &\n  Pick<LinkProps, 'as'> &\n  ButtonProps;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    pointer-events: none;\n  `;\n\nconst StyledButtonLink = styled(\n  StyledButton.withComponent('a'),\n  omitEmotionProps('as', 'disabled')\n)`\n  text-decoration: none;\n  display: inline-flex;\n  ${disabledStyles};\n`;\n\n/**\n * The button that is rendered as a link.\n */\nconst ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(\n  (\n    {\n      type = 'primary',\n      danger = false,\n      left,\n      right,\n      wide = 'default',\n      loading = false,\n      disabled = false,\n      size,\n      as,\n      onMouseDown = () => {},\n      onKeyDown = () => {},\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const { buttonColors, loadingColors } = useButtonColors({\n      type,\n      danger,\n      disabled,\n    });\n\n    return (\n      <StyledButtonLink\n        btnType={type}\n        colors={buttonColors}\n        wide={wide}\n        loading={loading}\n        disabled={disabled || loading}\n        size={size}\n        as={as}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        onKeyDown={(e) => {\n          onKeyDown(e);\n          if (disabled || loading) e.preventDefault();\n        }}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        {...rest}\n        ref={ref}\n      >\n        <ButtonContent\n          left={left}\n          right={right}\n          loading={loading}\n          loadingColors={loadingColors}\n        >\n          {children}\n        </ButtonContent>\n      </StyledButtonLink>\n    );\n  }\n);\n\nButtonLink.displayName = 'ButtonLink';\n\nexport default ButtonLink;\n"],"mappings":";AAAA,SAASA,GAAG,QAAQ,gBAAgB;AACpC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAAsBC,YAAY,QAAQ,WAAW;AACrD,OAAOC,aAAa,MAAM,yBAAyB;AACnD,OAAOC,eAAe,MAAM,iCAAiC;AAS7D,MAAMC,cAAc,GAAIC,CAAC,IACvBA,CAAC,CAACC,QAAQ,IACVV,GAAI;AACN;AACA,GAAG;AAEH,MAAMW,gBAAgB,GAAGV,MAAM,CAC7BI,YAAY,CAACO,aAAa,CAAC,GAAG,CAAC,EAC/BV,gBAAgB,CAAC,IAAI,EAAE,UAAU,CACnC,CAAE;AACF;AACA;AACA,IAAIM,cAAe;AACnB,CAAC;;AAED;AACA;AACA;AACA,MAAMK,UAAU,gBAAGT,UAAU,CAC3B,CACE;EACEU,IAAI,GAAG,SAAS;EAChBC,MAAM,GAAG,KAAK;EACdC,IAAI;EACJC,KAAK;EACLC,IAAI,GAAG,SAAS;EAChBC,OAAO,GAAG,KAAK;EACfT,QAAQ,GAAG,KAAK;EAChBU,IAAI;EACJC,EAAE;EACFC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EACtBC,SAAS,GAAGA,CAAA,KAAM,CAAC,CAAC;EACpBC,QAAQ;EACR,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAM;IAAEC,YAAY;IAAEC;EAAc,CAAC,GAAGrB,eAAe,CAAC;IACtDO,IAAI;IACJC,MAAM;IACNL;EACF,CAAC,CAAC;EAEF,oBACEP,KAAA,CAAA0B,aAAA,CAAClB,gBAAgB,EAAAmB,QAAA;IACfC,OAAO,EAAEjB,IAAK;IACdkB,MAAM,EAAEL,YAAa;IACrBT,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBT,QAAQ,EAAEA,QAAQ,IAAIS,OAAQ;IAC9BC,IAAI,EAAEA,IAAK;IACXC,EAAE,EAAEA,EAAG;IACPC,WAAW,EAAGW,CAAC,IAAK;MAClBX,WAAW,CAACW,CAAC,CAAC;MACdA,CAAC,CAACC,cAAc,CAAC,CAAC;IACpB,CAAE;IACFX,SAAS,EAAGU,CAAC,IAAK;MAChBV,SAAS,CAACU,CAAC,CAAC;MACZ,IAAIvB,QAAQ,IAAIS,OAAO,EAAEc,CAAC,CAACC,cAAc,CAAC,CAAC;IAC7C,CAAE;IACF,iBAAexB,QAAQ,IAAIS,OAAQ;IACnC,aAAWA;EAAQ,GACfM,IAAI;IACRC,GAAG,EAAEA;EAAI,iBAETvB,KAAA,CAAA0B,aAAA,CAACvB,aAAa;IACZU,IAAI,EAAEA,IAAK;IACXC,KAAK,EAAEA,KAAM;IACbE,OAAO,EAAEA,OAAQ;IACjBS,aAAa,EAAEA;EAAc,GAE5BJ,QACY,CACC,CAAC;AAEvB,CACF,CAAC;AAEDX,UAAU,CAACsB,WAAW,GAAG,YAAY;AAErC,eAAetB,UAAU"}
+{"version":3,"file":"index.js","names":["css","styled","omitEmotionProps","React","forwardRef","StyledButton","ButtonContent","useButtonColors","DisabledWrapper","disabledStyles","p","disabled","StyledButtonLink","withComponent","ButtonLink","type","danger","left","right","wide","loading","size","as","onMouseDown","onKeyDown","children","rest","ref","buttonColors","loadingColors","link","createElement","_extends","btnType","colors","e","preventDefault","displayName"],"sources":["../../../src/ButtonLink/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport { ButtonProps, StyledButton } from '../Button';\nimport ButtonContent from '../Button/ButtonContent';\nimport useButtonColors from '../Button/utils/useButtonColors';\nimport { DisabledWrapper, LinkProps, ReactRouterLinkProps } from '../Link';\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'type' | 'ref'>;\nexport type ButtonLinkProps = JsxAProps &\n  ReactRouterLinkProps &\n  Pick<LinkProps, 'as'> &\n  ButtonProps;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    pointer-events: none;\n  `;\n\nconst StyledButtonLink = styled(\n  StyledButton.withComponent('a'),\n  omitEmotionProps('as', 'disabled')\n)`\n  text-decoration: none;\n  display: inline-flex;\n  ${disabledStyles};\n`;\n\n/**\n * The button that is rendered as a link.\n */\nconst ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(\n  (\n    {\n      type = 'primary',\n      danger = false,\n      left,\n      right,\n      wide = 'default',\n      loading = false,\n      disabled = false,\n      size,\n      as,\n      onMouseDown = () => {},\n      onKeyDown = () => {},\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const { buttonColors, loadingColors } = useButtonColors({\n      type,\n      danger,\n      disabled,\n    });\n\n    const link = (\n      <StyledButtonLink\n        btnType={type}\n        colors={buttonColors}\n        wide={wide}\n        loading={loading}\n        disabled={disabled || loading}\n        size={size}\n        as={as}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        onKeyDown={(e) => {\n          onKeyDown(e);\n          if (disabled || loading) e.preventDefault();\n        }}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        {...rest}\n        ref={ref}\n      >\n        <ButtonContent\n          left={left}\n          right={right}\n          loading={loading}\n          loadingColors={loadingColors}\n        >\n          {children}\n        </ButtonContent>\n      </StyledButtonLink>\n    );\n\n    if (disabled || loading) {\n      return <DisabledWrapper>{link}</DisabledWrapper>;\n    }\n\n    return link;\n  }\n);\n\nButtonLink.displayName = 'ButtonLink';\n\nexport default ButtonLink;\n"],"mappings":";AAAA,SAASA,GAAG,QAAQ,gBAAgB;AACpC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAAsBC,YAAY,QAAQ,WAAW;AACrD,OAAOC,aAAa,MAAM,yBAAyB;AACnD,OAAOC,eAAe,MAAM,iCAAiC;AAC7D,SAASC,eAAe,QAAyC,SAAS;AAQ1E,MAAMC,cAAc,GAAIC,CAAC,IACvBA,CAAC,CAACC,QAAQ,IACVX,GAAI;AACN;AACA,GAAG;AAEH,MAAMY,gBAAgB,GAAGX,MAAM,CAC7BI,YAAY,CAACQ,aAAa,CAAC,GAAG,CAAC,EAC/BX,gBAAgB,CAAC,IAAI,EAAE,UAAU,CACnC,CAAE;AACF;AACA;AACA,IAAIO,cAAe;AACnB,CAAC;;AAED;AACA;AACA;AACA,MAAMK,UAAU,gBAAGV,UAAU,CAC3B,CACE;EACEW,IAAI,GAAG,SAAS;EAChBC,MAAM,GAAG,KAAK;EACdC,IAAI;EACJC,KAAK;EACLC,IAAI,GAAG,SAAS;EAChBC,OAAO,GAAG,KAAK;EACfT,QAAQ,GAAG,KAAK;EAChBU,IAAI;EACJC,EAAE;EACFC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EACtBC,SAAS,GAAGA,CAAA,KAAM,CAAC,CAAC;EACpBC,QAAQ;EACR,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAM;IAAEC,YAAY;IAAEC;EAAc,CAAC,GAAGtB,eAAe,CAAC;IACtDQ,IAAI;IACJC,MAAM;IACNL;EACF,CAAC,CAAC;EAEF,MAAMmB,IAAI,gBACR3B,KAAA,CAAA4B,aAAA,CAACnB,gBAAgB,EAAAoB,QAAA;IACfC,OAAO,EAAElB,IAAK;IACdmB,MAAM,EAAEN,YAAa;IACrBT,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBT,QAAQ,EAAEA,QAAQ,IAAIS,OAAQ;IAC9BC,IAAI,EAAEA,IAAK;IACXC,EAAE,EAAEA,EAAG;IACPC,WAAW,EAAGY,CAAC,IAAK;MAClBZ,WAAW,CAACY,CAAC,CAAC;MACdA,CAAC,CAACC,cAAc,CAAC,CAAC;IACpB,CAAE;IACFZ,SAAS,EAAGW,CAAC,IAAK;MAChBX,SAAS,CAACW,CAAC,CAAC;MACZ,IAAIxB,QAAQ,IAAIS,OAAO,EAAEe,CAAC,CAACC,cAAc,CAAC,CAAC;IAC7C,CAAE;IACF,iBAAezB,QAAQ,IAAIS,OAAQ;IACnC,aAAWA;EAAQ,GACfM,IAAI;IACRC,GAAG,EAAEA;EAAI,iBAETxB,KAAA,CAAA4B,aAAA,CAACzB,aAAa;IACZW,IAAI,EAAEA,IAAK;IACXC,KAAK,EAAEA,KAAM;IACbE,OAAO,EAAEA,OAAQ;IACjBS,aAAa,EAAEA;EAAc,GAE5BJ,QACY,CACC,CACnB;EAED,IAAId,QAAQ,IAAIS,OAAO,EAAE;IACvB,oBAAOjB,KAAA,CAAA4B,aAAA,CAACvB,eAAe,QAAEsB,IAAsB,CAAC;EAClD;EAEA,OAAOA,IAAI;AACb,CACF,CAAC;AAEDhB,UAAU,CAACuB,WAAW,GAAG,YAAY;AAErC,eAAevB,UAAU"}

package/dist/esm/Link/index.js

@@ -44,7 +44,20 @@ export const underlineAlwaysStyles = p => p.underline === 'always' && css`
       opacity: 1;
     }
   `;
-const StyledLink = styled('a', omitEmotionProps('size', 'underline', 'as'))`
+const disabledStyles = p => p.disabled && css`
+    pointer-events: none;
+
+    &,
+    &:active,
+    &:focus {
+      color: ${clr(p.theme.inputColorPlaceholder)};
+    }
+  `;
+export const DisabledWrapper = styled.div`
+  display: inline-block;
+  cursor: not-allowed;
+`;
+const StyledLink = styled('a', omitEmotionProps('size', 'underline', 'disabled', 'as'))`
   ${resetFocusStyles};
 
   cursor: pointer;
@@ -59,6 +72,7 @@ const StyledLink = styled('a', omitEmotionProps('size', 'underline', 'as'))`
 
   ${underlineHoverStyles};
   ${underlineAlwaysStyles};
+  ${disabledStyles};
   ${sizeStyles};
 `;
 
@@ -67,19 +81,29 @@ const StyledLink = styled('a', omitEmotionProps('size', 'underline', 'as'))`
  */
 const Link = /*#__PURE__*/forwardRef(({
   underline = 'hover',
+  disabled = false,
   as,
   onMouseDown = () => {},
   ...rest
-}, ref) => /*#__PURE__*/React.createElement(StyledLink, _extends({
-  underline: underline,
-  as: as,
-  onMouseDown: e => {
-    onMouseDown(e);
-    e.preventDefault();
+}, ref) => {
+  if (disabled) {
+    return /*#__PURE__*/React.createElement(DisabledWrapper, null, /*#__PURE__*/React.createElement(StyledLink, _extends({
+      disabled: true
+    }, rest, {
+      ref: ref
+    })));
   }
-}, rest, {
-  ref: ref
-})));
+  return /*#__PURE__*/React.createElement(StyledLink, _extends({
+    underline: underline,
+    as: as,
+    onMouseDown: e => {
+      onMouseDown(e);
+      e.preventDefault();
+    }
+  }, rest, {
+    ref: ref
+  }));
+});
 Link.displayName = 'Link';
 export default Link;
 //# sourceMappingURL=index.js.map

package/dist/esm/Link/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["css","styled","resetFocusStyles","sizeStyles","transitionStyles","clr","omitEmotionProps","React","forwardRef","underlineBaseStyles","p","theme","linkColor","underlineHoverStyles","underline","underlineAlwaysStyles","StyledLink","Link","as","onMouseDown","rest","ref","createElement","_extends","e","preventDefault","displayName"],"sources":["../../../src/Link/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n  resetFocusStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nexport interface ReactRouterLinkProps {\n  to?: string;\n  replace?: boolean;\n}\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;\nexport interface LinkProps extends JsxAProps, ReactRouterLinkProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n  /**\n   * The custom link component.\n   * For example, the Link from react-router-dom.\n   * @default undefined\n   */\n  as?: React.ElementType;\n}\n\nconst underlineBaseStyles = (p) => css`\n  position: relative;\n  display: inline-block;\n  padding-bottom: 0.1em;\n\n  &::after {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    content: '';\n    height: 0.125em;\n    background-color: ${clr(p.theme.linkColor)};\n  }\n`;\n\nexport const underlineHoverStyles = (p) =>\n  p.underline === 'hover' &&\n  css`\n    @media (hover: hover) {\n      ${underlineBaseStyles(p)};\n\n      &::after {\n        width: 0;\n        opacity: 0;\n        ${transitionStyles('width', 'opacity')(p)};\n      }\n\n      &:hover::after,\n      &:focus::after {\n        width: 100%;\n        opacity: 1;\n      }\n    }\n  `;\n\nexport const underlineAlwaysStyles = (p) =>\n  p.underline === 'always' &&\n  css`\n    ${underlineBaseStyles(p)};\n\n    &::after {\n      width: 100%;\n      opacity: 1;\n    }\n  `;\n\nconst StyledLink = styled(\n  'a',\n  omitEmotionProps('size', 'underline', 'as')\n)<LinkProps>`\n  ${resetFocusStyles};\n\n  cursor: pointer;\n  text-decoration: none;\n  line-height: 1.2;\n\n  &,\n  &:active,\n  &:focus {\n    color: ${(p) => clr(p.theme.linkColor)};\n  }\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component to navigate between pages.\n */\nconst Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ underline = 'hover', as, onMouseDown = () => {}, ...rest }, ref) => (\n    <StyledLink\n      underline={underline}\n      as={as}\n      onMouseDown={(e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      }}\n      {...rest}\n      ref={ref}\n    />\n  )\n);\n\nLink.displayName = 'Link';\n\nexport default Link;\n"],"mappings":";AAAA,SAASA,GAAG,QAAQ,gBAAgB;AACpC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SACEC,gBAAgB,EAChBC,UAAU,EACVC,gBAAgB,QAEX,mBAAmB;AAC1B,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAsBzC,MAAMC,mBAAmB,GAAIC,CAAC,IAAKV,GAAI;AACvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBK,GAAG,CAACK,CAAC,CAACC,KAAK,CAACC,SAAS,CAAE;AAC/C;AACA,CAAC;AAED,OAAO,MAAMC,oBAAoB,GAAIH,CAAC,IACpCA,CAAC,CAACI,SAAS,KAAK,OAAO,IACvBd,GAAI;AACN;AACA,QAAQS,mBAAmB,CAACC,CAAC,CAAE;AAC/B;AACA;AACA;AACA;AACA,UAAUN,gBAAgB,CAAC,OAAO,EAAE,SAAS,CAAC,CAACM,CAAC,CAAE;AAClD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAAG;AAEH,OAAO,MAAMK,qBAAqB,GAAIL,CAAC,IACrCA,CAAC,CAACI,SAAS,KAAK,QAAQ,IACxBd,GAAI;AACN,MAAMS,mBAAmB,CAACC,CAAC,CAAE;AAC7B;AACA;AACA;AACA;AACA;AACA,GAAG;AAEH,MAAMM,UAAU,GAAGf,MAAM,CACvB,GAAG,EACHK,gBAAgB,CAAC,MAAM,EAAE,WAAW,EAAE,IAAI,CAC5C,CAAa;AACb,IAAIJ,gBAAiB;AACrB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAcQ,CAAC,IAAKL,GAAG,CAACK,CAAC,CAACC,KAAK,CAACC,SAAS,CAAE;AAC3C;AACA;AACA,IAAIC,oBAAqB;AACzB,IAAIE,qBAAsB;AAC1B,IAAIZ,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMc,IAAI,gBAAGT,UAAU,CACrB,CAAC;EAAEM,SAAS,GAAG,OAAO;EAAEI,EAAE;EAAEC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBAChEd,KAAA,CAAAe,aAAA,CAACN,UAAU,EAAAO,QAAA;EACTT,SAAS,EAAEA,SAAU;EACrBI,EAAE,EAAEA,EAAG;EACPC,WAAW,EAAGK,CAAC,IAAK;IAClBL,WAAW,CAACK,CAAC,CAAC;IACdA,CAAC,CAACC,cAAc,CAAC,CAAC;EACpB;AAAE,GACEL,IAAI;EACRC,GAAG,EAAEA;AAAI,EACV,CAEL,CAAC;AAEDJ,IAAI,CAACS,WAAW,GAAG,MAAM;AAEzB,eAAeT,IAAI"}
+{"version":3,"file":"index.js","names":["css","styled","resetFocusStyles","sizeStyles","transitionStyles","clr","omitEmotionProps","React","forwardRef","underlineBaseStyles","p","theme","linkColor","underlineHoverStyles","underline","underlineAlwaysStyles","disabledStyles","disabled","inputColorPlaceholder","DisabledWrapper","div","StyledLink","Link","as","onMouseDown","rest","ref","createElement","_extends","e","preventDefault","displayName"],"sources":["../../../src/Link/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport {\n  resetFocusStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nexport interface ReactRouterLinkProps {\n  to?: string;\n  replace?: boolean;\n}\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;\nexport interface LinkProps extends JsxAProps, ReactRouterLinkProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n  /**\n   * Whether the link is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * The custom link component.\n   * For example, the Link from react-router-dom.\n   * @default undefined\n   */\n  as?: React.ElementType;\n}\n\nconst underlineBaseStyles = (p) => css`\n  position: relative;\n  display: inline-block;\n  padding-bottom: 0.1em;\n\n  &::after {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    content: '';\n    height: 0.125em;\n    background-color: ${clr(p.theme.linkColor)};\n  }\n`;\n\nexport const underlineHoverStyles = (p) =>\n  p.underline === 'hover' &&\n  css`\n    @media (hover: hover) {\n      ${underlineBaseStyles(p)};\n\n      &::after {\n        width: 0;\n        opacity: 0;\n        ${transitionStyles('width', 'opacity')(p)};\n      }\n\n      &:hover::after,\n      &:focus::after {\n        width: 100%;\n        opacity: 1;\n      }\n    }\n  `;\n\nexport const underlineAlwaysStyles = (p) =>\n  p.underline === 'always' &&\n  css`\n    ${underlineBaseStyles(p)};\n\n    &::after {\n      width: 100%;\n      opacity: 1;\n    }\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    pointer-events: none;\n\n    &,\n    &:active,\n    &:focus {\n      color: ${clr(p.theme.inputColorPlaceholder)};\n    }\n  `;\n\nexport const DisabledWrapper = styled.div`\n  display: inline-block;\n  cursor: not-allowed;\n`;\n\nconst StyledLink = styled(\n  'a',\n  omitEmotionProps('size', 'underline', 'disabled', 'as')\n)<LinkProps>`\n  ${resetFocusStyles};\n\n  cursor: pointer;\n  text-decoration: none;\n  line-height: 1.2;\n\n  &,\n  &:active,\n  &:focus {\n    color: ${(p) => clr(p.theme.linkColor)};\n  }\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${disabledStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component to navigate between pages.\n */\nconst Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      underline = 'hover',\n      disabled = false,\n      as,\n      onMouseDown = () => {},\n      ...rest\n    },\n    ref\n  ) => {\n    if (disabled) {\n      return (\n        <DisabledWrapper>\n          <StyledLink disabled {...rest} ref={ref} />\n        </DisabledWrapper>\n      );\n    }\n\n    return (\n      <StyledLink\n        underline={underline}\n        as={as}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        {...rest}\n        ref={ref}\n      />\n    );\n  }\n);\n\nLink.displayName = 'Link';\n\nexport default Link;\n"],"mappings":";AAAA,SAASA,GAAG,QAAQ,gBAAgB;AACpC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SACEC,gBAAgB,EAChBC,UAAU,EACVC,gBAAgB,QAEX,mBAAmB;AAC1B,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AA2BzC,MAAMC,mBAAmB,GAAIC,CAAC,IAAKV,GAAI;AACvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBK,GAAG,CAACK,CAAC,CAACC,KAAK,CAACC,SAAS,CAAE;AAC/C;AACA,CAAC;AAED,OAAO,MAAMC,oBAAoB,GAAIH,CAAC,IACpCA,CAAC,CAACI,SAAS,KAAK,OAAO,IACvBd,GAAI;AACN;AACA,QAAQS,mBAAmB,CAACC,CAAC,CAAE;AAC/B;AACA;AACA;AACA;AACA,UAAUN,gBAAgB,CAAC,OAAO,EAAE,SAAS,CAAC,CAACM,CAAC,CAAE;AAClD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAAG;AAEH,OAAO,MAAMK,qBAAqB,GAAIL,CAAC,IACrCA,CAAC,CAACI,SAAS,KAAK,QAAQ,IACxBd,GAAI;AACN,MAAMS,mBAAmB,CAACC,CAAC,CAAE;AAC7B;AACA;AACA;AACA;AACA;AACA,GAAG;AAEH,MAAMM,cAAc,GAAIN,CAAC,IACvBA,CAAC,CAACO,QAAQ,IACVjB,GAAI;AACN;AACA;AACA;AACA;AACA;AACA,eAAeK,GAAG,CAACK,CAAC,CAACC,KAAK,CAACO,qBAAqB,CAAE;AAClD;AACA,GAAG;AAEH,OAAO,MAAMC,eAAe,GAAGlB,MAAM,CAACmB,GAAI;AAC1C;AACA;AACA,CAAC;AAED,MAAMC,UAAU,GAAGpB,MAAM,CACvB,GAAG,EACHK,gBAAgB,CAAC,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,IAAI,CACxD,CAAa;AACb,IAAIJ,gBAAiB;AACrB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAcQ,CAAC,IAAKL,GAAG,CAACK,CAAC,CAACC,KAAK,CAACC,SAAS,CAAE;AAC3C;AACA;AACA,IAAIC,oBAAqB;AACzB,IAAIE,qBAAsB;AAC1B,IAAIC,cAAe;AACnB,IAAIb,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMmB,IAAI,gBAAGd,UAAU,CACrB,CACE;EACEM,SAAS,GAAG,OAAO;EACnBG,QAAQ,GAAG,KAAK;EAChBM,EAAE;EACFC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EACtB,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,IAAIT,QAAQ,EAAE;IACZ,oBACEV,KAAA,CAAAoB,aAAA,CAACR,eAAe,qBACdZ,KAAA,CAAAoB,aAAA,CAACN,UAAU,EAAAO,QAAA;MAACX,QAAQ;IAAA,GAAKQ,IAAI;MAAEC,GAAG,EAAEA;IAAI,EAAE,CAC3B,CAAC;EAEtB;EAEA,oBACEnB,KAAA,CAAAoB,aAAA,CAACN,UAAU,EAAAO,QAAA;IACTd,SAAS,EAAEA,SAAU;IACrBS,EAAE,EAAEA,EAAG;IACPC,WAAW,EAAGK,CAAC,IAAK;MAClBL,WAAW,CAACK,CAAC,CAAC;MACdA,CAAC,CAACC,cAAc,CAAC,CAAC;IACpB;EAAE,GACEL,IAAI;IACRC,GAAG,EAAEA;EAAI,EACV,CAAC;AAEN,CACF,CAAC;AAEDJ,IAAI,CAACS,WAAW,GAAG,MAAM;AAEzB,eAAeT,IAAI"}

package/dist/esm/LinkButton/index.js

@@ -1,10 +1,15 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { resetButtonStyles, sizeStyles } from '@os-design/styles';
 import { clr } from '@os-design/theming';
 import { omitEmotionProps } from '@os-design/utils';
 import React, { forwardRef } from 'react';
-import { underlineAlwaysStyles, underlineHoverStyles } from '../Link';
+import { DisabledWrapper, underlineAlwaysStyles, underlineHoverStyles } from '../Link';
+const disabledStyles = p => p.disabled && css`
+    cursor: inherit;
+    color: ${clr(p.theme.inputColorPlaceholder)};
+  `;
 const StyledButton = styled('button', omitEmotionProps('size', 'underline'))`
   ${resetButtonStyles};
 
@@ -15,6 +20,7 @@ const StyledButton = styled('button', omitEmotionProps('size', 'underline'))`
 
   ${underlineHoverStyles};
   ${underlineAlwaysStyles};
+  ${disabledStyles};
   ${sizeStyles};
 `;
 
@@ -23,17 +29,27 @@ const StyledButton = styled('button', omitEmotionProps('size', 'underline'))`
  */
 const LinkButton = /*#__PURE__*/forwardRef(({
   underline = 'hover',
+  disabled = false,
   onMouseDown = () => {},
   ...rest
-}, ref) => /*#__PURE__*/React.createElement(StyledButton, _extends({
-  underline: underline,
-  onMouseDown: e => {
-    onMouseDown(e);
-    e.preventDefault();
+}, ref) => {
+  if (disabled) {
+    return /*#__PURE__*/React.createElement(DisabledWrapper, null, /*#__PURE__*/React.createElement(StyledButton, _extends({
+      disabled: true
+    }, rest, {
+      ref: ref
+    })));
   }
-}, rest, {
-  ref: ref
-})));
+  return /*#__PURE__*/React.createElement(StyledButton, _extends({
+    underline: underline,
+    onMouseDown: e => {
+      onMouseDown(e);
+      e.preventDefault();
+    }
+  }, rest, {
+    ref: ref
+  }));
+});
 LinkButton.displayName = 'LinkButton';
 export default LinkButton;
 //# sourceMappingURL=index.js.map

package/dist/esm/LinkButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["styled","resetButtonStyles","sizeStyles","clr","omitEmotionProps","React","forwardRef","underlineAlwaysStyles","underlineHoverStyles","StyledButton","p","theme","linkColor","LinkButton","underline","onMouseDown","rest","ref","createElement","_extends","e","preventDefault","displayName"],"sources":["../../../src/LinkButton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { resetButtonStyles, sizeStyles, WithSize } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport { underlineAlwaysStyles, underlineHoverStyles } from '../Link';\n\ntype JsxButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref'>;\n\nexport interface LinkButtonProps extends JsxButtonProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n}\n\nconst StyledButton = styled(\n  'button',\n  omitEmotionProps('size', 'underline')\n)<LinkButtonProps>`\n  ${resetButtonStyles};\n\n  cursor: pointer;\n  text-align: left;\n  line-height: 1.2;\n  color: ${(p) => clr(p.theme.linkColor)};\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component that is rendered as a button.\n */\nconst LinkButton = forwardRef<HTMLButtonElement, LinkButtonProps>(\n  ({ underline = 'hover', onMouseDown = () => {}, ...rest }, ref) => (\n    <StyledButton\n      underline={underline}\n      onMouseDown={(e) => {\n        onMouseDown(e);\n        e.preventDefault();\n      }}\n      {...rest}\n      ref={ref}\n    />\n  )\n);\n\nLinkButton.displayName = 'LinkButton';\n\nexport default LinkButton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,iBAAiB,EAAEC,UAAU,QAAkB,mBAAmB;AAC3E,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,qBAAqB,EAAEC,oBAAoB,QAAQ,SAAS;AAYrE,MAAMC,YAAY,GAAGT,MAAM,CACzB,QAAQ,EACRI,gBAAgB,CAAC,MAAM,EAAE,WAAW,CACtC,CAAmB;AACnB,IAAIH,iBAAkB;AACtB;AACA;AACA;AACA;AACA,WAAYS,CAAC,IAAKP,GAAG,CAACO,CAAC,CAACC,KAAK,CAACC,SAAS,CAAE;AACzC;AACA,IAAIJ,oBAAqB;AACzB,IAAID,qBAAsB;AAC1B,IAAIL,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMW,UAAU,gBAAGP,UAAU,CAC3B,CAAC;EAAEQ,SAAS,GAAG,OAAO;EAAEC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBAC5DZ,KAAA,CAAAa,aAAA,CAACT,YAAY,EAAAU,QAAA;EACXL,SAAS,EAAEA,SAAU;EACrBC,WAAW,EAAGK,CAAC,IAAK;IAClBL,WAAW,CAACK,CAAC,CAAC;IACdA,CAAC,CAACC,cAAc,CAAC,CAAC;EACpB;AAAE,GACEL,IAAI;EACRC,GAAG,EAAEA;AAAI,EACV,CAEL,CAAC;AAEDJ,UAAU,CAACS,WAAW,GAAG,YAAY;AAErC,eAAeT,UAAU"}
+{"version":3,"file":"index.js","names":["css","styled","resetButtonStyles","sizeStyles","clr","omitEmotionProps","React","forwardRef","DisabledWrapper","underlineAlwaysStyles","underlineHoverStyles","disabledStyles","p","disabled","theme","inputColorPlaceholder","StyledButton","linkColor","LinkButton","underline","onMouseDown","rest","ref","createElement","_extends","e","preventDefault","displayName"],"sources":["../../../src/LinkButton/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { resetButtonStyles, sizeStyles, WithSize } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport {\n  DisabledWrapper,\n  underlineAlwaysStyles,\n  underlineHoverStyles,\n} from '../Link';\n\ntype JsxButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref'>;\n\nexport interface LinkButtonProps extends JsxButtonProps, WithSize {\n  /**\n   * Type of the underline styles.\n   * @default hover\n   */\n  underline?: 'hover' | 'always' | 'never';\n  /**\n   * Whether the link is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n}\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    cursor: inherit;\n    color: ${clr(p.theme.inputColorPlaceholder)};\n  `;\n\nconst StyledButton = styled(\n  'button',\n  omitEmotionProps('size', 'underline')\n)<LinkButtonProps>`\n  ${resetButtonStyles};\n\n  cursor: pointer;\n  text-align: left;\n  line-height: 1.2;\n  color: ${(p) => clr(p.theme.linkColor)};\n\n  ${underlineHoverStyles};\n  ${underlineAlwaysStyles};\n  ${disabledStyles};\n  ${sizeStyles};\n`;\n\n/**\n * The link component that is rendered as a button.\n */\nconst LinkButton = forwardRef<HTMLButtonElement, LinkButtonProps>(\n  (\n    { underline = 'hover', disabled = false, onMouseDown = () => {}, ...rest },\n    ref\n  ) => {\n    if (disabled) {\n      return (\n        <DisabledWrapper>\n          <StyledButton disabled {...rest} ref={ref} />\n        </DisabledWrapper>\n      );\n    }\n\n    return (\n      <StyledButton\n        underline={underline}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        {...rest}\n        ref={ref}\n      />\n    );\n  }\n);\n\nLinkButton.displayName = 'LinkButton';\n\nexport default LinkButton;\n"],"mappings":";AAAA,SAASA,GAAG,QAAQ,gBAAgB;AACpC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,iBAAiB,EAAEC,UAAU,QAAkB,mBAAmB;AAC3E,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SACEC,eAAe,EACfC,qBAAqB,EACrBC,oBAAoB,QACf,SAAS;AAiBhB,MAAMC,cAAc,GAAIC,CAAC,IACvBA,CAAC,CAACC,QAAQ,IACVb,GAAI;AACN;AACA,aAAaI,GAAG,CAACQ,CAAC,CAACE,KAAK,CAACC,qBAAqB,CAAE;AAChD,GAAG;AAEH,MAAMC,YAAY,GAAGf,MAAM,CACzB,QAAQ,EACRI,gBAAgB,CAAC,MAAM,EAAE,WAAW,CACtC,CAAmB;AACnB,IAAIH,iBAAkB;AACtB;AACA;AACA;AACA;AACA,WAAYU,CAAC,IAAKR,GAAG,CAACQ,CAAC,CAACE,KAAK,CAACG,SAAS,CAAE;AACzC;AACA,IAAIP,oBAAqB;AACzB,IAAID,qBAAsB;AAC1B,IAAIE,cAAe;AACnB,IAAIR,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMe,UAAU,gBAAGX,UAAU,CAC3B,CACE;EAAEY,SAAS,GAAG,OAAO;EAAEN,QAAQ,GAAG,KAAK;EAAEO,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EAAE,GAAGC;AAAK,CAAC,EAC1EC,GAAG,KACA;EACH,IAAIT,QAAQ,EAAE;IACZ,oBACEP,KAAA,CAAAiB,aAAA,CAACf,eAAe,qBACdF,KAAA,CAAAiB,aAAA,CAACP,YAAY,EAAAQ,QAAA;MAACX,QAAQ;IAAA,GAAKQ,IAAI;MAAEC,GAAG,EAAEA;IAAI,EAAE,CAC7B,CAAC;EAEtB;EAEA,oBACEhB,KAAA,CAAAiB,aAAA,CAACP,YAAY,EAAAQ,QAAA;IACXL,SAAS,EAAEA,SAAU;IACrBC,WAAW,EAAGK,CAAC,IAAK;MAClBL,WAAW,CAACK,CAAC,CAAC;MACdA,CAAC,CAACC,cAAc,CAAC,CAAC;IACpB;EAAE,GACEL,IAAI;IACRC,GAAG,EAAEA;EAAI,EACV,CAAC;AAEN,CACF,CAAC;AAEDJ,UAAU,CAACS,WAAW,GAAG,YAAY;AAErC,eAAeT,UAAU"}

package/dist/types/ButtonLink/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ButtonLink/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAgB,MAAM,WAAW,CAAC;AAGtD,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAE1D,KAAK,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,CAAC;AAClE,MAAM,MAAM,eAAe,GAAG,SAAS,GACrC,oBAAoB,GACpB,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,GACrB,WAAW,CAAC;AAoBd,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iFA0Df,CAAC;AAIF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ButtonLink/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAgB,MAAM,WAAW,CAAC;AAGtD,OAAO,EAAmB,SAAS,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAE3E,KAAK,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,CAAC;AAClE,MAAM,MAAM,eAAe,GAAG,SAAS,GACrC,oBAAoB,GACpB,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,GACrB,WAAW,CAAC;AAoBd,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iFAgEf,CAAC;AAIF,eAAe,UAAU,CAAC"}

package/dist/types/Link/index.d.ts

@@ -7,10 +7,15 @@ export interface ReactRouterLinkProps {
 type JsxAProps = Omit<JSX.IntrinsicElements['a'], 'ref'>;
 export interface LinkProps extends JsxAProps, ReactRouterLinkProps, WithSize {
     underline?: 'hover' | 'always' | 'never';
+    disabled?: boolean;
     as?: React.ElementType;
 }
 export declare const underlineHoverStyles: (p: any) => false | import("@emotion/utils").SerializedStyles;
 export declare const underlineAlwaysStyles: (p: any) => false | import("@emotion/utils").SerializedStyles;
+export declare const DisabledWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
 export default Link;
 //# sourceMappingURL=index.d.ts.map

package/dist/types/Link/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Link/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,QAAQ,EACT,MAAM,mBAAmB,CAAC;AAG3B,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,KAAK,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC;AACzD,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,oBAAoB,EAAE,QAAQ;IAK1E,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAMzC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;CACxB;AAiBD,eAAO,MAAM,oBAAoB,+DAkB9B,CAAC;AAEJ,eAAO,MAAM,qBAAqB,+DAS/B,CAAC;AA0BJ,QAAA,MAAM,IAAI,qFAaT,CAAC;AAIF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Link/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,QAAQ,EACT,MAAM,mBAAmB,CAAC;AAG3B,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,KAAK,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC;AACzD,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,oBAAoB,EAAE,QAAQ;IAK1E,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAKzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAMnB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;CACxB;AAiBD,eAAO,MAAM,oBAAoB,+DAkB9B,CAAC;AAEJ,eAAO,MAAM,qBAAqB,+DAS/B,CAAC;AAcJ,eAAO,MAAM,eAAe;;;qFAG3B,CAAC;AA2BF,QAAA,MAAM,IAAI,qFAgCT,CAAC;AAIF,eAAe,IAAI,CAAC"}

package/dist/types/LinkButton/index.d.ts

@@ -3,6 +3,7 @@ import React from 'react';
 type JsxButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref'>;
 export interface LinkButtonProps extends JsxButtonProps, WithSize {
     underline?: 'hover' | 'always' | 'never';
+    disabled?: boolean;
 }
 declare const LinkButton: React.ForwardRefExoticComponent<LinkButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export default LinkButton;

package/dist/types/LinkButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/LinkButton/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiC,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG5E,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,KAAK,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,CAAC;AAEnE,MAAM,WAAW,eAAgB,SAAQ,cAAc,EAAE,QAAQ;IAK/D,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CAC1C;AAqBD,QAAA,MAAM,UAAU,2FAYf,CAAC;AAIF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/LinkButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiC,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG5E,OAAO,KAAqB,MAAM,OAAO,CAAC;AAO1C,KAAK,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,CAAC;AAEnE,MAAM,WAAW,eAAgB,SAAQ,cAAc,EAAE,QAAQ;IAK/D,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAKzC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,QAAA,MAAM,UAAU,2FAyBf,CAAC;AAIF,eAAe,UAAU,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@os-design/core",
-  "version": "1.0.230",
+  "version": "1.0.231",
   "license": "UNLICENSED",
   "repository": "git@gitlab.com:os-team/libs/os-design.git",
   "main": "dist/cjs/index.js",
@@ -59,5 +59,5 @@
     "react": ">=18",
     "react-dom": ">=18"
   },
-  "gitHead": "378c11e847c774f623333abafb1ff008b5e9e7f6"
+  "gitHead": "62499aa4f865dbce0e0ccde63f92c0dbe893c19c"
 }

package/src/ButtonLink/index.tsx

@@ -5,7 +5,7 @@ import React, { forwardRef } from 'react';
 import { ButtonProps, StyledButton } from '../Button';
 import ButtonContent from '../Button/ButtonContent';
 import useButtonColors from '../Button/utils/useButtonColors';
-import { LinkProps, ReactRouterLinkProps } from '../Link';
+import { DisabledWrapper, LinkProps, ReactRouterLinkProps } from '../Link';
 
 type JsxAProps = Omit<JSX.IntrinsicElements['a'], 'type' | 'ref'>;
 export type ButtonLinkProps = JsxAProps &
@@ -56,7 +56,7 @@ const ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(
       disabled,
     });
 
-    return (
+    const link = (
       <StyledButtonLink
         btnType={type}
         colors={buttonColors}
@@ -88,6 +88,12 @@ const ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(
         </ButtonContent>
       </StyledButtonLink>
     );
+
+    if (disabled || loading) {
+      return <DisabledWrapper>{link}</DisabledWrapper>;
+    }
+
+    return link;
   }
 );
 

package/src/Link/index.tsx

@@ -22,6 +22,11 @@ export interface LinkProps extends JsxAProps, ReactRouterLinkProps, WithSize {
    * @default hover
    */
   underline?: 'hover' | 'always' | 'never';
+  /**
+   * Whether the link is disabled.
+   * @default false
+   */
+  disabled?: boolean;
   /**
    * The custom link component.
    * For example, the Link from react-router-dom.
@@ -76,9 +81,26 @@ export const underlineAlwaysStyles = (p) =>
     }
   `;
 
+const disabledStyles = (p) =>
+  p.disabled &&
+  css`
+    pointer-events: none;
+
+    &,
+    &:active,
+    &:focus {
+      color: ${clr(p.theme.inputColorPlaceholder)};
+    }
+  `;
+
+export const DisabledWrapper = styled.div`
+  display: inline-block;
+  cursor: not-allowed;
+`;
+
 const StyledLink = styled(
   'a',
-  omitEmotionProps('size', 'underline', 'as')
+  omitEmotionProps('size', 'underline', 'disabled', 'as')
 )<LinkProps>`
   ${resetFocusStyles};
 
@@ -94,6 +116,7 @@ const StyledLink = styled(
 
   ${underlineHoverStyles};
   ${underlineAlwaysStyles};
+  ${disabledStyles};
   ${sizeStyles};
 `;
 
@@ -101,18 +124,37 @@ const StyledLink = styled(
  * The link component to navigate between pages.
  */
 const Link = forwardRef<HTMLAnchorElement, LinkProps>(
-  ({ underline = 'hover', as, onMouseDown = () => {}, ...rest }, ref) => (
-    <StyledLink
-      underline={underline}
-      as={as}
-      onMouseDown={(e) => {
-        onMouseDown(e);
-        e.preventDefault();
-      }}
-      {...rest}
-      ref={ref}
-    />
-  )
+  (
+    {
+      underline = 'hover',
+      disabled = false,
+      as,
+      onMouseDown = () => {},
+      ...rest
+    },
+    ref
+  ) => {
+    if (disabled) {
+      return (
+        <DisabledWrapper>
+          <StyledLink disabled {...rest} ref={ref} />
+        </DisabledWrapper>
+      );
+    }
+
+    return (
+      <StyledLink
+        underline={underline}
+        as={as}
+        onMouseDown={(e) => {
+          onMouseDown(e);
+          e.preventDefault();
+        }}
+        {...rest}
+        ref={ref}
+      />
+    );
+  }
 );
 
 Link.displayName = 'Link';

package/src/LinkButton/index.tsx

@@ -1,9 +1,14 @@
+import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { resetButtonStyles, sizeStyles, WithSize } from '@os-design/styles';
 import { clr } from '@os-design/theming';
 import { omitEmotionProps } from '@os-design/utils';
 import React, { forwardRef } from 'react';
-import { underlineAlwaysStyles, underlineHoverStyles } from '../Link';
+import {
+  DisabledWrapper,
+  underlineAlwaysStyles,
+  underlineHoverStyles,
+} from '../Link';
 
 type JsxButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref'>;
 
@@ -13,8 +18,20 @@ export interface LinkButtonProps extends JsxButtonProps, WithSize {
    * @default hover
    */
   underline?: 'hover' | 'always' | 'never';
+  /**
+   * Whether the link is disabled.
+   * @default false
+   */
+  disabled?: boolean;
 }
 
+const disabledStyles = (p) =>
+  p.disabled &&
+  css`
+    cursor: inherit;
+    color: ${clr(p.theme.inputColorPlaceholder)};
+  `;
+
 const StyledButton = styled(
   'button',
   omitEmotionProps('size', 'underline')
@@ -28,6 +45,7 @@ const StyledButton = styled(
 
   ${underlineHoverStyles};
   ${underlineAlwaysStyles};
+  ${disabledStyles};
   ${sizeStyles};
 `;
 
@@ -35,17 +53,30 @@ const StyledButton = styled(
  * The link component that is rendered as a button.
  */
 const LinkButton = forwardRef<HTMLButtonElement, LinkButtonProps>(
-  ({ underline = 'hover', onMouseDown = () => {}, ...rest }, ref) => (
-    <StyledButton
-      underline={underline}
-      onMouseDown={(e) => {
-        onMouseDown(e);
-        e.preventDefault();
-      }}
-      {...rest}
-      ref={ref}
-    />
-  )
+  (
+    { underline = 'hover', disabled = false, onMouseDown = () => {}, ...rest },
+    ref
+  ) => {
+    if (disabled) {
+      return (
+        <DisabledWrapper>
+          <StyledButton disabled {...rest} ref={ref} />
+        </DisabledWrapper>
+      );
+    }
+
+    return (
+      <StyledButton
+        underline={underline}
+        onMouseDown={(e) => {
+          onMouseDown(e);
+          e.preventDefault();
+        }}
+        {...rest}
+        ref={ref}
+      />
+    );
+  }
 );
 
 LinkButton.displayName = 'LinkButton';