ag-common 0.0.807 → 0.0.809

package/dist/ui/components/DarkMode/Base.js

@@ -94,6 +94,8 @@ const DarkModeAux = ({ iconSize = '2.5rem', className, mode, onSubmit, style, dm
     const [index, setIndex] = (0, react_1.useState)(modes.findIndex((d) => d.mode === dm.darkmode));
     const [fill, background] = getColours(modes[index].mode, mode === 'vert');
     const twCalc = `calc(${iconSize} + ${iconSize} + ${iconSize} + 8px)`;
+    const width = mode === 'vert' ? `calc(${iconSize} + 8px)` : twCalc;
+    const height = mode === 'vert' ? twCalc : `calc(${iconSize} + 8px)`;
     const setDarkmode = (newDarkMode) => {
         let className = '';
         if (newDarkMode === types_1.TDarkMode.dark) {
@@ -119,12 +121,10 @@ const DarkModeAux = ({ iconSize = '2.5rem', className, mode, onSubmit, style, dm
         dm.setDarkmode(newDarkMode);
         onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(newDarkMode);
     };
-    return (react_1.default.createElement("div", { className: (0, utils_1.cn)('flex flex-row overflow-hidden justify-between items-center rounded-4xl', 'data-[mode=vert]:flex-col', className), "data-mode": mode !== null && mode !== void 0 ? mode : 'horiz', style: Object.assign(Object.assign(Object.assign({}, style), { background, border: `solid 2px ${fill}`, width: twCalc, height: `calc(${iconSize} + 8px)`, padding: '2px', boxSizing: 'border-box' }), (mode === 'vert' && {
-            width: `calc(${iconSize} + 8px)`,
-            height: twCalc,
-        })) }, modes.map((v, i) => {
+    return (react_1.default.createElement("div", { className: (0, utils_1.cn)('flex flex-row overflow-hidden justify-between items-center rounded-4xl', 'border-2 border-solid p-[2px] box-border', 'data-[mode=vert]:flex-col', className), "data-mode": mode !== null && mode !== void 0 ? mode : 'horiz', style: Object.assign(Object.assign({}, style), { background, borderColor: fill, width,
+            height }) }, modes.map((v, i) => {
         const selected = index === i;
-        return (react_1.default.createElement("div", { className: (0, utils_1.cn)('flex flex-col items-center justify-center rounded-full overflow-hidden cursor-pointer', 'data-[selected=true]:bg-white data-[selected=true]:cursor-default'), "data-selected": selected, style: { width: iconSize, height: iconSize }, 
+        return (react_1.default.createElement("div", { className: (0, utils_1.cn)('flex flex-col items-center justify-center rounded-full overflow-hidden cursor-pointer', selected && 'bg-white cursor-default'), "data-selected": selected, style: { width: iconSize, height: iconSize }, 
             // eslint-disable-next-line react/no-array-index-key
             key: i.toString(), onClick: () => {
                 if (index === i) {

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.807",
+  "version": "0.0.809",
   "name": "ag-common",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",