@thisisagile/easy-react 18.2.0 → 18.4.0

package/dist/index.js

@@ -32,6 +32,7 @@ var src_exports = {};
 __export(src_exports, {
   If: () => If,
   toChildren: () => toChildren,
+  toClasses: () => toClasses,
   useA: () => useA,
   useAn: () => useAn,
   useEntity: () => useEntity,
@@ -58,15 +59,19 @@ var import_easy = require("@thisisagile/easy");
 var import_react = __toESM(require("react"));
 var toChildren = (children) => (0, import_easy.toList)(import_react.default.Children.toArray(children).filter(import_easy.isDefined));
 
-// src/utils/Hooks.ts
+// src/utils/toClasses.ts
 var import_easy2 = require("@thisisagile/easy");
+var toClasses = (styles, classes, props) => [...(0, import_easy2.toArray)(classes).map((c) => styles[c]), ...(0, import_easy2.entries)(props).map(([key, val]) => (0, import_easy2.ifTrue)(val, styles[key]))].filter(Boolean).join(" ");
+
+// src/utils/Hooks.ts
+var import_easy3 = require("@thisisagile/easy");
 var import_react2 = require("react");
 function useSwitch(...states) {
   const [state, setState] = (0, import_react2.useState)(states[0]);
   const next = () => setState((s) => states[(states.indexOf(s) + 1) % states.length]);
   const isState = (t) => state === t;
   function ifState(t, yes, no) {
-    return (0, import_easy2.ofGet)(state === t ? yes : no, t);
+    return (0, import_easy3.ofGet)(state === t ? yes : no, t);
   }
   return { state, next, states, isState, ifState };
 }
@@ -91,7 +96,7 @@ var useOptional = (item) => {
 };
 var useEntity = useA;
 var useList = (...items) => {
-  const [state, setState] = (0, import_react2.useState)((0, import_easy2.toList)(...items));
+  const [state, setState] = (0, import_react2.useState)((0, import_easy3.toList)(...items));
   return [
     state,
     (e) => {
@@ -101,7 +106,7 @@ var useList = (...items) => {
   ];
 };
 var usePageList = (...items) => {
-  const [pages, setPages] = (0, import_react2.useState)((0, import_easy2.toPageList)(items));
+  const [pages, setPages] = (0, import_react2.useState)((0, import_easy3.toPageList)(items));
   return [
     pages,
     (e) => {
@@ -116,7 +121,7 @@ var usePaging = (f, options) => {
   const [take] = (0, import_react2.useState)(options?.take ?? 5);
   const next = (options2 = { skip, take }) => f(options2).then((items) => {
     setSkip(skip + take);
-    return setList((0, import_easy2.toPageList)(list.add(items), items));
+    return setList((0, import_easy3.toPageList)(list.add(items), items));
   });
   return [list, next, list.length < (list?.total ?? 0), skip, take];
 };
@@ -130,7 +135,7 @@ var useGet = (f, initial) => {
 };
 var useGetList = (f) => {
   const [list, setList] = usePageList();
-  const getter = () => f().then((l) => setList((0, import_easy2.isPageList)(l) ? l : (0, import_easy2.toPageList)(l, { total: l.length })));
+  const getter = () => f().then((l) => setList((0, import_easy3.isPageList)(l) ? l : (0, import_easy3.toPageList)(l, { total: l.length })));
   return [list, getter];
 };
 
@@ -171,6 +176,7 @@ function useToggle(initial = false) {
 0 && (module.exports = {
   If,
   toChildren,
+  toClasses,
   useA,
   useAn,
   useEntity,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/layout/If.tsx","../src/utils/Children.ts","../src/utils/Hooks.ts","../src/utils/useOnce.ts","../src/utils/useState.ts","../src/utils/useRev.ts","../src/utils/useToggle.ts"],"sourcesContent":["export * from './layout';\nexport * from './utils';\n","import * as React from 'react';\nimport { FunctionComponent, ReactElement, ReactNode } from 'react';\n\nexport interface IfProps {\n  condition: any | undefined;\n  children?: ReactNode;\n}\n\nexport const If: FunctionComponent<IfProps> = ({ condition, children }): ReactElement | null => (condition ? <>{children}</> : null);\n","import { isDefined, List, toList } from '@thisisagile/easy';\nimport React, { ReactNode } from 'react';\n\nexport const toChildren = (children: ReactNode): List<ReactNode> => toList(React.Children.toArray(children).filter(isDefined));\n","import { Get, isPageList, List, ofGet, Optional, PageList, PageOptions, Predicate, toList, toPageList, Validatable } from '@thisisagile/easy';\nimport { useState } from 'react';\n\n// export const useToggle = (initialState = false): [boolean, () => void] => {\n//   const [state, setState] = useState<boolean>(initialState);\n//   return [state, () => setState(s => !s)];\n// };\n\nexport function useSwitch<T>(...states: T[]): {\n  state: T;\n  next: () => void;\n  states: T[];\n  isState: Predicate<T>;\n  ifState: <U>(t: T, yes: Get<U, T>, no: Get<U, T>) => U;\n} {\n  const [state, setState] = useState(states[0]);\n  const next = () => setState(s => states[(states.indexOf(s) + 1) % states.length]);\n  const isState = (t: T) => state === t;\n\n  function ifState<U>(t: T, yes: Get<U, T>, no: Get<U, T>): U {\n    return ofGet(state === t ? yes : no, t);\n  }\n\n  return { state, next, states, isState, ifState };\n}\n\nexport const useA = <E extends Validatable>(item: Partial<E> = {} as Partial<E>): [E, (e: E) => E] => {\n  const [state, setState] = useState<E>({ isValid: false, ...item } as E);\n  return [\n    state,\n    (e: E): E => {\n      setState(e);\n      return e;\n    },\n  ];\n};\n\nexport const useAn = useA;\n\nexport const useOptional = <E>(item?: Partial<E>): [E, (e: Optional<E>) => Optional<E>, () => Optional<E>] => {\n  const [state, setState] = useState<E>(item as E);\n  const set = (e?: Optional<E>): Optional<E> => {\n    setState(e as E);\n    return e;\n  };\n  return [state, set, (): Optional<E> => set()];\n};\n\nexport const useEntity = useA;\n\nexport const useList = <E>(...items: E[]): [List<E>, (e: List<E>) => List<E>] => {\n  const [state, setState] = useState<List<E>>(toList<E>(...items));\n  return [\n    state,\n    (e: List<E>): List<E> => {\n      setState(e);\n      return e;\n    },\n  ];\n};\n\nexport const usePageList = <E>(...items: E[]): [PageList<E>, (e: PageList<E>) => PageList<E>] => {\n  const [pages, setPages] = useState<PageList<E>>(toPageList<E>(items));\n  return [\n    pages,\n    (e: PageList<E>): PageList<E> => {\n      setPages(e);\n      return e;\n    },\n  ];\n};\n\nexport const usePaging = <E>(\n  f: (options?: PageOptions) => Promise<PageList<E>>,\n  options?: PageOptions\n): [PageList<E>, (options?: PageOptions) => Promise<PageList<E>>, boolean, number, number] => {\n  const [list, setList] = usePageList<E>();\n  const [skip, setSkip] = useState(options?.skip ?? 0);\n  const [take] = useState(options?.take ?? 5);\n  const next = (options: PageOptions = { skip, take }) =>\n    f(options).then(items => {\n      setSkip(skip + take);\n      return setList(toPageList(list.add(items), items));\n    });\n  return [list, next, list.length < (list?.total ?? 0), skip, take];\n};\n\nexport const useGet = <E>(f: () => Promise<E>, initial?: Partial<E>): [E, () => Promise<E>] => {\n  const [item, setItem] = useState((initial ?? {}) as E);\n  const getter = () =>\n    f().then(i => {\n      setItem(i);\n      return i;\n    });\n  return [item, getter];\n};\n\nexport const useGetList = <E>(f: () => Promise<List<E>>): [List<E>, () => Promise<PageList<E>>] => {\n  const [list, setList] = usePageList<E>();\n  const getter = () => f().then(l => setList(isPageList<E>(l) ? l : toPageList(l, { total: l.length })));\n  return [list, getter];\n};\n","import { DependencyList, useEffect, useState } from 'react';\n\nexport type UseOnceOptions<E> = {\n  deps?: DependencyList;\n  initial?: Partial<E>;\n};\n\nexport function useOnce<E>(f: () => Promise<E>, options?: UseOnceOptions<E>): [E] {\n  const [item, setItem] = useState(options?.initial as E);\n  useEffect(() => void f().then(i => setItem(i)), options?.deps ?? []);\n  return [item];\n}\n","import { Dispatch, SetStateAction, useState as useReactState } from 'react';\n\nexport function useState<T>(): [T | undefined, Dispatch<SetStateAction<T | undefined>>, () => void];\nexport function useState<T>(initial: T): [T, Dispatch<SetStateAction<T>>, () => void];\nexport function useState<T>(initial?: T) {\n  const [state, setState] = useReactState(initial);\n  const reset = () => setState(initial);\n  return [state, setState, reset] as const;\n}\n","import { useState } from './useState';\n\nexport const useRev = (initial = 0) => {\n  const [rev, setRev, reset] = useState(initial);\n  const revalidate = () => setRev(r => r + 1);\n  return { rev, revalidate, reset };\n};\n","import { useState } from './useState';\n\nexport function useToggle(initial = false): [boolean, () => void, <T>(fn: () => Promise<T>) => Promise<T>] {\n  const [state, setState] = useState(initial);\n  const toggle = () => setState(s => !s);\n  const flip = <T>(fn: () => Promise<T>) => {\n    setState(s => !s);\n    return fn().finally(() => setState(s => !s));\n  };\n  return [state, toggle, flip];\n}\n"],"mappings":"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","names":["useState","React","import_easy","import_react","options","import_react","import_react","useState","useReactState","useState","useState"]}
+{"version":3,"sources":["../src/index.ts","../src/layout/If.tsx","../src/utils/Children.ts","../src/utils/toClasses.ts","../src/utils/Hooks.ts","../src/utils/useOnce.ts","../src/utils/useState.ts","../src/utils/useRev.ts","../src/utils/useToggle.ts"],"sourcesContent":["export * from './layout';\nexport * from './utils';\n","import * as React from 'react';\nimport { FunctionComponent, ReactElement, ReactNode } from 'react';\n\nexport interface IfProps {\n  condition: any | undefined;\n  children?: ReactNode;\n}\n\nexport const If: FunctionComponent<IfProps> = ({ condition, children }): ReactElement | null => (condition ? <>{children}</> : null);\n","import { isDefined, List, toList } from '@thisisagile/easy';\nimport React, { ReactNode } from 'react';\n\nexport const toChildren = (children: ReactNode): List<ReactNode> => toList(React.Children.toArray(children).filter(isDefined));\n","import { entries, ifTrue, OneOrMore, Optional, toArray } from '@thisisagile/easy';\n\nexport const toClasses = (styles: Record<string, string>, classes: OneOrMore<string>, props: Record<string, Optional<boolean>>): string =>\n  [...toArray(classes).map(c => styles[c]), ...entries(props).map(([key, val]) => ifTrue(val, styles[key]))].filter(Boolean).join(' ');\n","import { Get, isPageList, List, ofGet, Optional, PageList, PageOptions, Predicate, toList, toPageList, Validatable } from '@thisisagile/easy';\nimport { useState } from 'react';\n\n// export const useToggle = (initialState = false): [boolean, () => void] => {\n//   const [state, setState] = useState<boolean>(initialState);\n//   return [state, () => setState(s => !s)];\n// };\n\nexport function useSwitch<T>(...states: T[]): {\n  state: T;\n  next: () => void;\n  states: T[];\n  isState: Predicate<T>;\n  ifState: <U>(t: T, yes: Get<U, T>, no: Get<U, T>) => U;\n} {\n  const [state, setState] = useState(states[0]);\n  const next = () => setState(s => states[(states.indexOf(s) + 1) % states.length]);\n  const isState = (t: T) => state === t;\n\n  function ifState<U>(t: T, yes: Get<U, T>, no: Get<U, T>): U {\n    return ofGet(state === t ? yes : no, t);\n  }\n\n  return { state, next, states, isState, ifState };\n}\n\nexport const useA = <E extends Validatable>(item: Partial<E> = {} as Partial<E>): [E, (e: E) => E] => {\n  const [state, setState] = useState<E>({ isValid: false, ...item } as E);\n  return [\n    state,\n    (e: E): E => {\n      setState(e);\n      return e;\n    },\n  ];\n};\n\nexport const useAn = useA;\n\nexport const useOptional = <E>(item?: Partial<E>): [E, (e: Optional<E>) => Optional<E>, () => Optional<E>] => {\n  const [state, setState] = useState<E>(item as E);\n  const set = (e?: Optional<E>): Optional<E> => {\n    setState(e as E);\n    return e;\n  };\n  return [state, set, (): Optional<E> => set()];\n};\n\nexport const useEntity = useA;\n\nexport const useList = <E>(...items: E[]): [List<E>, (e: List<E>) => List<E>] => {\n  const [state, setState] = useState<List<E>>(toList<E>(...items));\n  return [\n    state,\n    (e: List<E>): List<E> => {\n      setState(e);\n      return e;\n    },\n  ];\n};\n\nexport const usePageList = <E>(...items: E[]): [PageList<E>, (e: PageList<E>) => PageList<E>] => {\n  const [pages, setPages] = useState<PageList<E>>(toPageList<E>(items));\n  return [\n    pages,\n    (e: PageList<E>): PageList<E> => {\n      setPages(e);\n      return e;\n    },\n  ];\n};\n\nexport const usePaging = <E>(\n  f: (options?: PageOptions) => Promise<PageList<E>>,\n  options?: PageOptions\n): [PageList<E>, (options?: PageOptions) => Promise<PageList<E>>, boolean, number, number] => {\n  const [list, setList] = usePageList<E>();\n  const [skip, setSkip] = useState(options?.skip ?? 0);\n  const [take] = useState(options?.take ?? 5);\n  const next = (options: PageOptions = { skip, take }) =>\n    f(options).then(items => {\n      setSkip(skip + take);\n      return setList(toPageList(list.add(items), items));\n    });\n  return [list, next, list.length < (list?.total ?? 0), skip, take];\n};\n\nexport const useGet = <E>(f: () => Promise<E>, initial?: Partial<E>): [E, () => Promise<E>] => {\n  const [item, setItem] = useState((initial ?? {}) as E);\n  const getter = () =>\n    f().then(i => {\n      setItem(i);\n      return i;\n    });\n  return [item, getter];\n};\n\nexport const useGetList = <E>(f: () => Promise<List<E>>): [List<E>, () => Promise<PageList<E>>] => {\n  const [list, setList] = usePageList<E>();\n  const getter = () => f().then(l => setList(isPageList<E>(l) ? l : toPageList(l, { total: l.length })));\n  return [list, getter];\n};\n","import { DependencyList, useEffect, useState } from 'react';\n\nexport type UseOnceOptions<E> = {\n  deps?: DependencyList;\n  initial?: Partial<E>;\n};\n\nexport function useOnce<E>(f: () => Promise<E>, options?: UseOnceOptions<E>): [E] {\n  const [item, setItem] = useState(options?.initial as E);\n  useEffect(() => void f().then(i => setItem(i)), options?.deps ?? []);\n  return [item];\n}\n","import { Dispatch, SetStateAction, useState as useReactState } from 'react';\n\nexport function useState<T>(): [T | undefined, Dispatch<SetStateAction<T | undefined>>, () => void];\nexport function useState<T>(initial: T): [T, Dispatch<SetStateAction<T>>, () => void];\nexport function useState<T>(initial?: T) {\n  const [state, setState] = useReactState(initial);\n  const reset = () => setState(initial);\n  return [state, setState, reset] as const;\n}\n","import { useState } from './useState';\n\nexport const useRev = (initial = 0) => {\n  const [rev, setRev, reset] = useState(initial);\n  const revalidate = () => setRev(r => r + 1);\n  return { rev, revalidate, reset };\n};\n","import { useState } from './useState';\n\nexport function useToggle(initial = false): [boolean, () => void, <T>(fn: () => Promise<T>) => Promise<T>] {\n  const [state, setState] = useState(initial);\n  const toggle = () => setState(s => !s);\n  const flip = <T>(fn: () => Promise<T>) => {\n    setState(s => !s);\n    return fn().finally(() => setState(s => !s));\n  };\n  return [state, toggle, flip];\n}\n"],"mappings":"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","names":["useState","React","import_easy","import_easy","import_react","options","import_react","import_react","useState","useReactState","useState","useState"]}

package/dist/utils/index.d.ts

@@ -1,4 +1,5 @@
 export * from './Children';
+export * from './toClasses';
 export * from './Hooks';
 export * from './useOnce';
 export * from './useRev';

package/dist/utils/index.mjs

@@ -1,4 +1,5 @@
 export * from "./Children";
+export * from "./toClasses";
 export * from "./Hooks";
 export * from "./useOnce";
 export * from "./useRev";

package/dist/utils/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/index.ts"],"sourcesContent":["export * from './Children';\nexport * from './Hooks';\nexport * from './useOnce';\nexport * from './useRev';\nexport * from './useState';\nexport * from './useToggle';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
+{"version":3,"sources":["../../src/utils/index.ts"],"sourcesContent":["export * from './Children';\nexport * from './toClasses';\nexport * from './Hooks';\nexport * from './useOnce';\nexport * from './useRev';\nexport * from './useState';\nexport * from './useToggle';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/utils/toClasses.d.ts

@@ -0,0 +1,2 @@
+import { OneOrMore, Optional } from '@thisisagile/easy';
+export declare const toClasses: (styles: Record<string, string>, classes: OneOrMore<string>, props: Record<string, Optional<boolean>>) => string;

package/dist/utils/toClasses.mjs

@@ -0,0 +1,7 @@
+// src/utils/toClasses.ts
+import { entries, ifTrue, toArray } from "@thisisagile/easy";
+var toClasses = (styles, classes, props) => [...toArray(classes).map((c) => styles[c]), ...entries(props).map(([key, val]) => ifTrue(val, styles[key]))].filter(Boolean).join(" ");
+export {
+  toClasses
+};
+//# sourceMappingURL=toClasses.mjs.map

package/dist/utils/toClasses.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/toClasses.ts"],"sourcesContent":["import { entries, ifTrue, OneOrMore, Optional, toArray } from '@thisisagile/easy';\n\nexport const toClasses = (styles: Record<string, string>, classes: OneOrMore<string>, props: Record<string, Optional<boolean>>): string =>\n  [...toArray(classes).map(c => styles[c]), ...entries(props).map(([key, val]) => ifTrue(val, styles[key]))].filter(Boolean).join(' ');\n"],"mappings":";AAAA,SAAS,SAAS,QAA6B,eAAe;AAEvD,IAAM,YAAY,CAAC,QAAgC,SAA4B,UACpF,CAAC,GAAG,QAAQ,OAAO,EAAE,IAAI,OAAK,OAAO,CAAC,CAAC,GAAG,GAAG,QAAQ,KAAK,EAAE,IAAI,CAAC,CAAC,KAAK,GAAG,MAAM,OAAO,KAAK,OAAO,GAAG,CAAC,CAAC,CAAC,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thisisagile/easy-react",
-  "version": "18.2.0",
+  "version": "18.4.0",
   "description": "Straightforward library building micro applications in react",
   "author": "Sander Hoogendoorn",
   "license": "MIT",
@@ -47,7 +47,7 @@
     "next-transpile-modules": "^10.0.0"
   },
   "dependencies": {
-    "@thisisagile/easy": "^18.2.0",
+    "@thisisagile/easy": "^18.4.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "sass": "^1.80.3"

package/src/utils/index.ts

@@ -1,4 +1,5 @@
 export * from './Children';
+export * from './toClasses';
 export * from './Hooks';
 export * from './useOnce';
 export * from './useRev';

package/src/utils/toClasses.ts

@@ -0,0 +1,4 @@
+import { entries, ifTrue, OneOrMore, Optional, toArray } from '@thisisagile/easy';
+
+export const toClasses = (styles: Record<string, string>, classes: OneOrMore<string>, props: Record<string, Optional<boolean>>): string =>
+  [...toArray(classes).map(c => styles[c]), ...entries(props).map(([key, val]) => ifTrue(val, styles[key]))].filter(Boolean).join(' ');