opus-toolkit-components 0.7.2 → 0.7.4

package/lib/{main.35bcd6f8c80839a980a8.js → main.eaa73c32b68eb30f0fde.js}

@@ -595,6 +595,7 @@ __webpack_require__.d(__webpack_exports__, {
   Loader: () => (/* reexport */ Loader),
   Modal: () => (/* reexport */ Modals_Modal),
   Navbar: () => (/* reexport */ Navbar_Navbar),
+  Pill: () => (/* reexport */ Pills_Pill),
   RadioButton: () => (/* reexport */ Radios_RadioButton),
   Table: () => (/* reexport */ Table)
 });
@@ -3570,14 +3571,14 @@ function Button(_ref) {
   // Define styles for button ranks
   const rankStyles = {
     primary: 'bg-[--color-primary-btn] hover:bg-[--color-primary-btn-hover] text-greyBaseLight',
-    secondary: 'bg-greyBaseDark900 hover:bg-brandPink700 text-greyBaseLight',
-    outline: 'bg-greyLight50 border-solid border-2 border-[--color-outline-btn] hover:border-[--color-outline-btn-hover] text-[--color-text-strong]',
+    secondary: 'bg-transparent hover:bg-brandPink700 text-greyBaseLight',
+    outline: 'bg-[--color-input-bg] border-solid border-2 border-[--color-outline-btn] hover:border-[--color-outline-btn-hover] text-[--color-text-strong]',
     neutral: 'bg-greyLight50 hover:bg-greyLight100 text-greyLight700',
     destructive: 'bg-utilRed1000 hover:bg-utilRed800 text-greyBaseLight'
   };
 
   // Disabled styles for button
-  const disabledStyles = 'bg-greyLight100 text-greyLight500 cursor-not-allowed';
+  const disabledStyles = 'bg-[--color-input-bg] text-[--color-text-weak] cursor-not-allowed';
 
   // Icon animation style (if applicable)
   const iconClassNames = "inline-block \n    transition-transform \n    ease-in-out \n    duration-200\n    h-5 w-5\n    ".concat(iconPosition === 'right' ? 'ml-2' : 'mr-2', "\n    ").concat(isIconAnimated && !isSaving ? 'group-hover:translate-x-1' : '', "\n    ").concat(isSaving ? 'animate-spin' : '', " // Add spinning animation\n  ");
@@ -3952,13 +3953,13 @@ function Table(_ref) {
     className: "bg-[--color-table-head-bg] ".concat(headRowClassName)
   }, data.map(column => /*#__PURE__*/external_react_default().createElement("th", {
     key: column.key,
-    className: "border-b border-gray-300 py-2 px-4 text-sm font-normal text-greyDark1000 ".concat(headCellClassName)
+    className: "border-b border-[--color-stroke] py-2 px-4 text-sm font-normal text-[--color-text-strong] ".concat(headCellClassName)
   }, column.header)))), /*#__PURE__*/external_react_default().createElement("tbody", null, rows.map((row, index) => /*#__PURE__*/external_react_default().createElement("tr", {
     key: rowKeyExtractor(row, index),
-    className: "".concat(index % 2 === 0 ? "bg-greyLight100" : "bg-greyLight50", " hover:bg-greyLight500 ").concat(rowClassName)
+    className: "".concat(index % 2 === 0 ? "bg-[--color-table-row-bg-even]" : "bg-[--color-table-row-bg-odd]", " hover:bg-[--color-table-row-bg-hover] ").concat(rowClassName)
   }, data.map(column => /*#__PURE__*/external_react_default().createElement("td", {
     key: column.key,
-    className: "p-4 text-sm text-greyLight700 ".concat(cellClassName)
+    className: "p-4 text-sm text-[--color-text-weak] ".concat(cellClassName)
   }, column.render ? column.render(row) : row[column.key]))))));
 }
 ;// ./node_modules/@react-aria/utils/dist/platform.mjs
@@ -12412,6 +12413,28 @@ function Loader(_ref) {
     className: "mt-4 text-greyBaseLight text-lg font-medium animate-pulse"
   }, loaderText));
 }
+;// ./src/components/Pills/Pill.js
+
+const statusClasses = {
+  danger: "bg-[--color-util-red] text-[--color-white]",
+  warning: "bg-[--color-util-amber] text-[--color-white]",
+  success: "bg-[--color-util-green] text-[--color-white]",
+  info: "bg-[--color-util-blue] text-[--color-white]",
+  notice: "bg-[--color-util-yellow] text-[--color-black]" // better contrast
+};
+const Pill = _ref => {
+  let {
+    text,
+    status = "info",
+    className = ""
+  } = _ref;
+  const baseClasses = "inline-block text-xs font-medium px-3 py-1 rounded-full";
+  const statusClass = statusClasses[status] || statusClasses.info;
+  return /*#__PURE__*/external_react_default().createElement("span", {
+    className: "".concat(baseClasses, " ").concat(statusClass, " ").concat(className)
+  }, text);
+};
+/* harmony default export */ const Pills_Pill = (Pill);
 ;// ./src/index.js
 
 
@@ -12425,8 +12448,9 @@ function Loader(_ref) {
 
 
 
+
 /******/ 	return __webpack_exports__;
 /******/ })()
 ;
 });
-//# sourceMappingURL=main.35bcd6f8c80839a980a8.js.map
+//# sourceMappingURL=main.eaa73c32b68eb30f0fde.js.map