@versini/ui-system 0.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) Arno Versini
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,27 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
+
+- Configure the top-level `parserOptions` property like this:
+
+```js
+   parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    project: ['./tsconfig.json', './tsconfig.node.json'],
+    tsconfigRootDir: __dirname,
+   },
+```
+
+- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
+- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
+- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list

package/dist/chunks/FlexgridContext.DVgU6-jM.js

@@ -0,0 +1,11 @@
+import t from "react";
+const e = "av-flexgrid", r = "av-flexgrid-item", c = 0.25, n = t.createContext({
+  columnGap: 0,
+  rowGap: 0
+});
+export {
+  e as FLEXGRID_CLASSNAME,
+  c as FLEXGRID_GAP_RATIO,
+  r as FLEXGRID_ITEM_CLASSNAME,
+  n as FlexgridContext
+};

package/dist/components/Flexgrid/Flexgrid.js

@@ -0,0 +1,39 @@
+import { jsx as o } from "react/jsx-runtime";
+import u from "clsx";
+import { FLEXGRID_CLASSNAME as p, FlexgridContext as A, FLEXGRID_GAP_RATIO as t } from "../../chunks/FlexgridContext.DVgU6-jM.js";
+const L = ({
+  children: s,
+  className: i,
+  columnGap: r = 1,
+  rowGap: e = 0,
+  height: l = "auto",
+  width: n = "auto",
+  direction: m = "row",
+  alignHorizontal: a = "normal",
+  alignVertical: x = "normal",
+  ...f
+}) => {
+  const c = {
+    flexDirection: m,
+    justifyContent: a,
+    alignItems: x,
+    height: l,
+    width: n,
+    /**
+     * Trick to account for the extra space taken
+     * by the columnGap and rowGap that will be applied
+     * to all FlexgridItems (see context and paddings).
+     */
+    marginLeft: r * -1 * t + "rem",
+    marginTop: e * -1 * t + "rem"
+  }, d = u(
+    i,
+    p,
+    "box-border flex flex-wrap"
+  ), g = { columnGap: r, rowGap: e };
+  return /* @__PURE__ */ o("div", { className: d, style: c, ...f, children: /* @__PURE__ */ o(A.Provider, { value: g, children: s }) });
+};
+export {
+  L as Flexgrid,
+  L as default
+};

package/dist/components/Flexgrid/FlexgridItem.js

@@ -0,0 +1,118 @@
+import { jsx as I } from "react/jsx-runtime";
+import { useContext as F } from "react";
+import { FLEXGRID_ITEM_CLASSNAME as g, FlexgridContext as G, FLEXGRID_GAP_RATIO as u } from "../../chunks/FlexgridContext.DVgU6-jM.js";
+import m from "clsx";
+const i = (l, s) => m({
+  "basis-1/12": l === 1 && !s,
+  "sm:basis-1/12": l === 1 && s === "sm",
+  "md:basis-1/12": l === 1 && s === "md",
+  "lg:basis-1/12": l === 1 && s === "lg",
+  "xl:basis-1/12": l === 1 && s === "xl",
+  "2xl:basis-1/12": l === 1 && s === "2xl",
+  "basis-2/12": l === 2 && !s,
+  "sm:basis-2/12": l === 2 && s === "sm",
+  "md:basis-2/12": l === 2 && s === "md",
+  "lg:basis-2/12": l === 2 && s === "lg",
+  "xl:basis-2/12": l === 2 && s === "xl",
+  "2xl:basis-2/12": l === 2 && s === "2xl",
+  "basis-3/12": l === 3 && !s,
+  "sm:basis-3/12": l === 3 && s === "sm",
+  "md:basis-3/12": l === 3 && s === "md",
+  "lg:basis-3/12": l === 3 && s === "lg",
+  "xl:basis-3/12": l === 3 && s === "xl",
+  "2xl:basis-3/12": l === 3 && s === "2xl",
+  "basis-4/12": l === 4 && !s,
+  "sm:basis-4/12": l === 4 && s === "sm",
+  "md:basis-4/12": l === 4 && s === "md",
+  "lg:basis-4/12": l === 4 && s === "lg",
+  "xl:basis-4/12": l === 4 && s === "xl",
+  "2xl:basis-4/12": l === 4 && s === "2xl",
+  "basis-5/12": l === 5 && !s,
+  "sm:basis-5/12": l === 5 && s === "sm",
+  "md:basis-5/12": l === 5 && s === "md",
+  "lg:basis-5/12": l === 5 && s === "lg",
+  "xl:basis-5/12": l === 5 && s === "xl",
+  "2xl:basis-5/12": l === 5 && s === "2xl",
+  "basis-6/12": l === 6 && !s,
+  "sm:basis-6/12": l === 6 && s === "sm",
+  "md:basis-6/12": l === 6 && s === "md",
+  "lg:basis-6/12": l === 6 && s === "lg",
+  "xl:basis-6/12": l === 6 && s === "xl",
+  "2xl:basis-6/12": l === 6 && s === "2xl",
+  "basis-7/12": l === 7 && !s,
+  "sm:basis-7/12": l === 7 && s === "sm",
+  "md:basis-7/12": l === 7 && s === "md",
+  "lg:basis-7/12": l === 7 && s === "lg",
+  "xl:basis-7/12": l === 7 && s === "xl",
+  "2xl:basis-7/12": l === 7 && s === "2xl",
+  "basis-8/12": l === 8 && !s,
+  "sm:basis-8/12": l === 8 && s === "sm",
+  "md:basis-8/12": l === 8 && s === "md",
+  "lg:basis-8/12": l === 8 && s === "lg",
+  "xl:basis-8/12": l === 8 && s === "xl",
+  "2xl:basis-8/12": l === 8 && s === "2xl",
+  "basis-9/12": l === 9 && !s,
+  "sm:basis-9/12": l === 9 && s === "sm",
+  "md:basis-9/12": l === 9 && s === "md",
+  "lg:basis-9/12": l === 9 && s === "lg",
+  "xl:basis-9/12": l === 9 && s === "xl",
+  "2xl:basis-9/12": l === 9 && s === "2xl",
+  "basis-10/12": l === 10 && !s,
+  "sm:basis-10/12": l === 10 && s === "sm",
+  "md:basis-10/12": l === 10 && s === "md",
+  "lg:basis-10/12": l === 10 && s === "lg",
+  "xl:basis-10/12": l === 10 && s === "xl",
+  "2xl:basis-10/12": l === 10 && s === "2xl",
+  "basis-11/12": l === 11 && !s,
+  "sm:basis-11/12": l === 11 && s === "sm",
+  "md:basis-11/12": l === 11 && s === "md",
+  "lg:basis-11/12": l === 11 && s === "lg",
+  "xl:basis-11/12": l === 11 && s === "xl",
+  "2xl:basis-11/12": l === 11 && s === "2xl",
+  "basis-full": l === 12 && !s,
+  "sm:basis-full": l === 12 && s === "sm",
+  "md:basis-full": l === 12 && s === "md",
+  "lg:basis-full": l === 12 && s === "lg",
+  "xl:basis-full": l === 12 && s === "xl",
+  "2xl:basis-full": l === 12 && s === "2xl"
+}), w = ({
+  className: l,
+  span: s
+}) => {
+  if (!s)
+    return m(l, g, "box-border basis-auto");
+  if (typeof s == "number")
+    return m(l, g, "box-border max-w-full", {
+      [`${i(s)}`]: !0
+    });
+  if (typeof s == "string")
+    return m(l, g, "box-border basis-auto", {
+      "max-w-full grow": s === "auto"
+    });
+  if (typeof s == "object") {
+    const f = Object.entries(s).map(([x, d]) => x === "fallback" ? i(d) : i(d, x));
+    return m(
+      l,
+      g,
+      "box-border",
+      f
+    );
+  }
+}, _ = ({
+  children: l,
+  className: s,
+  span: f,
+  ...x
+}) => {
+  const { columnGap: d, rowGap: b } = F(G), c = {
+    paddingLeft: d * u + "rem",
+    paddingTop: b * u + "rem"
+  }, C = w({
+    className: s,
+    span: f
+  });
+  return /* @__PURE__ */ I("div", { className: C, style: c, ...x, children: l });
+};
+export {
+  _ as FlexgridItem
+};

package/dist/components/ThemeProvider/ThemeProvider.js

@@ -0,0 +1,19 @@
+import { jsx as u } from "react/jsx-runtime";
+import { useRef as i, useEffect as p } from "react";
+const m = ({
+  customTheme: e,
+  children: n,
+  global: r
+}) => {
+  const t = i(null);
+  return p(() => {
+    var s;
+    const o = r ? document.documentElement.style : (s = t == null ? void 0 : t.current) == null ? void 0 : s.style;
+    if (!(!o || !e))
+      for (const [f, c] of Object.entries(e))
+        o.setProperty(f, c);
+  }, [e, r]), e || !r ? /* @__PURE__ */ u("div", { ref: t, className: "contents", children: n }) : n;
+};
+export {
+  m as ThemeProvider
+};

package/dist/index.d.ts

@@ -0,0 +1,133 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+
+type FlexgridProps = {
+	/**
+	 * Children of the Flexgrid (FlexgridItem(s) or any other nodes).
+	 */
+	children: React.ReactNode;
+
+	/**
+	 * Equivalent to "justify-content" in flexbox, this prop defines
+	 * the alignment along the main axis (horizontal).
+	 */
+	alignHorizontal?:
+		| "normal"
+		| "flex-start"
+		| "center"
+		| "flex-end"
+		| "space-between"
+		| "space-around"
+		| "space-evenly";
+
+	/**
+	 * Equivalent to "align-items" in flexbox, this prop defines
+	 * the alignment along the cross axis (vertical).
+	 */
+	alignVertical?:
+		| "normal"
+		| "flex-start"
+		| "center"
+		| "flex-end"
+		| "stretch"
+		| "baseline";
+
+	/**
+	 * The class name of the Flexgrid.
+	 * It follows the [CSS class name property](https://developer.mozilla.org/en-US/docs/Web/CSS/class).
+	 */
+	className?: string;
+
+	/**
+	 * Width of the gutters between the columns.
+	 * See the “Customization -> Spacing” section for
+	 * more information about this unit.
+	 */
+	columnGap?: number;
+
+	/**
+	 * Equivalent to "flex-direction" in flexbox, this prop
+	 * establishes the main-axis, thus defining the direction
+	 * flex items are placed in the flex container. Flexbox is
+	 * (aside from optional wrapping) a single-direction layout
+	 * concept. Think of flex items as primarily laying out
+	 * either in horizontal rows or vertical columns.
+	 */
+	direction?: "row" | "row-reverse" | "column" | "column-reverse";
+
+	/**
+	 * The height of the Flexgrid.
+	 * It follows the [CSS height property](https://developer.mozilla.org/en-US/docs/Web/CSS/height).
+	 */
+	height?: string;
+
+	/**
+	 * Width of the gutters between the rows.
+	 * See the “Customization -> Spacing” section for
+	 * more information about this unit.
+	 */
+	rowGap?: number;
+
+	/**
+	 * The width of the Flexgrid.
+	 * It follows the [CSS width property](https://developer.mozilla.org/en-US/docs/Web/CSS/width).
+	 */
+	width?: string;
+};
+
+type FlexgridItemProps = {
+	/** Children of the FlexgridItem. */
+	children?: React.ReactNode;
+
+	/** Classname to apply to the FlexgridItem. */
+	className?: string;
+
+	/** The item will span across the provided number of grid tracks. */
+	span?:
+		| number
+		| "auto"
+		| {
+				fallback?: number;
+				lg?: number;
+				md?: number;
+				sm?: number;
+				xl?: number;
+		  };
+};
+
+declare const Flexgrid: ({ children, className, columnGap, rowGap, height, width, direction, alignHorizontal, alignVertical, ...otherProps }: FlexgridProps) => react_jsx_runtime.JSX.Element;
+
+/**
+ * FlexgridItem is a child of Flexgrid. It is used to define the width of a
+ * column in a Flexgrid. It can be used to span across multiple columns in a
+ * Flexgrid by providing a number of columns or "auto" value to the `span` prop.
+ */
+declare const FlexgridItem: ({ children, className, span, ...otherProps }: FlexgridItemProps) => react_jsx_runtime.JSX.Element;
+
+type ThemeProviderProps = {
+	/**
+	 * The children to render.
+	 */
+	children: React.ReactNode;
+	/**
+	 * An object specifying custom properties impacting the base theme.
+	 * Not all custom properties need to be specified.
+	 * @example
+	 * ```tsx
+	 * // this will change the color of the button to red.
+	 * <ThemeProvider customTheme={{ '--av-action-dark': 'red' }}>
+	 *  <Button kind="dark">Click me</Button>
+	 * </ThemeProvider>
+	 * ```
+	 */
+	customTheme?: Record<string, string>;
+	/**
+	 * Whether to apply the theme globally or not.
+	 * @default false
+	 */
+	global?: boolean;
+};
+
+declare const ThemeProvider: ({ customTheme, children, global, }: ThemeProviderProps) => string | number | boolean | Iterable<react.ReactNode> | react_jsx_runtime.JSX.Element | null | undefined;
+
+export { Flexgrid, FlexgridItem, ThemeProvider };

package/dist/index.js

@@ -0,0 +1,21 @@
+import { Flexgrid as i } from "./components/Flexgrid/Flexgrid.js";
+import { FlexgridItem as t } from "./components/Flexgrid/FlexgridItem.js";
+import { ThemeProvider as I } from "./components/ThemeProvider/ThemeProvider.js";
+/*!
+  @versini/ui-system v0.0.0
+  © 2024 gizmette.com
+*/
+try {
+  window.__VERSINI_UI_SYSTEM__ || (window.__VERSINI_UI_SYSTEM__ = {
+    version: "0.0.0",
+    buildTime: "02/26/2024 08:34 AM EST",
+    homepage: "https://github.com/aversini/ui-components",
+    license: "MIT"
+  });
+} catch {
+}
+export {
+  i as Flexgrid,
+  t as FlexgridItem,
+  I as ThemeProvider
+};

package/dist/style.css

@@ -0,0 +1 @@
+*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-ms-input-placeholder,textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-ms-backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.m-4{margin:1rem}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-11{margin-bottom:2.75rem}.mb-12{margin-bottom:3rem}.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-20{margin-bottom:5rem}.mb-24{margin-bottom:6rem}.mb-28{margin-bottom:7rem}.mb-3{margin-bottom:.75rem}.mb-32{margin-bottom:8rem}.mb-36{margin-bottom:9rem}.mb-4{margin-bottom:1rem}.mb-44{margin-bottom:11rem}.mb-48{margin-bottom:12rem}.mb-5{margin-bottom:1.25rem}.mb-52{margin-bottom:13rem}.mb-56{margin-bottom:14rem}.mb-6{margin-bottom:1.5rem}.mb-60{margin-bottom:15rem}.mb-64{margin-bottom:16rem}.mb-7{margin-bottom:1.75rem}.mb-72{margin-bottom:18rem}.mb-8{margin-bottom:2rem}.mb-80{margin-bottom:20rem}.mb-9{margin-bottom:2.25rem}.mb-96{margin-bottom:24rem}.ml-0{margin-left:0}.ml-1{margin-left:.25rem}.ml-10{margin-left:2.5rem}.ml-11{margin-left:2.75rem}.ml-12{margin-left:3rem}.ml-14{margin-left:3.5rem}.ml-16{margin-left:4rem}.ml-2{margin-left:.5rem}.ml-20{margin-left:5rem}.ml-24{margin-left:6rem}.ml-28{margin-left:7rem}.ml-3{margin-left:.75rem}.ml-32{margin-left:8rem}.ml-36{margin-left:9rem}.ml-4{margin-left:1rem}.ml-44{margin-left:11rem}.ml-48{margin-left:12rem}.ml-5{margin-left:1.25rem}.ml-52{margin-left:13rem}.ml-56{margin-left:14rem}.ml-6{margin-left:1.5rem}.ml-60{margin-left:15rem}.ml-64{margin-left:16rem}.ml-7{margin-left:1.75rem}.ml-72{margin-left:18rem}.ml-8{margin-left:2rem}.ml-80{margin-left:20rem}.ml-9{margin-left:2.25rem}.ml-96{margin-left:24rem}.mr-0{margin-right:0}.mr-1{margin-right:.25rem}.mr-10{margin-right:2.5rem}.mr-11{margin-right:2.75rem}.mr-12{margin-right:3rem}.mr-14{margin-right:3.5rem}.mr-16{margin-right:4rem}.mr-2{margin-right:.5rem}.mr-20{margin-right:5rem}.mr-24{margin-right:6rem}.mr-28{margin-right:7rem}.mr-3{margin-right:.75rem}.mr-32{margin-right:8rem}.mr-36{margin-right:9rem}.mr-4{margin-right:1rem}.mr-44{margin-right:11rem}.mr-48{margin-right:12rem}.mr-5{margin-right:1.25rem}.mr-52{margin-right:13rem}.mr-56{margin-right:14rem}.mr-6{margin-right:1.5rem}.mr-60{margin-right:15rem}.mr-64{margin-right:16rem}.mr-7{margin-right:1.75rem}.mr-72{margin-right:18rem}.mr-8{margin-right:2rem}.mr-80{margin-right:20rem}.mr-9{margin-right:2.25rem}.mr-96{margin-right:24rem}.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-11{margin-top:2.75rem}.mt-12{margin-top:3rem}.mt-14{margin-top:3.5rem}.mt-16{margin-top:4rem}.mt-2{margin-top:.5rem}.mt-20{margin-top:5rem}.mt-24{margin-top:6rem}.mt-28{margin-top:7rem}.mt-3{margin-top:.75rem}.mt-32{margin-top:8rem}.mt-36{margin-top:9rem}.mt-4{margin-top:1rem}.mt-44{margin-top:11rem}.mt-48{margin-top:12rem}.mt-5{margin-top:1.25rem}.mt-52{margin-top:13rem}.mt-56{margin-top:14rem}.mt-6{margin-top:1.5rem}.mt-60{margin-top:15rem}.mt-64{margin-top:16rem}.mt-7{margin-top:1.75rem}.mt-72{margin-top:18rem}.mt-8{margin-top:2rem}.mt-80{margin-top:20rem}.mt-9{margin-top:2.25rem}.mt-96{margin-top:24rem}.box-border{box-sizing:border-box}.inline{display:inline}.flex{display:flex}.grid{display:grid}.contents{display:contents}.max-w-full{max-width:100%}.grow{flex-grow:1}.basis-1\/12{flex-basis:8.333333%}.basis-10\/12{flex-basis:83.333333%}.basis-11\/12{flex-basis:91.666667%}.basis-2\/12{flex-basis:16.666667%}.basis-3\/12{flex-basis:25%}.basis-4\/12{flex-basis:33.333333%}.basis-5\/12{flex-basis:41.666667%}.basis-6\/12{flex-basis:50%}.basis-7\/12{flex-basis:58.333333%}.basis-8\/12{flex-basis:66.666667%}.basis-9\/12{flex-basis:75%}.basis-auto{flex-basis:auto}.basis-full{flex-basis:100%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-wrap{flex-wrap:wrap}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.border-white{--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity))}.transition{transition-property:color,background-color,border-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-text-decoration-color,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-text-decoration-color,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.av-text-input-wrapper label[aria-hidden=true],.av-text-area-wrapper label[aria-hidden=true]{transform:translate(18px) scale(1);transform-origin:top left;transition:var(--av-text-area-wrapper-transition, all .2s ease-out)}.av-text-input:focus+label[aria-hidden=true],.av-text-input:not(:placeholder-shown)+label[aria-hidden=true],.av-text-area:focus+label[aria-hidden=true],.av-text-area:not(:placeholder-shown)+label[aria-hidden=true]{transform:translate(18px,var(--av-text-area-label, -25px)) scale(.75)}.av-text-input-simple:focus+label[aria-hidden=true],.av-text-input-simple:not(:placeholder-shown)+label[aria-hidden=true]{transform:translate(18px,var(--av-text-area-label, -12px)) scale(.75)}.av-text-input-helper-text,.av-text-area-helper-text{transform:translate(18px,var(--av-text-area-helper-text, 32px)) scale(.75);transform-origin:top left}.av-text-input__control--right,.av-text-area__control--right{right:18px}@keyframes blink{50%{fill:transparent}}.av-spinner__dot{animation:1s blink infinite}.av-spinner__dot:nth-child(2){animation-delay:.25s}.av-spinner__dot:nth-child(3){animation-delay:.5s}@media (min-width: 640px){.sm\:basis-1\/12{flex-basis:8.333333%}.sm\:basis-10\/12{flex-basis:83.333333%}.sm\:basis-11\/12{flex-basis:91.666667%}.sm\:basis-2\/12{flex-basis:16.666667%}.sm\:basis-3\/12{flex-basis:25%}.sm\:basis-4\/12{flex-basis:33.333333%}.sm\:basis-5\/12{flex-basis:41.666667%}.sm\:basis-6\/12{flex-basis:50%}.sm\:basis-7\/12{flex-basis:58.333333%}.sm\:basis-8\/12{flex-basis:66.666667%}.sm\:basis-9\/12{flex-basis:75%}.sm\:basis-full{flex-basis:100%}}@media (min-width: 768px){.md\:basis-1\/12{flex-basis:8.333333%}.md\:basis-10\/12{flex-basis:83.333333%}.md\:basis-11\/12{flex-basis:91.666667%}.md\:basis-2\/12{flex-basis:16.666667%}.md\:basis-3\/12{flex-basis:25%}.md\:basis-4\/12{flex-basis:33.333333%}.md\:basis-5\/12{flex-basis:41.666667%}.md\:basis-6\/12{flex-basis:50%}.md\:basis-7\/12{flex-basis:58.333333%}.md\:basis-8\/12{flex-basis:66.666667%}.md\:basis-9\/12{flex-basis:75%}.md\:basis-full{flex-basis:100%}}@media (min-width: 1024px){.lg\:basis-1\/12{flex-basis:8.333333%}.lg\:basis-10\/12{flex-basis:83.333333%}.lg\:basis-11\/12{flex-basis:91.666667%}.lg\:basis-2\/12{flex-basis:16.666667%}.lg\:basis-3\/12{flex-basis:25%}.lg\:basis-4\/12{flex-basis:33.333333%}.lg\:basis-5\/12{flex-basis:41.666667%}.lg\:basis-6\/12{flex-basis:50%}.lg\:basis-7\/12{flex-basis:58.333333%}.lg\:basis-8\/12{flex-basis:66.666667%}.lg\:basis-9\/12{flex-basis:75%}.lg\:basis-full{flex-basis:100%}}@media (min-width: 1280px){.xl\:basis-1\/12{flex-basis:8.333333%}.xl\:basis-10\/12{flex-basis:83.333333%}.xl\:basis-11\/12{flex-basis:91.666667%}.xl\:basis-2\/12{flex-basis:16.666667%}.xl\:basis-3\/12{flex-basis:25%}.xl\:basis-4\/12{flex-basis:33.333333%}.xl\:basis-5\/12{flex-basis:41.666667%}.xl\:basis-6\/12{flex-basis:50%}.xl\:basis-7\/12{flex-basis:58.333333%}.xl\:basis-8\/12{flex-basis:66.666667%}.xl\:basis-9\/12{flex-basis:75%}.xl\:basis-full{flex-basis:100%}}@media (min-width: 1536px){.\32xl\:basis-1\/12{flex-basis:8.333333%}.\32xl\:basis-10\/12{flex-basis:83.333333%}.\32xl\:basis-11\/12{flex-basis:91.666667%}.\32xl\:basis-2\/12{flex-basis:16.666667%}.\32xl\:basis-3\/12{flex-basis:25%}.\32xl\:basis-4\/12{flex-basis:33.333333%}.\32xl\:basis-5\/12{flex-basis:41.666667%}.\32xl\:basis-6\/12{flex-basis:50%}.\32xl\:basis-7\/12{flex-basis:58.333333%}.\32xl\:basis-8\/12{flex-basis:66.666667%}.\32xl\:basis-9\/12{flex-basis:75%}.\32xl\:basis-full{flex-basis:100%}}

package/dist/utilities.d.ts

@@ -0,0 +1,18 @@
+import * as tailwindcss_types_config from 'tailwindcss/types/config';
+import { Config, OptionalConfig } from 'tailwindcss/types/config';
+import typography from '@tailwindcss/typography';
+
+type TailwindConfig = {
+    content: string[];
+} & OptionalConfig;
+declare const twPlugin: {
+    content: string[];
+    safelist: string[];
+    plugins: (typeof typography | {
+        handler: tailwindcss_types_config.PluginCreator;
+        config?: Partial<Config> | undefined;
+    })[];
+    merge: (config: TailwindConfig) => Config;
+};
+
+export { twPlugin };