@douglasneuroinformatics/libui 2.8.0 → 2.8.2

package/dist/components/Form/StringField/StringFieldPassword.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StringFieldPassword.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/StringField/StringFieldPassword.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AASjF,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,MAAM,qBAAqB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEtD,MAAM,MAAM,wBAAwB,GAAG,uBAAuB,CAAC,MAAM,CAAC,GACpE,OAAO,CAAC,eAAe,EAAE;IAAE,OAAO,EAAE,UAAU,CAAA;CAAE,CAAC,CAAC;AAEpD,eAAO,MAAM,mBAAmB,sFAS7B,wBAAwB,sBAsD1B,CAAC"}
+{"version":3,"file":"StringFieldPassword.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/StringField/StringFieldPassword.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AASjF,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,MAAM,qBAAqB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEtD,MAAM,MAAM,wBAAwB,GAAG,uBAAuB,CAAC,MAAM,CAAC,GACpE,OAAO,CAAC,eAAe,EAAE;IAAE,OAAO,EAAE,UAAU,CAAA;CAAE,CAAC,CAAC;AAEpD,eAAO,MAAM,mBAAmB,sFAS7B,wBAAwB,sBAuD1B,CAAC"}

package/dist/components/Form/StringField/StringFieldPassword.js

@@ -22,7 +22,7 @@ export const StringFieldPassword = ({ calculateStrength, description, error, lab
             React.createElement("button", { className: "absolute right-0 flex h-full w-8 items-center justify-center text-muted-foreground", disabled: readOnly, tabIndex: -1, type: "button", onClick: () => setShow(!show) },
                 React.createElement(EyeIcon, { className: cn('absolute transition-all', show ? '-rotate-90 scale-0' : 'rotate-0 scale-100') }),
                 React.createElement(EyeOffIcon, { className: cn('absolute transition-all', !show ? 'rotate-90 scale-0' : 'rotate-0 scale-100') }))),
-        strength !== null && (React.createElement(motion.div, { animate: { width: `${strength * 25}%` }, className: "h-1 w-full overflow-hidden rounded", transition: { duration: 0.5 } },
+        strength !== null && (React.createElement(motion.div, { animate: { width: `${Math.max(strength, value?.length ? 1 : 0) * 25}%` }, className: "h-1 w-full overflow-hidden rounded", initial: { width: '0%' }, transition: { duration: 0.5 } },
             React.createElement("div", { className: cn('h-full w-full bg-destructive transition-colors duration-500', strength === 2 && 'bg-yellow-500 dark:bg-yellow-700', strength === 3 && 'bg-sky-500 dark:bg-sky-700', strength === 4 && 'bg-green-500 dark:bg-green-700') }))),
         React.createElement(FieldGroup.Error, { error: error })));
 };

package/dist/styles/globals.css

@@ -70,6 +70,7 @@
 @layer base {
   * {
     @apply border-border;
+    scrollbar-width: thin;
   }
   body {
     @apply bg-background text-foreground;

package/dist/testing/mocks.js

@@ -31,7 +31,7 @@ export const mockStorage = (name) => {
             this.store = {};
         }
         getItem(key) {
-            return this.store[key] || null;
+            return this.store[key] ?? null;
         }
         removeItem(key) {
             delete this.store[key];

package/package.json

@@ -1,18 +1,15 @@
 {
   "name": "@douglasneuroinformatics/libui",
   "type": "module",
-  "version": "2.8.0",
+  "version": "2.8.2",
   "packageManager": "pnpm@9.3.0",
-  "description": "Generic UI components for DNP projects, built using React and TailwindCSS",
-  "author": {
-    "name": "Douglas Neuroinformatics",
-    "email": "support@douglasneuroinformatics.ca"
-  },
+  "description": "Generic UI components for DNP projects, built using React and Tailwind CSS",
+  "author": "Joshua Unrau",
   "license": "Apache-2.0",
   "homepage": "https://github.com/DouglasNeuroInformatics/libui#readme",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/DouglasNeuroInformatics/libui"
+    "url": "https://github.com/DouglasNeuroInformatics/libui"
   },
   "bugs": {
     "url": "https://github.com/DouglasNeuroInformatics/libui/issues"
@@ -116,11 +113,10 @@
   "devDependencies": {
     "@commitlint/cli": "^19.3.0",
     "@commitlint/config-conventional": "^19.2.2",
-    "@commitlint/types": "^19.0.3",
     "@douglasneuroinformatics/eslint-config": "^4.2.2",
-    "@semantic-release/changelog": "^6.0.3",
-    "@semantic-release/git": "^10.0.1",
-    "@semantic-release/npm": "^12.0.1",
+    "@douglasneuroinformatics/prettier-config": "^0.0.1",
+    "@douglasneuroinformatics/semantic-release": "^0.0.1",
+    "@douglasneuroinformatics/tsconfig": "^1.0.1",
     "@storybook/addon-essentials": "^8.1.6",
     "@storybook/addon-interactions": "^8.1.6",
     "@storybook/addon-links": "^8.1.6",
@@ -147,9 +143,8 @@
     "husky": "^9.0.11",
     "jsdom": "24.1.0",
     "postcss": "^8.4.38",
-    "prettier": "^3.3.1",
+    "prettier": "^3.3.2",
     "prettier-plugin-tailwindcss": "^0.6.2",
-    "semantic-release": "^23.0.8",
     "sort-json": "^2.0.1",
     "storybook": "^8.1.6",
     "storybook-react-i18next": "^3.1.1",
@@ -157,5 +152,15 @@
     "typescript": "~5.4.5",
     "vite": "5.2.13",
     "vitest": "^1.6.0"
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  },
+  "release": {
+    "extends": [
+      "@douglasneuroinformatics/semantic-release"
+    ]
   }
 }

package/src/components/DatePicker/DatePicker.tsx

@@ -72,7 +72,7 @@ export const DatePicker = React.forwardRef<React.ElementRef<typeof Card>, DatePi
   // the duration is doubled because presumably it is to mount old and mount new
   const [canSetMonth, setCanSetMonth] = useState(true);
 
-  const monthName = t(`months.${MONTHS[date.getMonth()]}`);
+  const monthName = t(`months.${MONTHS[date.getMonth()]!}`);
 
   const handleYearSelection = (date: Date) => {
     dispatch({ type: 'set-year', value: date.getFullYear() });

package/src/components/Form/FieldsComponent.tsx

@@ -19,7 +19,7 @@ export type FieldsComponentProps<T extends FormDataType> = {
 /** Renders an object containing key value pairs, where the value is a FormField of some kind */
 export const FieldsComponent = <T extends FormDataType>({ fields, ...props }: FieldsComponentProps<T>) => {
   return Object.keys(fields).map((name) => {
-    const field = fields[name];
+    const field = fields[name]!;
     if (field.kind === 'dynamic') {
       return <DynamicField {...props} field={field} key={name} name={name} />;
     }

package/src/components/Form/NumberRecordField.tsx

@@ -41,7 +41,7 @@ export const NumberRecordField = <T extends NumberRecordFieldValue = NumberRecor
       </Heading>
       <div className="space-y-6">
         {Object.keys(items).map((name) => {
-          const item = items[name];
+          const item = items[name]!;
           return (
             <NumberField
               error={recordError?.[name]}

package/src/components/Form/RecordArrayField.tsx

@@ -73,12 +73,12 @@ export const RecordArrayField = memo(function RecordArrayField({
                     if (!newArrayError[i]) {
                       newArrayError[i] = {};
                     }
-                    newArrayError[i][name] = error;
+                    newArrayError[i]![name] = error;
                     setArrayError(newArrayError);
                   }}
                   setValue={(value) => {
                     const newArrayValue = [...arrayValue];
-                    newArrayValue[i][name] = value;
+                    newArrayValue[i]![name] = value;
                     setArrayValue(newArrayValue);
                   }}
                   value={arrayValue?.[i]?.[name]}

package/src/components/Form/StringField/StringFieldPassword.tsx

@@ -62,8 +62,9 @@ export const StringFieldPassword = ({
       </FieldGroup.Row>
       {strength !== null && (
         <motion.div
-          animate={{ width: `${strength * 25}%` }}
+          animate={{ width: `${Math.max(strength, value?.length ? 1 : 0) * 25}%` }}
           className="h-1 w-full overflow-hidden rounded"
+          initial={{ width: '0%' }}
           transition={{ duration: 0.5 }}
         >
           <div

package/src/components/Form/utils.ts

@@ -28,7 +28,7 @@ export function getFormFields<T extends FormDataType>(content: FormContent<T>):
   if (!Array.isArray(content)) {
     return content;
   }
-  return content.reduce((prev, current) => ({ ...prev, ...current.fields }), content[0].fields) as FormFields<T>;
+  return content.reduce((prev, current) => ({ ...prev, ...current.fields }), content[0]!.fields) as FormFields<T>;
 }
 
 /**

package/src/hooks/useNotificationsStore.test.ts

@@ -23,7 +23,7 @@ describe('useNotificationsStore', () => {
     expect(result.current.notifications.length).toBe(1);
     expect(result.current.notifications[0]).toMatchObject({ message: 'test' });
     act(() => {
-      result.current.dismissNotification(result.current.notifications[0].id);
+      result.current.dismissNotification(result.current.notifications[0]!.id);
     });
     expect(result.current.notifications.length).toBe(0);
   });

package/src/i18n.ts

@@ -69,8 +69,8 @@ i18n.addPreInitTranslations = function (this, translations) {
     return;
   }
   const resources = createResources(translations);
-  Object.assign(this.options.resources.en, resources.en);
-  Object.assign(this.options.resources.fr, resources.fr);
+  Object.assign(this.options.resources.en!, resources.en);
+  Object.assign(this.options.resources.fr!, resources.fr);
 };
 
 i18n.use(initReactI18next).use(LanguageDetector);

package/src/styles/globals.css

@@ -70,6 +70,7 @@
 @layer base {
   * {
     @apply border-border;
+    scrollbar-width: thin;
   }
   body {
     @apply bg-background text-foreground;

package/src/testing/mocks.ts

@@ -35,7 +35,7 @@ export const mockStorage = (name: 'localStorage' | 'sessionStorage'): void => {
     }
 
     getItem(key: string) {
-      return this.store[key] || null;
+      return this.store[key] ?? null;
     }
 
     removeItem(key: string) {