@lunit/design-system 1.0.0-a.1 → 1.0.0-a.3

package/dist/components/Button/Button.styled.js

@@ -0,0 +1,180 @@
+import { styled } from "@mui/material/styles";
+import { Button as MuiButton } from "@mui/material";
+import { PADDING_OF_FOCUS, OUTLINED_BORDER_WIDTH } from "./const";
+import { getButtonPaddingBySizeAndKind } from "./utils/getButtonPaddingBySizeAndKind";
+import { getIconButtonPaddingBySizeAndKind } from "./utils/getIconButtonPaddingBySizeAndKind";
+import getHoverStyle from "./utils/getHoverStyle";
+const borderRadius = "8px";
+export const sizeStyle = ({ size, kind, hasIconOnly, typography, selected = false, }) => ({
+    ...(size === "small" && {
+        ...typography.button2,
+        padding: `${hasIconOnly
+            ? getIconButtonPaddingBySizeAndKind({ kind, size, selected })
+            : getButtonPaddingBySizeAndKind({ kind, size, selected })}`,
+        minWidth: "28px",
+        minHeight: "28px",
+    }),
+    ...(size === "medium" && {
+        ...typography.button2,
+        padding: `${hasIconOnly
+            ? getIconButtonPaddingBySizeAndKind({ kind, size, selected })
+            : getButtonPaddingBySizeAndKind({ kind, size, selected })}`,
+        minWidth: "36px",
+        minHeight: "36px",
+    }),
+    ...(size === "large" && {
+        ...typography.button1,
+        padding: `${hasIconOnly
+            ? getIconButtonPaddingBySizeAndKind({ kind, size, selected })
+            : getButtonPaddingBySizeAndKind({ kind, size, selected })}`,
+        minWidth: "44px",
+        minHeight: "44px",
+    }),
+});
+export const kindStyle = ({ kind, color, token }) => ({
+    // kind: container
+    ...(kind === "contained" &&
+        color === "primary" && {
+        color: token.component.btn_contained_primary_text,
+        backgroundColor: token.component.btn_contained_primary_bg,
+        "&:hover": getHoverStyle(token.component.btn_contained_primary_bg),
+        "&.Mui-disabled": {
+            opacity: 0.38,
+            border: "none",
+            color: token.component.btn_contained_primary_text,
+        },
+    }),
+    ...(kind === "contained" &&
+        color === "secondary" && {
+        color: token.component.btn_contained_secondary_text,
+        backgroundColor: token.component.btn_contained_secondary_bg,
+        "&:hover": getHoverStyle(token.component.btn_contained_secondary_bg),
+        "&.Mui-disabled": {
+            opacity: 0.38,
+            border: "none",
+            color: token.component.btn_contained_secondary_text,
+        },
+    }),
+    ...(kind === "contained" &&
+        color === "error" && {
+        color: token.component.btn_contained_error_text,
+        backgroundColor: token.component.btn_contained_error_bg,
+        "&:hover": getHoverStyle(token.component.btn_contained_error_bg),
+        "&.Mui-disabled": {
+            opacity: 0.38,
+            border: "none",
+            color: token.component.btn_contained_error_text,
+        },
+    }),
+    // kind: ghost
+    ...(kind === "ghost" &&
+        color === "primary" && {
+        color: token.component.btn_ghost_primary_text,
+        border: "none",
+        "&:hover": getHoverStyle("none"),
+        "&.Mui-disabled": {
+            opacity: 0.38,
+            border: "none",
+            color: token.component.btn_ghost_primary_text,
+        },
+    }),
+    ...(kind === "ghost" &&
+        color === "secondary" && {
+        color: token.component.btn_ghost_secondary_text,
+        border: "none",
+        "&:hover": getHoverStyle("none"),
+        "&.Mui-disabled": {
+            opacity: 0.38,
+            border: "none",
+            color: token.component.btn_ghost_secondary_text,
+        },
+    }),
+    ...(kind === "ghost" &&
+        color === "error" && {
+        color: token.component.btn_ghost_error_text,
+        "&:hover": getHoverStyle("none"),
+        "&.Mui-disabled": {
+            opacity: 0.38,
+            border: "none",
+            color: token.component.btn_ghost_error_text,
+        },
+    }),
+    // kind: outlined
+    ...(kind === "outlined" &&
+        color === "primary" && {
+        color: token.component.btn_outlined_primary_text,
+        border: `${OUTLINED_BORDER_WIDTH}px solid ${token.component.btn_outlined_primary_border}`,
+        "&:hover": getHoverStyle("none"),
+        "&:hover:before": {
+            content: "''",
+            position: "absolute",
+            left: "-1px",
+            top: "-1px",
+            width: "calc(100% + 2px)",
+            height: "calc(100% + 2px)",
+            zIndex: -1,
+            backgroundColor: token.core.hover,
+            borderRadius,
+        },
+        "&.Mui-disabled": {
+            opacity: 0.38,
+            color: token.component.btn_outlined_primary_text,
+        },
+    }),
+});
+export const commonStyle = ({ token }) => ({
+    fontWeight: "500",
+    borderRadius,
+    textTransform: "initial",
+    "&.Mui-focusVisible": {
+        "&::after": {
+            position: "absolute",
+            width: `calc(100% + ${PADDING_OF_FOCUS}px)`,
+            height: `calc(100% + ${PADDING_OF_FOCUS}px)`,
+            content: '""',
+            borderRadius: "11px",
+            border: `1px solid ${token.core.focused}`,
+            boxSizing: "border-box",
+        },
+    },
+    "&:hover:before": {
+        content: "''",
+        position: "absolute",
+        left: 0,
+        top: 0,
+        width: "100%",
+        height: "100%",
+        zIndex: -1,
+        backgroundColor: token.core.hover,
+        borderRadius,
+    },
+});
+export const iconStyle = ({ size, hasIconOnly, }) => ({
+    "& .MuiButton-startIcon": {
+        width: "20px",
+        height: "20px",
+        margin: 0,
+        marginRight: hasIconOnly ? "0px" : size === "large" ? "8px" : "4px",
+        // This style was added for Mui Button Svg Icon handling
+        "*:nth-of-type(1)": {
+            fontSize: "20px",
+        },
+    },
+    svg: {
+        width: "20px",
+        height: "20px",
+        margin: 0,
+        marginRight: hasIconOnly ? "0px" : size === "large" ? "8px" : "4px",
+    },
+});
+export const CustomButton = styled(MuiButton, {
+    shouldForwardProp: (prop) => {
+        return !["kind", "hasIconOnly"].includes(prop);
+    },
+})(({ theme: { typography, palette: { token }, }, kind, size, color, hasIconOnly, }) => ({
+    ...commonStyle({ token }),
+    ...iconStyle({ size, hasIconOnly }),
+    ...sizeStyle({ size, kind, hasIconOnly, typography }),
+    ...kindStyle({ kind, color, token }),
+}));
+//# sourceMappingURL=Button.styled.js.map

package/dist/components/Button/Button.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.styled.js","sourceRoot":"","sources":["../../../src/components/Button/Button.styled.ts"],"names":[],"mappings":"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"}

package/dist/components/Button/Button.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Button.types.js.map

package/dist/components/Button/Button.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.types.js","sourceRoot":"","sources":["../../../src/components/Button/Button.types.ts"],"names":[],"mappings":""}

package/dist/components/Button/const.js

@@ -0,0 +1,3 @@
+export const PADDING_OF_FOCUS = 6; // TODO: focus 시 padding 고정값, size 별 차이 여부 확인 필요
+export const OUTLINED_BORDER_WIDTH = 1;
+//# sourceMappingURL=const.js.map

package/dist/components/Button/const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.js","sourceRoot":"","sources":["../../../src/components/Button/const.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,CAAC,CAAC,gDAAgD;AACnF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,CAAC"}

package/dist/components/Button/index.js

@@ -1,2 +1,2 @@
-(()=>{"use strict";var o={493:(o,n,e)=>{e.d(n,{op:()=>d});var t=e(442),r=e(692),i=function(o){var n=o.kind,e=o.size,t=o.selected,r=void 0!==t&&t;return"small"===e?"outlined"!==n||r?"4px 8px":"".concat(3,"px ").concat(7,"px"):"medium"===e?"outlined"!==n||r?"8px 12px":"".concat(7,"px ").concat(11,"px"):"outlined"!==n||r?"10px 12px":"".concat(9,"px ").concat(11,"px")},c=function(o){var n=o.kind,e=o.size,t=o.selected,r=void 0!==t&&t;return"small"===e?"outlined"!==n||r?"4px":"".concat(3,"px"):"medium"===e?"outlined"!==n||r?"8px":"".concat(7,"px"):"outlined"!==n||r?"12px":"".concat(11,"px")},a=function(){return a=Object.assign||function(o){for(var n,e=1,t=arguments.length;e<t;e++)for(var r in n=arguments[e])Object.prototype.hasOwnProperty.call(n,r)&&(o[r]=n[r]);return o},a.apply(this,arguments)},d=(0,t.styled)(r.Button,{shouldForwardProp:function(o){return!["kind","hasIconOnly"].includes(o)}})((function(o){var n=o.theme,e=n.typography,t=n.palette.token,r=o.kind,d=o.size,l=o.color,p=o.hasIconOnly;return a(a(a(a({},function(o){var n=o.token;return{fontWeight:"500",borderRadius:"8px",textTransform:"initial","&.Mui-focusVisible":{"&::after":{position:"absolute",width:"calc(100% + ".concat(6,"px)"),height:"calc(100% + ".concat(6,"px)"),content:'""',borderRadius:"11px",border:"1px solid ".concat(n.core.focused),boxSizing:"border-box"}}}}({token:t})),function(o){var n=o.size,e=o.hasIconOnly;return{"& .MuiButton-startIcon":{width:"20px",height:"20px",margin:0,marginRight:e?"0px":"large"===n?"8px":"4px","*:nth-of-type(1)":{fontSize:"20px"}},svg:{width:"20px",height:"20px",margin:0,marginRight:e?"0px":"large"===n?"8px":"4px"}}}({size:d,hasIconOnly:p})),function(o){var n=o.size,e=o.kind,t=o.hasIconOnly,r=o.typography,d=o.selected,l=void 0!==d&&d;return a(a(a({},"small"===n&&a(a({},r.button2),{padding:"".concat(t?c({kind:e,size:n,selected:l}):i({kind:e,size:n,selected:l})),minWidth:"28px",minHeight:"28px"})),"medium"===n&&a(a({},r.button2),{padding:"".concat(t?c({kind:e,size:n,selected:l}):i({kind:e,size:n,selected:l})),minWidth:"36px",minHeight:"36px"})),"large"===n&&a(a({},r.button1),{padding:"".concat(t?c({kind:e,size:n,selected:l}):i({kind:e,size:n,selected:l})),minWidth:"44px",minHeight:"44px"}))}({size:d,kind:r,hasIconOnly:p,typography:e})),function(o){var n=o.kind,e=o.color,t=o.token;return a(a(a(a(a(a(a({},"contained"===n&&"primary"===e&&{color:t.component.btn_contained_primary_text,backgroundColor:t.component.btn_contained_primary_bg,"&:hover":{backgroundColor:t.component.btn_contained_primary_bg},"&.Mui-disabled":{opacity:.38,border:"none",color:t.component.btn_contained_primary_text}}),"contained"===n&&"secondary"===e&&{color:t.component.btn_contained_secondary_text,backgroundColor:t.component.btn_contained_secondary_bg,"&:hover":{backgroundColor:t.component.btn_contained_secondary_bg},"&.Mui-disabled":{opacity:.38,border:"none",color:t.component.btn_contained_secondary_text}}),"contained"===n&&"error"===e&&{color:t.component.btn_contained_error_text,backgroundColor:t.component.btn_contained_error_bg,"&:hover":{backgroundColor:t.component.btn_contained_error_bg},"&.Mui-disabled":{opacity:.38,border:"none",color:t.component.btn_contained_error_text}}),"ghost"===n&&"primary"===e&&{color:t.component.btn_ghost_primary_text,border:"none","&:hover":{backgroundColor:"rgba(0, 0, 0, 0.06)"},"&.Mui-disabled":{opacity:.38,border:"none",color:t.component.btn_ghost_primary_text}}),"ghost"===n&&"secondary"===e&&{color:t.component.btn_ghost_secondary_text,border:"none","&:hover":{backgroundColor:"rgba(0, 0, 0, 0.06)"},"&.Mui-disabled":{opacity:.38,border:"none",color:t.component.btn_ghost_secondary_text}}),"ghost"===n&&"error"===e&&{color:t.component.btn_ghost_error_text,"&:hover":{backgroundColor:"rgba(0, 0, 0, 0.06)"},"&.Mui-disabled":{opacity:.38,border:"none",color:t.component.btn_ghost_error_text}}),"outlined"===n&&"primary"===e&&{color:t.component.btn_outlined_primary_text,border:"".concat(1,"px solid ").concat(t.component.btn_outlined_primary_border),"&:hover":{backgroundColor:"rgba(0, 0, 0, 0.06)"},"&.Mui-disabled":{opacity:.38,color:t.component.btn_outlined_primary_text}})}({kind:r,color:l,token:t}))}))},692:o=>{o.exports=require("@mui/material")},442:o=>{o.exports=require("@mui/material/styles")},997:o=>{o.exports=require("react/jsx-runtime")}},n={};function e(t){var r=n[t];if(void 0!==r)return r.exports;var i=n[t]={exports:{}};return o[t](i,i.exports,e),i.exports}e.d=(o,n)=>{for(var t in n)e.o(n,t)&&!e.o(o,t)&&Object.defineProperty(o,t,{enumerable:!0,get:n[t]})},e.o=(o,n)=>Object.prototype.hasOwnProperty.call(o,n),e.r=o=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(o,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(o,"__esModule",{value:!0})};var t={};(()=>{e.r(t),e.d(t,{default:()=>i});var o=e(997),n=e(493),r=function(){return r=Object.assign||function(o){for(var n,e=1,t=arguments.length;e<t;e++)for(var r in n=arguments[e])Object.prototype.hasOwnProperty.call(n,r)&&(o[r]=n[r]);return o},r.apply(this,arguments)};const i=function(e){var t=e.kind,i=void 0===t?"contained":t,c=e.size,a=void 0===c?"small":c,d=e.color,l=void 0===d?"primary":d,p=e.icon,s=e.className,u=e.children,b=function(o,n){var e={};for(var t in o)Object.prototype.hasOwnProperty.call(o,t)&&n.indexOf(t)<0&&(e[t]=o[t]);if(null!=o&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(t=Object.getOwnPropertySymbols(o);r<t.length;r++)n.indexOf(t[r])<0&&Object.prototype.propertyIsEnumerable.call(o,t[r])&&(e[t[r]]=o[t[r]])}return e}(e,["kind","size","color","icon","className","children"]),m=Boolean(p&&!u);return(0,o.jsx)(o.Fragment,{children:"contained"===i||"ghost"===i?(0,o.jsx)(n.op,r({className:"".concat(i," ").concat(s||""),kind:i,color:l,size:a,startIcon:p,hasIconOnly:m,disableRipple:!0,disableFocusRipple:!0},b,{children:!m&&(0,o.jsx)(o.Fragment,{children:u})})):(0,o.jsx)(n.op,r({className:"outlined ".concat(s||""),kind:"outlined",color:"primary",size:a,startIcon:p,hasIconOnly:m,disableRipple:!0,disableFocusRipple:!0},b,{children:!m&&(0,o.jsx)(o.Fragment,{children:u})}))})}})(),exports.default=t.default,Object.defineProperty(exports,"__esModule",{value:!0})})();
+export { default } from "./Button";
 //# sourceMappingURL=index.js.map

package/dist/components/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"components/Button/index.js","mappings":"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","sources":["webpack://@lunit/design-system/./src/components/Button/utils/getButtonPaddingBySizeAndKind.ts","webpack://@lunit/design-system/./src/components/Button/utils/getIconButtonPaddingBySizeAndKind.ts","webpack://@lunit/design-system/./src/components/Button/Button.styled.ts","webpack://@lunit/design-system/./src/components/Button/const.ts","webpack://@lunit/design-system/external commonjs \"@mui/material\"","webpack://@lunit/design-system/external commonjs \"@mui/material/styles\"","webpack://@lunit/design-system/external commonjs \"react/jsx-runtime\"","webpack://@lunit/design-system/webpack/bootstrap","webpack://@lunit/design-system/webpack/runtime/define property getters","webpack://@lunit/design-system/webpack/runtime/hasOwnProperty shorthand","webpack://@lunit/design-system/webpack/runtime/make namespace object","webpack://@lunit/design-system/./src/components/Button/Button.tsx"],"sourcesContent":["import { OUTLINED_BORDER_WIDTH } from \"../const\";\n\nimport type { ButtonProps } from \"../Button.types\";\nimport { ToggleButtonProps } from \"@/components/ToggleButton/ToggleButton.types\";\n\ntype GetButtonPaddingBySizeAndKindParams = Pick<ButtonProps, \"kind\" | \"size\"> &\n  Pick<ToggleButtonProps, \"selected\">;\n\n/**\n * When kind is outlined,\n * the padding value must include the border width of outlined.\n * This function takes care of this.\n */\nexport const getButtonPaddingBySizeAndKind = ({\n  kind,\n  size,\n  selected = false,\n}: GetButtonPaddingBySizeAndKindParams) => {\n  if (size === \"small\") {\n    return kind === \"outlined\" && !selected\n      ? `${4 - OUTLINED_BORDER_WIDTH}px ${8 - OUTLINED_BORDER_WIDTH}px`\n      : \"4px 8px\";\n  }\n\n  if (size === \"medium\") {\n    return kind === \"outlined\" && !selected\n      ? `${8 - OUTLINED_BORDER_WIDTH}px ${12 - OUTLINED_BORDER_WIDTH}px`\n      : \"8px 12px\";\n  }\n\n  // size === \"large\"\n  return kind === \"outlined\" && !selected\n    ? `${10 - OUTLINED_BORDER_WIDTH}px ${12 - OUTLINED_BORDER_WIDTH}px`\n    : \"10px 12px\";\n};\n","import { OUTLINED_BORDER_WIDTH } from \"../const\";\n\nimport type { ButtonProps } from \"../Button.types\";\nimport { ToggleButtonProps } from \"@/components/ToggleButton/ToggleButton.types\";\n\ntype GetIconButtonPaddingBySizeAndKindProps = Pick<\n  ButtonProps,\n  \"kind\" | \"size\"\n> &\n  Pick<ToggleButtonProps, \"selected\">;\n\n/**\n * When kind is outlined,\n * the padding value must include the border width of outlined.\n * This function takes care of this.\n */\nexport const getIconButtonPaddingBySizeAndKind = ({\n  kind,\n  size,\n  selected = false,\n}: GetIconButtonPaddingBySizeAndKindProps) => {\n  if (size === \"small\") {\n    return kind === \"outlined\" && !selected\n      ? `${4 - OUTLINED_BORDER_WIDTH}px`\n      : \"4px\";\n  }\n\n  if (size === \"medium\") {\n    return kind === \"outlined\" && !selected\n      ? `${8 - OUTLINED_BORDER_WIDTH}px`\n      : \"8px\";\n  }\n\n  // size === \"large\"\n  return kind === \"outlined\" && !selected\n    ? `${12 - OUTLINED_BORDER_WIDTH}px`\n    : \"12px\";\n};\n","import { styled } from \"@mui/material/styles\";\nimport { Button as MuiButton } from \"@mui/material\";\n\nimport { ColorToken } from \"@/foundation/colors/types\";\nimport { PADDING_OF_FOCUS, OUTLINED_BORDER_WIDTH } from \"./const\";\nimport { getButtonPaddingBySizeAndKind } from \"./utils/getButtonPaddingBySizeAndKind\";\nimport { getIconButtonPaddingBySizeAndKind } from \"./utils/getIconButtonPaddingBySizeAndKind\";\n\nimport type { ButtonProps } from \"./Button.types\";\nimport type { ToggleButtonProps } from \"../ToggleButton/ToggleButton.types\";\nimport type { Typography } from \"@mui/material/styles/createTypography\";\n\ntype KindStyleParams = Pick<ButtonProps, \"kind\" | \"color\"> & {\n  token: ColorToken;\n};\n\ntype CustomButtonProps = ButtonProps & { hasIconOnly: boolean };\n\ntype sizeStyleParams = Pick<\n  CustomButtonProps,\n  \"size\" | \"hasIconOnly\" | \"kind\"\n> &\n  Pick<ToggleButtonProps, \"selected\"> & { typography: Typography };\n\nexport const sizeStyle = ({\n  size,\n  kind,\n  hasIconOnly,\n  typography,\n  selected = false,\n}: sizeStyleParams) => ({\n  ...(size === \"small\" && {\n    ...typography.button2,\n    padding: `${\n      hasIconOnly\n        ? getIconButtonPaddingBySizeAndKind({ kind, size, selected })\n        : getButtonPaddingBySizeAndKind({ kind, size, selected })\n    }`,\n    minWidth: \"28px\",\n    minHeight: \"28px\",\n  }),\n  ...(size === \"medium\" && {\n    ...typography.button2,\n    padding: `${\n      hasIconOnly\n        ? getIconButtonPaddingBySizeAndKind({ kind, size, selected })\n        : getButtonPaddingBySizeAndKind({ kind, size, selected })\n    }`,\n    minWidth: \"36px\",\n    minHeight: \"36px\",\n  }),\n  ...(size === \"large\" && {\n    ...typography.button1,\n    padding: `${\n      hasIconOnly\n        ? getIconButtonPaddingBySizeAndKind({ kind, size, selected })\n        : getButtonPaddingBySizeAndKind({ kind, size, selected })\n    }`,\n    minWidth: \"44px\",\n    minHeight: \"44px\",\n  }),\n});\n\nexport const kindStyle = ({ kind, color, token }: KindStyleParams) => ({\n  // kind: container\n  ...(kind === \"contained\" &&\n    color === \"primary\" && {\n      color: token.component.btn_contained_primary_text,\n      backgroundColor: token.component.btn_contained_primary_bg,\n      \"&:hover\": {\n        backgroundColor: token.component.btn_contained_primary_bg,\n      },\n      \"&.Mui-disabled\": {\n        opacity: 0.38,\n        border: \"none\",\n        color: token.component.btn_contained_primary_text,\n      },\n    }),\n  ...(kind === \"contained\" &&\n    color === \"secondary\" && {\n      color: token.component.btn_contained_secondary_text,\n      backgroundColor: token.component.btn_contained_secondary_bg,\n      \"&:hover\": {\n        backgroundColor: token.component.btn_contained_secondary_bg,\n      },\n      \"&.Mui-disabled\": {\n        opacity: 0.38,\n        border: \"none\",\n        color: token.component.btn_contained_secondary_text,\n      },\n    }),\n  ...(kind === \"contained\" &&\n    color === \"error\" && {\n      color: token.component.btn_contained_error_text,\n      backgroundColor: token.component.btn_contained_error_bg,\n      \"&:hover\": {\n        backgroundColor: token.component.btn_contained_error_bg,\n      },\n      \"&.Mui-disabled\": {\n        opacity: 0.38,\n        border: \"none\",\n        color: token.component.btn_contained_error_text,\n      },\n    }),\n  // kind: ghost\n  ...(kind === \"ghost\" &&\n    color === \"primary\" && {\n      color: token.component.btn_ghost_primary_text,\n      border: \"none\",\n      \"&:hover\": {\n        backgroundColor: \"rgba(0, 0, 0, 0.06)\",\n      },\n      \"&.Mui-disabled\": {\n        opacity: 0.38,\n        border: \"none\",\n        color: token.component.btn_ghost_primary_text,\n      },\n    }),\n  ...(kind === \"ghost\" &&\n    color === \"secondary\" && {\n      color: token.component.btn_ghost_secondary_text,\n      border: \"none\",\n      \"&:hover\": {\n        backgroundColor: \"rgba(0, 0, 0, 0.06)\",\n      },\n      \"&.Mui-disabled\": {\n        opacity: 0.38,\n        border: \"none\",\n        color: token.component.btn_ghost_secondary_text,\n      },\n    }),\n  ...(kind === \"ghost\" &&\n    color === \"error\" && {\n      color: token.component.btn_ghost_error_text,\n      \"&:hover\": {\n        backgroundColor: \"rgba(0, 0, 0, 0.06)\",\n      },\n      \"&.Mui-disabled\": {\n        opacity: 0.38,\n        border: \"none\",\n        color: token.component.btn_ghost_error_text,\n      },\n    }),\n  // kind: outlined\n  ...(kind === \"outlined\" &&\n    color === \"primary\" && {\n      color: token.component.btn_outlined_primary_text,\n      border: `${OUTLINED_BORDER_WIDTH}px solid ${token.component.btn_outlined_primary_border}`,\n      \"&:hover\": {\n        backgroundColor: \"rgba(0, 0, 0, 0.06)\", // TODO: color util function 추가 후 변경\n      },\n      \"&.Mui-disabled\": {\n        opacity: 0.38,\n        color: token.component.btn_outlined_primary_text,\n      },\n    }),\n});\n\nexport const commonStyle = ({ token }: { token: ColorToken }) =>\n  ({\n    fontWeight: \"500\",\n    borderRadius: \"8px\",\n    textTransform: \"initial\",\n    \"&.Mui-focusVisible\": {\n      \"&::after\": {\n        position: \"absolute\",\n        width: `calc(100% + ${PADDING_OF_FOCUS}px)`,\n        height: `calc(100% + ${PADDING_OF_FOCUS}px)`,\n        content: '\"\"',\n        borderRadius: \"11px\",\n        border: `1px solid ${token.core.focused}`,\n        boxSizing: \"border-box\",\n      },\n    },\n  } as const);\n\nexport const iconStyle = ({\n  size,\n  hasIconOnly,\n}: Pick<CustomButtonProps, \"size\" | \"hasIconOnly\">) => ({\n  \"& .MuiButton-startIcon\": {\n    width: \"20px\",\n    height: \"20px\",\n    margin: 0,\n    marginRight: hasIconOnly ? \"0px\" : size === \"large\" ? \"8px\" : \"4px\",\n\n    // This style was added for Mui Button Svg Icon handling\n    \"*:nth-of-type(1)\": {\n      fontSize: \"20px\",\n    },\n  },\n  svg: {\n    width: \"20px\",\n    height: \"20px\",\n    margin: 0,\n    marginRight: hasIconOnly ? \"0px\" : size === \"large\" ? \"8px\" : \"4px\",\n  },\n});\n\nexport const CustomButton = styled(MuiButton, {\n  shouldForwardProp: (prop: string) => {\n    return ![\"kind\", \"hasIconOnly\"].includes(prop);\n  },\n})<CustomButtonProps>(\n  ({\n    theme: {\n      typography,\n      palette: { token },\n    },\n    kind,\n    size,\n    color,\n    hasIconOnly,\n  }) => ({\n    ...commonStyle({ token }),\n    ...iconStyle({ size, hasIconOnly }),\n    ...sizeStyle({ size, kind, hasIconOnly, typography }),\n    ...kindStyle({ kind, color, token }),\n  })\n);\n","export const PADDING_OF_FOCUS = 6; // TODO: focus 시 padding 고정값, size 별 차이 여부 확인 필요\nexport const OUTLINED_BORDER_WIDTH = 1;\n","module.exports = require(\"@mui/material\");","module.exports = require(\"@mui/material/styles\");","module.exports = require(\"react/jsx-runtime\");","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import React from \"react\";\n\nimport { CustomButton } from \"./Button.styled\";\n\nimport type { ButtonProps } from \"./Button.types\";\n\nconst Button = (props: Omit<ButtonProps, \"hasIconOnly\">) => {\n  const {\n    kind = \"contained\",\n    size = \"small\",\n    color = \"primary\",\n    icon,\n    className,\n    children,\n    ...buttonProps\n  } = props;\n  const hasIconOnly = Boolean(icon && !children);\n\n  return (\n    <>\n      {kind === \"contained\" || kind === \"ghost\" ? (\n        <CustomButton\n          className={`${kind} ${className ? className : \"\"}`}\n          kind={kind}\n          color={color}\n          size={size}\n          startIcon={icon}\n          hasIconOnly={hasIconOnly}\n          disableRipple\n          disableFocusRipple\n          {...buttonProps}\n        >\n          {!hasIconOnly && <>{children}</>}\n        </CustomButton>\n      ) : (\n        <CustomButton\n          className={`outlined ${className ? className : \"\"}`}\n          kind=\"outlined\"\n          color=\"primary\"\n          size={size}\n          startIcon={icon}\n          hasIconOnly={hasIconOnly}\n          disableRipple\n          disableFocusRipple\n          {...buttonProps}\n        >\n          {!hasIconOnly && <>{children}</>}\n        </CustomButton>\n      )}\n    </>\n  );\n};\n\nexport default Button;\n"],"names":["getButtonPaddingBySizeAndKind","kind","size","selected","getIconButtonPaddingBySizeAndKind","CustomButton","styled","shouldForwardProp","prop","includes","theme","typography","token","color","hasIconOnly","fontWeight","borderRadius","textTransform","position","width","height","content","border","core","focused","boxSizing","commonStyle","margin","marginRight","fontSize","svg","iconStyle","button2","padding","minWidth","minHeight","button1","sizeStyle","component","btn_contained_primary_text","backgroundColor","btn_contained_primary_bg","opacity","btn_contained_secondary_text","btn_contained_secondary_bg","btn_contained_error_text","btn_contained_error_bg","btn_ghost_primary_text","btn_ghost_secondary_text","btn_ghost_error_text","btn_outlined_primary_text","btn_outlined_primary_border","kindStyle","module","exports","require","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","d","definition","key","o","Object","defineProperty","enumerable","get","obj","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value","props","icon","className","children","buttonProps","Boolean","startIcon","disableRipple","disableFocusRipple"],"sourceRoot":""}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}

package/dist/components/Button/utils/getButtonPaddingBySizeAndKind.js

@@ -0,0 +1,23 @@
+import { OUTLINED_BORDER_WIDTH } from "../const";
+/**
+ * When kind is outlined,
+ * the padding value must include the border width of outlined.
+ * This function takes care of this.
+ */
+export const getButtonPaddingBySizeAndKind = ({ kind, size, selected = false, }) => {
+    if (size === "small") {
+        return kind === "outlined" && !selected
+            ? `${4 - OUTLINED_BORDER_WIDTH}px ${8 - OUTLINED_BORDER_WIDTH}px`
+            : "4px 8px";
+    }
+    if (size === "medium") {
+        return kind === "outlined" && !selected
+            ? `${8 - OUTLINED_BORDER_WIDTH}px ${12 - OUTLINED_BORDER_WIDTH}px`
+            : "8px 12px";
+    }
+    // size === "large"
+    return kind === "outlined" && !selected
+        ? `${10 - OUTLINED_BORDER_WIDTH}px ${12 - OUTLINED_BORDER_WIDTH}px`
+        : "10px 12px";
+};
+//# sourceMappingURL=getButtonPaddingBySizeAndKind.js.map

package/dist/components/Button/utils/getButtonPaddingBySizeAndKind.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getButtonPaddingBySizeAndKind.js","sourceRoot":"","sources":["../../../../src/components/Button/utils/getButtonPaddingBySizeAndKind.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAQjD;;;;GAIG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,EAC5C,IAAI,EACJ,IAAI,EACJ,QAAQ,GAAG,KAAK,GACoB,EAAE,EAAE;IACxC,IAAI,IAAI,KAAK,OAAO,EAAE;QACpB,OAAO,IAAI,KAAK,UAAU,IAAI,CAAC,QAAQ;YACrC,CAAC,CAAC,GAAG,CAAC,GAAG,qBAAqB,MAAM,CAAC,GAAG,qBAAqB,IAAI;YACjE,CAAC,CAAC,SAAS,CAAC;KACf;IAED,IAAI,IAAI,KAAK,QAAQ,EAAE;QACrB,OAAO,IAAI,KAAK,UAAU,IAAI,CAAC,QAAQ;YACrC,CAAC,CAAC,GAAG,CAAC,GAAG,qBAAqB,MAAM,EAAE,GAAG,qBAAqB,IAAI;YAClE,CAAC,CAAC,UAAU,CAAC;KAChB;IAED,mBAAmB;IACnB,OAAO,IAAI,KAAK,UAAU,IAAI,CAAC,QAAQ;QACrC,CAAC,CAAC,GAAG,EAAE,GAAG,qBAAqB,MAAM,EAAE,GAAG,qBAAqB,IAAI;QACnE,CAAC,CAAC,WAAW,CAAC;AAClB,CAAC,CAAC"}

package/dist/components/Button/utils/getHoverStyle.js

@@ -0,0 +1,7 @@
+const getHoverStyle = (backgroundColor) => ({
+    position: "relative",
+    zIndex: 0,
+    backgroundColor,
+});
+export default getHoverStyle;
+//# sourceMappingURL=getHoverStyle.js.map

package/dist/components/Button/utils/getHoverStyle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getHoverStyle.js","sourceRoot":"","sources":["../../../../src/components/Button/utils/getHoverStyle.ts"],"names":[],"mappings":"AAAA,MAAM,aAAa,GAAG,CAAC,eAA6C,EAAE,EAAE,CAAC,CAAC;IACxE,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,CAAC;IACT,eAAe;CAChB,CAAC,CAAC;AAEH,eAAe,aAAa,CAAC"}

package/dist/components/Button/utils/getIconButtonPaddingBySizeAndKind.js

@@ -0,0 +1,23 @@
+import { OUTLINED_BORDER_WIDTH } from "../const";
+/**
+ * When kind is outlined,
+ * the padding value must include the border width of outlined.
+ * This function takes care of this.
+ */
+export const getIconButtonPaddingBySizeAndKind = ({ kind, size, selected = false, }) => {
+    if (size === "small") {
+        return kind === "outlined" && !selected
+            ? `${4 - OUTLINED_BORDER_WIDTH}px`
+            : "4px";
+    }
+    if (size === "medium") {
+        return kind === "outlined" && !selected
+            ? `${8 - OUTLINED_BORDER_WIDTH}px`
+            : "8px";
+    }
+    // size === "large"
+    return kind === "outlined" && !selected
+        ? `${12 - OUTLINED_BORDER_WIDTH}px`
+        : "12px";
+};
+//# sourceMappingURL=getIconButtonPaddingBySizeAndKind.js.map

package/dist/components/Button/utils/getIconButtonPaddingBySizeAndKind.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getIconButtonPaddingBySizeAndKind.js","sourceRoot":"","sources":["../../../../src/components/Button/utils/getIconButtonPaddingBySizeAndKind.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAWjD;;;;GAIG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAG,CAAC,EAChD,IAAI,EACJ,IAAI,EACJ,QAAQ,GAAG,KAAK,GACuB,EAAE,EAAE;IAC3C,IAAI,IAAI,KAAK,OAAO,EAAE;QACpB,OAAO,IAAI,KAAK,UAAU,IAAI,CAAC,QAAQ;YACrC,CAAC,CAAC,GAAG,CAAC,GAAG,qBAAqB,IAAI;YAClC,CAAC,CAAC,KAAK,CAAC;KACX;IAED,IAAI,IAAI,KAAK,QAAQ,EAAE;QACrB,OAAO,IAAI,KAAK,UAAU,IAAI,CAAC,QAAQ;YACrC,CAAC,CAAC,GAAG,CAAC,GAAG,qBAAqB,IAAI;YAClC,CAAC,CAAC,KAAK,CAAC;KACX;IAED,mBAAmB;IACnB,OAAO,IAAI,KAAK,UAAU,IAAI,CAAC,QAAQ;QACrC,CAAC,CAAC,GAAG,EAAE,GAAG,qBAAqB,IAAI;QACnC,CAAC,CAAC,MAAM,CAAC;AACb,CAAC,CAAC"}

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { styled } from "@mui/material/styles";
+import MuiCheckbox from "@mui/material/Checkbox";
+const CustomCheckbox = styled(MuiCheckbox)(({ theme }) => ({
+    width: 20,
+    height: 20,
+    padding: 1,
+    "&.Mui-disabled": {
+        opacity: 0.38,
+    },
+    "&.Mui-focusVisible:after": {
+        content: '""',
+        position: "absolute",
+        width: 24,
+        height: 24,
+        border: `1px solid ${theme.palette.token.core.focused}`,
+        borderRadius: "7px",
+    },
+}));
+const iconSize = {
+    width: 18,
+    height: 18,
+};
+const DefaultIcon = styled("span")(({ theme }) => ({
+    ...iconSize,
+    backgroundColor: theme.palette.token.component.selectcontrol_off,
+    maskImage: "url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath" +
+        " fill-rule='evenodd' clip-rule='evenodd' d='M14 1.5H4C2.61929 1.5 1.5 2.61929 1.5 4V14C1.5 15.3807 2.61929 16.5 4 16.5H14C15.3807 " +
+        "16.5 16.5 15.3807 16.5 14V4C16.5 2.61929 15.3807 1.5 14 1.5ZM4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 14 0H4Z' /%3E%3C/svg%3E\")",
+}));
+const CheckedIcon = styled("span")(({ theme }) => ({
+    ...iconSize,
+    backgroundColor: theme.palette.token.component.selectcontrol_on,
+    maskImage: "url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath" +
+        " fill-rule='evenodd' clip-rule='evenodd' d='M4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 14 0H4ZM14.2516 " +
+        "7.14413C14.6074 6.72168 14.5533 6.09083 14.1309 5.73508C13.7084 5.37933 13.0776 5.43341 12.7218 5.85586L8.31824 11.0851L5.14993 8.37556C4.7302 8.01661 4.09895 8.06588 3.74 8.48561C3.38105 8.90533 3.43032 9.53658 3.85005 9.89553L7.78416 13.26C7.98672 13.4332 8.25006 13.5184 8.51571 13.4967C8.78135 13.4749 9.02732 13.348 9.19901 13.1441L14.2516 7.14413Z' /%3E%3C/svg%3E\")",
+}));
+const IndeterminateIcon = styled("span")(({ theme }) => ({
+    ...iconSize,
+    backgroundColor: theme.palette.token.component.selectcontrol_on,
+    maskImage: "url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath" +
+        " fill-rule='evenodd' clip-rule='evenodd' d='M4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 " +
+        "14 0H4ZM4 8C3.44772 8 3 8.44771 3 9C3 9.5523 3.44771 10 4 10H14C14.5523 10 15 9.5523 15 9C15 8.44772 14.5523 8 14 8H4Z' /%3E%3C/svg%3E\")",
+}));
+const Checkbox = (props) => {
+    return (_jsx(CustomCheckbox, { disableRipple: true, icon: _jsx(DefaultIcon, {}), checkedIcon: _jsx(CheckedIcon, {}), indeterminateIcon: _jsx(IndeterminateIcon, {}), ...props }));
+};
+export default Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/dist/components/Checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,WAAW,MAAM,wBAAwB,CAAC;AAGjD,MAAM,cAAc,GAAG,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACzD,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,EAAE;IACV,OAAO,EAAE,CAAC;IACV,gBAAgB,EAAE;QAChB,OAAO,EAAE,IAAI;KACd;IACD,0BAA0B,EAAE;QAC1B,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,EAAE;QACT,MAAM,EAAE,EAAE;QACV,MAAM,EAAE,aAAa,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,EAAE;QACvD,YAAY,EAAE,KAAK;KACpB;CACF,CAAC,CAAC,CAAC;AAEJ,MAAM,QAAQ,GAAG;IACf,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,EAAE;CACX,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACjD,GAAG,QAAQ;IACX,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,iBAAiB;IAChE,SAAS,EACP,gHAAgH;QAChH,oIAAoI;QACpI,wMAAwM;CAC3M,CAAC,CAAC,CAAC;AAEJ,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACjD,GAAG,QAAQ;IACX,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,gBAAgB;IAC/D,SAAS,EACP,gHAAgH;QAChH,8KAA8K;QAC9K,sXAAsX;CACzX,CAAC,CAAC,CAAC;AAEJ,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IACvD,GAAG,QAAQ;IACX,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,gBAAgB;IAC/D,SAAS,EACP,gHAAgH;QAChH,8JAA8J;QAC9J,2IAA2I;CAC9I,CAAC,CAAC,CAAC;AAEJ,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;IACxC,OAAO,CACL,KAAC,cAAc,IACb,aAAa,QACb,IAAI,EAAE,KAAC,WAAW,KAAG,EACrB,WAAW,EAAE,KAAC,WAAW,KAAG,EAC5B,iBAAiB,EAAE,KAAC,iBAAiB,KAAG,KACpC,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/components/Checkbox/index.js

@@ -1,2 +1,2 @@
-(()=>{"use strict";var e={n:t=>{var o=t&&t.__esModule?()=>t.default:()=>t;return e.d(o,{a:o}),o},d:(t,o)=>{for(var r in o)e.o(o,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:o[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{default:()=>p});const o=require("react/jsx-runtime"),r=require("@mui/material/styles"),n=require("@mui/material/Checkbox");var a=e.n(n),l=function(){return l=Object.assign||function(e){for(var t,o=1,r=arguments.length;o<r;o++)for(var n in t=arguments[o])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},l.apply(this,arguments)},i=(0,r.styled)(a())((function(e){var t=e.theme;return{width:20,height:20,padding:1,"&.Mui-disabled":{opacity:.38},"&.Mui-focusVisible:after":{content:'""',position:"absolute",width:24,height:24,border:"1px solid ".concat(t.palette.token.core.focused),borderRadius:"7px"}}})),s={width:18,height:18},d=(0,r.styled)("span")((function(e){var t=e.theme;return l(l({},s),{backgroundColor:t.palette.token.component.selectcontrol_off,maskImage:"url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14 1.5H4C2.61929 1.5 1.5 2.61929 1.5 4V14C1.5 15.3807 2.61929 16.5 4 16.5H14C15.3807 16.5 16.5 15.3807 16.5 14V4C16.5 2.61929 15.3807 1.5 14 1.5ZM4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 14 0H4Z' /%3E%3C/svg%3E\")"})})),u=(0,r.styled)("span")((function(e){var t=e.theme;return l(l({},s),{backgroundColor:t.palette.token.component.selectcontrol_on,maskImage:"url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 14 0H4ZM14.2516 7.14413C14.6074 6.72168 14.5533 6.09083 14.1309 5.73508C13.7084 5.37933 13.0776 5.43341 12.7218 5.85586L8.31824 11.0851L5.14993 8.37556C4.7302 8.01661 4.09895 8.06588 3.74 8.48561C3.38105 8.90533 3.43032 9.53658 3.85005 9.89553L7.78416 13.26C7.98672 13.4332 8.25006 13.5184 8.51571 13.4967C8.78135 13.4749 9.02732 13.348 9.19901 13.1441L14.2516 7.14413Z' /%3E%3C/svg%3E\")"})})),c=(0,r.styled)("span")((function(e){var t=e.theme;return l(l({},s),{backgroundColor:t.palette.token.component.selectcontrol_on,maskImage:"url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 14 0H4ZM4 8C3.44772 8 3 8.44771 3 9C3 9.5523 3.44771 10 4 10H14C14.5523 10 15 9.5523 15 9C15 8.44772 14.5523 8 14 8H4Z' /%3E%3C/svg%3E\")"})}));const p=function(e){return(0,o.jsx)(i,l({disableRipple:!0,icon:(0,o.jsx)(d,{}),checkedIcon:(0,o.jsx)(u,{}),indeterminateIcon:(0,o.jsx)(c,{})},e))};exports.default=t.default,Object.defineProperty(exports,"__esModule",{value:!0})})();
+export { default } from "./Checkbox";
 //# sourceMappingURL=index.js.map

package/dist/components/Checkbox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"components/Checkbox/index.js","mappings":"mBACA,IAAIA,EAAsB,CCA1BA,EAAyBC,IACxB,IAAIC,EAASD,GAAUA,EAAOE,WAC7B,IAAOF,EAAiB,QACxB,IAAM,EAEP,OADAD,EAAoBI,EAAEF,EAAQ,CAAEG,EAAGH,IAC5BA,CAAM,ECLdF,EAAwB,CAACM,EAASC,KACjC,IAAI,IAAIC,KAAOD,EACXP,EAAoBS,EAAEF,EAAYC,KAASR,EAAoBS,EAAEH,EAASE,IAC5EE,OAAOC,eAAeL,EAASE,EAAK,CAAEI,YAAY,EAAMC,IAAKN,EAAWC,IAE1E,ECNDR,EAAwB,CAACc,EAAKC,IAAUL,OAAOM,UAAUC,eAAeC,KAAKJ,EAAKC,GCClFf,EAAyBM,IACH,oBAAXa,QAA0BA,OAAOC,aAC1CV,OAAOC,eAAeL,EAASa,OAAOC,YAAa,CAAEC,MAAO,WAE7DX,OAAOC,eAAeL,EAAS,aAAc,CAAEe,OAAO,GAAO,G,mCCL9D,MAAM,EAA+BC,QAAQ,qBCAvC,EAA+BA,QAAQ,wBCAvC,EAA+BA,QAAQ,0B,6NCKvCC,GAAiB,IAAAC,QAAO,IAAP,EAAoB,SAAC,G,IAAEC,EAAK,QAAO,OACxDC,MAAO,GACPC,OAAQ,GACRC,QAAS,EACT,iBAAkB,CAChBC,QAAS,KAEX,2BAA4B,CAC1BC,QAAS,KACTC,SAAU,WACVL,MAAO,GACPC,OAAQ,GACRK,OAAQ,oBAAaP,EAAMQ,QAAQC,MAAMC,KAAKC,SAC9CC,aAAc,OAbwC,IAiBpDC,EAAW,CACfZ,MAAO,GACPC,OAAQ,IAGJY,GAAc,IAAAf,QAAO,OAAP,EAAe,SAAC,G,IAAEC,EAAK,QAAO,cAC7Ca,GAAQ,CACXE,gBAAiBf,EAAMQ,QAAQC,MAAMO,UAAUC,kBAC/CC,UACE,0bAJ8C,IAS5CC,GAAc,IAAApB,QAAO,OAAP,EAAe,SAAC,G,IAAEC,EAAK,QAAO,cAC7Ca,GAAQ,CACXE,gBAAiBf,EAAMQ,QAAQC,MAAMO,UAAUI,iBAC/CF,UACE,kpBAJ8C,IAS5CG,GAAoB,IAAAtB,QAAO,OAAP,EAAe,SAAC,G,IAAEC,EAAK,QAAO,cACnDa,GAAQ,CACXE,gBAAiBf,EAAMQ,QAAQC,MAAMO,UAAUI,iBAC/CF,UACE,uZAJoD,IAqBxD,QAZiB,SAACI,GAChB,OACE,SAACxB,EAAc,GACbyB,eAAa,EACbC,MAAM,SAACV,EAAW,IAClBW,aAAa,SAACN,EAAW,IACzBO,mBAAmB,SAACL,EAAiB,KACjCC,GAGV,E","sources":["webpack://@lunit/design-system/webpack/bootstrap","webpack://@lunit/design-system/webpack/runtime/compat get default export","webpack://@lunit/design-system/webpack/runtime/define property getters","webpack://@lunit/design-system/webpack/runtime/hasOwnProperty shorthand","webpack://@lunit/design-system/webpack/runtime/make namespace object","webpack://@lunit/design-system/external commonjs \"react/jsx-runtime\"","webpack://@lunit/design-system/external commonjs \"@mui/material/styles\"","webpack://@lunit/design-system/external commonjs \"@mui/material/Checkbox\"","webpack://@lunit/design-system/./src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["// The require scope\nvar __webpack_require__ = {};\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"react/jsx-runtime\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"@mui/material/styles\");","const __WEBPACK_NAMESPACE_OBJECT__ = require(\"@mui/material/Checkbox\");","import React from \"react\";\nimport { styled } from \"@mui/material/styles\";\nimport MuiCheckbox from \"@mui/material/Checkbox\";\nimport type { CheckboxProps } from \"@mui/material\";\n\nconst CustomCheckbox = styled(MuiCheckbox)(({ theme }) => ({\n  width: 20,\n  height: 20,\n  padding: 1,\n  \"&.Mui-disabled\": {\n    opacity: 0.38,\n  },\n  \"&.Mui-focusVisible:after\": {\n    content: '\"\"',\n    position: \"absolute\",\n    width: 24,\n    height: 24,\n    border: `1px solid ${theme.palette.token.core.focused}`,\n    borderRadius: \"7px\",\n  },\n}));\n\nconst iconSize = {\n  width: 18,\n  height: 18,\n};\n\nconst DefaultIcon = styled(\"span\")(({ theme }) => ({\n  ...iconSize,\n  backgroundColor: theme.palette.token.component.selectcontrol_off,\n  maskImage:\n    \"url(\\\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath\" +\n    \" fill-rule='evenodd' clip-rule='evenodd' d='M14 1.5H4C2.61929 1.5 1.5 2.61929 1.5 4V14C1.5 15.3807 2.61929 16.5 4 16.5H14C15.3807 \" +\n    \"16.5 16.5 15.3807 16.5 14V4C16.5 2.61929 15.3807 1.5 14 1.5ZM4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 14 0H4Z' /%3E%3C/svg%3E\\\")\",\n}));\n\nconst CheckedIcon = styled(\"span\")(({ theme }) => ({\n  ...iconSize,\n  backgroundColor: theme.palette.token.component.selectcontrol_on,\n  maskImage:\n    \"url(\\\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath\" +\n    \" fill-rule='evenodd' clip-rule='evenodd' d='M4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 14 0H4ZM14.2516 \" +\n    \"7.14413C14.6074 6.72168 14.5533 6.09083 14.1309 5.73508C13.7084 5.37933 13.0776 5.43341 12.7218 5.85586L8.31824 11.0851L5.14993 8.37556C4.7302 8.01661 4.09895 8.06588 3.74 8.48561C3.38105 8.90533 3.43032 9.53658 3.85005 9.89553L7.78416 13.26C7.98672 13.4332 8.25006 13.5184 8.51571 13.4967C8.78135 13.4749 9.02732 13.348 9.19901 13.1441L14.2516 7.14413Z' /%3E%3C/svg%3E\\\")\",\n}));\n\nconst IndeterminateIcon = styled(\"span\")(({ theme }) => ({\n  ...iconSize,\n  backgroundColor: theme.palette.token.component.selectcontrol_on,\n  maskImage:\n    \"url(\\\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath\" +\n    \" fill-rule='evenodd' clip-rule='evenodd' d='M4 0C1.79086 0 0 1.79086 0 4V14C0 16.2091 1.79086 18 4 18H14C16.2091 18 18 16.2091 18 14V4C18 1.79086 16.2091 0 \" +\n    \"14 0H4ZM4 8C3.44772 8 3 8.44771 3 9C3 9.5523 3.44771 10 4 10H14C14.5523 10 15 9.5523 15 9C15 8.44772 14.5523 8 14 8H4Z' /%3E%3C/svg%3E\\\")\",\n}));\n\nconst Checkbox = (props: CheckboxProps) => {\n  return (\n    <CustomCheckbox\n      disableRipple\n      icon={<DefaultIcon />}\n      checkedIcon={<CheckedIcon />}\n      indeterminateIcon={<IndeterminateIcon />}\n      {...props}\n    />\n  );\n};\n\nexport default Checkbox;\n"],"names":["__webpack_require__","module","getter","__esModule","d","a","exports","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","require","CustomCheckbox","styled","theme","width","height","padding","opacity","content","position","border","palette","token","core","focused","borderRadius","iconSize","DefaultIcon","backgroundColor","component","selectcontrol_off","maskImage","CheckedIcon","selectcontrol_on","IndeterminateIcon","props","disableRipple","icon","checkedIcon","indeterminateIcon"],"sourceRoot":""}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC"}

package/dist/components/Chip/Chip.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar } from "@mui/material";
+import Close16 from "@lunit/design-system-icons/Close16";
+import { StyledOutlinedChip, StyledContainedChipBase, StyledContainedChipEnable, StyledContainedChipDeletable, } from "./Chip.styled";
+const Chip = (props) => {
+    const { kind, onDelete, onClick, ...restProps } = props;
+    if (kind === "outlined")
+        return _jsx(OutlinedChip, { ...props });
+    else if (onClick)
+        return _jsx(EnableContainedChip, { ...props });
+    else if (onDelete)
+        return _jsx(DeletableContainedChip, { ...props });
+    return _jsx(ReadOnlyContainedChip, { ...restProps });
+};
+const OutlinedChip = (props) => {
+    const { color = "primary", ...restProps } = props;
+    return (_jsx(StyledOutlinedChip, { ...restProps, variant: "outlined", disabled: true, color: color }));
+};
+/**
+ * Conditional styling for contained chip
+ */
+const getAvatar = (thumbnail) => {
+    if (!thumbnail || typeof thumbnail !== "string")
+        return;
+    if (thumbnail.length === 0)
+        return _jsx(Avatar, {});
+    return _jsx(Avatar, { children: thumbnail.slice(0, 1).toLocaleUpperCase() });
+};
+const getIcon = (thumbnail) => {
+    if (thumbnail && typeof thumbnail !== "string")
+        return thumbnail;
+    return undefined;
+};
+const getLabelMargin = (thumbnail, deletable) => {
+    return {
+        marginLeft: thumbnail ? "0px" : "8px",
+        marginRight: deletable ? "0px" : "8px",
+    };
+};
+const ReadOnlyContainedChip = (props) => {
+    const { color = "primary", thumbnail, sx, ...restProps } = props;
+    return (_jsx(StyledContainedChipBase, { ...restProps, disabled: true, avatar: getAvatar(thumbnail), icon: getIcon(thumbnail), color: color, sx: {
+            "& .MuiChip-label": {
+                ...getLabelMargin(thumbnail),
+            },
+            ...sx,
+        } }));
+};
+const EnableContainedChip = (props) => {
+    const { color = "primary", thumbnail, onClick, sx, ...restProps } = props;
+    return (_jsx(StyledContainedChipEnable, { ...restProps, onClick: onClick, avatar: getAvatar(thumbnail), icon: getIcon(thumbnail), color: color, sx: {
+            "& .MuiChip-label": {
+                ...getLabelMargin(thumbnail),
+            },
+        } }));
+};
+const DeleteIconWithHoverLayer = ({ onClick }) => {
+    return (_jsxs(_Fragment, { children: [_jsx(Close16, {}), _jsx(Close16, { className: "delete-icon-hover-layer", onClick: onClick })] }));
+};
+const DeletableContainedChip = (props) => {
+    const { color = "primary", thumbnail, onDelete, sx, ...restProps } = props;
+    return (_jsx(StyledContainedChipDeletable, { ...restProps, color: color, onDelete: onDelete, deleteIcon: _jsx(DeleteIconWithHoverLayer, { onClick: onDelete }), avatar: getAvatar(thumbnail), icon: getIcon(thumbnail), sx: {
+            "& .MuiChip-label": {
+                ...getLabelMargin(thumbnail, Boolean(onDelete)),
+            },
+            ...sx,
+        } }));
+};
+export default Chip;
+//# sourceMappingURL=Chip.js.map

package/dist/components/Chip/Chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"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"}