@peassoft/mnr-web-ui-kit 2.3.0 → 2.4.0

package/dist/plain-select/icons.d.ts

@@ -0,0 +1,3 @@
+import type { JSX } from 'react';
+export declare function UncheckedIcon(): JSX.Element;
+export declare function CheckedIcon(): JSX.Element;

package/dist/plain-select/icons.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function UncheckedIcon() {
+  return _jsx("svg", {
+    width: '24',
+    height: '24',
+    viewBox: '0 0 24 24',
+    fill: 'none',
+    stroke: 'currentColor',
+    strokeWidth: '1',
+    strokeLinecap: 'round',
+    strokeLinejoin: 'round',
+    className: 'uikit_PlainSelect_icon uikit_PlainSelect_uncheckedIcon',
+    children: _jsx("rect", {
+      width: '18',
+      height: '18',
+      x: '3',
+      y: '3',
+      rx: '2'
+    })
+  });
+}
+export function CheckedIcon() {
+  return _jsxs("svg", {
+    width: '24',
+    height: '24',
+    viewBox: '0 0 24 24',
+    fill: 'none',
+    stroke: 'currentColor',
+    strokeWidth: '2',
+    strokeLinecap: 'round',
+    strokeLinejoin: 'round',
+    className: 'uikit_PlainSelect_icon uikit_PlainSelect_checkedIcon',
+    children: [_jsx("path", {
+      d: 'M21 10.656V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h12.344'
+    }), _jsx("path", {
+      d: 'm9 11 3 3L22 4'
+    })]
+  });
+}

package/dist/plain-select/index.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useId, useCallback, useState, useMemo, useLayoutEffect, createRef } from 'react';
 import './styles.css';
-import Icon from './icon.js';
+import { UncheckedIcon, CheckedIcon } from './icons.js';
 /**
  * Select element implementing Listbox pattern. Presents a list of options and allows
  * a user to select one or more of them.
@@ -177,9 +177,7 @@ export function PlainSelect(props) {
           tabIndex: multiple && currFocusedIdx === idx ? 0 : -1,
           onClick: () => handleItemClick(item.id),
           onKeyDown: multiple ? handleMultiSelectKeyDown : undefined,
-          children: [_jsx(Icon, {
-            selected: isSelected
-          }), _jsxs("div", {
+          children: [isSelected ? _jsx(CheckedIcon, {}) : _jsx(UncheckedIcon, {}), _jsxs("div", {
             className: 'uikit_PlainSelect_itemContent',
             children: [_jsx("div", {
               children: item.title

package/dist/plain-select/styles.css

@@ -1,11 +1,11 @@
 .uikit_PlainSelect_label {
   margin: 0;
-  color: #757575;
+  color: #737373;
 }
 
 @media (prefers-color-scheme: dark) {
   .uikit_PlainSelect_label {
-    color: #979797;
+    color: #acacac;
   }
 }
 
@@ -37,8 +37,12 @@
   flex-shrink: 0;
 }
 
-.uikit_PlainSelect_icon--hidden {
-  visibility: hidden;
+.uikit_PlainSelect_uncheckedIcon {
+  color: #767676;
+}
+
+.uikit_PlainSelect_checkedIcon {
+  color: #337e33;
 }
 
 .uikit_PlainSelect_itemContent {
@@ -51,6 +55,6 @@
 
 .uikit_PlainSelect_description {
   margin-top: 0.5em;
-  color: #757575;
+  color: #737373;
   font-size: 87.5%;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@peassoft/mnr-web-ui-kit",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "Peassoft web UI kit for MNR web applications",
   "type": "module",
   "exports": {

package/dist/plain-select/icon.d.ts

@@ -1,6 +0,0 @@
-import type { JSX } from 'react';
-type Props = {
-    selected: boolean;
-};
-export default function Icon(props: Props): JSX.Element;
-export {};

package/dist/plain-select/icon.js

@@ -1,17 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function Icon(props) {
-  const {
-    selected
-  } = props;
-  const className = 'uikit_PlainSelect_icon' + (selected ? '' : ' uikit_PlainSelect_icon--hidden');
-  return _jsx("svg", {
-    className: className,
-    width: '24',
-    height: '24',
-    viewBox: '0 0 24 24',
-    children: _jsx("path", {
-      d: 'M9 16.172l10.594-10.594 1.406 1.406-12 12-5.578-5.578 1.406-1.406z',
-      fill: '#24b23e'
-    })
-  });
-}