nurseitaly-components 0.0.14 → 0.0.16

package/dist/basic/CheckboxGroupField/CheckboxGroupField.d.ts

@@ -0,0 +1,14 @@
+import { FieldValues, UseFormReturn } from 'react-hook-form';
+import type { SelectItem } from '../SelectField/SelectField';
+import '../CheckboxField/style.scss';
+import './style.scss';
+type CheckboxGroupFieldProps<TFieldValues extends FieldValues = FieldValues, TContext = any, TTransformedValues = TFieldValues> = {
+    attr: string;
+    createdForm: UseFormReturn<TFieldValues, TContext, TTransformedValues>;
+    options: SelectItem[];
+    disabled?: boolean;
+    className?: string;
+    onChange?: (attr: string, value: Array<string | number>) => void;
+};
+export default function CheckboxGroupField<TFieldValues extends FieldValues = FieldValues, TContext = any, TTransformedValues = TFieldValues>({ attr, createdForm, options, disabled, className, onChange, }: CheckboxGroupFieldProps<TFieldValues, TContext, TTransformedValues>): import("react").JSX.Element;
+export {};

package/dist/basic/CheckboxGroupField/CheckboxGroupField.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Checkbox, FormControlLabel } from '@mui/material';
+import cx from 'classnames';
+import { Controller, } from 'react-hook-form';
+import '../CheckboxField/style.scss';
+import './style.scss';
+function toValueList(value) {
+    if (!Array.isArray(value)) {
+        return [];
+    }
+    return value;
+}
+export default function CheckboxGroupField({ attr, createdForm, options = [], disabled = false, className, onChange, }) {
+    const fieldName = attr;
+    const { control } = createdForm;
+    return (_jsx(Controller, { name: fieldName, control: control, render: ({ field }) => {
+            const selected = toValueList(field.value);
+            const toggle = (optionValue, checked) => {
+                const next = checked
+                    ? selected.includes(optionValue)
+                        ? selected
+                        : [...selected, optionValue]
+                    : selected.filter((v) => v !== optionValue);
+                field.onChange(next);
+                onChange?.(attr, next);
+            };
+            return (_jsx("div", { className: cx('ds-checkbox-group', className), children: options.map((option) => (_jsx(FormControlLabel, { className: "ds-checkbox", disabled: disabled, control: _jsx(Checkbox, { checked: selected.includes(option.value), onChange: (e) => toggle(option.value, e.target.checked), onBlur: field.onBlur, inputRef: field.ref }), label: option.label }, String(option.value)))) }));
+        } }));
+}

package/dist/basic/CheckboxGroupField/index.d.ts

@@ -0,0 +1,2 @@
+import CheckboxGroupField from './CheckboxGroupField';
+export default CheckboxGroupField;

package/dist/basic/CheckboxGroupField/index.js

@@ -0,0 +1,2 @@
+import CheckboxGroupField from './CheckboxGroupField';
+export default CheckboxGroupField;

package/dist/basic/CheckboxGroupField/style.scss

@@ -0,0 +1,5 @@
+.ds-checkbox-group {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}

package/dist/basic/Tooltip/styles.scss

@@ -6,7 +6,10 @@
   max-width: 280px;
   padding: var(--spacing-100) var(--spacing-150);
   border-radius: var(--radius-100);
-  @include body-medium-1;
+  font-size: 16px !important;
+  font-weight: 400 !important;
+  line-height: 150% !important;
+  letter-spacing: 0px !important;
   margin-top: 8px !important;
 }
 

package/dist/basic/index.d.ts

@@ -3,6 +3,7 @@ export { default as Badge } from './Badge';
 export { default as Button } from './Button';
 export type { ButtonDSColors, ButtonDSModes, ButtonDSPositions, ButtonDSSizes, } from './Button/Button';
 export { default as CheckboxField } from './CheckboxField';
+export { default as CheckboxGroupField } from './CheckboxGroupField';
 export { default as DatePickerField } from './DatePickerField';
 export { default as DropdownButton } from './DropdownButton';
 export { default as DropdownList } from './DropdownList';

package/dist/basic/index.js

@@ -4,6 +4,7 @@ export { default as Avatar } from './Avatar';
 export { default as Badge } from './Badge';
 export { default as Button } from './Button';
 export { default as CheckboxField } from './CheckboxField';
+export { default as CheckboxGroupField } from './CheckboxGroupField';
 export { default as DatePickerField } from './DatePickerField';
 export { default as DropdownButton } from './DropdownButton';
 export { default as DropdownList } from './DropdownList';

package/dist/common/AppForm/AppForm.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { AsyncSelectField, CheckboxField, DatePickerField, SelectField, SelectMultipleField, SwitchField, TextField, } from "../../basic";
+import { AsyncSelectField, CheckboxField, CheckboxGroupField, DatePickerField, SelectField, SelectMultipleField, SwitchField, TextField, } from "../../basic";
 import FormColorField from "./FormColorField";
 import { getFieldFlexStyle, groupFieldsIntoRows } from "./groupFieldsIntoRows";
 import "./style.scss";
@@ -47,6 +47,10 @@ export default function AppForm({ fields, form, prefix, onChangeFunctions = {},
             return (_jsx(SelectField, { ...selectProps, allowEmpty: field.allowEmpty }, name));
         }
         if (field.type === "check") {
+            if (field.multiple) {
+                const checkOptions = getOptions(field.attr) || field.options || [];
+                return (_jsx(CheckboxGroupField, { attr: name, createdForm: form, options: checkOptions, disabled: field.disabled, onChange: (_attr, value) => handleChange?.(value) }, name));
+            }
             return (_jsx(CheckboxField, { attr: name, label: field.name, createdForm: form, disabled: field.disabled }, name));
         }
         if (field.type === "switch") {

package/dist/styles/base/_typographs.scss

@@ -186,12 +186,11 @@
   letter-spacing: 0px;
 }
 
-// sets as important to override MuiTooltip-tooltip
 @mixin body-medium-1 {
-  font-size: 16px !important;
-  font-weight: 400 !important;
-  line-height: 150% !important;
-  letter-spacing: 0px !important;
+  font-size: 16px;
+  font-weight: 400;
+  line-height: 150%;
+  letter-spacing: 0px;
 }
 
 @mixin body-medium-2 {

package/dist/styles/main.scss

@@ -79,11 +79,9 @@ body {
   display: flex !important;
 }
 
-.tablet-only {
-  display: none !important;
-}
-
-.mobile-only {
+.tablet-only,
+.mobile-only,
+.desktop-never {
   display: none !important;
 }
 
@@ -94,7 +92,8 @@ body {
     display: none !important;
   }
 
-  .tablet-only {
+  .tablet-only,
+  .desktop-never {
     display: flex !important;
   }
 }
@@ -106,7 +105,8 @@ body {
     display: none !important;
   }
 
-  .mobile-only {
+  .mobile-only,
+  .desktop-never {
     display: flex !important;
   }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "nurseitaly-components",
   "private": false,
-  "version": "0.0.14",
+  "version": "0.0.16",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {

package/dist/basic/Dummy/Dummy.d.ts

@@ -1,9 +0,0 @@
-import './styles.scss';
-export declare const DummyModes: readonly ["white", "blue"];
-type DummyModes = (typeof DummyModes)[number];
-export type Props = {
-    className?: string;
-    mode?: DummyModes;
-};
-export default function Dummy({ className, mode }: Props): import("react").JSX.Element;
-export {};

package/dist/basic/Dummy/Dummy.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import cx from 'classnames';
-import './styles.scss';
-export const DummyModes = ['white', 'blue'];
-export default function Dummy({ className, mode = 'blue' }) {
-    const getClassNames = cx('ds-dummy', className, mode);
-    return _jsx("div", { className: getClassNames, children: "aaaa" });
-}

package/dist/basic/Dummy/index.d.ts

@@ -1,2 +0,0 @@
-import Dummy from './Dummy';
-export default Dummy;

package/dist/basic/Dummy/index.js

@@ -1,2 +0,0 @@
-import Dummy from './Dummy';
-export default Dummy;

package/dist/basic/Dummy/styles.scss

@@ -1,4 +0,0 @@
-.ds-dummy {
-  display: flex;
-  align-items: center;
-}