loon-bulma-react 2023.0.23 → 2023.0.25

package/dist/loon-react-bulma-types.d.ts

@@ -51,8 +51,9 @@ export declare type CheckradioStylingType = 'rounded' | 'noborder' | 'colored' |
 export declare type IndicatorPositionProp = 'tl' | 'tr' | 'tc' | 'bl' | 'br' | 'bc' | 'lc' | 'rc' | 'top-left' | 'top-right' | 'top-center' | 'bottom-left' | 'bottom-right' | 'bottom-center' | 'left-center' | 'right-center';
 /** Autocomplete-types voor bijvoorbeeld password-managers.
  * Programma's zoals bijvoorbeeld 1Password gebruiken deze om te bepalen waar dit veld mee gevuld moet worden.
+ * **LET OP:** `off` wordt door sommige browsers genegeerd (eikels). Gebruik `nope` als je *ECHT* geen autocomplete wil.
  * */
-export declare type AutoCompleteType = 'on' | 'off' | 'current-password' | 'new-password' | 'username' | 'given-name' | 'additional-name' | 'family-name' | 'nickname' | 'email' | 'name' | 'one-time-code' | 'organization' | 'street-address' | 'tel' | 'bday' | 'language' | 'country' | 'postal-code';
+export declare type AutoCompleteType = 'on' | 'off' | 'nope' | 'current-password' | 'new-password' | 'username' | 'given-name' | 'additional-name' | 'family-name' | 'nickname' | 'email' | 'name' | 'one-time-code' | 'organization' | 'street-address' | 'tel' | 'bday' | 'language' | 'country' | 'postal-code';
 /** Vaste (per jaar verschillende) kleuren die gebruikt worden binnen `loon-bulma-react` voor als we GEEN css kunnen gebruiken. */
 export declare const enum DefinedHexColors {
     Primary = "#0089b6",

package/dist/utils/JSDateTime.class.d.ts

@@ -307,13 +307,19 @@ declare class JSDateTime {
     /**
      * Check if this JSDateTime object is between two other JSDates or Dates
      * @param dates a tuple with two JSDateTime|Date instances
+     * @param included if the start and end date should be included (default: false)
      * @return is this JSDateTime between the two dates (true|false)
      * @example
-     * const date = JSDateTime.fromDate(new Date(2020, 0, 1));       // 01-01-2020
-     * date.isBetween([new Date(2030, 0, 1), new Date(2010, 0, 1)]); // true
-     * date.isBefore([new Date(2010, 0, 1), new Date(2015, 0, 1)]);  // false
+     * const date = JSDateTime.fromDate(new Date(2020, 0, 1));        // 01-01-2020
+     * date.isBetween([new Date(2030, 0, 1), new Date(2010, 0, 1)]);  // true
+     * date.isBetween([new Date(2010, 0, 1), new Date(2015, 0, 1)]);  // false
+     * @example examples for the include-parameter
+     * const date = JSDateTime.fromDate(new Date(2020, 0, 1));                       // 01-01-2020
+     * date.isBetween([new Date(2020, 0, 1), new Date(2010, 0, 1)]);                 // false
+     * date.isBetween([new Date(2020, 0, 1), new Date(2010, 0, 1), true]);           // true
+     * date.isBetween([new Date(2020, 0, 1), new Date(2010, 0, 1), [true, false]]);  // true
      */
-    isBetween([date1, date2]: [JSDateTime | Date, JSDateTime | Date]): boolean;
+    isBetween(dates: [JSDateTime | Date, JSDateTime | Date], included?: boolean | [boolean, boolean]): boolean;
     /**
      * Is this JSDateTime before another Date or JSDateTime.
      * JSDateTime implements the .valueOf() method of objects, so it is possible to compare JSDateTime objects and Date objects through <, >, ==, <= and >=.

package/dist/utils/JSDuration.class.d.ts

@@ -14,13 +14,11 @@ declare class JSDuration {
      * @example
      * // verschil tussen nu en 1 dag, 30min later
      * let dur = new JSDuration(JSDateTime.now(), JSDateTime.now().plus({ days: 1, minutes: 30 }));
-     * console.log(dur.inDays); // 1
-     * console.log(dur.differenceIn(['hours', 'minutes']))
-     * // { hours: 24, minutes: 30 }
+     * console.log(dur.inDays);                             // 1
+     * console.log(dur.differenceIn(['hours', 'minutes'])); // { hours: 24, minutes: 30 }
      *
      * let dur = new JSDuration(JSDateTime.now(), JSDateTime.now().plus({ days: 1, minutes: 30, seconds: 30 }));
-     * console.log(dur.differenceIn(['hours', 'minutes']))
-     * // { hours: 24, minutes: 30, rest: 30_000 }
+     * console.log(dur.differenceIn(['hours', 'minutes']))  // { hours: 24, minutes: 30, rest: 30_000 }
      */
     constructor(jsd1: Date | JSDateTime, jsd2?: Date | JSDateTime);
     /** @returns Aantal absolute milliseconden tussen de twee JSDateTimes van deze duration (altijd positief) */

package/dist/utils/deserialize.function.d.ts

@@ -0,0 +1,2 @@
+/** Default deserializer met `JSON.parse` van een `string` naar de waarde `T` */
+export declare function deserializeJSON<T>(value: string): T;

package/dist/utils/index.d.ts

@@ -2,3 +2,4 @@ export * from './JSDateTime.class';
 export * from './JSDuration.class';
 export * from './hasBSN.function';
 export * from './calculateTxtColor.function';
+export * from './isIBAN.function';

package/dist/utils/isIBAN.function.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Controleer of een opgegeven rekeningnummer wel een IBAN, nummer is.
+ * @param rekNr het rekeningsnummer dat gecontroleerd moet worden
+ * @returns een tuple met een boolean en een string
+ * - `[true, 'LAND']` als het een geldige IBAN is
+ * - `[false, 'invalid format']` als het niet voldoet aan het IBAN-formaat
+ * - `[false, 'invalid landcode']` als de landcode niet bestaat (in onze gegevens)
+ * - `[false, 'invalid length']` als het niet voldoet aan de lengte-eis die hoort bij de landcode
+ * - `[false, 'invalid restgetal']` als het niet voldoet aan de mod-97 berekening voor IBAN
+ * @example
+ * const [bool, msg] = isIBAN('NL28 ASNB 0709 1665 92');  // [true, 'Nederland']
+ * const [bool, msg] = isIBAN('NL28 ASNB 0709 1665 922'); // [false, 'invalid length']
+ * const [bool, msg] = isIBAN('NL28 ASNB 0709 1665 93');  // [false, 'invalid restgetal']
+ * const [bool, msg] = isIBAN('ABCDEFG');                 // [false, 'invalid format']
+ * const [bool, msg] = isIBAN('QQ28 ASNB 0709 1665 93');  // [false, 'invalid landcode']
+ */
+export declare function isIBAN(rekNr: string): [boolean, string];
+/** Een array van landen met de landcode en de lengte van een IBAN. Ook een voorbeeld-IBAN */
+declare const IBAN_GEGEVENS_MET_TEST_PER_LAND: Readonly<Array<{
+    /** landnaam waar deze settings van toepassing zijn */ land: string;
+    /** code voor het land zoals dat in een IBAN voorkomt */ code: string;
+    /** de totale lengte van het IBAN-rekeningnummer */ length: number;
+    /** een voorbeeld-IBAN-nummer */ IBAN: string;
+}>>;
+export { IBAN_GEGEVENS_MET_TEST_PER_LAND as IbanDetailsPerLand };

package/dist/utils/serialize.function.d.ts

@@ -0,0 +1,2 @@
+/** Default serializer met `JSON.stringify` van de waar `T` naar een `string` */
+export declare function serializeJSON<T>(value: T): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "loon-bulma-react",
-  "version": "2023.0.23",
+  "version": "2023.0.25",
   "description": "Bulma & ReactJS componenten voor Loon Salarissoftware",
   "author": "timroos1990",
   "license": "MIT",
@@ -36,53 +36,78 @@
     "@babel/preset-env": "^7.20.2",
     "@babel/preset-react": "^7.18.6",
     "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^13.4.0",
+    "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
     "@types/jest": "^29.4.0",
-    "@types/node": "^18.11.18",
-    "@types/react": "^18.0.27",
-    "@types/react-dom": "^18.0.10",
+    "@types/node": "^18.14.6",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
     "@types/warning": "^3.0.0",
-    "@typescript-eslint/eslint-plugin": "^5.49.0",
-    "@typescript-eslint/parser": "^5.49.0",
+    "@typescript-eslint/eslint-plugin": "^5.54.1",
+    "@typescript-eslint/parser": "^5.54.1",
     "@yaireo/ui-range": "^2.1.15",
     "cross-env": "^7.0.3",
-    "eslint": "^8.32.0",
-    "eslint-config-prettier": "^8.6.0",
+    "eslint": "^8.35.0",
+    "eslint-config-prettier": "^8.7.0",
     "eslint-config-standard": "^17.0.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-react": "^7.32.1",
+    "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-standard": "^5.0.0",
-    "eslint-plugin-testing-library": "^5.10.0",
+    "eslint-plugin-testing-library": "^5.10.2",
     "gh-pages": "^5.0.0",
     "jest-preview": "^0.3.1",
     "microbundle-crl": "^0.13.11",
     "npm-run-all": "^4.1.5",
     "postcss-normalize": "^10.0.1",
-    "postcss-preset-env": "^8.0.0",
-    "prettier": "^2.8.3",
+    "postcss-preset-env": "^8.0.1",
+    "prettier": "^2.8.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-scripts": "^5.0.1",
-    "sass": "^1.57.1",
-    "typescript": "^4.9.4",
+    "sass": "^1.58.3",
+    "typescript": "^4.9.5",
     "warning": "^4.0.3",
-    "webpack-bundle-analyzer": "^4.7.0"
+    "webpack-bundle-analyzer": "^4.8.0"
   },
   "files": [
     "dist",
     "styles"
   ],
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^6.2.1",
-    "@fortawesome/free-solid-svg-icons": "^6.2.1",
+    "@fortawesome/fontawesome-svg-core": "^6.3.0",
+    "@fortawesome/free-solid-svg-icons": "^6.3.0",
     "@fortawesome/react-fontawesome": "^0.2.0",
     "bulma": "^0.9.4",
     "react": "^18.2.0",
-    "react-currency-input-field": "^3.6.9"
+    "react-currency-input-field": "^3.6.10",
+    "@tiptap/extension-bold": "^2.0.0-beta.220",
+    "@tiptap/extension-bullet-list": "^2.0.0-beta.220",
+    "@tiptap/extension-color": "^2.0.0-beta.220",
+    "@tiptap/extension-hard-break": "^2.0.0-beta.220",
+    "@tiptap/extension-heading": "^2.0.0-beta.220",
+    "@tiptap/extension-highlight": "^2.0.0-beta.220",
+    "@tiptap/extension-history": "^2.0.0-beta.220",
+    "@tiptap/extension-horizontal-rule": "^2.0.0-beta.220",
+    "@tiptap/extension-image": "^2.0.0-beta.220",
+    "@tiptap/extension-italic": "^2.0.0-beta.220",
+    "@tiptap/extension-link": "^2.0.0-beta.220",
+    "@tiptap/extension-list-item": "^2.0.0-beta.220",
+    "@tiptap/extension-ordered-list": "^2.0.0-beta.220",
+    "@tiptap/extension-strike": "^2.0.0-beta.220",
+    "@tiptap/extension-subscript": "^2.0.0-beta.220",
+    "@tiptap/extension-superscript": "^2.0.0-beta.220",
+    "@tiptap/extension-table": "^2.0.0-beta.220",
+    "@tiptap/extension-table-cell": "^2.0.0-beta.220",
+    "@tiptap/extension-table-header": "^2.0.0-beta.220",
+    "@tiptap/extension-table-row": "^2.0.0-beta.220",
+    "@tiptap/extension-text-align": "^2.0.0-beta.220",
+    "@tiptap/extension-text-style": "^2.0.0-beta.220",
+    "@tiptap/extension-underline": "^2.0.0-beta.220",
+    "@tiptap/react": "^2.0.0-beta.220",
+    "@tiptap/starter-kit": "^2.0.0-beta.220"
   },
   "browserslist": {
     "production": [

package/styles/_all.scss

@@ -12,3 +12,4 @@
 @import './timeline.scss';
 @import './checkradio.scss';
 @import './tooltip.scss';
+@import './tiptap-editor.scss';

package/styles/tiptap-editor.scss

@@ -0,0 +1,11 @@
+// https://tiptap.dev/guide/styling#option-1-style-the-plain-html
+.ProseMirror {
+  background-color: $white;
+  padding: 1px;
+  resize: vertical;
+  overflow: auto;
+  border: thin solid $input-border-color;
+  height: 10em;
+  border-radius: $input-radius;
+  min-height: 5em;
+}