@lizzelabs/react-harmony 1.0.0 → 1.1.0

package/dist/systems.es.js

@@ -0,0 +1,97 @@
+const t = {
+  applyOn: (n) => n.kind === "contents",
+  style: {
+    display: "contents",
+    background: "transparent",
+    position: "relative"
+  }
+}, i = {
+  applyOn: (n) => n.kind === "input",
+  style: {
+    flex: "1 0 auto",
+    width: "100%",
+    height: "100%",
+    display: "flex",
+    fontSize: "1rem",
+    boxShadow: "none",
+    outline: "none",
+    border: "1px solid transparent",
+    padding: "10px 0",
+    paddingLeft: "10px",
+    borderRadius: "5px",
+    appearance: "none",
+    "&::-webkit-outer-spin-button": {
+      margin: 0,
+      appearance: "none"
+    },
+    "&::-webkit-inner-spin-button": {
+      margin: 0,
+      appearance: "none"
+    }
+  }
+}, o = {
+  applyOn: (n) => n.kind === "media",
+  style: {
+    display: "flex",
+    flex: 1,
+    userSelect: "none"
+  }
+}, a = {
+  applyOn: (n) => n.kind === "piece",
+  style: {
+    display: "flex",
+    flex: "1 1 auto",
+    userSelect: "none",
+    touchAction: "none"
+  }
+}, l = {
+  applyOn: "all",
+  style: {
+    margin: 0,
+    padding: 0,
+    border: 0,
+    fontSize: "100%",
+    fontWeight: "400",
+    fontStyle: "normal",
+    boxSizing: "border-box",
+    fontOpticalSizing: "auto",
+    listStyle: "none",
+    quotes: "none",
+    userSelect: "none",
+    overflow: "hidden"
+  }
+}, r = {
+  applyOn: (n) => n.kind === "screen",
+  style: {
+    display: "grid",
+    gridTemplateColumns: "1fr",
+    gridTemplateRows: "1fr",
+    width: "100%",
+    height: "100%",
+    position: "relative"
+  }
+}, p = {
+  applyOn: (n) => n.kind === "scrollable",
+  defaults: {
+    primary: "var(--color)",
+    highlight: "var(--highlight)",
+    size: "thin",
+    behavior: "instant"
+  },
+  style: {
+    "--color": "rgb(220, 220, 220)",
+    "--highlight": "rgba(25, 25, 25, 0.1)"
+  }
+}, s = [
+  l,
+  a,
+  r,
+  o,
+  i,
+  t,
+  p
+], d = (n, ...e) => [...n, ...e];
+export {
+  s as HARMONY_SYSTEM,
+  d as mergeSystems
+};

package/dist/text-E5g5oMHP.js

@@ -0,0 +1,72 @@
+import { memo as l } from "react";
+import { u, P as d } from "./piece-CqJl-F6G.js";
+import { j as a, i as f } from "./piece-provider-DTglah_F.js";
+import "./animations-B09mMqCx.js";
+import { splitProps as x } from "./utils.es.js";
+import "./scrollable-Dg_gmKLH.js";
+import "./screen-C0RCelCe.js";
+import "./media-C5LK6pq4.js";
+const h = (t) => {
+  const { as: n, children: o, kind: e, ...i } = t;
+  return u({
+    ...i,
+    kind: e || "text",
+    as: n,
+    children: o
+  });
+};
+function w(t, n = {}) {
+  return function(e) {
+    const i = [
+      "containerRef",
+      "direction",
+      "alignContent",
+      "justifyContent",
+      "alignItems",
+      "justifytItems",
+      "display",
+      "contentColumns",
+      "contentRows",
+      "atColumn",
+      "atRow",
+      "flex",
+      "height",
+      "width",
+      "margin",
+      "padding"
+    ], { known: c, unknown: r } = x(
+      e,
+      i
+    ), { injectContainerProps: p, ...s } = n, m = {
+      ...s,
+      ...c
+    };
+    return /* @__PURE__ */ a.jsx(
+      d,
+      {
+        kind: "alignment-container",
+        ...m,
+        children: /* @__PURE__ */ a.jsx(
+          t,
+          {
+            ...r,
+            ...p ? s : {},
+            children: r?.children
+          }
+        )
+      }
+    );
+  };
+}
+const P = (t) => h(t).element, E = l(
+  w(P, {
+    withStyle: { display: "flex", flex: "1 1 auto" }
+  }),
+  f
+);
+export {
+  P as I,
+  E as T,
+  h as u,
+  w
+};

package/dist/text.es.js

@@ -0,0 +1,6 @@
+import { I as a, T as s, u as x } from "./text-E5g5oMHP.js";
+export {
+  a as InternalText,
+  s as Text,
+  x as useText
+};

package/dist/types/css.d.ts

@@ -0,0 +1,6 @@
+import { CSSProperties } from 'react';
+export type CssClass = {
+    selector: string;
+    styles: CSSProperties;
+    media?: string;
+};

package/dist/types/html.d.ts

@@ -0,0 +1,5 @@
+import { JSX } from 'react';
+export type HtmlTag = keyof HTMLElementTagNameMap;
+export type IntrinsicElement = keyof JSX.IntrinsicElements;
+export type IntrinsicElementFromHTML<T extends HtmlTag> = T extends IntrinsicElement ? T : never;
+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';

package/dist/types/index.d.ts

@@ -0,0 +1,3 @@
+export * from './css';
+export * from './html';
+export * from './utils';

package/dist/types/utils.d.ts

@@ -0,0 +1,20 @@
+import { CSSProperties } from 'react';
+import { HtmlTag, IntrinsicElement, IntrinsicElementFromHTML } from './html';
+export type PartialRequired<T, Key extends keyof T> = T & Required<Pick<T, Key>>;
+export type ElementEvents<T extends HtmlTag, I extends IntrinsicElement = IntrinsicElementFromHTML<T>> = Pick<React.ComponentPropsWithoutRef<I>, {
+    [K in keyof React.ComponentPropsWithoutRef<I>]: K extends `on${string}` ? K : never;
+}[keyof React.ComponentPropsWithoutRef<I>]>;
+export type NoEventsAndAria<T> = Omit<T, (keyof T & `on${string}`) | `aria${string}`>;
+export type NoAria<T> = Omit<T, keyof T & `aria${string}`>;
+export type PropWithTheme<Obj, T extends any | undefined> = Obj | ((theme?: T) => Obj);
+export type WithStyle = CSSProperties | {
+    [key in `&${string}`]?: CSSProperties;
+} | {
+    [key in `@${string}`]?: CSSProperties;
+} | {
+    [key in string]?: CSSProperties;
+} | {
+    [key in `@${string}`]?: WithStyle;
+} | {
+    [key in `--${string}`]?: string | number;
+};

package/dist/types.es.js

@@ -0,0 +1 @@
+

package/dist/utils/appendClasses.d.ts

@@ -0,0 +1 @@
+export declare const appendClasses: (...classes: (string | undefined)[]) => string | undefined;

package/dist/utils/excludeProperties.d.ts

@@ -0,0 +1 @@
+export declare const excludeProperties: <T>(obj: T, keys: (keyof T)[]) => T;

package/dist/utils/fillObjectWithDefaults.d.ts

@@ -0,0 +1 @@
+export declare const fillObjectWithDefaults: <T extends object, D extends object>(obj: T, ...defaults: D[]) => T;

package/dist/utils/index.d.ts

@@ -0,0 +1,5 @@
+export * from './excludeProperties';
+export * from './appendClasses';
+export * from './styles';
+export * from './fillObjectWithDefaults';
+export * from './splitProps';

package/dist/utils/splitProps.d.ts

@@ -0,0 +1,4 @@
+export declare const splitProps: <T extends object, K extends keyof T>(obj: T, knownKeys: K[]) => {
+    known: {};
+    unknown: {};
+};

package/dist/utils/styles.d.ts

@@ -0,0 +1,28 @@
+import { CssClass, WithStyle } from '../types';
+import { CSSProperties } from 'react';
+export declare class Styles {
+    static PSEUDO_KEY: string;
+    static MEDIA_KEY: string;
+    private _sheet?;
+    private css;
+    constructor();
+    private static initialize;
+    translateObjecToCss(selector: string, styles?: CSSProperties): string;
+    translateAnimationToCss(style: WithStyle): string;
+    splitRootAndPseudo(obj: WithStyle, className?: string, media?: string): CssClass[];
+    splitWithIntoCssClasses(styles: WithStyle, className?: string): {
+        globals: (CssClass | {
+            selector: string;
+            styles: any;
+        })[];
+        root: CssClass[];
+        media: {
+            [key: string]: CssClass[];
+        };
+        animations: {};
+    };
+    apply(styles: WithStyle, className?: string): void;
+    insert(css?: string): void;
+    itsAlreadyInserted(css: string): boolean;
+    delete(): void;
+}

package/dist/utils.es.js

@@ -0,0 +1,25 @@
+import { S as c, e as i } from "./styles-DofTX6nZ.js";
+import { a as f, f as d } from "./fillObjectWithDefaults-AoLKqRgC.js";
+const r = (s, t) => Object.entries(s).reduce(
+  (n, [e, o]) => t.includes(e) ? {
+    ...n,
+    known: {
+      ...n.known,
+      [e]: o
+    }
+  } : {
+    ...n,
+    unknown: {
+      ...n.unknown,
+      [e]: o
+    }
+  },
+  { known: {}, unknown: {} }
+);
+export {
+  c as Styles,
+  f as appendClasses,
+  i as excludeProperties,
+  d as fillObjectWithDefaults,
+  r as splitProps
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lizzelabs/react-harmony",
   "private": false,
-  "version": "1.0.0",
+  "version": "1.1.0",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "type": "module",