@apexcura/ui-components 0.0.12-Beta63 → 0.0.12-Beta65

package/dist/index.css

@@ -451,6 +451,34 @@ video {
 :where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper {
   border: 1px solid #919191;
 }
+:where(.css-dev-only-do-not-override-1r287do).ant-input-affix-wrapper {
+  border: solid 1px #919191;
+  width: 275px;
+  height: 16px;
+  padding: 16px;
+  gap: 10px;
+}
+:where(.css-dev-only-do-not-override-1r287do).ant-input-outlined:hover {
+  border: solid 1px #919191;
+}
+:where(.css-dev-only-do-not-override-1r287do).ant-input-outlined:focus {
+  border: solid 1px #919191;
+}
+:where(.css-dev-only-do-not-override-1r287do).ant-input-outlined:focus-within {
+  border: solid 1px #919191;
+}
+:where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::before {
+  display: none;
+}
+:where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::after {
+  display: none;
+}
+:where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper:not(:first-child)::before {
+  width: 0;
+}
+:where(.css-dev-only-do-not-override-1r287do).ant-radio-button-wrapper:first-child {
+  border-inline-start: 1px solid rgb(145 145 145);
+}
 .hover\:bg-\[\#F2F2F2\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(242 242 242 / var(--tw-bg-opacity));

package/dist/index.js

@@ -187,6 +187,7 @@ var import_react6 = __toESM(require("react"));
 var import_antd6 = require("antd");
 var containerClassName = " ";
 var className = "bg-[#F2F2F2] border border-[#919191] !rounded-[8px] !m-[10px] hover:bg-[#F2F2F2] !text-center !text-black !shadow-[0px_0px_1px_1px_#919191]";
+var selectedClassName = "!bg-[#E2D6F8] !border !border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center !text-black shadow-[0px_0px_1px_1px_#919191]";
 var RadioElement = (props) => {
   const [isDisabled, setIsDisabled] = (0, import_react6.useState)(props.disabled);
   const [selectedValue, setSelectedValue] = (0, import_react6.useState)(props.value);
@@ -200,6 +201,9 @@ var RadioElement = (props) => {
       props.onChange(selectedOptions);
     }
   };
+  const getButtonStyle = (option) => {
+    return selectedValue === option.value ? `${selectedClassName} ${option.selectedClassName}` : `${className} ${option.className}`;
+  };
   return /* @__PURE__ */ import_react6.default.createElement("div", { className: containerClassName }, /* @__PURE__ */ import_react6.default.createElement(
     import_antd6.Radio.Group,
     {
@@ -214,7 +218,7 @@ var RadioElement = (props) => {
         key: option.value,
         value: option.value,
         disabled: isDisabled && selectedValue !== option.value,
-        className,
+        className: getButtonStyle(option),
         style: { pointerEvents: isDisabled && selectedValue !== option.value ? "none" : "auto" }
       },
       option.label

package/dist/index.mjs

@@ -140,6 +140,7 @@ import React6, { useState as useState2 } from "react";
 import { Radio } from "antd";
 var containerClassName = " ";
 var className = "bg-[#F2F2F2] border border-[#919191] !rounded-[8px] !m-[10px] hover:bg-[#F2F2F2] !text-center !text-black !shadow-[0px_0px_1px_1px_#919191]";
+var selectedClassName = "!bg-[#E2D6F8] !border !border-[#B8A4DE] rounded-[8px] p-[6px] m-[10px] shadow-[0px_0px_1px_1px_#B8A4DE] text-center !text-black shadow-[0px_0px_1px_1px_#919191]";
 var RadioElement = (props) => {
   const [isDisabled, setIsDisabled] = useState2(props.disabled);
   const [selectedValue, setSelectedValue] = useState2(props.value);
@@ -153,6 +154,9 @@ var RadioElement = (props) => {
       props.onChange(selectedOptions);
     }
   };
+  const getButtonStyle = (option) => {
+    return selectedValue === option.value ? `${selectedClassName} ${option.selectedClassName}` : `${className} ${option.className}`;
+  };
   return /* @__PURE__ */ React6.createElement("div", { className: containerClassName }, /* @__PURE__ */ React6.createElement(
     Radio.Group,
     {
@@ -167,7 +171,7 @@ var RadioElement = (props) => {
         key: option.value,
         value: option.value,
         disabled: isDisabled && selectedValue !== option.value,
-        className,
+        className: getButtonStyle(option),
         style: { pointerEvents: isDisabled && selectedValue !== option.value ? "none" : "auto" }
       },
       option.label

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.12-Beta63",
+  "version": "0.0.12-Beta65",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",
@@ -25,9 +25,7 @@
   "types": "./dist/index.d.ts",
   "scripts": {
     "test": "jest",
-    "build:css": "npx tailwindcss -i ./src/styles/index.css -o ./dist/styles.css",
-    "build:ts": "tsup",
-    "build": "npm run build:css && npm run build:ts"
+    "build": "tsup"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.4.2",

package/postcss.config.js

@@ -1,6 +1,6 @@
 module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
+  plugins: [
+    require('tailwindcss'),
+    require('autoprefixer'),
+  ]
 }

package/tailwind.config.js

@@ -1,10 +1,9 @@
-/** @type {import('tailwindcss').Config} */
 module.exports = {
   content: [
-    "./src/**/*.{js,jsx,ts,tsx}",
+    "./src/**/*.{js,jsx,ts,tsx}", // Adjust this path according to your project structure
   ],
   theme: {
     extend: {},
   },
   plugins: [],
-}
+};