@imc0nt0/wooris 0.0.4 → 0.0.5

package/dist/index.esm.js

@@ -1,6 +1,17 @@
-import React from 'react';
+import React, { useEffect, useContext, useState, useCallback, createContext } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
+function _arrayLikeToArray(r, a) {
+  (null == a || a > r.length) && (a = r.length);
+  for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+  return n;
+}
+function _arrayWithHoles(r) {
+  if (Array.isArray(r)) return r;
+}
+function _arrayWithoutHoles(r) {
+  if (Array.isArray(r)) return _arrayLikeToArray(r);
+}
 function _defineProperty(e, r, t) {
   return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
     value: t,
@@ -9,6 +20,42 @@ function _defineProperty(e, r, t) {
     writable: !0
   }) : e[r] = t, e;
 }
+function _iterableToArray(r) {
+  if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
+}
+function _iterableToArrayLimit(r, l) {
+  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (null != t) {
+    var e,
+      n,
+      i,
+      u,
+      a = [],
+      f = !0,
+      o = !1;
+    try {
+      if (i = (t = t.call(r)).next, 0 === l) {
+        if (Object(t) !== t) return;
+        f = !1;
+      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+    } catch (r) {
+      o = !0, n = r;
+    } finally {
+      try {
+        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
+      } finally {
+        if (o) throw n;
+      }
+    }
+    return a;
+  }
+}
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
 function ownKeys(e, r) {
   var t = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
@@ -50,6 +97,12 @@ function _objectWithoutPropertiesLoose(r, e) {
   }
   return t;
 }
+function _slicedToArray(r, e) {
+  return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
+}
+function _toConsumableArray(r) {
+  return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
+}
 function _toPrimitive(t, r) {
   if ("object" != typeof t || !t) return t;
   var e = t[Symbol.toPrimitive];
@@ -64,6 +117,13 @@ function _toPropertyKey(t) {
   var i = _toPrimitive(t, "string");
   return "symbol" == typeof i ? i : i + "";
 }
+function _unsupportedIterableToArray(r, a) {
+  if (r) {
+    if ("string" == typeof r) return _arrayLikeToArray(r, a);
+    var t = {}.toString.call(r).slice(8, -1);
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
+  }
+}
 
 var propTypesExports = {};
 var propTypes = {
@@ -1255,20 +1315,23 @@ if (process.env.NODE_ENV !== 'production') {
   propTypes.exports = requireFactoryWithThrowingShims()();
 }
 
-var _excluded$1 = ["children", "variant", "onClick", "className", "disabled"];
+var _excluded$3 = ["children", "variant", "type", "onClick", "className", "disabled"];
 var Button = function Button(_ref) {
   var children = _ref.children,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'md' : _ref$type,
     onClick = _ref.onClick,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? '' : _ref$className,
     _ref$disabled = _ref.disabled,
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    rest = _objectWithoutProperties(_ref, _excluded$1);
+    rest = _objectWithoutProperties(_ref, _excluded$3);
   var variantClass = "wooris-btn-".concat(variant);
+  var typeClass = "wooris-btn-".concat(type);
   return /*#__PURE__*/jsx("button", _objectSpread2(_objectSpread2({
-    className: "wooris-btn ".concat(variantClass, " ").concat(className),
+    className: "wooris-btn ".concat(variantClass, " ").concat(typeClass, " ").concat(className),
     onClick: onClick,
     disabled: disabled
   }, rest), {}, {
@@ -1278,12 +1341,13 @@ var Button = function Button(_ref) {
 Button.propTypes = {
   children: propTypesExports.node,
   variant: propTypesExports.oneOf(['primary', 'success', 'error', 'info', 'warning']),
+  type: propTypesExports.oneOf(['xs', 'sm', 'md', 'lg', 'xl', 'xl2', 'xl3']),
   onClick: propTypesExports.func,
   className: propTypesExports.string,
   disabled: propTypesExports.bool
 };
 
-var _excluded = ["placeholder", "value", "onChange", "className", "type"];
+var _excluded$2 = ["placeholder", "value", "onChange", "className", "type"];
 var Input = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$placeholder = _ref.placeholder,
     placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
@@ -1293,7 +1357,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     className = _ref$className === void 0 ? '' : _ref$className,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'text' : _ref$type,
-    rest = _objectWithoutProperties(_ref, _excluded);
+    rest = _objectWithoutProperties(_ref, _excluded$2);
   return /*#__PURE__*/jsx("input", _objectSpread2({
     ref: ref,
     className: "wooris-input ".concat(className),
@@ -1385,21 +1449,77 @@ Modal.propTypes = {
   closeOnBackdrop: propTypesExports.bool
 };
 
-var colors = {
-  success: "#10B981",
-  error: "#EF4444",
-  info: "#3B82F6",
-  warning: "#F59E0B",
-  primary: "#3B82F6",
-  text: "#111827",
-  bg: "#ffffff"
+var _excluded$1 = ["children", "container", "item", "spacing", "type", "xs", "sm", "md", "lg"];
+var Grid = function Grid(_ref) {
+  var children = _ref.children,
+    _ref$container = _ref.container,
+    container = _ref$container === void 0 ? false : _ref$container,
+    _ref$item = _ref.item,
+    item = _ref$item === void 0 ? false : _ref$item,
+    _ref$spacing = _ref.spacing,
+    spacing = _ref$spacing === void 0 ? 0 : _ref$spacing,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'md' : _ref$type,
+    xs = _ref.xs,
+    sm = _ref.sm,
+    md = _ref.md,
+    lg = _ref.lg,
+    rest = _objectWithoutProperties(_ref, _excluded$1);
+  var classNames = ['wooris-grid'];
+  var styles = {};
+  if (container) {
+    classNames.push('wooris-grid-container');
+    if (spacing > 0) {
+      styles.gap = "".concat(spacing * 8, "px");
+    }
+  }
+  if (item) {
+    classNames.push('wooris-grid-item');
+    classNames.push("wooris-grid-item-".concat(type)); // Apply type class to items
+    if (xs) classNames.push("wooris-grid-xs-".concat(xs));
+    if (sm) classNames.push("wooris-grid-sm-".concat(sm));
+    if (md) classNames.push("wooris-grid-md-".concat(md));
+    if (lg) classNames.push("wooris-grid-lg-".concat(lg));
+  }
+  return /*#__PURE__*/jsx("div", _objectSpread2(_objectSpread2({
+    className: classNames.join(' '),
+    style: styles
+  }, rest), {}, {
+    children: children
+  }));
 };
-var fonts = {
-  sans: 'Freesentation-5Medium, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial'
+Grid.propTypes = {
+  children: propTypesExports.node,
+  container: propTypesExports.bool,
+  item: propTypesExports.bool,
+  spacing: propTypesExports.number,
+  type: propTypesExports.oneOf(['xs', 'sm', 'md', 'lg', 'xl', 'xl2', 'xl3']),
+  // Updated type prop types
+  xs: propTypesExports.number,
+  sm: propTypesExports.number,
+  md: propTypesExports.number,
+  lg: propTypesExports.number
 };
-var tokens = {
-  colors: colors,
-  fonts: fonts
+
+var _excluded = ["children", "type", "className"];
+var Card = function Card(_ref) {
+  var children = _ref.children,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'md' : _ref$type,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var typeClass = "wooris-card-".concat(type);
+  return /*#__PURE__*/jsx("div", _objectSpread2(_objectSpread2({
+    className: "wooris-card ".concat(typeClass, " ").concat(className)
+  }, rest), {}, {
+    children: children
+  }));
+};
+Card.propTypes = {
+  children: propTypesExports.node,
+  type: propTypesExports.oneOf(['xs', 'sm', 'md', 'lg', 'xl', 'xl2', 'xl3']),
+  className: propTypesExports.string
 };
 
 function styleInject(css, ref) {
@@ -1429,8 +1549,205 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "@font-face {\r\n    font-family: \"Freesentation-5Medium\";\r\n    src: url(\"https://cdn.jsdelivr.net/gh/projectnoonnu/2404@1.0/Freesentation-5Medium.woff2\") format(\"woff2\");\r\n    font-weight: 500;\r\n    font-style: normal;\r\n    font-display: swap;\r\n}\r\n\r\n\r\n:root {\r\n    --color-success: #10B981;\r\n    --color-error: #EF4444;\r\n    --color-info: #3B82F6;\r\n    --color-warning: #F59E0B;\r\n\r\n\r\n    --color-primary: var(--color-info);\r\n    --color-text: #111827;\r\n    --color-bg: #ffffff;\r\n\r\n\r\n    --font-sans: \"Freesentation-5Medium\", system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial;\r\n    --font-size-base: 16px;\r\n    --radius-sm: 6px;\r\n    --radius-md: 10px;\r\n}\r\n\r\n\r\n.wooris-btn { font-family: var(--font-sans); border-radius: var(--radius-md); padding: 0.5rem 1rem; border: none; cursor: pointer; }\r\n\r\n\r\n.wooris-btn-primary { background: var(--color-primary); color: white; }\r\n\r\n\r\n.wooris-btn-success { background: var(--color-success); color: white; }\r\n\r\n\r\n.wooris-btn-error { background: var(--color-error); color: white; }\r\n\r\n\r\n.wooris-btn-info { background: var(--color-info); color: white; }\r\n\r\n\r\n.wooris-btn-warning { background: var(--color-warning); color: black; }\r\n\r\n\r\n.wooris-btn:disabled { opacity: 0.5; cursor: not-allowed; }\r\n\r\n\r\n.wooris-badge { display:inline-flex; align-items:center; gap:0.4rem; font-family:var(--font-sans); padding: 0.2rem 0.5rem; border-radius: 9999px; font-size: 0.875rem; color: white; }\r\n\r\n\r\n.wooris-badge-primary { background: var(--color-primary); }\r\n\r\n\r\n.wooris-badge-success { background: var(--color-success); }\r\n\r\n\r\n.wooris-badge-error { background: var(--color-error); }\r\n\r\n\r\n.wooris-badge-info { background: var(--color-info); }\r\n\r\n\r\n.wooris-badge-warning { background: var(--color-warning); color: black; }\r\n\r\n\r\n.wooris-input { font-family:var(--font-sans); padding: 0.5rem 0.75rem; border-radius: var(--radius-sm); border: 1px solid #e5e7eb; }\r\n\r\n\r\n.wooris-modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.4); display:flex; align-items:center; justify-content:center; z-index: 9999; }\r\n\r\n\r\n.wooris-modal-sheet { background: white; border-radius: 12px; padding: 1rem; min-width: 320px; max-width: 720px; box-shadow: 0 10px 30px rgba(2,6,23,0.2); }\r\n\r\n\r\n* { box-sizing: border-box; }\r\n\r\n\r\nbody { margin: 0; font-family: var(--font-sans); color: var(--color-text); }";
+var css_248z$1 = ".wooris-toast-container {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  z-index: 1000;\n  display: flex;\n  flex-direction: column;\n  gap: 10px; /* Space between toasts */\n  align-items: flex-end; /* Align toasts to the right */\n}\n\n.wooris-toast {\n  padding: 10px 20px;\n  border-radius: 5px;\n  color: #fff;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);\n  min-width: 250px;\n  opacity: 0;\n  transform: translateX(100%); /* Slide in from right */\n  animation: slideInToast 0.3s forwards;\n}\n\n.wooris-toast-message {\n  margin-right: 10px;\n}\n\n.wooris-toast-close {\n  background: none;\n  border: none;\n  color: #fff;\n  font-size: 1.2em;\n  cursor: pointer;\n}\n\n/* Types */\n\n.wooris-toast-info {\n  background-color: #2196f3; /* Blue */\n}\n\n.wooris-toast-success {\n  background-color: #4caf50; /* Green */\n}\n\n.wooris-toast-error {\n  background-color: #f44336; /* Red */\n}\n\n.wooris-toast-warning {\n  background-color: #ff9800; /* Orange */\n}\n\n@keyframes slideInToast {\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n";
+styleInject(css_248z$1,{"insertAt":"top"});
+
+var ToastAlert = function ToastAlert(_ref) {
+  var message = _ref.message,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'info' : _ref$type,
+    _ref$duration = _ref.duration,
+    duration = _ref$duration === void 0 ? 3000 : _ref$duration,
+    onClose = _ref.onClose;
+  useEffect(function () {
+    var timer = setTimeout(function () {
+      if (onClose) {
+        onClose();
+      }
+    }, duration);
+    return function () {
+      return clearTimeout(timer);
+    };
+  }, [duration, onClose]);
+  var toastClass = "wooris-toast wooris-toast-".concat(type);
+  return /*#__PURE__*/jsxs("div", {
+    className: toastClass,
+    role: "alert",
+    children: [/*#__PURE__*/jsx("div", {
+      className: "wooris-toast-message",
+      children: message
+    }), /*#__PURE__*/jsx("button", {
+      className: "wooris-toast-close",
+      onClick: onClose,
+      children: "\xD7"
+    })]
+  });
+};
+ToastAlert.propTypes = {
+  message: propTypesExports.string.isRequired,
+  type: propTypesExports.oneOf(['success', 'error', 'info', 'warning']),
+  duration: propTypesExports.number,
+  onClose: propTypesExports.func
+};
+
+const byteToHex = [];
+for (let i = 0; i < 256; ++i) {
+    byteToHex.push((i + 0x100).toString(16).slice(1));
+}
+function unsafeStringify(arr, offset = 0) {
+    return (byteToHex[arr[offset + 0]] +
+        byteToHex[arr[offset + 1]] +
+        byteToHex[arr[offset + 2]] +
+        byteToHex[arr[offset + 3]] +
+        '-' +
+        byteToHex[arr[offset + 4]] +
+        byteToHex[arr[offset + 5]] +
+        '-' +
+        byteToHex[arr[offset + 6]] +
+        byteToHex[arr[offset + 7]] +
+        '-' +
+        byteToHex[arr[offset + 8]] +
+        byteToHex[arr[offset + 9]] +
+        '-' +
+        byteToHex[arr[offset + 10]] +
+        byteToHex[arr[offset + 11]] +
+        byteToHex[arr[offset + 12]] +
+        byteToHex[arr[offset + 13]] +
+        byteToHex[arr[offset + 14]] +
+        byteToHex[arr[offset + 15]]).toLowerCase();
+}
+
+let getRandomValues;
+const rnds8 = new Uint8Array(16);
+function rng() {
+    if (!getRandomValues) {
+        if (typeof crypto === 'undefined' || !crypto.getRandomValues) {
+            throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+        }
+        getRandomValues = crypto.getRandomValues.bind(crypto);
+    }
+    return getRandomValues(rnds8);
+}
+
+const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
+var native = { randomUUID };
+
+function _v4(options, buf, offset) {
+    options = options || {};
+    const rnds = options.random ?? options.rng?.() ?? rng();
+    if (rnds.length < 16) {
+        throw new Error('Random bytes length must be >= 16');
+    }
+    rnds[6] = (rnds[6] & 0x0f) | 0x40;
+    rnds[8] = (rnds[8] & 0x3f) | 0x80;
+    if (buf) {
+        offset = offset || 0;
+        if (offset < 0 || offset + 16 > buf.length) {
+            throw new RangeError(`UUID byte range ${offset}:${offset + 15} is out of buffer bounds`);
+        }
+        for (let i = 0; i < 16; ++i) {
+            buf[offset + i] = rnds[i];
+        }
+        return buf;
+    }
+    return unsafeStringify(rnds);
+}
+function v4(options, buf, offset) {
+    if (native.randomUUID && !buf && !options) {
+        return native.randomUUID();
+    }
+    return _v4(options, buf, offset);
+}
+
+var ToastContext = /*#__PURE__*/createContext();
+
+// Custom hook to use the toast functions
+var useToast = function useToast() {
+  return useContext(ToastContext);
+};
+
+// Toast Provider component
+var ToastProvider = function ToastProvider(_ref) {
+  var children = _ref.children;
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    toasts = _useState2[0],
+    setToasts = _useState2[1];
+  var addToast = useCallback(function (message) {
+    var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'info';
+    var duration = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 3000;
+    var id = v4();
+    setToasts(function (prevToasts) {
+      return [].concat(_toConsumableArray(prevToasts), [{
+        id: id,
+        message: message,
+        type: type,
+        duration: duration
+      }]);
+    });
+  }, []);
+  var removeToast = useCallback(function (id) {
+    setToasts(function (prevToasts) {
+      return prevToasts.filter(function (toast) {
+        return toast.id !== id;
+      });
+    });
+  }, []);
+  var showInfo = useCallback(function (message, duration) {
+    return addToast(message, 'info', duration);
+  }, [addToast]);
+  var showSuccess = useCallback(function (message, duration) {
+    return addToast(message, 'success', duration);
+  }, [addToast]);
+  var showError = useCallback(function (message, duration) {
+    return addToast(message, 'error', duration);
+  }, [addToast]);
+  var showWarning = useCallback(function (message, duration) {
+    return addToast(message, 'warning', duration);
+  }, [addToast]);
+  var contextValue = {
+    showInfo: showInfo,
+    showSuccess: showSuccess,
+    showError: showError,
+    showWarning: showWarning
+  };
+  return /*#__PURE__*/jsxs(ToastContext.Provider, {
+    value: contextValue,
+    children: [children, /*#__PURE__*/jsxs("div", {
+      className: "wooris-toast-container",
+      children: [" ", toasts.map(function (toast) {
+        return /*#__PURE__*/jsx(ToastAlert, {
+          message: toast.message,
+          type: toast.type,
+          duration: toast.duration,
+          onClose: function onClose() {
+            return removeToast(toast.id);
+          }
+        }, toast.id);
+      })]
+    })]
+  });
+};
+
+var colors = {
+  success: "#10B981",
+  error: "#EF4444",
+  info: "#3B82F6",
+  warning: "#F59E0B",
+  primary: "#3B82F6",
+  text: "#111827",
+  bg: "#ffffff"
+};
+var fonts = {
+  sans: 'Freesentation-5Medium, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial'
+};
+var tokens = {
+  colors: colors,
+  fonts: fonts
+};
+
+var css_248z = "@font-face {\n    font-family: \"Freesentation-5Medium\";\n    src: url(\"https://cdn.jsdelivr.net/gh/projectnoonnu/2404@1.0/Freesentation-5Medium.woff2\") format(\"woff2\");\n    font-weight: 500;\n    font-style: normal;\n    font-display: swap;\n}\n\n\n:root {\n    --color-success: #10B981;\n    --color-error: #EF4444;\n    --color-info: #3B82F6;\n    --color-warning: #F59E0B;\n\n\n    --color-primary: var(--color-info);\n    --color-text: #111827;\n    --color-bg: #ffffff;\n\n\n    --font-sans: \"Freesentation-5Medium\", system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial;\n    --font-size-base: 16px;\n    --radius-sm: 6px;\n    --radius-md: 10px;\n\n    --breakpoint-sm: 600px;\n    --breakpoint-md: 960px;\n    --breakpoint-lg: 1280px;\n}\n\n\n.wooris-btn { font-family: var(--font-sans); border-radius: var(--radius-md); padding: 0.5rem 1rem; border: none; cursor: pointer; }\n\n\n.wooris-btn-primary { background: var(--color-primary); color: white; }\n\n\n.wooris-btn-success { background: var(--color-success); color: white; }\n\n\n.wooris-btn-error { background: var(--color-error); color: white; }\n\n\n.wooris-btn-info { background: var(--color-info); color: white; }\n\n\n.wooris-btn-warning { background: var(--color-warning); color: black; }\n\n\n.wooris-btn:disabled { opacity: 0.5; cursor: not-allowed; }\n\n\n/* Button Sizes */\n\n\n.wooris-btn-xs {\n    padding: 0.2rem 0.5rem;\n    font-size: 0.7rem;\n}\n\n\n.wooris-btn-sm {\n    padding: 0.3rem 0.7rem;\n    font-size: 0.8rem;\n}\n\n\n.wooris-btn-md {\n    padding: 0.5rem 1rem;\n    font-size: 1rem;\n}\n\n\n.wooris-btn-lg {\n    padding: 0.7rem 1.2rem;\n    font-size: 1.2rem;\n}\n\n\n.wooris-btn-xl {\n    padding: 0.9rem 1.4rem;\n    font-size: 1.4rem;\n}\n\n\n.wooris-btn-xl2 {\n    padding: 1.1rem 1.6rem;\n    font-size: 1.6rem;\n}\n\n\n.wooris-btn-xl3 {\n    padding: 1.3rem 1.8rem;\n    font-size: 1.8rem;\n}\n\n\n.wooris-badge { display:inline-flex; align-items:center; gap:0.4rem; font-family:var(--font-sans); padding: 0.2rem 0.5rem; border-radius: 9999px; font-size: 0.875rem; color: white; }\n\n\n.wooris-badge-primary { background: var(--color-primary); }\n\n\n.wooris-badge-success { background: var(--color-success); }\n\n\n.wooris-badge-error { background: var(--color-error); }\n\n\n.wooris-badge-info { background: var(--color-info); }\n\n\n.wooris-badge-warning { background: var(--color-warning); color: black; }\n\n\n.wooris-input { font-family:var(--font-sans); padding: 0.5rem 0.75rem; border-radius: var(--radius-sm); border: 1px solid #e5e7eb; }\n\n\n.wooris-modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.4); display:flex; align-items:center; justify-content:center; z-index: 9999; }\n\n\n.wooris-modal-sheet { background: white; border-radius: 12px; padding: 1rem; min-width: 320px; max-width: 720px; box-shadow: 0 10px 30px rgba(2,6,23,0.2); }\n\n\n/* Grid Styles */\n\n\n.wooris-grid-container {\n    display: grid;\n    grid-template-columns: repeat(12, 1fr);\n}\n\n\n.wooris-grid-item {\n    min-width: 0; /* Ensures item can shrink */\n}\n\n\n/* Grid Item Sizes */\n\n\n.wooris-grid-item-xs {\n    padding: 0.25rem;\n}\n\n\n.wooris-grid-item-sm {\n    padding: 0.5rem;\n}\n\n\n.wooris-grid-item-md {\n    padding: 1rem;\n}\n\n\n.wooris-grid-item-lg {\n    padding: 1.5rem;\n}\n\n\n.wooris-grid-item-xl {\n    padding: 2rem;\n}\n\n\n.wooris-grid-item-xl2 {\n    padding: 2.5rem;\n}\n\n\n.wooris-grid-item-xl3 {\n    padding: 3rem;\n}\n\n\n/* XS (default mobile-first) */\n\n\n.wooris-grid-xs-1 { grid-column: span 1 / span 1; }\n\n\n.wooris-grid-xs-2 { grid-column: span 2 / span 2; }\n\n\n.wooris-grid-xs-3 { grid-column: span 3 / span 3; }\n\n\n.wooris-grid-xs-4 { grid-column: span 4 / span 4; }\n\n\n.wooris-grid-xs-5 { grid-column: span 5 / span 5; }\n\n\n.wooris-grid-xs-6 { grid-column: span 6 / span 6; }\n\n\n.wooris-grid-xs-7 { grid-column: span 7 / span 7; }\n\n\n.wooris-grid-xs-8 { grid-column: span 8 / span 8; }\n\n\n.wooris-grid-xs-9 { grid-column: span 9 / span 9; }\n\n\n.wooris-grid-xs-10 { grid-column: span 10 / span 10; }\n\n\n.wooris-grid-xs-11 { grid-column: span 11 / span 11; }\n\n\n.wooris-grid-xs-12 { grid-column: span 12 / span 12; }\n\n\n/* SM breakpoint */\n\n\n@media (min-width: var(--breakpoint-sm)) {\n    .wooris-grid-sm-1 { grid-column: span 1 / span 1; }\n    .wooris-grid-sm-2 { grid-column: span 2 / span 2; }\n    .wooris-grid-sm-3 { grid-column: span 3 / span 3; }\n    .wooris-grid-sm-4 { grid-column: span 4 / span 4; }\n    .wooris-grid-sm-5 { grid-column: span 5 / span 5; }\n    .wooris-grid-sm-6 { grid-column: span 6 / span 6; }\n    .wooris-grid-sm-7 { grid-column: span 7 / span 7; }\n    .wooris-grid-sm-8 { grid-column: span 8 / span 8; }\n    .wooris-grid-sm-9 { grid-column: span 9 / span 9; }\n    .wooris-grid-sm-10 { grid-column: span 10 / span 10; }\n    .wooris-grid-sm-11 { grid-column: span 11 / span 11; }\n    .wooris-grid-sm-12 { grid-column: span 12 / span 12; }\n}\n\n\n/* MD breakpoint */\n\n\n@media (min-width: var(--breakpoint-md)) {\n    .wooris-grid-md-1 { grid-column: span 1 / span 1; }\n    .wooris-grid-md-2 { grid-column: span 2 / span 2; }\n    .wooris-grid-md-3 { grid-column: span 3 / span 3; }\n    .wooris-grid-md-4 { grid-column: span 4 / span 4; }\n    .wooris-grid-md-5 { grid-column: span 5 / span 5; }\n    .wooris-grid-md-6 { grid-column: span 6 / span 6; }\n    .wooris-grid-md-7 { grid-column: span 7 / span 7; }\n    .wooris-grid-md-8 { grid-column: span 8 / span 8; }\n    .wooris-grid-md-9 { grid-column: span 9 / span 9; }\n    .wooris-grid-md-10 { grid-column: span 10 / span 10; }\n    .wooris-grid-md-11 { grid-column: span 11 / span 11; }\n    .wooris-grid-md-12 { grid-column: span 12 / span 12; }\n}\n\n\n/* LG breakpoint */\n\n\n@media (min-width: var(--breakpoint-lg)) {\n    .wooris-grid-lg-1 { grid-column: span 1 / span 1; }\n    .wooris-grid-lg-2 { grid-column: span 2 / span 2; }\n    .wooris-grid-lg-3 { grid-column: span 3 / span 3; }\n    .wooris-grid-lg-4 { grid-column: span 4 / span 4; }\n    .wooris-grid-lg-5 { grid-column: span 5 / span 5; }\n    .wooris-grid-lg-6 { grid-column: span 6 / span 6; }\n    .wooris-grid-lg-7 { grid-column: span 7 / span 7; }\n    .wooris-grid-lg-8 { grid-column: span 8 / span 8; }\n    .wooris-grid-lg-9 { grid-column: span 9 / span 9; }\n    .wooris-grid-lg-10 { grid-column: span 10 / span 10; }\n    .wooris-grid-lg-11 { grid-column: span 11 / span 11; }\n    .wooris-grid-lg-12 { grid-column: span 12 / span 12; }\n}\n\n\n/* Card Styles */\n\n\n.wooris-card {\n    background: var(--color-bg);\n    border-radius: var(--radius-md);\n    box-shadow: 0 1px 3px rgba(0,0,0,0.1);\n    border: 1px solid #e5e7eb;\n}\n\n\n.wooris-card-xs {\n    padding: 0.5rem;\n    font-size: 0.75rem;\n}\n\n\n.wooris-card-sm {\n    padding: 0.75rem;\n    font-size: 0.875rem;\n}\n\n\n.wooris-card-md {\n    padding: 1rem;\n    font-size: 1rem;\n}\n\n\n.wooris-card-lg {\n    padding: 1.5rem;\n    font-size: 1.125rem;\n}\n\n\n.wooris-card-xl {\n    padding: 2rem;\n    font-size: 1.25rem;\n}\n\n\n.wooris-card-xl2 {\n    padding: 2.5rem;\n    font-size: 1.375rem;\n}\n\n\n.wooris-card-xl3 {\n    padding: 3rem;\n    font-size: 1.5rem;\n}\n\n\n* { box-sizing: border-box; }\n\n\nbody { margin: 0; font-family: var(--font-sans); color: var(--color-text); }";
 styleInject(css_248z,{"insertAt":"top"});
 
-export { Badge, Button, Input, Modal, colors, fonts, tokens };
+export { Badge, Button, Card, Grid, Input, Modal, ToastAlert, ToastProvider, colors, fonts, tokens, useToast };
 //# sourceMappingURL=index.esm.js.map