@lizzelabs/react-harmony 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/dist/animations-B09mMqCx.js +24 -0
  2. package/dist/animations.es.js +5 -0
  3. package/dist/components/animations/animations.d.ts +5 -0
  4. package/dist/components/animations/animations.hook.d.ts +2 -0
  5. package/dist/components/animations/animations.types.d.ts +16 -0
  6. package/dist/components/animations/index.d.ts +3 -0
  7. package/dist/components/index.d.ts +7 -0
  8. package/dist/components/media/index.d.ts +3 -0
  9. package/dist/components/media/media.d.ts +5 -0
  10. package/dist/components/media/media.hook.d.ts +2 -0
  11. package/dist/components/media/media.types.d.ts +15 -0
  12. package/dist/components/piece/index.d.ts +3 -0
  13. package/dist/components/piece/piece.d.ts +6 -0
  14. package/dist/components/piece/piece.hook.d.ts +5 -0
  15. package/dist/components/piece/piece.static.d.ts +2 -0
  16. package/dist/components/piece/piece.types.d.ts +34 -0
  17. package/dist/components/piece/piece.utils.d.ts +7 -0
  18. package/dist/components/piece-provider/index.d.ts +3 -0
  19. package/dist/components/piece-provider/piece-provider.context.d.ts +2 -0
  20. package/dist/components/piece-provider/piece-provider.d.ts +4 -0
  21. package/dist/components/piece-provider/piece-provider.hook.d.ts +2 -0
  22. package/dist/components/piece-provider/piece-provider.types.d.ts +24 -0
  23. package/dist/components/screen/index.d.ts +3 -0
  24. package/dist/components/screen/screen.d.ts +4 -0
  25. package/dist/components/screen/screen.hook.d.ts +4 -0
  26. package/dist/components/screen/screen.types.d.ts +15 -0
  27. package/dist/components/scrollable/index.d.ts +3 -0
  28. package/dist/components/scrollable/scrollable.d.ts +6 -0
  29. package/dist/components/scrollable/scrollable.hook.d.ts +5 -0
  30. package/dist/components/scrollable/scrollable.styles.d.ts +14 -0
  31. package/dist/components/scrollable/scrollable.types.d.ts +12 -0
  32. package/dist/components/text/index.d.ts +3 -0
  33. package/dist/components/text/text.d.ts +4 -0
  34. package/dist/components/text/text.hook.d.ts +5 -0
  35. package/dist/components/text/text.types.d.ts +3 -0
  36. package/dist/components.es.js +24 -0
  37. package/dist/fillObjectWithDefaults-AoLKqRgC.js +13 -0
  38. package/dist/hocs/index.d.ts +1 -0
  39. package/dist/hocs/withPieceAsContainer.d.ts +7 -0
  40. package/dist/index.d.ts +5 -0
  41. package/dist/index.es.js +36 -0
  42. package/dist/media-BrSPl6_U.js +48 -0
  43. package/dist/media.es.js +5 -0
  44. package/dist/piece-Mpz6AD6r.js +221 -0
  45. package/dist/piece-provider-DTglah_F.js +1388 -0
  46. package/dist/piece-provider.es.js +5 -0
  47. package/dist/piece.es.js +5 -0
  48. package/dist/screen-gL0zeQqb.js +53 -0
  49. package/dist/screen.es.js +5 -0
  50. package/dist/scrollable-hsA1xMFz.js +94 -0
  51. package/dist/scrollable.es.js +5 -0
  52. package/dist/styles-DofTX6nZ.js +653 -0
  53. package/dist/systems/harmony/alignment-container.d.ts +2 -0
  54. package/dist/systems/harmony/contents.d.ts +2 -0
  55. package/dist/systems/harmony/index.d.ts +1 -0
  56. package/dist/systems/harmony/input.d.ts +2 -0
  57. package/dist/systems/harmony/media.d.ts +2 -0
  58. package/dist/systems/harmony/piece.d.ts +2 -0
  59. package/dist/systems/harmony/reset.d.ts +2 -0
  60. package/dist/systems/harmony/screen.d.ts +2 -0
  61. package/dist/systems/harmony/scrollable.d.ts +2 -0
  62. package/dist/systems/index.d.ts +2 -0
  63. package/dist/systems/mergeSystems.d.ts +2 -0
  64. package/dist/systems.es.js +97 -0
  65. package/dist/text-BEFRS4fh.js +70 -0
  66. package/dist/text.es.js +6 -0
  67. package/dist/types/css.d.ts +6 -0
  68. package/dist/types/html.d.ts +5 -0
  69. package/dist/types/index.d.ts +3 -0
  70. package/dist/types/utils.d.ts +20 -0
  71. package/dist/types.es.js +1 -0
  72. package/dist/utils/appendClasses.d.ts +1 -0
  73. package/dist/utils/excludeProperties.d.ts +1 -0
  74. package/dist/utils/fillObjectWithDefaults.d.ts +1 -0
  75. package/dist/utils/index.d.ts +5 -0
  76. package/dist/utils/splitProps.d.ts +4 -0
  77. package/dist/utils/styles.d.ts +28 -0
  78. package/dist/utils.es.js +25 -0
  79. package/package.json +1 -1
@@ -0,0 +1,97 @@
1
+ const t = {
2
+ applyOn: (n) => n.kind === "contents",
3
+ style: {
4
+ display: "contents",
5
+ background: "transparent",
6
+ position: "relative"
7
+ }
8
+ }, i = {
9
+ applyOn: (n) => n.kind === "input",
10
+ style: {
11
+ flex: "1 0 auto",
12
+ width: "100%",
13
+ height: "100%",
14
+ display: "flex",
15
+ fontSize: "1rem",
16
+ boxShadow: "none",
17
+ outline: "none",
18
+ border: "1px solid transparent",
19
+ padding: "10px 0",
20
+ paddingLeft: "10px",
21
+ borderRadius: "5px",
22
+ appearance: "none",
23
+ "&::-webkit-outer-spin-button": {
24
+ margin: 0,
25
+ appearance: "none"
26
+ },
27
+ "&::-webkit-inner-spin-button": {
28
+ margin: 0,
29
+ appearance: "none"
30
+ }
31
+ }
32
+ }, o = {
33
+ applyOn: (n) => n.kind === "media",
34
+ style: {
35
+ display: "flex",
36
+ flex: 1,
37
+ userSelect: "none"
38
+ }
39
+ }, a = {
40
+ applyOn: (n) => n.kind === "piece",
41
+ style: {
42
+ display: "flex",
43
+ flex: "1 1 auto",
44
+ userSelect: "none",
45
+ touchAction: "none"
46
+ }
47
+ }, l = {
48
+ applyOn: "all",
49
+ style: {
50
+ margin: 0,
51
+ padding: 0,
52
+ border: 0,
53
+ fontSize: "100%",
54
+ fontWeight: "400",
55
+ fontStyle: "normal",
56
+ boxSizing: "border-box",
57
+ fontOpticalSizing: "auto",
58
+ listStyle: "none",
59
+ quotes: "none",
60
+ userSelect: "none",
61
+ overflow: "hidden"
62
+ }
63
+ }, r = {
64
+ applyOn: (n) => n.kind === "screen",
65
+ style: {
66
+ display: "grid",
67
+ gridTemplateColumns: "1fr",
68
+ gridTemplateRows: "1fr",
69
+ width: "100%",
70
+ height: "100%",
71
+ position: "relative"
72
+ }
73
+ }, p = {
74
+ applyOn: (n) => n.kind === "scrollable",
75
+ defaults: {
76
+ primary: "var(--color)",
77
+ highlight: "var(--highlight)",
78
+ size: "thin",
79
+ behavior: "instant"
80
+ },
81
+ style: {
82
+ "--color": "rgb(220, 220, 220)",
83
+ "--highlight": "rgba(25, 25, 25, 0.1)"
84
+ }
85
+ }, s = [
86
+ l,
87
+ a,
88
+ r,
89
+ o,
90
+ i,
91
+ t,
92
+ p
93
+ ], d = (n, ...e) => [...n, ...e];
94
+ export {
95
+ s as HARMONY_SYSTEM,
96
+ d as mergeSystems
97
+ };
@@ -0,0 +1,70 @@
1
+ import { memo as u } from "react";
2
+ import { u as l, P as d } from "./piece-Mpz6AD6r.js";
3
+ import { j as c, i as f } from "./piece-provider-DTglah_F.js";
4
+ import "./animations-B09mMqCx.js";
5
+ import { splitProps as x } from "./utils.es.js";
6
+ import "./scrollable-hsA1xMFz.js";
7
+ import "./screen-gL0zeQqb.js";
8
+ import "./media-BrSPl6_U.js";
9
+ const h = (t) => {
10
+ const { as: n, children: o, kind: e, ...i } = t;
11
+ return l({
12
+ ...i,
13
+ kind: e || "text",
14
+ as: n,
15
+ children: o
16
+ });
17
+ };
18
+ function w(t, n = {}) {
19
+ return function(e) {
20
+ const i = [
21
+ "containerRef",
22
+ "direction",
23
+ "alignContent",
24
+ "justifyContent",
25
+ "alignItems",
26
+ "justifytItems",
27
+ "display",
28
+ "contentColumns",
29
+ "contentRows",
30
+ "atColumn",
31
+ "atRow",
32
+ "flex",
33
+ "height",
34
+ "width",
35
+ "margin",
36
+ "padding"
37
+ ], { known: a, unknown: r } = x(
38
+ e,
39
+ i
40
+ ), { injectContainerProps: m, ...s } = n, p = {
41
+ ...s,
42
+ ...a
43
+ };
44
+ return /* @__PURE__ */ c.jsx(
45
+ d,
46
+ {
47
+ kind: "alignment-container",
48
+ ...p,
49
+ children: /* @__PURE__ */ c.jsx(
50
+ t,
51
+ {
52
+ ...r,
53
+ ...m ? s : {},
54
+ children: r?.children
55
+ }
56
+ )
57
+ }
58
+ );
59
+ };
60
+ }
61
+ const P = (t) => h(t).element, E = u(
62
+ w(P),
63
+ f
64
+ );
65
+ export {
66
+ P as I,
67
+ E as T,
68
+ h as u,
69
+ w
70
+ };
@@ -0,0 +1,6 @@
1
+ import { I as a, T as s, u as x } from "./text-BEFRS4fh.js";
2
+ export {
3
+ a as InternalText,
4
+ s as Text,
5
+ x as useText
6
+ };
@@ -0,0 +1,6 @@
1
+ import { CSSProperties } from 'react';
2
+ export type CssClass = {
3
+ selector: string;
4
+ styles: CSSProperties;
5
+ media?: string;
6
+ };
@@ -0,0 +1,5 @@
1
+ import { JSX } from 'react';
2
+ export type HtmlTag = keyof HTMLElementTagNameMap;
3
+ export type IntrinsicElement = keyof JSX.IntrinsicElements;
4
+ export type IntrinsicElementFromHTML<T extends HtmlTag> = T extends IntrinsicElement ? T : never;
5
+ export type TextTag = 'a' | 'abbr' | 'address' | 'b' | 'bdi' | 'bdo' | 'blockquote' | 'cite' | 'code' | 'data' | 'dd' | 'del' | 'dfn' | 'dt' | 'em' | 'figcaption' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'i' | 'ins' | 'kbd' | 'label' | 'legend' | 'li' | 'mark' | 'p' | 'pre' | 'q' | 'rp' | 'rt' | 'ruby' | 's' | 'samp' | 'small' | 'span' | 'strong' | 'sub' | 'sup' | 'time' | 'u' | 'var';
@@ -0,0 +1,3 @@
1
+ export * from './css';
2
+ export * from './html';
3
+ export * from './utils';
@@ -0,0 +1,20 @@
1
+ import { CSSProperties } from 'react';
2
+ import { HtmlTag, IntrinsicElement, IntrinsicElementFromHTML } from './html';
3
+ export type PartialRequired<T, Key extends keyof T> = T & Required<Pick<T, Key>>;
4
+ export type ElementEvents<T extends HtmlTag, I extends IntrinsicElement = IntrinsicElementFromHTML<T>> = Pick<React.ComponentPropsWithoutRef<I>, {
5
+ [K in keyof React.ComponentPropsWithoutRef<I>]: K extends `on${string}` ? K : never;
6
+ }[keyof React.ComponentPropsWithoutRef<I>]>;
7
+ export type NoEventsAndAria<T> = Omit<T, (keyof T & `on${string}`) | `aria${string}`>;
8
+ export type NoAria<T> = Omit<T, keyof T & `aria${string}`>;
9
+ export type PropWithTheme<Obj, T extends any | undefined> = Obj | ((theme?: T) => Obj);
10
+ export type WithStyle = CSSProperties | {
11
+ [key in `&${string}`]?: CSSProperties;
12
+ } | {
13
+ [key in `@${string}`]?: CSSProperties;
14
+ } | {
15
+ [key in string]?: CSSProperties;
16
+ } | {
17
+ [key in `@${string}`]?: WithStyle;
18
+ } | {
19
+ [key in `--${string}`]?: string | number;
20
+ };
@@ -0,0 +1 @@
1
+
@@ -0,0 +1 @@
1
+ export declare const appendClasses: (...classes: (string | undefined)[]) => string | undefined;
@@ -0,0 +1 @@
1
+ export declare const excludeProperties: <T>(obj: T, keys: (keyof T)[]) => T;
@@ -0,0 +1 @@
1
+ export declare const fillObjectWithDefaults: <T extends object, D extends object>(obj: T, ...defaults: D[]) => T;
@@ -0,0 +1,5 @@
1
+ export * from './excludeProperties';
2
+ export * from './appendClasses';
3
+ export * from './styles';
4
+ export * from './fillObjectWithDefaults';
5
+ export * from './splitProps';
@@ -0,0 +1,4 @@
1
+ export declare const splitProps: <T extends object, K extends keyof T>(obj: T, knownKeys: K[]) => {
2
+ known: {};
3
+ unknown: {};
4
+ };
@@ -0,0 +1,28 @@
1
+ import { CssClass, WithStyle } from '../types';
2
+ import { CSSProperties } from 'react';
3
+ export declare class Styles {
4
+ static PSEUDO_KEY: string;
5
+ static MEDIA_KEY: string;
6
+ private _sheet?;
7
+ private css;
8
+ constructor();
9
+ private static initialize;
10
+ translateObjecToCss(selector: string, styles?: CSSProperties): string;
11
+ translateAnimationToCss(style: WithStyle): string;
12
+ splitRootAndPseudo(obj: WithStyle, className?: string, media?: string): CssClass[];
13
+ splitWithIntoCssClasses(styles: WithStyle, className?: string): {
14
+ globals: (CssClass | {
15
+ selector: string;
16
+ styles: any;
17
+ })[];
18
+ root: CssClass[];
19
+ media: {
20
+ [key: string]: CssClass[];
21
+ };
22
+ animations: {};
23
+ };
24
+ apply(styles: WithStyle, className?: string): void;
25
+ insert(css?: string): void;
26
+ itsAlreadyInserted(css: string): boolean;
27
+ delete(): void;
28
+ }
@@ -0,0 +1,25 @@
1
+ import { S as c, e as i } from "./styles-DofTX6nZ.js";
2
+ import { a as f, f as d } from "./fillObjectWithDefaults-AoLKqRgC.js";
3
+ const r = (s, t) => Object.entries(s).reduce(
4
+ (n, [e, o]) => t.includes(e) ? {
5
+ ...n,
6
+ known: {
7
+ ...n.known,
8
+ [e]: o
9
+ }
10
+ } : {
11
+ ...n,
12
+ unknown: {
13
+ ...n.unknown,
14
+ [e]: o
15
+ }
16
+ },
17
+ { known: {}, unknown: {} }
18
+ );
19
+ export {
20
+ c as Styles,
21
+ f as appendClasses,
22
+ i as excludeProperties,
23
+ d as fillObjectWithDefaults,
24
+ r as splitProps
25
+ };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@lizzelabs/react-harmony",
3
3
  "private": false,
4
- "version": "1.0.0",
4
+ "version": "1.0.1",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",
7
7
  "type": "module",