@remember-web/primitive 0.1.12 → 0.1.13

package/dist/src/Modals/Dialog/index.cjs.js

@@ -1,95 +0,0 @@
-"use client";
-'use strict';
-
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-var DialogPrimitive = require('@radix-ui/react-dialog');
-var icon = require('@remember-web/icon');
-var index = require('../../Common/Flex/index.cjs.js');
-var styles = require('./styles.cjs.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
-
-var _excluded = ["children"],
-  _excluded2 = ["children", "dimmed"];
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/**
- * @prop {React.ReactNode} children
- * @prop {boolean} open
- * @prop {boolean} defaultOpen
- * @prop {(open: boolean) => void} onOpenChange
- * @prop {boolean} modal
- * @prop {string} id
- */
-function Dialog(_ref) {
-  var children = _ref.children,
-    props = _objectWithoutProperties__default.default(_ref, _excluded);
-  return /*#__PURE__*/jsxRuntime.jsx(DialogPrimitive.Root, _objectSpread(_objectSpread({}, props), {}, {
-    children: children
-  }));
-}
-
-/**
- * @prop {boolean} dimmed
- * @see https://www.radix-ui.com/docs/primitives/components/dialog
- */
-Dialog.Content = function (_ref2) {
-  var children = _ref2.children,
-    _ref2$dimmed = _ref2.dimmed,
-    dimmed = _ref2$dimmed === void 0 ? true : _ref2$dimmed,
-    props = _objectWithoutProperties__default.default(_ref2, _excluded2);
-  return /*#__PURE__*/jsxRuntime.jsxs(DialogPrimitive.Portal, {
-    children: [dimmed && /*#__PURE__*/jsxRuntime.jsx(styles.StyledOverlay, {}), /*#__PURE__*/jsxRuntime.jsx(styles.DialogContent, _objectSpread(_objectSpread({}, props), {}, {
-      children: /*#__PURE__*/jsxRuntime.jsx(index.Flex, {
-        direction: "column",
-        align: "center",
-        children: children
-      })
-    }))]
-  });
-};
-Dialog.HeadIcon = function (_ref3) {
-  var _ref3$type = _ref3.type,
-    type = _ref3$type === void 0 ? 'alert' : _ref3$type;
-  return /*#__PURE__*/jsxRuntime.jsxs(styles.DialogIcon, {
-    children: [type === 'alert' && /*#__PURE__*/jsxRuntime.jsx(icon.PictogramAlert, {
-      size: 40
-    }), type === 'confirm' && /*#__PURE__*/jsxRuntime.jsx(icon.PictogramCheck, {
-      size: 40
-    })]
-  });
-};
-Dialog.CloseIcon = function () {
-  return /*#__PURE__*/jsxRuntime.jsx(DialogPrimitive.Close, {
-    asChild: true,
-    children: /*#__PURE__*/jsxRuntime.jsx(styles.IconButton, {
-      type: "button",
-      "aria-label": "Close",
-      children: /*#__PURE__*/jsxRuntime.jsx(icon.IconClose, {
-        size: "small"
-      })
-    })
-  });
-};
-Dialog.Title = function (_ref4) {
-  var children = _ref4.children;
-  return /*#__PURE__*/jsxRuntime.jsx(styles.DialogTitle, {
-    children: children
-  });
-};
-Dialog.Description = function (_ref5) {
-  var children = _ref5.children;
-  return /*#__PURE__*/jsxRuntime.jsx(styles.DialogDescription, {
-    children: children
-  });
-};
-Dialog.Trigger = DialogPrimitive.Trigger;
-Dialog.Close = DialogPrimitive.Close;
-
-exports.Dialog = Dialog;
-//# sourceMappingURL=index.cjs.js.map

package/dist/src/Modals/Dialog/index.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/Modals/Dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { DialogContentProps, DialogProps } from '@radix-ui/react-dialog';\nimport { Root, Trigger, Close, Portal } from '@radix-ui/react-dialog';\nimport { IconClose, PictogramAlert, PictogramCheck } from '@remember-web/icon';\n\nimport { Flex } from '@/Common/Flex';\n\nimport {\n  DialogContent,\n  DialogDescription,\n  DialogIcon,\n  DialogTitle,\n  IconButton,\n  StyledOverlay,\n} from './styles';\n\ninterface ContentProps extends DialogContentProps {\n  children: React.ReactNode;\n  dimmed?: boolean;\n}\n\n/**\n * @prop {React.ReactNode} children\n * @prop {boolean} open\n * @prop {boolean} defaultOpen\n * @prop {(open: boolean) => void} onOpenChange\n * @prop {boolean} modal\n * @prop {string} id\n */\nexport function Dialog({ children, ...props }: DialogProps) {\n  return <Root {...props}>{children}</Root>;\n}\n\n/**\n * @prop {boolean} dimmed\n * @see https://www.radix-ui.com/docs/primitives/components/dialog\n */\nDialog.Content = ({ children, dimmed = true, ...props }: ContentProps) => (\n  <Portal>\n    {dimmed && <StyledOverlay />}\n    <DialogContent {...props}>\n      <Flex direction=\"column\" align=\"center\">\n        {children}\n      </Flex>\n    </DialogContent>\n  </Portal>\n);\n\nDialog.HeadIcon = ({ type = 'alert' }: { type?: 'alert' | 'confirm' }) => (\n  <DialogIcon>\n    {type === 'alert' && <PictogramAlert size={40} />}\n    {type === 'confirm' && <PictogramCheck size={40} />}\n  </DialogIcon>\n);\n\nDialog.CloseIcon = () => (\n  <Close asChild>\n    <IconButton type=\"button\" aria-label=\"Close\">\n      <IconClose size=\"small\" />\n    </IconButton>\n  </Close>\n);\n\nDialog.Title = ({ children }: { children: React.ReactNode }) => (\n  <DialogTitle>{children}</DialogTitle>\n);\n\nDialog.Description = ({ children }: { children: React.ReactNode }) => (\n  <DialogDescription>{children}</DialogDescription>\n);\n\nDialog.Trigger = Trigger;\nDialog.Close = Close;\n"],"names":["props","children","Dialog","dimmed","direction","align","type","size"],"mappings":";;;;;;;;;;;;;;;;AAAa;;AAAA;AAAA;AAsBb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AAAqD;AAAtBA;;AACdC;AAAW;AACnC;;AAEA;AACA;AACA;AACA;AACAC;AAAiB;;AAAaC;AAAkBH;;AACvCC;;AAGGG;AAAmBC;AAAcJ;;AAEhC;AACO;AACT;AAGXC;AAAkB;AAAGI;;AACRL;AAC4BM;;AACEA;AAAS;AAAG;AACxC;AAGfL;;;;AAEgBI;AAAc;;AACbC;;;AACA;AACP;AAGVL;AAAe;;AACDD;AAAU;AAAe;AAGvCC;AAAqB;;AACDD;AAAU;AAAqB;AAGnDC;AACAA;;"}

package/dist/src/Modals/Dialog/index.d.ts

@@ -1,32 +0,0 @@
-/// <reference types="react" />
-import type { DialogContentProps, DialogProps } from '@radix-ui/react-dialog';
-interface ContentProps extends DialogContentProps {
-    children: React.ReactNode;
-    dimmed?: boolean;
-}
-/**
- * @prop {React.ReactNode} children
- * @prop {boolean} open
- * @prop {boolean} defaultOpen
- * @prop {(open: boolean) => void} onOpenChange
- * @prop {boolean} modal
- * @prop {string} id
- */
-export declare function Dialog({ children, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace Dialog {
-    var Content: ({ children, dimmed, ...props }: ContentProps) => import("react/jsx-runtime").JSX.Element;
-    var HeadIcon: ({ type }: {
-        type?: "alert" | "confirm" | undefined;
-    }) => import("react/jsx-runtime").JSX.Element;
-    var CloseIcon: () => import("react/jsx-runtime").JSX.Element;
-    var Title: ({ children }: {
-        children: import("react").ReactNode;
-    }) => import("react/jsx-runtime").JSX.Element;
-    var Description: ({ children }: {
-        children: import("react").ReactNode;
-    }) => import("react/jsx-runtime").JSX.Element;
-    var Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-    var Close: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
-}
-export {};
-//# sourceMappingURL=index.d.ts.map

package/dist/src/Modals/Dialog/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/Modals/Dialog/index.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAe9E,UAAU,YAAa,SAAQ,kBAAkB;IAC/C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAEzD;yBAFe,MAAM"}

package/dist/src/Modals/Dialog/index.esm.js

@@ -1,88 +0,0 @@
-"use client";
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { Root, Portal, Close, Trigger } from '@radix-ui/react-dialog';
-import { PictogramAlert, PictogramCheck, IconClose } from '@remember-web/icon';
-import { Flex } from '../../Common/Flex/index.esm.js';
-import { StyledOverlay, DialogContent, DialogIcon, IconButton, DialogTitle, DialogDescription } from './styles.esm.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var _excluded = ["children"],
-  _excluded2 = ["children", "dimmed"];
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/**
- * @prop {React.ReactNode} children
- * @prop {boolean} open
- * @prop {boolean} defaultOpen
- * @prop {(open: boolean) => void} onOpenChange
- * @prop {boolean} modal
- * @prop {string} id
- */
-function Dialog(_ref) {
-  var children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/jsx(Root, _objectSpread(_objectSpread({}, props), {}, {
-    children: children
-  }));
-}
-
-/**
- * @prop {boolean} dimmed
- * @see https://www.radix-ui.com/docs/primitives/components/dialog
- */
-Dialog.Content = function (_ref2) {
-  var children = _ref2.children,
-    _ref2$dimmed = _ref2.dimmed,
-    dimmed = _ref2$dimmed === void 0 ? true : _ref2$dimmed,
-    props = _objectWithoutProperties(_ref2, _excluded2);
-  return /*#__PURE__*/jsxs(Portal, {
-    children: [dimmed && /*#__PURE__*/jsx(StyledOverlay, {}), /*#__PURE__*/jsx(DialogContent, _objectSpread(_objectSpread({}, props), {}, {
-      children: /*#__PURE__*/jsx(Flex, {
-        direction: "column",
-        align: "center",
-        children: children
-      })
-    }))]
-  });
-};
-Dialog.HeadIcon = function (_ref3) {
-  var _ref3$type = _ref3.type,
-    type = _ref3$type === void 0 ? 'alert' : _ref3$type;
-  return /*#__PURE__*/jsxs(DialogIcon, {
-    children: [type === 'alert' && /*#__PURE__*/jsx(PictogramAlert, {
-      size: 40
-    }), type === 'confirm' && /*#__PURE__*/jsx(PictogramCheck, {
-      size: 40
-    })]
-  });
-};
-Dialog.CloseIcon = function () {
-  return /*#__PURE__*/jsx(Close, {
-    asChild: true,
-    children: /*#__PURE__*/jsx(IconButton, {
-      type: "button",
-      "aria-label": "Close",
-      children: /*#__PURE__*/jsx(IconClose, {
-        size: "small"
-      })
-    })
-  });
-};
-Dialog.Title = function (_ref4) {
-  var children = _ref4.children;
-  return /*#__PURE__*/jsx(DialogTitle, {
-    children: children
-  });
-};
-Dialog.Description = function (_ref5) {
-  var children = _ref5.children;
-  return /*#__PURE__*/jsx(DialogDescription, {
-    children: children
-  });
-};
-Dialog.Trigger = Trigger;
-Dialog.Close = Close;
-
-export { Dialog };
-//# sourceMappingURL=index.esm.js.map

package/dist/src/Modals/Dialog/index.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../src/Modals/Dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { DialogContentProps, DialogProps } from '@radix-ui/react-dialog';\nimport { Root, Trigger, Close, Portal } from '@radix-ui/react-dialog';\nimport { IconClose, PictogramAlert, PictogramCheck } from '@remember-web/icon';\n\nimport { Flex } from '@/Common/Flex';\n\nimport {\n  DialogContent,\n  DialogDescription,\n  DialogIcon,\n  DialogTitle,\n  IconButton,\n  StyledOverlay,\n} from './styles';\n\ninterface ContentProps extends DialogContentProps {\n  children: React.ReactNode;\n  dimmed?: boolean;\n}\n\n/**\n * @prop {React.ReactNode} children\n * @prop {boolean} open\n * @prop {boolean} defaultOpen\n * @prop {(open: boolean) => void} onOpenChange\n * @prop {boolean} modal\n * @prop {string} id\n */\nexport function Dialog({ children, ...props }: DialogProps) {\n  return <Root {...props}>{children}</Root>;\n}\n\n/**\n * @prop {boolean} dimmed\n * @see https://www.radix-ui.com/docs/primitives/components/dialog\n */\nDialog.Content = ({ children, dimmed = true, ...props }: ContentProps) => (\n  <Portal>\n    {dimmed && <StyledOverlay />}\n    <DialogContent {...props}>\n      <Flex direction=\"column\" align=\"center\">\n        {children}\n      </Flex>\n    </DialogContent>\n  </Portal>\n);\n\nDialog.HeadIcon = ({ type = 'alert' }: { type?: 'alert' | 'confirm' }) => (\n  <DialogIcon>\n    {type === 'alert' && <PictogramAlert size={40} />}\n    {type === 'confirm' && <PictogramCheck size={40} />}\n  </DialogIcon>\n);\n\nDialog.CloseIcon = () => (\n  <Close asChild>\n    <IconButton type=\"button\" aria-label=\"Close\">\n      <IconClose size=\"small\" />\n    </IconButton>\n  </Close>\n);\n\nDialog.Title = ({ children }: { children: React.ReactNode }) => (\n  <DialogTitle>{children}</DialogTitle>\n);\n\nDialog.Description = ({ children }: { children: React.ReactNode }) => (\n  <DialogDescription>{children}</DialogDescription>\n);\n\nDialog.Trigger = Trigger;\nDialog.Close = Close;\n"],"names":["props","children","Dialog","dimmed","direction","align","type","size"],"mappings":";;;;;;;;;AAAa;;AAAA;AAAA;AAsBb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AAAqD;AAAtBA;;AACdC;AAAW;AACnC;;AAEA;AACA;AACA;AACA;AACAC;AAAiB;;AAAaC;AAAkBH;;AACvCC;;AAGGG;AAAmBC;AAAcJ;;AAEhC;AACO;AACT;AAGXC;AAAkB;AAAGI;;AACRL;AAC4BM;;AACEA;AAAS;AAAG;AACxC;AAGfL;;;;AAEgBI;AAAc;;AACbC;;;AACA;AACP;AAGVL;AAAe;;AACDD;AAAU;AAAe;AAGvCC;AAAqB;;AACDD;AAAU;AAAqB;AAGnDC;AACAA;;"}

package/dist/src/Modals/Dialog/styles.cjs.js

@@ -1,51 +0,0 @@
-"use client";
-'use strict';
-
-var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
-var DialogPrimitive = require('@radix-ui/react-dialog');
-var mixin = require('@remember-web/mixin');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefault(_taggedTemplateLiteral);
-var styled__default = /*#__PURE__*/_interopDefault(styled);
-var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
-var overlayShow = styled.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral__default.default(["\n  0% { opacity: 0; }\n  100% { opacity: 1; }\n"])));
-var contentShow = styled.keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default.default(["\n  0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n  100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n"])));
-var StyledOverlay = styled__default.default(DialogPrimitive__namespace.Overlay)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default.default(["\n  position: fixed;\n  inset: 0;\n  background-color: rgba(0, 0, 0, 0.3);\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ", " 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n"])), overlayShow);
-var DialogContent = styled__default.default(DialogPrimitive__namespace.Content)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default.default(["\n  box-sizing: border-box;\n  background-color: ", ";\n  border-radius: 8px;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 90vw;\n  max-width: 360px;\n  min-width: 300px;\n  max-height: 85vh;\n  padding: 32px 24px 24px;\n\n  &:focus {\n    outline: none;\n  }\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ", " 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n"])), mixin.primary200, contentShow);
-var DialogIcon = styled__default.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default.default(["\n  margin-bottom: 16px;\n"])));
-var IconButton = styled__default.default.button(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral__default.default(["\n  all: unset;\n  height: 16px;\n  width: 16px;\n  margin: -8px 0 8px 0;\n  align-self: flex-end;\n  cursor: pointer;\n"])));
-var DialogTitle = styled__default.default(DialogPrimitive__namespace.Title)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral__default.default(["\n  ", "\n\n  color: ", ";\n  margin: 0;\n  padding: 0;\n  white-space: pre-line;\n"])), mixin.getTypographyStyles('Headline4_B'), mixin.contents000);
-var DialogDescription = styled__default.default(DialogPrimitive__namespace.Description)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral__default.default(["\n  ", "\n\n  color: ", ";\n  margin: 4px 0 24px;\n  text-align: center;\n  white-space: pre-line;\n"])), mixin.getTypographyStyles('Body1_M'), mixin.contents100);
-
-exports.DialogContent = DialogContent;
-exports.DialogDescription = DialogDescription;
-exports.DialogIcon = DialogIcon;
-exports.DialogTitle = DialogTitle;
-exports.IconButton = IconButton;
-exports.StyledOverlay = StyledOverlay;
-exports.contentShow = contentShow;
-exports.overlayShow = overlayShow;
-//# sourceMappingURL=styles.cjs.js.map

package/dist/src/Modals/Dialog/styles.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.cjs.js","sources":["../../../../src/Modals/Dialog/styles.ts"],"sourcesContent":["'use client';\n\nimport styled, { keyframes } from 'styled-components';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {\n  primary200,\n  contents000,\n  contents100,\n  getTypographyStyles,\n} from '@remember-web/mixin';\n\nexport const overlayShow = keyframes`\n  0% { opacity: 0; }\n  100% { opacity: 1; }\n`;\n\nexport const contentShow = keyframes`\n  0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n  100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n`;\n\nexport const StyledOverlay = styled(DialogPrimitive.Overlay)`\n  position: fixed;\n  inset: 0;\n  background-color: rgba(0, 0, 0, 0.3);\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ${overlayShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n`;\n\nexport const DialogContent = styled(DialogPrimitive.Content)`\n  box-sizing: border-box;\n  background-color: ${primary200};\n  border-radius: 8px;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 90vw;\n  max-width: 360px;\n  min-width: 300px;\n  max-height: 85vh;\n  padding: 32px 24px 24px;\n\n  &:focus {\n    outline: none;\n  }\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ${contentShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n`;\n\nexport const DialogIcon = styled.div`\n  margin-bottom: 16px;\n`;\n\nexport const IconButton = styled.button`\n  all: unset;\n  height: 16px;\n  width: 16px;\n  margin: -8px 0 8px 0;\n  align-self: flex-end;\n  cursor: pointer;\n`;\n\nexport const DialogTitle = styled(DialogPrimitive.Title)`\n  ${getTypographyStyles('Headline4_B')}\n\n  color: ${contents000};\n  margin: 0;\n  padding: 0;\n  white-space: pre-line;\n`;\n\nexport const DialogDescription = styled(DialogPrimitive.Description)`\n  ${getTypographyStyles('Body1_M')}\n\n  color: ${contents100};\n  margin: 4px 0 24px;\n  text-align: center;\n  white-space: pre-line;\n`;\n"],"names":["DialogIcon","IconButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAa;AAWN;AAKA;;;AAsCMA;AAIAC;AASN;AASA;;;;;;;;;"}

package/dist/src/Modals/Dialog/styles.d.ts

@@ -1,19 +0,0 @@
-/// <reference types="react" />
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-export declare const overlayShow: import("styled-components/dist/models/Keyframes").default;
-export declare const contentShow: import("styled-components/dist/models/Keyframes").default;
-export declare const StyledOverlay: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<DialogPrimitive.DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & Omit<import("react").ForwardRefExoticComponent<DialogPrimitive.DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const DialogContent: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<DialogPrimitive.DialogContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & Omit<import("react").ForwardRefExoticComponent<DialogPrimitive.DialogContentProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const DialogIcon: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
-export declare const IconButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>>;
-export declare const DialogTitle: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<DialogPrimitive.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & {
-    ref?: ((instance: HTMLHeadingElement | null) => void) | import("react").RefObject<HTMLHeadingElement> | null | undefined;
-}, never>> & Omit<import("react").ForwardRefExoticComponent<DialogPrimitive.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const DialogDescription: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<DialogPrimitive.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & {
-    ref?: ((instance: HTMLParagraphElement | null) => void) | import("react").RefObject<HTMLParagraphElement> | null | undefined;
-}, never>> & Omit<import("react").ForwardRefExoticComponent<DialogPrimitive.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>, keyof import("react").Component<any, {}, any>>;
-//# sourceMappingURL=styles.d.ts.map

package/dist/src/Modals/Dialog/styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/Modals/Dialog/styles.ts"],"names":[],"mappings":";AAGA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAQ1D,eAAO,MAAM,WAAW,2DAGvB,CAAC;AAEF,eAAO,MAAM,WAAW,2DAGvB,CAAC;AAEF,eAAO,MAAM,aAAa;;+LAQzB,CAAC;AAEF,eAAO,MAAM,aAAa;;+LAqBzB,CAAC;AAEF,eAAO,MAAM,UAAU,gNAEtB,CAAC;AAEF,eAAO,MAAM,UAAU,4NAOtB,CAAC;AAEF,eAAO,MAAM,WAAW;;iMAOvB,CAAC;AAEF,eAAO,MAAM,iBAAiB;;yMAO7B,CAAC"}

package/dist/src/Modals/Dialog/styles.esm.js

@@ -1,18 +0,0 @@
-"use client";
-import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
-import styled, { keyframes } from 'styled-components';
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-import { primary200, getTypographyStyles, contents000, contents100 } from '@remember-web/mixin';
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
-var overlayShow = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% { opacity: 0; }\n  100% { opacity: 1; }\n"])));
-var contentShow = keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n  100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n"])));
-var StyledOverlay = styled(DialogPrimitive.Overlay)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: fixed;\n  inset: 0;\n  background-color: rgba(0, 0, 0, 0.3);\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ", " 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n"])), overlayShow);
-var DialogContent = styled(DialogPrimitive.Content)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  box-sizing: border-box;\n  background-color: ", ";\n  border-radius: 8px;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 90vw;\n  max-width: 360px;\n  min-width: 300px;\n  max-height: 85vh;\n  padding: 32px 24px 24px;\n\n  &:focus {\n    outline: none;\n  }\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ", " 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n"])), primary200, contentShow);
-var DialogIcon = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  margin-bottom: 16px;\n"])));
-var IconButton = styled.button(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  all: unset;\n  height: 16px;\n  width: 16px;\n  margin: -8px 0 8px 0;\n  align-self: flex-end;\n  cursor: pointer;\n"])));
-var DialogTitle = styled(DialogPrimitive.Title)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  ", "\n\n  color: ", ";\n  margin: 0;\n  padding: 0;\n  white-space: pre-line;\n"])), getTypographyStyles('Headline4_B'), contents000);
-var DialogDescription = styled(DialogPrimitive.Description)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  ", "\n\n  color: ", ";\n  margin: 4px 0 24px;\n  text-align: center;\n  white-space: pre-line;\n"])), getTypographyStyles('Body1_M'), contents100);
-
-export { DialogContent, DialogDescription, DialogIcon, DialogTitle, IconButton, StyledOverlay, contentShow, overlayShow };
-//# sourceMappingURL=styles.esm.js.map

package/dist/src/Modals/Dialog/styles.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.esm.js","sources":["../../../../src/Modals/Dialog/styles.ts"],"sourcesContent":["'use client';\n\nimport styled, { keyframes } from 'styled-components';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {\n  primary200,\n  contents000,\n  contents100,\n  getTypographyStyles,\n} from '@remember-web/mixin';\n\nexport const overlayShow = keyframes`\n  0% { opacity: 0; }\n  100% { opacity: 1; }\n`;\n\nexport const contentShow = keyframes`\n  0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n  100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n`;\n\nexport const StyledOverlay = styled(DialogPrimitive.Overlay)`\n  position: fixed;\n  inset: 0;\n  background-color: rgba(0, 0, 0, 0.3);\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ${overlayShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n`;\n\nexport const DialogContent = styled(DialogPrimitive.Content)`\n  box-sizing: border-box;\n  background-color: ${primary200};\n  border-radius: 8px;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 90vw;\n  max-width: 360px;\n  min-width: 300px;\n  max-height: 85vh;\n  padding: 32px 24px 24px;\n\n  &:focus {\n    outline: none;\n  }\n\n  @media (prefers-reduced-motion: no-preference) {\n    animation: ${contentShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n  }\n`;\n\nexport const DialogIcon = styled.div`\n  margin-bottom: 16px;\n`;\n\nexport const IconButton = styled.button`\n  all: unset;\n  height: 16px;\n  width: 16px;\n  margin: -8px 0 8px 0;\n  align-self: flex-end;\n  cursor: pointer;\n`;\n\nexport const DialogTitle = styled(DialogPrimitive.Title)`\n  ${getTypographyStyles('Headline4_B')}\n\n  color: ${contents000};\n  margin: 0;\n  padding: 0;\n  white-space: pre-line;\n`;\n\nexport const DialogDescription = styled(DialogPrimitive.Description)`\n  ${getTypographyStyles('Body1_M')}\n\n  color: ${contents100};\n  margin: 4px 0 24px;\n  text-align: center;\n  white-space: pre-line;\n`;\n"],"names":["DialogIcon","IconButton"],"mappings":";;;;;;AAAa;AAWN;AAKA;;;AAsCMA;AAIAC;AASN;AASA;;"}

package/dist/src/Modals/index.d.ts

@@ -1,2 +0,0 @@
-export * from './Dialog';
-//# sourceMappingURL=index.d.ts.map

package/dist/src/Modals/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Modals/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/dist/src/Paginations/CompactPagination/index.cjs.js

@@ -1,98 +0,0 @@
-"use client";
-'use strict';
-
-var icon = require('@remember-web/icon');
-var mixin = require('@remember-web/mixin');
-var index = require('../../Common/Flex/index.cjs.js');
-var styles = require('../styles.cjs.js');
-var usePagination = require('../usePagination.cjs.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function CompactPagination(_ref) {
-  var _ref$activePage = _ref.activePage,
-    activePage = _ref$activePage === void 0 ? 1 : _ref$activePage,
-    _ref$totalItemCount = _ref.totalItemCount,
-    totalItemCount = _ref$totalItemCount === void 0 ? 0 : _ref$totalItemCount,
-    onChangePage = _ref.onChangePage,
-    itemCountPerPage = _ref.itemCountPerPage,
-    _ref$infinite = _ref.infinite,
-    infinite = _ref$infinite === void 0 ? false : _ref$infinite,
-    className = _ref.className;
-  var _usePagination = usePagination({
-      activePage: activePage,
-      totalItemCount: totalItemCount,
-      pageRangeDisplayed: 1,
-      itemCountPerPage: itemCountPerPage
-    }),
-    totalLastPage = _usePagination.totalLastPage,
-    prevPage = _usePagination.prevPage,
-    nextPage = _usePagination.nextPage,
-    isPrevPageDisabled = _usePagination.isPrevPageDisabled,
-    isNextPageDisabled = _usePagination.isNextPageDisabled;
-  var iconColor = function iconColor(disabled) {
-    return disabled ? mixin.contents300 : mixin.contents000;
-  };
-  var onClickPrevPage = function onClickPrevPage() {
-    var prevPageToGo = activePage === 1 && infinite ? totalLastPage : prevPage;
-    onChangePage(prevPageToGo);
-  };
-  var onClickNextPage = function onClickNextPage() {
-    var nextPageToGo = activePage === totalLastPage && infinite ? 1 : nextPage;
-    onChangePage(nextPageToGo);
-  };
-  var hasOnlyOnePage = totalLastPage === 1;
-  var getArrowButtonDisabled = function getArrowButtonDisabled(disabled) {
-    if (hasOnlyOnePage) {
-      return true;
-    }
-    if (infinite) {
-      return false;
-    }
-    return disabled;
-  };
-  var getArrowButtonColor = function getArrowButtonColor(disabled) {
-    if (hasOnlyOnePage) {
-      return mixin.contents300;
-    }
-    if (infinite) {
-      return mixin.contents000;
-    }
-    return iconColor(disabled);
-  };
-  return /*#__PURE__*/jsxRuntime.jsxs(styles.CompactPaginationContainer, {
-    className: className,
-    role: "navigation",
-    "aria-label": "\uD398\uC774\uC9C0\uB124\uC774\uC158",
-    children: [/*#__PURE__*/jsxRuntime.jsx(styles.ArrowButton, {
-      disabled: getArrowButtonDisabled(isPrevPageDisabled),
-      onClick: onClickPrevPage,
-      "aria-label": "\uC774\uC804 \uD398\uC774\uC9C0\uB85C \uC774\uB3D9",
-      children: /*#__PURE__*/jsxRuntime.jsx(icon.IconArrow2Left, {
-        size: "small",
-        color: getArrowButtonColor(isPrevPageDisabled),
-        "aria-hidden": "true"
-      })
-    }), /*#__PURE__*/jsxRuntime.jsxs(index.Flex, {
-      gap: "4px",
-      style: {
-        minWidth: '44px',
-        userSelect: 'none'
-      },
-      children: [/*#__PURE__*/jsxRuntime.jsx(styles.CurrentPage, {
-        children: activePage
-      }), "/ ", totalLastPage]
-    }), /*#__PURE__*/jsxRuntime.jsx(styles.ArrowButton, {
-      disabled: getArrowButtonDisabled(isNextPageDisabled),
-      onClick: onClickNextPage,
-      "aria-label": "\uB2E4\uC74C \uD398\uC774\uC9C0\uB85C \uC774\uB3D9",
-      children: /*#__PURE__*/jsxRuntime.jsx(icon.IconArrow2Right, {
-        size: "small",
-        color: getArrowButtonColor(isNextPageDisabled),
-        "aria-hidden": "true"
-      })
-    })]
-  });
-}
-
-exports.CompactPagination = CompactPagination;
-//# sourceMappingURL=index.cjs.js.map

package/dist/src/Paginations/CompactPagination/index.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/Paginations/CompactPagination/index.tsx"],"sourcesContent":["'use client';\n\nimport { IconArrow2Left, IconArrow2Right } from '@remember-web/icon';\nimport { contents000, contents300 } from '@remember-web/mixin';\n\nimport { Flex } from '@/Common/Flex';\n\nimport {\n  ArrowButton,\n  CompactPaginationContainer,\n  CurrentPage,\n} from '../styles';\nimport type { CompactPaginationProps } from '../types';\nimport usePagination from '../usePagination';\n\nexport function CompactPagination({\n  activePage = 1,\n  totalItemCount = 0,\n  onChangePage,\n  itemCountPerPage,\n  infinite = false,\n  className,\n}: CompactPaginationProps) {\n  const {\n    totalLastPage,\n    prevPage,\n    nextPage,\n    isPrevPageDisabled,\n    isNextPageDisabled,\n  } = usePagination({\n    activePage,\n    totalItemCount,\n    pageRangeDisplayed: 1,\n    itemCountPerPage,\n  });\n\n  const iconColor = (disabled: boolean) =>\n    disabled ? contents300 : contents000;\n\n  const onClickPrevPage = () => {\n    const prevPageToGo =\n      activePage === 1 && infinite ? totalLastPage : prevPage;\n    onChangePage(prevPageToGo);\n  };\n\n  const onClickNextPage = () => {\n    const nextPageToGo =\n      activePage === totalLastPage && infinite ? 1 : nextPage;\n    onChangePage(nextPageToGo);\n  };\n\n  const hasOnlyOnePage = totalLastPage === 1;\n\n  const getArrowButtonDisabled = (disabled: boolean) => {\n    if (hasOnlyOnePage) {\n      return true;\n    }\n    if (infinite) {\n      return false;\n    }\n    return disabled;\n  };\n\n  const getArrowButtonColor = (disabled: boolean) => {\n    if (hasOnlyOnePage) {\n      return contents300;\n    }\n    if (infinite) {\n      return contents000;\n    }\n    return iconColor(disabled);\n  };\n\n  return (\n    <CompactPaginationContainer\n      className={className}\n      role=\"navigation\"\n      aria-label=\"페이지네이션\"\n    >\n      <ArrowButton\n        disabled={getArrowButtonDisabled(isPrevPageDisabled)}\n        onClick={onClickPrevPage}\n        aria-label=\"이전 페이지로 이동\"\n      >\n        <IconArrow2Left\n          size=\"small\"\n          color={getArrowButtonColor(isPrevPageDisabled)}\n          aria-hidden=\"true\"\n        />\n      </ArrowButton>\n      <Flex gap=\"4px\" style={{ minWidth: '44px', userSelect: 'none' }}>\n        <CurrentPage>{activePage}</CurrentPage>/ {totalLastPage}\n      </Flex>\n      <ArrowButton\n        disabled={getArrowButtonDisabled(isNextPageDisabled)}\n        onClick={onClickNextPage}\n        aria-label=\"다음 페이지로 이동\"\n      >\n        <IconArrow2Right\n          size=\"small\"\n          color={getArrowButtonColor(isNextPageDisabled)}\n          aria-hidden=\"true\"\n        />\n      </ArrowButton>\n    </CompactPaginationContainer>\n  );\n}\n"],"names":["activePage","totalItemCount","infinite","pageRangeDisplayed","itemCountPerPage","className","role","disabled","onClick","size","color","gap","style","minWidth","userSelect","children"],"mappings":";;;;;;;;;;AAeO;AAOoB;AANzBA;;AACAC;;;;AAGAC;;;AAUEF;AACAC;AACAE;AACAC;AACF;;;;;;AAEA;AAAoC;AACE;AAEtC;;;;AAMA;;;;AAMA;AAEA;AACE;AACE;AACF;AACA;AACE;AACF;AACA;;AAGF;AACE;AACE;AACF;AACA;AACE;AACF;;;;AAMEC;AACAC;AACA;;AAGEC;AACAC;AACA;;AAGEC;AACAC;;;AAEA;AAEEC;AAAUC;AAASC;AAAkBC;;;AAC7BC;;AAA2C;AAGvDR;AACAC;AACA;;AAGEC;AACAC;;;AAEA;AACU;AAGpB;;"}

package/dist/src/Paginations/CompactPagination/index.d.ts

@@ -1,3 +0,0 @@
-import type { CompactPaginationProps } from '../types';
-export declare function CompactPagination({ activePage, totalItemCount, onChangePage, itemCountPerPage, infinite, className, }: CompactPaginationProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/src/Paginations/CompactPagination/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/Paginations/CompactPagination/index.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAGvD,wBAAgB,iBAAiB,CAAC,EAChC,UAAc,EACd,cAAkB,EAClB,YAAY,EACZ,gBAAgB,EAChB,QAAgB,EAChB,SAAS,GACV,EAAE,sBAAsB,2CAoFxB"}

package/dist/src/Paginations/CompactPagination/index.esm.js

@@ -1,96 +0,0 @@
-"use client";
-import { IconArrow2Left, IconArrow2Right } from '@remember-web/icon';
-import { contents300, contents000 } from '@remember-web/mixin';
-import { Flex } from '../../Common/Flex/index.esm.js';
-import { CompactPaginationContainer, ArrowButton, CurrentPage } from '../styles.esm.js';
-import usePagination from '../usePagination.esm.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-function CompactPagination(_ref) {
-  var _ref$activePage = _ref.activePage,
-    activePage = _ref$activePage === void 0 ? 1 : _ref$activePage,
-    _ref$totalItemCount = _ref.totalItemCount,
-    totalItemCount = _ref$totalItemCount === void 0 ? 0 : _ref$totalItemCount,
-    onChangePage = _ref.onChangePage,
-    itemCountPerPage = _ref.itemCountPerPage,
-    _ref$infinite = _ref.infinite,
-    infinite = _ref$infinite === void 0 ? false : _ref$infinite,
-    className = _ref.className;
-  var _usePagination = usePagination({
-      activePage: activePage,
-      totalItemCount: totalItemCount,
-      pageRangeDisplayed: 1,
-      itemCountPerPage: itemCountPerPage
-    }),
-    totalLastPage = _usePagination.totalLastPage,
-    prevPage = _usePagination.prevPage,
-    nextPage = _usePagination.nextPage,
-    isPrevPageDisabled = _usePagination.isPrevPageDisabled,
-    isNextPageDisabled = _usePagination.isNextPageDisabled;
-  var iconColor = function iconColor(disabled) {
-    return disabled ? contents300 : contents000;
-  };
-  var onClickPrevPage = function onClickPrevPage() {
-    var prevPageToGo = activePage === 1 && infinite ? totalLastPage : prevPage;
-    onChangePage(prevPageToGo);
-  };
-  var onClickNextPage = function onClickNextPage() {
-    var nextPageToGo = activePage === totalLastPage && infinite ? 1 : nextPage;
-    onChangePage(nextPageToGo);
-  };
-  var hasOnlyOnePage = totalLastPage === 1;
-  var getArrowButtonDisabled = function getArrowButtonDisabled(disabled) {
-    if (hasOnlyOnePage) {
-      return true;
-    }
-    if (infinite) {
-      return false;
-    }
-    return disabled;
-  };
-  var getArrowButtonColor = function getArrowButtonColor(disabled) {
-    if (hasOnlyOnePage) {
-      return contents300;
-    }
-    if (infinite) {
-      return contents000;
-    }
-    return iconColor(disabled);
-  };
-  return /*#__PURE__*/jsxs(CompactPaginationContainer, {
-    className: className,
-    role: "navigation",
-    "aria-label": "\uD398\uC774\uC9C0\uB124\uC774\uC158",
-    children: [/*#__PURE__*/jsx(ArrowButton, {
-      disabled: getArrowButtonDisabled(isPrevPageDisabled),
-      onClick: onClickPrevPage,
-      "aria-label": "\uC774\uC804 \uD398\uC774\uC9C0\uB85C \uC774\uB3D9",
-      children: /*#__PURE__*/jsx(IconArrow2Left, {
-        size: "small",
-        color: getArrowButtonColor(isPrevPageDisabled),
-        "aria-hidden": "true"
-      })
-    }), /*#__PURE__*/jsxs(Flex, {
-      gap: "4px",
-      style: {
-        minWidth: '44px',
-        userSelect: 'none'
-      },
-      children: [/*#__PURE__*/jsx(CurrentPage, {
-        children: activePage
-      }), "/ ", totalLastPage]
-    }), /*#__PURE__*/jsx(ArrowButton, {
-      disabled: getArrowButtonDisabled(isNextPageDisabled),
-      onClick: onClickNextPage,
-      "aria-label": "\uB2E4\uC74C \uD398\uC774\uC9C0\uB85C \uC774\uB3D9",
-      children: /*#__PURE__*/jsx(IconArrow2Right, {
-        size: "small",
-        color: getArrowButtonColor(isNextPageDisabled),
-        "aria-hidden": "true"
-      })
-    })]
-  });
-}
-
-export { CompactPagination };
-//# sourceMappingURL=index.esm.js.map

package/dist/src/Paginations/CompactPagination/index.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.esm.js","sources":["../../../../src/Paginations/CompactPagination/index.tsx"],"sourcesContent":["'use client';\n\nimport { IconArrow2Left, IconArrow2Right } from '@remember-web/icon';\nimport { contents000, contents300 } from '@remember-web/mixin';\n\nimport { Flex } from '@/Common/Flex';\n\nimport {\n  ArrowButton,\n  CompactPaginationContainer,\n  CurrentPage,\n} from '../styles';\nimport type { CompactPaginationProps } from '../types';\nimport usePagination from '../usePagination';\n\nexport function CompactPagination({\n  activePage = 1,\n  totalItemCount = 0,\n  onChangePage,\n  itemCountPerPage,\n  infinite = false,\n  className,\n}: CompactPaginationProps) {\n  const {\n    totalLastPage,\n    prevPage,\n    nextPage,\n    isPrevPageDisabled,\n    isNextPageDisabled,\n  } = usePagination({\n    activePage,\n    totalItemCount,\n    pageRangeDisplayed: 1,\n    itemCountPerPage,\n  });\n\n  const iconColor = (disabled: boolean) =>\n    disabled ? contents300 : contents000;\n\n  const onClickPrevPage = () => {\n    const prevPageToGo =\n      activePage === 1 && infinite ? totalLastPage : prevPage;\n    onChangePage(prevPageToGo);\n  };\n\n  const onClickNextPage = () => {\n    const nextPageToGo =\n      activePage === totalLastPage && infinite ? 1 : nextPage;\n    onChangePage(nextPageToGo);\n  };\n\n  const hasOnlyOnePage = totalLastPage === 1;\n\n  const getArrowButtonDisabled = (disabled: boolean) => {\n    if (hasOnlyOnePage) {\n      return true;\n    }\n    if (infinite) {\n      return false;\n    }\n    return disabled;\n  };\n\n  const getArrowButtonColor = (disabled: boolean) => {\n    if (hasOnlyOnePage) {\n      return contents300;\n    }\n    if (infinite) {\n      return contents000;\n    }\n    return iconColor(disabled);\n  };\n\n  return (\n    <CompactPaginationContainer\n      className={className}\n      role=\"navigation\"\n      aria-label=\"페이지네이션\"\n    >\n      <ArrowButton\n        disabled={getArrowButtonDisabled(isPrevPageDisabled)}\n        onClick={onClickPrevPage}\n        aria-label=\"이전 페이지로 이동\"\n      >\n        <IconArrow2Left\n          size=\"small\"\n          color={getArrowButtonColor(isPrevPageDisabled)}\n          aria-hidden=\"true\"\n        />\n      </ArrowButton>\n      <Flex gap=\"4px\" style={{ minWidth: '44px', userSelect: 'none' }}>\n        <CurrentPage>{activePage}</CurrentPage>/ {totalLastPage}\n      </Flex>\n      <ArrowButton\n        disabled={getArrowButtonDisabled(isNextPageDisabled)}\n        onClick={onClickNextPage}\n        aria-label=\"다음 페이지로 이동\"\n      >\n        <IconArrow2Right\n          size=\"small\"\n          color={getArrowButtonColor(isNextPageDisabled)}\n          aria-hidden=\"true\"\n        />\n      </ArrowButton>\n    </CompactPaginationContainer>\n  );\n}\n"],"names":["activePage","totalItemCount","infinite","pageRangeDisplayed","itemCountPerPage","className","role","disabled","onClick","size","color","gap","style","minWidth","userSelect","children"],"mappings":";;;;;;;;AAeO;AAOoB;AANzBA;;AACAC;;;;AAGAC;;;AAUEF;AACAC;AACAE;AACAC;AACF;;;;;;AAEA;AAAoC;AACE;AAEtC;;;;AAMA;;;;AAMA;AAEA;AACE;AACE;AACF;AACA;AACE;AACF;AACA;;AAGF;AACE;AACE;AACF;AACA;AACE;AACF;;;;AAMEC;AACAC;AACA;;AAGEC;AACAC;AACA;;AAGEC;AACAC;;;AAEA;AAEEC;AAAUC;AAASC;AAAkBC;;;AAC7BC;;AAA2C;AAGvDR;AACAC;AACA;;AAGEC;AACAC;;;AAEA;AACU;AAGpB;;"}