aidos-ui 3.0.0

package/.prettierrc

@@ -0,0 +1,4 @@
+{
+  "tabWidth": 2,
+  "useTabs": false
+}

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) [2023] [Gerard Moreno-Torres Bertran]
+
+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,55 @@
+# Aidos UI
+
+This is a React design system library with many utilities and zero dependencies. It was built with the aim to be simple, lightweight and beautiful.
+
+Documentation can be found [here](https://simple-ui-core.vercel.app);
+
+## Why?
+
+Over the years I have always have many side projects, and many of them needed a UI. Back in 2019 I thought, maybe I could make my own design system, and so I did. Since then it has changed quite a bit and it is now something I am more or less proud of. It has everything I have ever needed and it is done in the way I find simplest and least convoluted. This is all ultimately very subjective, and that is fine, because the first design decision of this library was that it would be extremely opinionated. With that said, although this library does not lend it self to modification, it does tend to be fairly easy to extend and compose with it. I am now making this documentation with the vague weak conviction that someone out there may benefit from it.
+
+---
+
+## Who is this for?
+
+I initially only planned to use this myself so its features and design have so far reflected the things I have been working on. However I keep extending this library, and I think that with more users it may be possible to add more ideas and usecases so that this becomes a really complete system.
+
+---
+
+## Design philosophy
+
+1. <b>Opinionated</b>
+
+First and foremost, this library is extremely opinionated. This is so because I believe HTML is too low level and error prone, CSS defaults are not beautiful enough, and the web in general too big a toolkit to make simple things work in the way you expect. So, for the sake of simplicity, this library imposes opinions at every step. These opinions will not fit everyone's needs, and that is a sacrifice that can be made for the sake of simplicity.
+
+3. <b>Modular</b>
+
+There is no limit to the number of features and components that can be added, as long as every piece remains modular, or at most, composed out of its simpler parts. This is important to keep bundle sizes under control and also to keep the API sane. Modular components imply abstractions that do not depend on each other. This helps keep overall complexity low, so that it is simpler to extend the system.
+
+3. <b>Accessible</b>
+
+By design every component should be accessible, paying attention to keyboard navigation, focusable elements, adding helpful aria properties and following wcag specificaitons as faithfully as possible.
+
+4. <b>Dependency free</b>
+
+As few dependencies as possible, to keep things light and under control. The only dependency right now is [iconify](https://github.com/iconify/iconify) because I am not able to re-create all icons myself.
+
+---
+
+## Installation
+
+This library can be installed through npm
+
+```bash
+npm install --save aidos-ui
+```
+
+---
+
+## How to use
+
+- Import components from the `dist` folder (e.g. `import {Button} from 'simple-ui-core/dist`)
+- The `Providers` component somewhere in the application.
+- If the application is running in nextjs, the `JSServerStyles` component has to be used in the \_document `<Head />`, this enables jss to work also server side.
+
+---

package/dist/Badge.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { Color, JSStyle, Size } from "./jss";
+export declare function Badge({ size, color, jsStyle, }: {
+    size?: Size;
+    color?: Color;
+    jsStyle?: JSStyle;
+}): JSX.Element;

package/dist/Badge.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BaseView } from "./BaseView";
+import { getBackground } from "./jss";
+const sizes = {
+    xsmall: 4,
+    small: 6,
+    medium: 12,
+    large: 18,
+    xlarge: 24,
+};
+export function Badge({ size = "medium", color = "highlight", jsStyle, }) {
+    return (_jsx(BaseView, { jsStyle: [
+            {
+                width: sizes[size],
+                height: sizes[size],
+                borderRadius: sizes[size] / 2,
+            },
+            getBackground(color),
+            jsStyle,
+        ] }));
+}
+//# sourceMappingURL=Badge.js.map

package/dist/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../src/Badge.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAwB,aAAa,EAAE,MAAM,OAAO,CAAC;AAE5D,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,EAAE;CACX,CAAC;AAEF,MAAM,UAAU,KAAK,CAAC,EACpB,IAAI,GAAG,QAAQ,EACf,KAAK,GAAG,WAAW,EACnB,OAAO,GAKR;IACC,OAAO,CACL,KAAC,QAAQ,IACP,OAAO,EAAE;YACP;gBACE,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC;gBAClB,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC;gBACnB,YAAY,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;aAC9B;YACD,aAAa,CAAC,KAAK,CAAC;YACpB,OAAO;SACR,GACD,CACH,CAAC;AACJ,CAAC"}

package/dist/BaseButton.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { InteractableColor } from "./Interactable";
+import { JSStyle, Padding } from "./jss";
+export interface BaseButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    jsStyle?: JSStyle;
+    color: InteractableColor;
+    bare?: boolean;
+    className?: undefined;
+    animateInteraction?: boolean;
+    padding?: Padding;
+}
+export declare const BaseButton: React.ForwardRefExoticComponent<BaseButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/BaseButton.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { getInteractableJSStyles } from "./Interactable";
+import { jss } from "./jss";
+export const BaseButton = React.forwardRef(({ onClick, children, jsStyle, color, bare = false, disabled, animateInteraction = true, padding, ...otherProps }, ref) => {
+    return (_jsx("button", { ...otherProps, "aria-disabled": disabled ? true : undefined, ref: ref, onClick: (event) => {
+            if (disabled) {
+                return;
+            }
+            onClick(event);
+        }, className: jss([
+            ...getInteractableJSStyles({
+                color,
+                bare,
+                disabled,
+                animateInteraction,
+                padding,
+            }),
+            jsStyle,
+        ]), children: children }));
+});
+//# sourceMappingURL=BaseButton.js.map

package/dist/BaseButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseButton.js","sourceRoot":"","sources":["../src/BaseButton.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAqB,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAoB,GAAG,EAAE,MAAM,OAAO,CAAC;AAa9C,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CACxC,CACE,EACE,OAAO,EACP,QAAQ,EACR,OAAO,EACP,KAAK,EACL,IAAI,GAAG,KAAK,EACZ,QAAQ,EACR,kBAAkB,GAAG,IAAI,EACzB,OAAO,EACP,GAAG,UAAU,EACG,EAClB,GAAkC,EAClC,EAAE;IACF,OAAO,CACL,oBACM,UAAU,mBACC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC1C,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;YACjB,IAAI,QAAQ,EAAE;gBACZ,OAAO;aACR;YAED,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC,EACD,SAAS,EAAE,GAAG,CAAC;YACb,GAAG,uBAAuB,CAAC;gBACzB,KAAK;gBACL,IAAI;gBACJ,QAAQ;gBACR,kBAAkB;gBAClB,OAAO;aACR,CAAC;YACF,OAAO;SACR,CAAC,YAED,QAAQ,GACF,CACV,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/BaseInput.d.ts

@@ -0,0 +1,15 @@
+import React, { ReactNode } from "react";
+import { JSStyle, Size, TextColor } from "./jss";
+export interface BaseInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    jsStyle?: JSStyle;
+    className?: undefined;
+    size?: undefined;
+    children?: undefined;
+    id?: undefined;
+    label?: ReactNode;
+    labelSize?: Size;
+    labelColor?: TextColor;
+    labelBold?: boolean;
+    labelPosition?: "start" | "end";
+}
+export declare const BaseInput: React.ForwardRefExoticComponent<BaseInputProps & React.RefAttributes<HTMLInputElement>>;

package/dist/BaseInput.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useId } from "react";
+import { jss } from "./jss";
+import { Label } from "./Text";
+export const BaseInput = React.forwardRef(({ jsStyle, label, labelPosition = "end", labelSize, labelColor, labelBold, ...otherProps }, ref) => {
+    const id = useId();
+    const labelElement = (_jsx(Label, { size: labelSize, bold: labelBold, color: labelColor, jsStyle: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+        }, htmlFor: id, children: label }));
+    return (_jsxs(_Fragment, { children: [label && labelPosition === "start" && labelElement, _jsx("input", { id: id, ref: ref, className: jss(jsStyle), ...otherProps }), label && labelPosition === "end" && labelElement] }));
+});
+//# sourceMappingURL=BaseInput.js.map

package/dist/BaseInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseInput.js","sourceRoot":"","sources":["../src/BaseInput.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAa,KAAK,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAA4B,GAAG,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAC;AAgB/B,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CACvC,CACE,EACE,OAAO,EACP,KAAK,EACL,aAAa,GAAG,KAAK,EACrB,SAAS,EACT,UAAU,EACV,SAAS,EACT,GAAG,UAAU,EACE,EACjB,GAAiC,EACjC,EAAE;IACF,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IACnB,MAAM,YAAY,GAAG,CACnB,KAAC,KAAK,IACJ,IAAI,EAAE,SAAS,EACf,IAAI,EAAE,SAAS,EACf,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE;YACP,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;SACzB,EACD,OAAO,EAAE,EAAE,YAEV,KAAK,GACA,CACT,CAAC;IAEF,OAAO,CACL,8BACG,KAAK,IAAI,aAAa,KAAK,OAAO,IAAI,YAAY,EACnD,gBAAO,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,CAAC,OAAO,CAAC,KAAM,UAAU,GAAI,EACnE,KAAK,IAAI,aAAa,KAAK,KAAK,IAAI,YAAY,IAChD,CACJ,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/BaseLink.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import { InteractableColor } from "./Interactable";
+import { JSStyle, Padding } from "./jss";
+export interface BaseLinkProps extends React.LinkHTMLAttributes<HTMLAnchorElement> {
+    onClick?: (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
+    target?: string;
+    jsStyle?: JSStyle;
+    color: InteractableColor;
+    href: string;
+    disabled?: boolean;
+    bare?: boolean;
+    className?: undefined;
+    animateInteraction?: boolean;
+    padding?: Padding;
+}
+export declare const BaseLinkComponentOverrideContext: React.Context<(props: any) => JSX.Element>;
+export declare const BaseLink: React.ForwardRefExoticComponent<BaseLinkProps & React.RefAttributes<HTMLAnchorElement>>;

package/dist/BaseLink.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useContext } from "react";
+import { getInteractableJSStyles } from "./Interactable";
+import { jss } from "./jss";
+// This only exists to make NextJS happy, it should not be used in any other case
+export const BaseLinkComponentOverrideContext = React.createContext((props) => (_jsx("a", { ...props })));
+export const BaseLink = React.forwardRef(({ onClick, children, jsStyle, color, bare = false, disabled, animateInteraction = true, padding, href, role = "link", ...otherProps }, ref) => {
+    const Link = useContext(BaseLinkComponentOverrideContext);
+    return (_jsx(Link, { ...otherProps, "aria-disabled": disabled ? true : undefined, href: href, role: role, ref: ref, onClick: onClick
+            ? (event) => {
+                if (disabled) {
+                    return;
+                }
+                onClick(event);
+            }
+            : undefined, className: jss([
+            ...getInteractableJSStyles({
+                color,
+                bare,
+                disabled,
+                animateInteraction,
+                padding,
+            }),
+            disabled && { pointerEvents: "none" },
+            jsStyle,
+        ]), children: children }));
+});
+//# sourceMappingURL=BaseLink.js.map

package/dist/BaseLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseLink.js","sourceRoot":"","sources":["../src/BaseLink.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAqB,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAoB,GAAG,EAAE,MAAM,OAAO,CAAC;AAgB9C,iFAAiF;AACjF,MAAM,CAAC,MAAM,gCAAgC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAC7E,eAAO,KAAK,GAAI,CACjB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,CACE,EACE,OAAO,EACP,QAAQ,EACR,OAAO,EACP,KAAK,EACL,IAAI,GAAG,KAAK,EACZ,QAAQ,EACR,kBAAkB,GAAG,IAAI,EACzB,OAAO,EACP,IAAI,EACJ,IAAI,GAAG,MAAM,EACb,GAAG,UAAU,EACC,EAChB,GAAkC,EAClC,EAAE;IACF,MAAM,IAAI,GAAG,UAAU,CAAC,gCAAgC,CAAC,CAAC;IAE1D,OAAO,CACL,KAAC,IAAI,OACC,UAAU,mBACC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC1C,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,OAAO,EACL,OAAO;YACL,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;gBACR,IAAI,QAAQ,EAAE;oBACZ,OAAO;iBACR;gBAED,OAAO,CAAC,KAAK,CAAC,CAAC;YACjB,CAAC;YACH,CAAC,CAAC,SAAS,EAEf,SAAS,EAAE,GAAG,CAAC;YACb,GAAG,uBAAuB,CAAC;gBACzB,KAAK;gBACL,IAAI;gBACJ,QAAQ;gBACR,kBAAkB;gBAClB,OAAO;aACR,CAAC;YACF,QAAQ,IAAI,EAAE,aAAa,EAAE,MAAM,EAAE;YACrC,OAAO;SACR,CAAC,YAED,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/BaseList.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ColumnProps } from "./Column";
+export interface BaseListProps extends ColumnProps {
+    tag?: undefined;
+}
+export declare const BaseList: React.ForwardRefExoticComponent<Pick<BaseListProps, "padding" | "style" | "slot" | "title" | "children" | "hidden" | "color" | "relative" | "justify" | "direction" | "translate" | "gap" | "dangerouslySetInnerHTML" | "grow" | "shrink" | "jsStyle" | "tag" | "className" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align"> & React.RefAttributes<HTMLDivElement>>;

package/dist/BaseList.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { Column } from "./Column";
+export const BaseList = React.forwardRef(({ jsStyle, ...otherProps }, ref) => {
+    return (_jsx(Column, { ...otherProps, tag: "ul", jsStyle: [
+            {
+                listStyle: "none",
+                margin: 0,
+                padding: 0,
+            },
+            jsStyle,
+        ], ref: ref }));
+});
+//# sourceMappingURL=BaseList.js.map

package/dist/BaseList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseList.js","sourceRoot":"","sources":["../src/BaseList.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAe,MAAM,UAAU,CAAC;AAM/C,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,CACE,EAAE,OAAO,EAAE,GAAG,UAAU,EAAiB,EACzC,GAA+B,EAC/B,EAAE;IACF,OAAO,CACL,KAAC,MAAM,OACD,UAAU,EACd,GAAG,EAAC,IAAI,EACR,OAAO,EAAE;YACP;gBACE,SAAS,EAAE,MAAM;gBACjB,MAAM,EAAE,CAAC;gBACT,OAAO,EAAE,CAAC;aACX;YACD,OAAO;SACR,EACD,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/BaseListAddOn.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { BaseViewProps } from "./BaseView";
+export interface BaseListAddOnProps extends BaseViewProps {
+}
+export declare const BaseListAddOn: React.ForwardRefExoticComponent<Pick<BaseListAddOnProps, "style" | "slot" | "title" | "children" | "hidden" | "color" | "relative" | "translate" | "dangerouslySetInnerHTML" | "grow" | "shrink" | "jsStyle" | "tag" | "className" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLDivElement>>;

package/dist/BaseListAddOn.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { BaseView } from "./BaseView";
+export const BaseListAddOn = React.forwardRef((props, ref) => {
+    return _jsx(BaseView, { ...props, ref: ref });
+});
+//# sourceMappingURL=BaseListAddOn.js.map

package/dist/BaseListAddOn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseListAddOn.js","sourceRoot":"","sources":["../src/BaseListAddOn.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAiB,MAAM,YAAY,CAAC;AAIrD,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAC3C,CAAC,KAAyB,EAAE,GAA+B,EAAE,EAAE;IAC7D,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,CAAC;AAC3C,CAAC,CACF,CAAC"}

package/dist/BaseListItem.d.ts

@@ -0,0 +1,27 @@
+import React, { ReactNode } from "react";
+import { RowProps } from "./Row";
+import { JSStyle, Size, Position, Spacing, TextColor } from "./jss";
+export interface BaseListItemProps extends RowProps {
+    children: (elements: {
+        content: JSX.Element;
+    }) => ReactNode;
+    jsStyle?: JSStyle;
+    withDivider?: boolean;
+    headline: string;
+    headlineSize?: Size;
+    headlineColor?: TextColor;
+    headlineAddOn?: ReactNode;
+    headlineBold?: boolean;
+    body?: string;
+    bodySize?: Size;
+    bodyColor?: TextColor;
+    addOn?: ReactNode;
+    addOnPosition?: Position;
+    outerAddOn?: ReactNode;
+    disabled?: boolean;
+    role?: undefined;
+    gap?: Spacing;
+    selected?: boolean;
+    bare?: boolean;
+}
+export declare const BaseListItem: React.ForwardRefExoticComponent<Pick<BaseListItemProps, "padding" | "style" | "body" | "slot" | "title" | "children" | "hidden" | "color" | "relative" | "justify" | "disabled" | "direction" | "translate" | "gap" | "dangerouslySetInnerHTML" | "grow" | "shrink" | "jsStyle" | "tag" | "className" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "bare" | "selected" | "align" | "headline" | "headlineColor" | "headlineSize" | "headlineAddOn" | "bodyColor" | "bodySize" | "addOn" | "addOnPosition" | "headlineBold" | "withDivider" | "outerAddOn"> & React.RefAttributes<HTMLElement>>;

package/dist/BaseListItem.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from "react";
+import { ListDivider } from "./ListDivider";
+import { Row } from "./Row";
+import { cssVar } from "./jss";
+import { TextPairing } from "./TextPairing";
+import { BaseView } from "./BaseView";
+export const BaseListItem = React.forwardRef(({ children, jsStyle, withDivider = true, headline, headlineSize = "medium", headlineColor = "primary", headlineAddOn, body, bodySize = "small", bodyColor = "secondary", addOn, addOnPosition, outerAddOn, disabled = false, padding = "medium", gap = "medium", selected, bare, headlineBold, ...otherProps }, ref) => {
+    const content = (_jsx(TextPairing, { headlineBold: headlineBold, padding: padding, gap: gap, addOn: addOn, addOnPosition: addOnPosition, headline: headline, headlineSize: headlineSize, headlineColor: disabled ? "subtle" : bare && selected ? "highlight" : headlineColor, headlineAddOn: headlineAddOn, body: body, bodySize: bodySize, bodyColor: disabled ? "subtle" : bodyColor, grow: true, shrink: false }));
+    return (_jsxs(_Fragment, { children: [_jsxs(Row, { ...otherProps, ref: ref, relative: true, tag: "li", role: "row", jsStyle: [
+                    !bare && {
+                        [":first-child *"]: {
+                            borderTopLeftRadius: cssVar("--border-radius-l"),
+                            borderTopRightRadius: cssVar("--border-radius-l"),
+                        },
+                        [":last-child *"]: {
+                            borderBottomLeftRadius: cssVar("--border-radius-l"),
+                            borderBottomRightRadius: cssVar("--border-radius-l"),
+                        },
+                    },
+                    jsStyle,
+                ], children: [_jsx(Row, { grow: true, role: "gridcell", jsStyle: {
+                            overflow: "hidden",
+                        }, children: children({ content }) }), outerAddOn && _jsx(BaseView, { role: "gridcell", children: outerAddOn })] }), withDivider && _jsx(ListDivider, {})] }));
+});
+//# sourceMappingURL=BaseListItem.js.map

package/dist/BaseListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseListItem.js","sourceRoot":"","sources":["../src/BaseListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAY,MAAM,OAAO,CAAC;AACtC,OAAO,EAA+C,MAAM,EAAE,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAyBtC,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EACE,QAAQ,EACR,OAAO,EACP,WAAW,GAAG,IAAI,EAClB,QAAQ,EACR,YAAY,GAAG,QAAQ,EACvB,aAAa,GAAG,SAAS,EACzB,aAAa,EACb,IAAI,EACJ,QAAQ,GAAG,OAAO,EAClB,SAAS,GAAG,WAAW,EACvB,KAAK,EACL,aAAa,EACb,UAAU,EACV,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,GAAG,GAAG,QAAQ,EACd,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,GAAG,UAAU,EACK,EACpB,GAA4B,EAC5B,EAAE;IACF,MAAM,OAAO,GAAG,CACd,KAAC,WAAW,IACV,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,aAAa,EACX,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,EAEtE,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC1C,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,KAAK,GACb,CACH,CAAC;IAEF,OAAO,CACL,8BACE,MAAC,GAAG,OACE,UAAU,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,QACR,GAAG,EAAC,IAAI,EACR,IAAI,EAAC,KAAK,EACV,OAAO,EAAE;oBACP,CAAC,IAAI,IAAI;wBACP,CAAC,gBAAgB,CAAC,EAAE;4BAClB,mBAAmB,EAAE,MAAM,CAAC,mBAAmB,CAAC;4BAChD,oBAAoB,EAAE,MAAM,CAAC,mBAAmB,CAAC;yBAClD;wBACD,CAAC,eAAe,CAAC,EAAE;4BACjB,sBAAsB,EAAE,MAAM,CAAC,mBAAmB,CAAC;4BACnD,uBAAuB,EAAE,MAAM,CAAC,mBAAmB,CAAC;yBACrD;qBACF;oBACD,OAAO;iBACR,aAED,KAAC,GAAG,IACF,IAAI,QACJ,IAAI,EAAC,UAAU,EACf,OAAO,EAAE;4BACP,QAAQ,EAAE,QAAQ;yBACnB,YAEA,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC,GAClB,EACL,UAAU,IAAI,KAAC,QAAQ,IAAC,IAAI,EAAC,UAAU,YAAE,UAAU,GAAY,IAC5D,EACL,WAAW,IAAI,KAAC,WAAW,KAAG,IAC9B,CACJ,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/BaseView.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { JSStyle } from "./jss";
+export interface BaseViewProps extends React.HTMLAttributes<HTMLElement> {
+    jsStyle?: JSStyle;
+    ref?: React.Ref<HTMLDivElement>;
+    className?: undefined;
+    grow?: boolean;
+    shrink?: boolean;
+    relative?: boolean;
+    tag?: keyof HTMLElementTagNameMap;
+}
+export declare const BaseView: React.ForwardRefExoticComponent<Pick<BaseViewProps, "style" | "slot" | "title" | "children" | "hidden" | "color" | "relative" | "translate" | "dangerouslySetInnerHTML" | "grow" | "shrink" | "jsStyle" | "tag" | "className" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLElement>>;

package/dist/BaseView.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { jss } from "./jss";
+const jsStyles = {
+    relative: {
+        position: "relative",
+    },
+    grow: {
+        flexGrow: 1,
+    },
+    shrink: {
+        flexShrink: 1,
+    },
+};
+export const BaseView = React.forwardRef(({ jsStyle, children, tag, grow, shrink, relative, ...otherProps }, ref) => {
+    const Tag = tag ?? "div";
+    return (
+    // @ts-ignore
+    _jsx(Tag, { ref: ref, className: jss([
+            jsStyle,
+            grow && jsStyles.grow,
+            shrink && jsStyles.shrink,
+            relative && jsStyles.relative,
+        ]), ...otherProps, children: children }));
+});
+//# sourceMappingURL=BaseView.js.map

package/dist/BaseView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseView.js","sourceRoot":"","sources":["../src/BaseView.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAW,GAAG,EAAE,MAAM,OAAO,CAAC;AAErC,MAAM,QAAQ,GAA+B;IAC3C,QAAQ,EAAE;QACR,QAAQ,EAAE,UAAU;KACrB;IACD,IAAI,EAAE;QACJ,QAAQ,EAAE,CAAC;KACZ;IACD,MAAM,EAAE;QACN,UAAU,EAAE,CAAC;KACd;CACF,CAAC;AAYF,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,CACE,EACE,OAAO,EACP,QAAQ,EACR,GAAG,EACH,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,GAAG,UAAU,EACC,EAChB,GAA4B,EAC5B,EAAE;IACF,MAAM,GAAG,GAAW,GAAG,IAAI,KAAK,CAAC;IAEjC,OAAO;IACL,aAAa;IACb,KAAC,GAAG,IACF,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAG,CAAC;YACb,OAAO;YACP,IAAI,IAAI,QAAQ,CAAC,IAAI;YACrB,MAAM,IAAI,QAAQ,CAAC,MAAM;YACzB,QAAQ,IAAI,QAAQ,CAAC,QAAQ;SAC9B,CAAC,KACE,UAAU,YAEb,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/Box.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { FlexLayoutProps } from "./FlexLayout";
+export interface BoxProps extends FlexLayoutProps {
+}
+export declare function Box({ padding, align, justify, ...otherProps }: BoxProps): JSX.Element;

package/dist/Box.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FlexLayout } from "./FlexLayout";
+export function Box({ padding = "medium", align = "center", justify = "center", ...otherProps }) {
+    return (_jsx(FlexLayout, { padding: padding, align: align, justify: justify, ...otherProps }));
+}
+//# sourceMappingURL=Box.js.map

package/dist/Box.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Box.js","sourceRoot":"","sources":["../src/Box.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAC;AAI3D,MAAM,UAAU,GAAG,CAAC,EAClB,OAAO,GAAG,QAAQ,EAClB,KAAK,GAAG,QAAQ,EAChB,OAAO,GAAG,QAAQ,EAClB,GAAG,UAAU,EACJ;IACT,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,KACZ,UAAU,GACd,CACH,CAAC;AACJ,CAAC"}

package/dist/Button.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { BaseButtonProps } from "./BaseButton";
+import { IconType } from "./IconType";
+import { FlexLayoutProps } from "./FlexLayout";
+import { InteractableColor } from "./Interactable";
+import { Align, Gap, Justify, Size } from "./jss";
+export interface ButtonProps extends BaseButtonProps {
+    label: string;
+    color: InteractableColor;
+    size?: Size;
+    icon?: IconType;
+    iconSize?: Size;
+    children?: undefined;
+    iconPosition?: "left" | "right";
+    rowProps?: FlexLayoutProps;
+    align?: Align;
+    gap?: Gap;
+    justify?: Justify;
+}
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/Button.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import { BaseButton } from "./BaseButton";
+import { Text } from "./Text";
+import { Row } from "./Row";
+import { Icon } from "./Icon";
+import { getGlyphColor } from "./Interactable";
+import { cssVar, getPadding } from "./jss";
+export const Button = React.forwardRef(({ label, color, bare, disabled, icon, iconSize = "medium", iconPosition = "left", align = "center", gap = "small", justify = "center", jsStyle, size = "medium", ...otherProps }, ref) => {
+    return (_jsx(BaseButton, { ...otherProps, bare: bare, ref: ref, color: color, disabled: disabled, jsStyle: [
+            {
+                borderRadius: cssVar("--border-radius-m"),
+                justifyContent: "center",
+                userSelect: "none",
+            },
+            getPadding("medium"),
+            jsStyle,
+        ], children: _jsxs(Row, { grow: true, align: align, gap: gap, justify: justify, children: [icon && iconPosition === "left" && (_jsx(Icon, { icon: icon, size: iconSize, color: getGlyphColor(color, disabled, bare) })), _jsx(Text, { size: size, color: getGlyphColor(color, disabled, bare), children: label }), icon && iconPosition === "right" && (_jsx(Icon, { icon: icon, size: iconSize, color: getGlyphColor(color, disabled, bare) }))] }) }));
+});
+//# sourceMappingURL=Button.js.map

package/dist/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAmB,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,OAAO,EAAqB,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAA6B,MAAM,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAgBtE,MAAM,CAAC,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CACpC,CACE,EACE,KAAK,EACL,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,QAAQ,GAAG,QAAQ,EACnB,YAAY,GAAG,MAAM,EACrB,KAAK,GAAG,QAAQ,EAChB,GAAG,GAAG,OAAO,EACb,OAAO,GAAG,QAAQ,EAClB,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,GAAG,UAAU,EACD,EACd,GAAkC,EAClC,EAAE;IACF,OAAO,CACL,KAAC,UAAU,OACL,UAAU,EACd,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE;YACP;gBACE,YAAY,EAAE,MAAM,CAAC,mBAAmB,CAAC;gBACzC,cAAc,EAAE,QAAQ;gBACxB,UAAU,EAAE,MAAM;aACnB;YACD,UAAU,CAAC,QAAQ,CAAC;YACpB,OAAO;SACR,YAED,MAAC,GAAG,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,OAAO,EAAE,OAAO,aACtD,IAAI,IAAI,YAAY,KAAK,MAAM,IAAI,CAClC,KAAC,IAAI,IACH,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,GAC3C,CACH,EACD,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,YAC1D,KAAK,GACD,EACN,IAAI,IAAI,YAAY,KAAK,OAAO,IAAI,CACnC,KAAC,IAAI,IACH,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,GAC3C,CACH,IACG,GACK,CACd,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/Calendar.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { JSStyle } from "./jss";
+export declare const Calendar: React.ForwardRefExoticComponent<{
+    date: Date;
+    header: (props: {
+        weekday: string;
+    }) => JSX.Element;
+    jsStyle?: JSStyle;
+    cell: (props: {
+        today?: boolean;
+        date: Date;
+        outOfMonth: boolean;
+        top: boolean;
+        left: boolean;
+        right: boolean;
+        bottom: boolean;
+    }) => JSX.Element;
+} & React.RefAttributes<HTMLElement>>;

package/dist/Calendar.js

@@ -0,0 +1,57 @@
+import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import React, { useMemo } from "react";
+import { BaseView } from "./BaseView";
+const dateFormatter = Intl.DateTimeFormat("en-UK", {
+    weekday: "short",
+});
+const MON = dateFormatter.format(new Date(2000, 1, 7));
+const TUE = dateFormatter.format(new Date(2000, 1, 8));
+const WED = dateFormatter.format(new Date(2000, 1, 9));
+const THU = dateFormatter.format(new Date(2000, 1, 10));
+const FRI = dateFormatter.format(new Date(2000, 1, 11));
+const SAT = dateFormatter.format(new Date(2000, 1, 12));
+const SUN = dateFormatter.format(new Date(2000, 1, 13));
+export const Calendar = React.forwardRef(({ date, cell, header, jsStyle, }, ref) => {
+    const year = date.getFullYear();
+    const month = date.getMonth();
+    const daysInMonth = new Date(year, month + 1, 0).getDate();
+    const firstDayOfTheMonth = new Date(year, month, 1).getDay();
+    const offset = firstDayOfTheMonth === 0 ? 6 : firstDayOfTheMonth - 1;
+    const headers = useMemo(() => {
+        return (_jsxs(_Fragment, { children: [header({ weekday: MON }), header({ weekday: TUE }), header({ weekday: WED }), header({ weekday: THU }), header({ weekday: FRI }), header({ weekday: SAT }), header({ weekday: SUN })] }));
+    }, []);
+    return (_jsxs(BaseView, { ref: ref, jsStyle: [
+            {
+                display: "grid",
+                gridTemplateColumns: "1fr 1fr 1fr 1fr 1fr 1fr 1fr",
+                gridTemplateRows: "1fr",
+            },
+            jsStyle,
+        ], children: [headers, Array.from(Array(offset).keys()).map((index) => {
+                const dayDate = new Date(date.getFullYear(), date.getMonth(), index + 1 - offset);
+                return (_jsx(React.Fragment, { children: cell({
+                        date: dayDate,
+                        today: false,
+                        top: true,
+                        left: index % 7 === 0,
+                        outOfMonth: true,
+                        right: false,
+                        bottom: false,
+                    }) }, dayDate.toISOString()));
+            }), Array.from(Array(daysInMonth).keys()).map((index) => {
+                const dayDate = new Date(date.getFullYear(), date.getMonth(), index + 1, 12 // If we do not add this the ISO string would be from the day before at midnight
+                );
+                return (_jsx(React.Fragment, { children: cell({
+                        date: dayDate,
+                        top: index + offset < 7,
+                        left: (index + offset) % 7 === 0,
+                        right: (index + offset) % 7 === 7 - 1 || index === daysInMonth - 1,
+                        bottom: index > daysInMonth - 7 - 1,
+                        outOfMonth: false,
+                        today: dayDate.getDate() == new Date().getDate() &&
+                            dayDate.getMonth() == new Date().getMonth() &&
+                            dayDate.getFullYear() == new Date().getFullYear(),
+                    }) }, dayDate.toISOString()));
+            })] }));
+});
+//# sourceMappingURL=Calendar.js.map