@yakad/ui 1.2.68-beta → 1.2.70-beta

package/client.tsx

@@ -1,4 +1,4 @@
-import ClickAwayListener from "./clickAwayListener/clickAwayListener";
-import HistoryBack from "./historyBack/historyBack";
-
-export { ClickAwayListener, HistoryBack };
+import ClickAwayListener from "./clickAwayListener/clickAwayListener";
+import HistoryBack from "./historyBack/historyBack";
+
+export { ClickAwayListener, HistoryBack };

package/codeField/codeField.module.css

@@ -1,23 +1,23 @@
-.input {
-    box-sizing: border-box;
-    display: block;
-    border: none;
-    padding: 0;
-    margin: 0;
-    margin-left: 0.5ch;
-    background: repeating-linear-gradient(
-            90deg,
-            #7d7d7d 0,
-            #7d7d7d 1ch,
-            transparent 0,
-            transparent 1.5ch
-        )
-        0 100%/100% 0.2rem no-repeat;
-    color: transparent;
-    text-shadow: 0 0 0 rgb(var(--secondaryColor, 98 91 113));
-    font: 5ch consolas, monospace;
-    letter-spacing: 0.5ch;
-}
-.input:focus {
-    outline: none;
-}
+.input {
+    box-sizing: border-box;
+    display: block;
+    border: none;
+    padding: 0;
+    margin: 0;
+    margin-left: 0.5ch;
+    background: repeating-linear-gradient(
+            90deg,
+            #7d7d7d 0,
+            #7d7d7d 1ch,
+            transparent 0,
+            transparent 1.5ch
+        )
+        0 100%/100% 0.2rem no-repeat;
+    color: transparent;
+    text-shadow: 0 0 0 rgb(var(--secondaryColor, 98 91 113));
+    font: 5ch consolas, monospace;
+    letter-spacing: 0.5ch;
+}
+.input:focus {
+    outline: none;
+}

package/codeField/codeField.tsx

@@ -1,32 +1,32 @@
-import React from "react";
-import { joinClassNames, joinStyles } from "@yakad/lib";
-import styles from "./codeField.module.css";
-
-interface CodeFieldsProps extends React.HTMLAttributes<HTMLInputElement> {
-    length?: number;
-    name?: string;
-    type?: string;
-}
-
-function CodeField(props: CodeFieldsProps) {
-    const joinedClassNames = joinClassNames(styles.input, props.className!);
-
-    const joinedStyles = joinStyles(
-        { width: "calc(1.5ch * " + props.length + ")" },
-        props.style!
-    );
-
-    return (
-        <input
-            {...props}
-            name={props.name}
-            type={props.type}
-            minLength={props.length}
-            maxLength={props.length}
-            className={joinedClassNames}
-            style={joinedStyles}
-        />
-    );
-}
-
-export default CodeField;
+import React from "react";
+import { joinClassNames, joinStyles } from "@yakad/lib";
+import styles from "./codeField.module.css";
+
+interface CodeFieldsProps extends React.HTMLAttributes<HTMLInputElement> {
+    length?: number;
+    name?: string;
+    type?: string;
+}
+
+function CodeField(props: CodeFieldsProps) {
+    const joinedClassNames = joinClassNames(styles.input, props.className!);
+
+    const joinedStyles = joinStyles(
+        { width: "calc(1.5ch * " + props.length + ")" },
+        props.style!
+    );
+
+    return (
+        <input
+            {...props}
+            name={props.name}
+            type={props.type}
+            minLength={props.length}
+            maxLength={props.length}
+            className={joinedClassNames}
+            style={joinedStyles}
+        />
+    );
+}
+
+export default CodeField;

package/container/container.module.css

@@ -1,24 +1,24 @@
-div.container {
-    display: flex;
-    flex-direction: inherit;
-    width: 100%;
-    padding: 2rem;
-    margin: auto;
-    box-sizing: border-box;
-}
-
-div.container.xs {
-    max-width: 44.4rem;
-}
-div.container.sm {
-    max-width: 60rem;
-}
-div.container.md {
-    max-width: 90rem;
-}
-div.container.lg {
-    max-width: 120rem;
-}
-div.container.xl {
-    max-width: 150rem;
-}
+div.container {
+    display: flex;
+    flex-direction: inherit;
+    width: 100%;
+    padding: 2rem;
+    margin: auto;
+    box-sizing: border-box;
+}
+
+div.container.xs {
+    max-width: 44.4rem;
+}
+div.container.sm {
+    max-width: 60rem;
+}
+div.container.md {
+    max-width: 90rem;
+}
+div.container.lg {
+    max-width: 120rem;
+}
+div.container.xl {
+    max-width: 150rem;
+}

package/container/container.tsx

@@ -1,27 +1,27 @@
-import React from "react";
-import { joinClassNames, joinStyles } from "@yakad/lib";
-import styles from "./container.module.css";
-
-type ScreenSize = "xs" | "sm" | "md" | "lg" | "xl";
-
-interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
-  maxWidth?: ScreenSize;
-  background?: "dotted";
-}
-
-function Container(props: ContainerProps) {
-  const joinedClassNames = joinClassNames(
-    props.maxWidth ? styles[props.maxWidth] : "",
-    props.background ? styles[props.background] : "",
-    styles.container,
-    props.className!
-  );
-
-  return (
-    <div {...props} className={joinedClassNames}>
-      {props.children}
-    </div>
-  );
-}
-
-export default Container;
+import React from "react";
+import { joinClassNames, joinStyles } from "@yakad/lib";
+import styles from "./container.module.css";
+
+type ScreenSize = "xs" | "sm" | "md" | "lg" | "xl";
+
+interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
+  maxWidth?: ScreenSize;
+  background?: "dotted";
+}
+
+function Container(props: ContainerProps) {
+  const joinedClassNames = joinClassNames(
+    props.maxWidth ? styles[props.maxWidth] : "",
+    props.background ? styles[props.background] : "",
+    styles.container,
+    props.className!
+  );
+
+  return (
+    <div {...props} className={joinedClassNames}>
+      {props.children}
+    </div>
+  );
+}
+
+export default Container;

package/footer/footer.module.css

@@ -1,9 +1,9 @@
-.footer {
-    background: rgb(var(--surfaceContainerColor, 243 237 247));
-    color: rgb(var(--onSurfaceColor, 28 27 31));
-    fill: rgb(var(--onSurfaceColor, 28 27 31));
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    box-sizing: border-box;
-}
+.footer {
+    background: rgb(var(--surfaceContainerColor, 243 237 247));
+    color: rgb(var(--onSurfaceColor, 28 27 31));
+    fill: rgb(var(--onSurfaceColor, 28 27 31));
+    display: flex;
+    flex-direction: row;
+    width: 100%;
+    box-sizing: border-box;
+}

package/footer/footer.tsx

@@ -1,15 +1,15 @@
-import React from "react";
-import { joinClassNames } from "@yakad/lib";
-import styles from "./footer.module.css";
-
-function Footer(props: React.HTMLAttributes<HTMLElement>) {
-  const joinedClassNames = joinClassNames(styles.footer, props.className!);
-
-  return (
-    <footer {...props} className={joinedClassNames}>
-      {props.children}
-    </footer>
-  );
-}
-
-export default Footer;
+import React from "react";
+import { joinClassNames } from "@yakad/lib";
+import styles from "./footer.module.css";
+
+function Footer(props: React.HTMLAttributes<HTMLElement>) {
+  const joinedClassNames = joinClassNames(styles.footer, props.className!);
+
+  return (
+    <footer {...props} className={joinedClassNames}>
+      {props.children}
+    </footer>
+  );
+}
+
+export default Footer;

package/form/form.module.css

@@ -1,6 +1,6 @@
-.form {
-    display: flex;
-    flex-direction: column;
-    gap: 1.5rem;
-    width: 100%;
-}
+.form {
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+    width: 100%;
+}

package/form/form.tsx

@@ -1,23 +1,23 @@
-import React from "react";
-import { joinClassNames, joinStyles } from "@yakad/lib";
-import styles from "./form.module.css";
-
-function Form(props: React.HTMLAttributes<HTMLFormElement>) {
-  const joinedClassNames = joinClassNames(styles.form, props.className!);
-
-  return (
-    <form
-      {...props}
-      className={joinedClassNames}
-      onSubmit={(e) => {
-        e.preventDefault();
-
-        props.onSubmit!(null as any);
-      }}
-    >
-      {props.children}
-    </form>
-  );
-}
-
-export default Form;
+import React from "react";
+import { joinClassNames, joinStyles } from "@yakad/lib";
+import styles from "./form.module.css";
+
+function Form(props: React.HTMLAttributes<HTMLFormElement>) {
+  const joinedClassNames = joinClassNames(styles.form, props.className!);
+
+  return (
+    <form
+      {...props}
+      className={joinedClassNames}
+      onSubmit={(e) => {
+        e.preventDefault();
+
+        props.onSubmit!(null as any);
+      }}
+    >
+      {props.children}
+    </form>
+  );
+}
+
+export default Form;

package/gridContainer/gridContainer.module.css

@@ -1,5 +1,5 @@
-.gridcontainer {
-    display: grid;
-    box-sizing: border-box;
-    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
-}
+.gridcontainer {
+    display: grid;
+    box-sizing: border-box;
+    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
+}

package/gridContainer/gridContainer.tsx

@@ -1,28 +1,28 @@
-import React from "react";
-import { joinClassNames, joinStyles } from "@yakad/lib";
-import styles from "./gridContainer.module.css";
-
-interface GridContainerProps extends React.HTMLAttributes<HTMLDivElement> {
-    rowGap?: number;
-    columnGap?: number;
-}
-
-// Custom Button Element
-function GridContainer(props: GridContainerProps) {
-    const joinedClassNames = joinClassNames(
-        styles.gridcontainer,
-        props.className!
-    );
-    const joinedStyles = joinStyles(
-        { columnGap: props.columnGap ? props.columnGap + "rem" : "1.5rem" },
-        { rowGap: props.rowGap ? props.rowGap + "rem" : "1.5rem" },
-        props.style!
-    );
-    return (
-        <div {...props} className={joinedClassNames} style={joinedStyles}>
-            {props.children}
-        </div>
-    );
-}
-
-export default GridContainer;
+import React from "react";
+import { joinClassNames, joinStyles } from "@yakad/lib";
+import styles from "./gridContainer.module.css";
+
+interface GridContainerProps extends React.HTMLAttributes<HTMLDivElement> {
+    rowGap?: number;
+    columnGap?: number;
+}
+
+// Custom Button Element
+function GridContainer(props: GridContainerProps) {
+    const joinedClassNames = joinClassNames(
+        styles.gridcontainer,
+        props.className!
+    );
+    const joinedStyles = joinStyles(
+        { columnGap: props.columnGap ? props.columnGap + "rem" : "1.5rem" },
+        { rowGap: props.rowGap ? props.rowGap + "rem" : "1.5rem" },
+        props.style!
+    );
+    return (
+        <div {...props} className={joinedClassNames} style={joinedStyles}>
+            {props.children}
+        </div>
+    );
+}
+
+export default GridContainer;