@nurihaus/web-design-system 3.0.3 → 3.1.1

package/dist/toast.js

@@ -0,0 +1,497 @@
+"use client";
+import * as __WEBPACK_EXTERNAL_MODULE_radix_ui_3bc96d1b__ from "radix-ui";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_179142b8__ from "react/jsx-runtime";
+/******/ var __webpack_modules__ = ({
+
+/***/ 7413
+(__unused_webpack_module, __webpack_exports__, __nuri_require__) {
+
+/* harmony export */ __nuri_require__.d(__webpack_exports__, {
+/* harmony export */   A: () => (__WEBPACK_DEFAULT_EXPORT__),
+/* harmony export */   t: () => (/* binding */ ToastProvider)
+/* harmony export */ });
+/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __nuri_require__(612);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __nuri_require__(1041);
+/* harmony import */ var radix_ui__WEBPACK_IMPORTED_MODULE_2__ = __nuri_require__(0);
+/* harmony import */ var _helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__ = __nuri_require__(3274);
+/* harmony import */ var _helpers_utils_getMergedProps__WEBPACK_IMPORTED_MODULE_4__ = __nuri_require__(7335);
+/* harmony import */ var _toast_props__WEBPACK_IMPORTED_MODULE_5__ = __nuri_require__(5618);
+var __assign = undefined && undefined.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+
+
+
+
+
+// Toast.Provider 는 DOM 을 그리지 않는다. Viewport(ol) 가 토스트가 쌓이는 자리다.
+var ToastViewport = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (props, ref) {
+  var className = props.className,
+    position = props.position,
+    restProps = __rest(props, ["className", "position"]);
+  var positionClassName = (0,_helpers_utils_getMergedProps__WEBPACK_IMPORTED_MODULE_4__/* .getMergedProps */ .p)({
+    position: position
+  }, _toast_props__WEBPACK_IMPORTED_MODULE_5__/* .toastViewportProps */ .Cc).className;
+  return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(radix_ui__WEBPACK_IMPORTED_MODULE_2__.Toast.Viewport, __assign({
+    ref: ref,
+    className: (0,_helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__/* .classNames */ .x)('nuri-theme base-toast viewport', positionClassName, className)
+  }, restProps));
+});
+ToastViewport.displayName = 'ToastViewport';
+// Radix Toast 는 Provider 없이 쓰면 오류를 낸다. 쓰는 쪽이 앱 루트에 한 번 둔다.
+// radix-ui 는 peerDependency 라 진입점(`/toast`, 루트)이 달라도 Radix context 하나를 같이 쓴다.
+var ToastProvider = function ToastProvider(props) {
+  var children = props.children,
+    duration = props.duration,
+    position = props.position,
+    _a = props.label,
+    label = _a === void 0 ? '알림' : _a;
+  return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(radix_ui__WEBPACK_IMPORTED_MODULE_2__.Toast.Provider, {
+    duration: duration,
+    label: label,
+    children: [children, (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(ToastViewport, {
+      position: position,
+      label: "".concat(label, " ({hotkey})")
+    })]
+  });
+};
+ToastProvider.displayName = 'ToastProvider';
+var ToastRootBase = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (props, ref) {
+  var children = props.children,
+    className = props.className,
+    restProps = __rest(props, ["children", "className"]);
+  return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(radix_ui__WEBPACK_IMPORTED_MODULE_2__.Toast.Root, __assign({
+    ref: ref,
+    className: (0,_helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__/* .classNames */ .x)('nuri-theme base-toast', className)
+  }, restProps, {
+    children: children
+  }));
+});
+ToastRootBase.displayName = 'ToastRoot';
+var ToastTitle = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (props, ref) {
+  var className = props.className,
+    restProps = __rest(props, ["className"]);
+  return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(radix_ui__WEBPACK_IMPORTED_MODULE_2__.Toast.Title, __assign({
+    ref: ref,
+    className: (0,_helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__/* .classNames */ .x)('nuri-theme base-toast title', className)
+  }, restProps));
+});
+ToastTitle.displayName = 'ToastTitle';
+var ToastDescription = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (props, ref) {
+  var className = props.className,
+    restProps = __rest(props, ["className"]);
+  return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(radix_ui__WEBPACK_IMPORTED_MODULE_2__.Toast.Description, __assign({
+    ref: ref,
+    className: (0,_helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__/* .classNames */ .x)('nuri-theme base-toast description', className)
+  }, restProps));
+});
+ToastDescription.displayName = 'ToastDescription';
+// 누르면 Radix 가 토스트를 닫는다(onOpenChange(false)).
+var ToastAction = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (props, ref) {
+  var className = props.className,
+    restProps = __rest(props, ["className"]);
+  return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(radix_ui__WEBPACK_IMPORTED_MODULE_2__.Toast.Action, __assign({
+    ref: ref,
+    className: (0,_helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__/* .classNames */ .x)('nuri-theme base-toast action', className),
+    type: 'button'
+  }, restProps));
+});
+ToastAction.displayName = 'ToastAction';
+var ToastClose = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (props, ref) {
+  var className = props.className,
+    restProps = __rest(props, ["className"]);
+  return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(radix_ui__WEBPACK_IMPORTED_MODULE_2__.Toast.Close, __assign({
+    ref: ref,
+    className: (0,_helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__/* .classNames */ .x)('nuri-theme base-toast close', className),
+    type: 'button'
+  }, restProps));
+});
+ToastClose.displayName = 'ToastClose';
+var ToastRoot = Object.assign(ToastRootBase, {
+  Viewport: ToastViewport,
+  Title: ToastTitle,
+  Description: ToastDescription,
+  Action: ToastAction,
+  Close: ToastClose
+});
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ToastRoot);
+
+/***/ },
+
+/***/ 5618
+(__unused_webpack_module, __webpack_exports__, __nuri_require__) {
+
+/* harmony export */ __nuri_require__.d(__webpack_exports__, {
+/* harmony export */   Cc: () => (/* binding */ toastViewportProps),
+/* harmony export */   Eg: () => (/* binding */ toastProps)
+/* harmony export */ });
+/* unused harmony exports variants, positions */
+var variants = ['default', 'secondary', 'success', 'warning', 'error'];
+var positions = ['top-right', 'bottom-right', 'bottom-center'];
+var toastProps = {
+  variant: {
+    type: 'className',
+    className: 'variant',
+    values: variants,
+    "default": 'default'
+  }
+};
+var toastViewportProps = {
+  position: {
+    type: 'className',
+    className: 'position',
+    values: positions,
+    "default": 'bottom-right'
+  }
+};
+
+/***/ },
+
+/***/ 4012
+(__unused_webpack_module, __webpack_exports__, __nuri_require__) {
+
+
+// EXPORTS
+__nuri_require__.d(__webpack_exports__, {
+  t: () => (/* reexport */ base_toast/* ToastProvider */.t),
+  A: () => (/* binding */ toast)
+});
+
+// EXTERNAL MODULE: external {"root":"jsx-runtime","commonjs2":"react/jsx-runtime","commonjs":"react/jsx-runtime","amd":"react/jsx-runtime","module":"react/jsx-runtime"}
+var jsx_runtime_ = __nuri_require__(612);
+// EXTERNAL MODULE: external {"root":"React","commonjs2":"react","commonjs":"react","amd":"react","module":"react"}
+var external_root_React_commonjs2_react_commonjs_react_amd_react_module_react_ = __nuri_require__(1041);
+// EXTERNAL MODULE: ./assets/icons/check.svg
+var check = __nuri_require__(5077);
+;// ./assets/icons/exclamation.svg
+var _path, _path2;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+
+var SvgExclamation = function SvgExclamation(props) {
+  return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_module_react_.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none",
+    viewBox: "0 0 16 16"
+  }, props), _path || (_path = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_module_react_.createElement("path", {
+    stroke: "#fff",
+    strokeLinecap: "round",
+    strokeWidth: 1.5,
+    d: "M8 3.5V9"
+  })), _path2 || (_path2 = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_module_react_.createElement("path", {
+    stroke: "#fff",
+    strokeLinecap: "round",
+    strokeWidth: 2,
+    d: "M8 12h.01"
+  })));
+};
+/* harmony default export */ const exclamation = (SvgExclamation);
+// EXTERNAL MODULE: ./assets/icons/multifly.svg
+var multifly = __nuri_require__(6713);
+// EXTERNAL MODULE: ./helpers/utils/classNames.js
+var classNames = __nuri_require__(3274);
+// EXTERNAL MODULE: ./helpers/utils/getMergedProps.ts
+var getMergedProps = __nuri_require__(7335);
+// EXTERNAL MODULE: ./components/button/cta-button.tsx
+var cta_button = __nuri_require__(910);
+// EXTERNAL MODULE: ./components/toast/base-toast.tsx
+var base_toast = __nuri_require__(7413);
+// EXTERNAL MODULE: ./components/toast/toast-props.ts
+var toast_props = __nuri_require__(5618);
+;// ./components/toast/toast.tsx
+var __assign = undefined && undefined.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+
+
+
+
+
+
+
+
+
+
+// 상태를 뜻하는 variant 는 앞에 아이콘을 둔다. error 는 닫기와 같은 X 를 쓴다
+var VARIANT_ICON = {
+  success: check/* default */.A,
+  warning: exclamation,
+  error: multifly/* default */.A
+};
+var Toast = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_amd_react_module_react_.forwardRef)(function (props, ref) {
+  var className = props.className,
+    title = props.title,
+    description = props.description,
+    variant = props.variant,
+    action = props.action,
+    _a = props.showClose,
+    showClose = _a === void 0 ? true : _a,
+    restProps = __rest(props, ["className", "title", "description", "variant", "action", "showClose"]);
+  var variantClassName = (0,getMergedProps/* getMergedProps */.p)({
+    className: className,
+    variant: variant
+  }, toast_props/* toastProps */.Eg).className;
+  var Icon = variant && variant in VARIANT_ICON ? VARIANT_ICON[variant] : null;
+  return (0,jsx_runtime_.jsxs)(base_toast/* default */.A, __assign({
+    ref: ref,
+    className: (0,classNames/* classNames */.x)(variantClassName, 'toast')
+  }, restProps, {
+    children: [Icon && (0,jsx_runtime_.jsx)(Icon, {
+      className: 'toast-icon',
+      "aria-hidden": true
+    }), (0,jsx_runtime_.jsxs)("div", {
+      className: 'toast-body',
+      children: [(0,jsx_runtime_.jsx)(base_toast/* default */.A.Title, {
+        className: 'toast-title',
+        children: title
+      }), description && (0,jsx_runtime_.jsx)(base_toast/* default */.A.Description, {
+        className: 'toast-description',
+        children: description
+      })]
+    }), action && (0,jsx_runtime_.jsx)(base_toast/* default */.A.Action, {
+      className: 'toast-action',
+      altText: action.altText,
+      asChild: true,
+      children: (0,jsx_runtime_.jsx)(cta_button/* default */.A, {
+        size: 'xs',
+        variant: 'neutral',
+        text: action.label,
+        onClick: action.onClick
+      })
+    }), showClose && (0,jsx_runtime_.jsx)(base_toast/* default */.A.Close, {
+      className: 'toast-close',
+      "aria-label": "\uB2EB\uAE30",
+      children: (0,jsx_runtime_.jsx)(multifly/* default */.A, {})
+    })]
+  }));
+});
+Toast.displayName = 'Toast';
+/* harmony default export */ const toast = (Toast);
+
+/***/ },
+
+/***/ 0
+(module, __unused_webpack_exports, __nuri_require__) {
+
+var x = (y) => {
+	var x = {}; __nuri_require__.d(x, y); return x
+} 
+var y = (x) => (() => (x))
+module.exports = x({ ["Toast"]: () => (__WEBPACK_EXTERNAL_MODULE_radix_ui_3bc96d1b__.Toast) });
+
+/***/ },
+
+/***/ 1041
+(module, __unused_webpack_exports, __nuri_require__) {
+
+var x = (y) => {
+	var x = {}; __nuri_require__.d(x, y); return x
+} 
+var y = (x) => (() => (x))
+module.exports = x({ ["Children"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.Children), ["cloneElement"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.cloneElement), ["createElement"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.createElement), ["forwardRef"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.forwardRef), ["isValidElement"]: () => (__WEBPACK_EXTERNAL_MODULE_react__.isValidElement) });
+
+/***/ },
+
+/***/ 612
+(module, __unused_webpack_exports, __nuri_require__) {
+
+var x = (y) => {
+	var x = {}; __nuri_require__.d(x, y); return x
+} 
+var y = (x) => (() => (x))
+module.exports = x({ ["jsx"]: () => (__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_179142b8__.jsx), ["jsxs"]: () => (__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_179142b8__.jsxs) });
+
+/***/ }
+
+/******/ });
+/************************************************************************/
+/******/ // The module cache
+/******/ var __webpack_module_cache__ = {};
+/******/ 
+/******/ // The require function
+/******/ function __nuri_require__(moduleId) {
+/******/ 	// Check if module is in cache
+/******/ 	var cachedModule = __webpack_module_cache__[moduleId];
+/******/ 	if (cachedModule !== undefined) {
+/******/ 		return cachedModule.exports;
+/******/ 	}
+/******/ 	// Create a new module (and put it into the cache)
+/******/ 	var module = __webpack_module_cache__[moduleId] = {
+/******/ 		// no module.id needed
+/******/ 		// no module.loaded needed
+/******/ 		exports: {}
+/******/ 	};
+/******/ 
+/******/ 	// Execute the module function
+/******/ 	__webpack_modules__[moduleId](module, module.exports, __nuri_require__);
+/******/ 
+/******/ 	// Return the exports of the module
+/******/ 	return module.exports;
+/******/ }
+/******/ 
+/******/ // expose the modules object (__webpack_modules__)
+/******/ __nuri_require__.m = __webpack_modules__;
+/******/ 
+/************************************************************************/
+/******/ /* webpack/runtime/chunk loaded */
+/******/ (() => {
+/******/ 	var deferred = [];
+/******/ 	__nuri_require__.O = (result, chunkIds, fn, priority) => {
+/******/ 		if(chunkIds) {
+/******/ 			priority = priority || 0;
+/******/ 			for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
+/******/ 			deferred[i] = [chunkIds, fn, priority];
+/******/ 			return;
+/******/ 		}
+/******/ 		var notFulfilled = Infinity;
+/******/ 		for (var i = 0; i < deferred.length; i++) {
+/******/ 			var [chunkIds, fn, priority] = deferred[i];
+/******/ 			var fulfilled = true;
+/******/ 			for (var j = 0; j < chunkIds.length; j++) {
+/******/ 				if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__nuri_require__.O).every((key) => (__nuri_require__.O[key](chunkIds[j])))) {
+/******/ 					chunkIds.splice(j--, 1);
+/******/ 				} else {
+/******/ 					fulfilled = false;
+/******/ 					if(priority < notFulfilled) notFulfilled = priority;
+/******/ 				}
+/******/ 			}
+/******/ 			if(fulfilled) {
+/******/ 				deferred.splice(i--, 1)
+/******/ 				var r = fn();
+/******/ 				if (r !== undefined) result = r;
+/******/ 			}
+/******/ 		}
+/******/ 		return result;
+/******/ 	};
+/******/ })();
+/******/ 
+/******/ /* webpack/runtime/define property getters */
+/******/ (() => {
+/******/ 	// define getter functions for harmony exports
+/******/ 	__nuri_require__.d = (exports, definition) => {
+/******/ 		for(var key in definition) {
+/******/ 			if(__nuri_require__.o(definition, key) && !__nuri_require__.o(exports, key)) {
+/******/ 				Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 			}
+/******/ 		}
+/******/ 	};
+/******/ })();
+/******/ 
+/******/ /* webpack/runtime/hasOwnProperty shorthand */
+/******/ (() => {
+/******/ 	__nuri_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ })();
+/******/ 
+/******/ /* webpack/runtime/export webpack runtime */
+/******/ export { __nuri_require__ };
+/******/ 
+/******/ /* webpack/runtime/import chunk loading */
+/******/ (() => {
+/******/ 	// no baseURI
+/******/ 	
+/******/ 	// object to store loaded and loading chunks
+/******/ 	// undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ 	// [resolve, Promise] = chunk loading, 0 = chunk loaded
+/******/ 	var installedChunks = {
+/******/ 		448: 0
+/******/ 	};
+/******/ 	
+/******/ 	var installChunk = (data) => {
+/******/ 		var {__webpack_esm_ids__, __webpack_esm_modules__, __webpack_esm_runtime__} = data;
+/******/ 		// add "modules" to the modules object,
+/******/ 		// then flag all "ids" as loaded and fire callback
+/******/ 		var moduleId, chunkId, i = 0;
+/******/ 		for(moduleId in __webpack_esm_modules__) {
+/******/ 			if(__nuri_require__.o(__webpack_esm_modules__, moduleId)) {
+/******/ 				__nuri_require__.m[moduleId] = __webpack_esm_modules__[moduleId];
+/******/ 			}
+/******/ 		}
+/******/ 		if(__webpack_esm_runtime__) __webpack_esm_runtime__(__nuri_require__);
+/******/ 		for(;i < __webpack_esm_ids__.length; i++) {
+/******/ 			chunkId = __webpack_esm_ids__[i];
+/******/ 			if(__nuri_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ 				installedChunks[chunkId][0]();
+/******/ 			}
+/******/ 			installedChunks[__webpack_esm_ids__[i]] = 0;
+/******/ 		}
+/******/ 		__nuri_require__.O();
+/******/ 	}
+/******/ 	
+/******/ 	// no chunk on demand loading
+/******/ 	
+/******/ 	// no prefetching
+/******/ 	
+/******/ 	// no preloaded
+/******/ 	
+/******/ 	__nuri_require__.C = installChunk;
+/******/ 	
+/******/ 	__nuri_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
+/******/ 	// no HMR
+/******/ 	
+/******/ 	// no HMR manifest
+/******/ })();
+/******/ 
+/************************************************************************/
+/******/ 
+/******/ import * as __webpack_chunk_1__ from "./chunk-364.js";
+/******/ __nuri_require__.C(__webpack_chunk_1__);
+/******/ import * as __webpack_chunk_2__ from "./chunk-777.js";
+/******/ __nuri_require__.C(__webpack_chunk_2__);
+/******/ import * as __webpack_chunk_3__ from "./chunk-298.js";
+/******/ __nuri_require__.C(__webpack_chunk_3__);
+/******/ import * as __webpack_chunk_4__ from "./chunk-933.js";
+/******/ __nuri_require__.C(__webpack_chunk_4__);
+/******/ import * as __webpack_chunk_5__ from "./chunk-302.js";
+/******/ __nuri_require__.C(__webpack_chunk_5__);
+/******/ import * as __webpack_chunk_6__ from "./chunk-713.js";
+/******/ __nuri_require__.C(__webpack_chunk_6__);
+/******/ import * as __webpack_chunk_7__ from "./chunk-976.js";
+/******/ __nuri_require__.C(__webpack_chunk_7__);
+/******/ import * as __webpack_chunk_8__ from "./chunk-910.js";
+/******/ __nuri_require__.C(__webpack_chunk_8__);
+/******/ import * as __webpack_chunk_9__ from "./chunk-77.js";
+/******/ __nuri_require__.C(__webpack_chunk_9__);
+/******/ 
+/******/ // startup
+/******/ // Load entry module and return exports
+/******/ // This entry module depends on other loaded chunks and execution need to be delayed
+/******/ var __webpack_exports__ = __nuri_require__.O(undefined, [364,777,298,933,302,713,976,910,77], () => (__nuri_require__(4012)))
+/******/ __webpack_exports__ = __nuri_require__.O(__webpack_exports__);
+/******/ const __webpack_exports__ToastProvider = __webpack_exports__.t;
+/******/ const __webpack_exports__default = __webpack_exports__.A;
+/******/ export { __webpack_exports__ToastProvider as ToastProvider, __webpack_exports__default as default };
+/******/ 

package/dist/tokens.css

@@ -151,11 +151,11 @@
   --line-height-5xl: 66px;
   --line-height-6xl: 82px;
   /* 한 줄에 나란히 놓이는 컨트롤: button, drop-down, text-field */
-  --control-height-xs: 30px;
-  --control-height-s: 40px;
-  --control-height-m: 50px;
-  --control-height-l: 54px;
-  --control-height-xl: 60px;
+  --control-height-xs: 28px;
+  --control-height-s: 36px;
+  --control-height-m: 40px;
+  --control-height-l: 44px;
+  --control-height-xl: 48px;
 
   /* 라벨: badge */
   --label-height-xs: 28px;
@@ -175,6 +175,15 @@
   --checkbox-size-l: 24px;
   --radio-size: 18px;
   --radio-dot-size: 8px;
+
+  /* 스위치: 트랙 폭·높이. 손잡이는 트랙 높이에서 inset 을 뺀 정사각이다 */
+  --switch-width-s: 32px;
+  --switch-width-m: 40px;
+  --switch-width-l: 48px;
+  --switch-height-s: 18px;
+  --switch-height-m: 22px;
+  --switch-height-l: 26px;
+  --switch-thumb-inset: 2px;
   --avatar-size-s: 40px;
   --avatar-size-m: 58px;
   --avatar-size-l: 74px;
@@ -185,6 +194,13 @@
   --avatar-badge-size-xl: 48px;
 
   /* 폭 */
+  --drawer-width-s: 320px;
+  --drawer-width-m: 400px;
+  --drawer-width-l: 520px;
+  --drawer-height-s: 320px;
+  --drawer-height-m: 400px;
+  --drawer-height-l: 520px;
+  --toast-width: 360px;
   --modal-width-s: 400px;
   --modal-width-m: 450px;
   --modal-width-l: 500px;
@@ -195,8 +211,17 @@
   --icon-size-l: 24px;
   --tooltip-arrow: 8px;
   --spinner-stroke: 3px;
+  --overlay-spinner-size: 64px;
+  --overlay-spinner-stroke: 8px;
   --tab-indicator-thickness: 3px;
   --checkbox-border: 1.5px;
+  --breadcrumb-chevron-xs: 12px;
+  --breadcrumb-chevron-s: 14px;
+  --breadcrumb-chevron-m: 16px;
+  --breadcrumb-chevron-l: 18px;
+  --breadcrumb-chevron-xl: 20px;
+  --skeleton-text-height: 16px;
+  --skeleton-last-line-width: 60%;
   --hairline: 1px;
 
   /* 그림자 */
@@ -211,12 +236,14 @@
   --z-popover: 5;
   --z-overlay: 9998;
   --z-modal: 9999;
+  --z-toast: 10000;
 
   /* 모션 */
   --motion-fast: 160ms;
   --motion-base: 300ms;
   --motion-ease: ease;
   --spinner-duration: 1.2s;
+  --skeleton-duration: 1.5s;
   --spinner-ease: cubic-bezier(0.5, 0, 0.5, 1);
 }
 /* semantic: app */

package/dist/tooltip.js

@@ -12,9 +12,9 @@ import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_179142b8__ from "react/j
 /* harmony export */   B: () => (/* binding */ TooltipProvider)
 /* harmony export */ });
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __nuri_require__(612);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __nuri_require__(41);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __nuri_require__(1041);
 /* harmony import */ var radix_ui__WEBPACK_IMPORTED_MODULE_2__ = __nuri_require__(0);
-/* harmony import */ var _helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__ = __nuri_require__(274);
+/* harmony import */ var _helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_3__ = __nuri_require__(3274);
 var __assign = undefined && undefined.__assign || function () {
   __assign = Object.assign || function (t) {
     for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -108,7 +108,7 @@ var TooltipRoot = Object.assign(TooltipRootBase, {
 
 /***/ },
 
-/***/ 563
+/***/ 1563
 (__unused_webpack_module, __webpack_exports__, __nuri_require__) {
 
 /* harmony export */ __nuri_require__.d(__webpack_exports__, {
@@ -116,11 +116,11 @@ var TooltipRoot = Object.assign(TooltipRootBase, {
 /* harmony export */   B: () => (/* reexport safe */ _base_tooltip__WEBPACK_IMPORTED_MODULE_4__.B)
 /* harmony export */ });
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __nuri_require__(612);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __nuri_require__(41);
-/* harmony import */ var _helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_2__ = __nuri_require__(274);
-/* harmony import */ var _helpers_utils_getMergedProps__WEBPACK_IMPORTED_MODULE_3__ = __nuri_require__(335);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __nuri_require__(1041);
+/* harmony import */ var _helpers_utils_classNames__WEBPACK_IMPORTED_MODULE_2__ = __nuri_require__(3274);
+/* harmony import */ var _helpers_utils_getMergedProps__WEBPACK_IMPORTED_MODULE_3__ = __nuri_require__(7335);
 /* harmony import */ var _base_tooltip__WEBPACK_IMPORTED_MODULE_4__ = __nuri_require__(909);
-/* harmony import */ var _tooltip_props__WEBPACK_IMPORTED_MODULE_5__ = __nuri_require__(690);
+/* harmony import */ var _tooltip_props__WEBPACK_IMPORTED_MODULE_5__ = __nuri_require__(8690);
 var __assign = undefined && undefined.__assign || function () {
   __assign = Object.assign || function (t) {
     for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -191,7 +191,7 @@ module.exports = x({ ["Tooltip"]: () => (__WEBPACK_EXTERNAL_MODULE_radix_ui_3bc9
 
 /***/ },
 
-/***/ 41
+/***/ 1041
 (module, __unused_webpack_exports, __nuri_require__) {
 
 var x = (y) => {
@@ -352,7 +352,7 @@ module.exports = x({ ["Fragment"]: () => (__WEBPACK_EXTERNAL_MODULE_react_jsx_ru
 /******/ // startup
 /******/ // Load entry module and return exports
 /******/ // This entry module depends on other loaded chunks and execution need to be delayed
-/******/ var __webpack_exports__ = __nuri_require__.O(undefined, [364,309], () => (__nuri_require__(563)))
+/******/ var __webpack_exports__ = __nuri_require__.O(undefined, [364,309], () => (__nuri_require__(1563)))
 /******/ __webpack_exports__ = __nuri_require__.O(__webpack_exports__);
 /******/ const __webpack_exports__TooltipProvider = __webpack_exports__.B;
 /******/ const __webpack_exports__default = __webpack_exports__.A;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nurihaus/web-design-system",
-  "version": "3.0.3",
+  "version": "3.1.1",
   "description": "Nurihaus 디자인 시스템 — 컴포넌트와 디자인 토큰",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -144,6 +144,38 @@
       "types": "./dist/components/check-box/check-box.d.ts",
       "default": "./dist/check-box.js"
     },
+    "./switch": {
+      "types": "./dist/components/switch/switch.d.ts",
+      "default": "./dist/switch.js"
+    },
+    "./text-area": {
+      "types": "./dist/components/text-area/text-area.d.ts",
+      "default": "./dist/text-area.js"
+    },
+    "./toast": {
+      "types": "./dist/components/toast/toast.d.ts",
+      "default": "./dist/toast.js"
+    },
+    "./pagination": {
+      "types": "./dist/components/pagination/pagination.d.ts",
+      "default": "./dist/pagination.js"
+    },
+    "./modal": {
+      "types": "./dist/components/modal/modal.d.ts",
+      "default": "./dist/modal.js"
+    },
+    "./drawer": {
+      "types": "./dist/components/drawer/drawer.d.ts",
+      "default": "./dist/drawer.js"
+    },
+    "./skeleton": {
+      "types": "./dist/components/skeleton/skeleton.d.ts",
+      "default": "./dist/skeleton.js"
+    },
+    "./breadcrumb": {
+      "types": "./dist/components/breadcrumb/breadcrumb.d.ts",
+      "default": "./dist/breadcrumb.js"
+    },
     "./drop-down": {
       "types": "./dist/components/drop-down/drop-down.d.ts",
       "default": "./dist/drop-down.js"