@infonomic/uikit 1.0.0

package/dist/components/button/control-buttons_module.css

@@ -0,0 +1,118 @@
+@layer infonomic-base, infonomic-utilities, infonomic-theme;
+
+@layer infonomic-components {
+  .stop-button-krMTsl, .play-button-GfHYHO, .directional-button-kGS8rA {
+    color: #fff;
+    background-color: var(--primary-500);
+    cursor: pointer;
+    border-style: none;
+    border-radius: 100%;
+    outline: none;
+    justify-content: center;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+    text-decoration: none;
+    transition: all .3s cubic-bezier(.25, .8, .5, 1), color 1ms;
+    display: flex;
+  }
+
+  .directional-button-kGS8rA span {
+    width: 40%;
+    padding-bottom: 3px;
+  }
+
+  .play-button-GfHYHO span {
+    width: 80%;
+    height: 80%;
+  }
+
+  .stop-button-krMTsl span {
+    width: 50%;
+    height: 50%;
+  }
+
+  .directional-button-kGS8rA span .icon-k646_6 path {
+    stroke: none;
+    fill: #fff;
+  }
+
+  .stop-button-krMTsl:hover, .play-button-GfHYHO:hover, .stop-button-krMTsl:focus, .play-button-GfHYHO:focus, .directional-button-kGS8rA:hover, .directional-button-kGS8rA:focus {
+    color: #fff;
+    background-color: var(--primary-600);
+    transform: translateY(-5px);
+  }
+
+  .xs-lujClY {
+    width: 20px;
+    min-width: 20px;
+    height: 20px;
+    min-height: 20px;
+  }
+
+  .sm-Ay8zIA {
+    width: 30px;
+    min-width: 30px;
+    height: 30px;
+    min-height: 30px;
+  }
+
+  .md-wBr0Jw {
+    width: 40px;
+    min-width: 40px;
+    height: 40px;
+    min-height: 40px;
+  }
+
+  .lg-idpovR {
+    width: 50px;
+    min-width: 50px;
+    height: 50px;
+    min-height: 50px;
+  }
+
+  .xl-jHgaWE {
+    width: 40px;
+    min-width: 40px;
+    height: 40px;
+    min-height: 40px;
+  }
+
+  .up-fGNcdy:hover, .up-fGNcdy:focus {
+    transform: translateY(-5px);
+  }
+
+  .down-y1K3Vt span, .down-y1K3Vt span {
+    transform: rotate(180deg);
+  }
+
+  .down-y1K3Vt:hover, .down-y1K3Vt:focus {
+    transform: translateY(5px);
+  }
+
+  .left-B6s4j6 span, .left-B6s4j6 span {
+    transform: rotate(-90deg);
+  }
+
+  .left-B6s4j6:hover, .left-B6s4j6:focus {
+    transform: translateX(-5px);
+  }
+
+  .right-nFxLqo span, .right-nFxLqo span {
+    transform: rotate(90deg);
+  }
+
+  .right-nFxLqo:hover, .right-nFxLqo:focus {
+    transform: translateX(5px);
+  }
+
+  :is(.dark .play-button-GfHYHO, .dark .stop-button-krMTsl, .dark .directional-button-kGS8rA) {
+    background-color: var(--primary-500);
+  }
+
+  :is(.dark .play-button-GfHYHO:hover, .dark .stop-button-krMTsl:hover, .dark .play-button-GfHYHO:focus, .dark .stop-button-krMTsl:focus, .dark .directional-button-kGS8rA:hover, .dark .directional-button-kGS8rA:focus) {
+    color: #fff;
+    background-color: var(--primary-600);
+  }
+}
+

package/dist/components/button/copy-button.d.ts

@@ -0,0 +1,12 @@
+import type React from 'react';
+import type { ButtonProps } from './button.js';
+interface CopyButtonProps extends Omit<ButtonProps, 'children'> {
+    text: string;
+    hoverText?: string;
+    copiedText?: string;
+    containerClassName?: string;
+    svgClassName?: string;
+}
+export declare function CopyButton({ text, hoverText, copiedText, variant, size, intent, fullWidth, ripple, className, containerClassName, svgClassName, ...rest }: CopyButtonProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=copy-button.d.ts.map

package/dist/components/button/copy-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy-button.d.ts","sourceRoot":"","sources":["../../../src/components/button/copy-button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAS9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAI9C,UAAU,eAAgB,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IAC7D,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,SAAkB,EAClB,UAAsB,EACtB,OAAO,EACP,IAAW,EACX,MAAM,EACN,SAAS,EACT,MAAM,EACN,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,GAAG,IAAI,EACR,EAAE,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAyDrC"}

package/dist/components/button/copy-button.js

@@ -0,0 +1,57 @@
+'use client'
+import { jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import classnames from "classnames";
+import { CopyIcon } from "../../icons/index.js";
+import { Tooltip } from "../tooltip/tooltip.js";
+import { Button } from "./button.js";
+import copy_button_module from "./copy-button.module.js";
+function CopyButton({ text, hoverText = 'Copy', copiedText = 'Copied!', variant, size = 'sm', intent, fullWidth, ripple, className, containerClassName, svgClassName, ...rest }) {
+    const [copied, setCopied] = useState(void 0);
+    const handleCopied = ()=>{
+        if (null != navigator.clipboard && null != navigator.permissions) navigator.clipboard.writeText(text).then(()=>{
+            setCopied(true);
+        });
+        else if (document.queryCommandSupported('copy')) {
+            const element = document.createElement('textarea');
+            element.value = text;
+            document.body.appendChild(element);
+            element.select();
+            document.execCommand('copy');
+            document.body.removeChild(element);
+            setCopied(true);
+        }
+    };
+    useEffect(()=>{
+        if (true === copied) setTimeout(()=>{
+            setCopied(void 0);
+        }, 900);
+    });
+    const svgColor = 'noeffect' === intent || 'secondary' === intent || 'warning' === intent || 'outlined' === variant || 'text' === variant ? copy_button_module["copy-button-foreground"] : copy_button_module["copy-button-foreground-reversed"];
+    const tooltipText = null != copied && copied ? copiedText : hoverText;
+    return /*#__PURE__*/ jsx("div", {
+        className: classnames(copy_button_module["copy-button-container"], containerClassName),
+        children: /*#__PURE__*/ jsx(Tooltip, {
+            side: "top",
+            sideOffset: 2,
+            text: tooltipText,
+            open: copied,
+            children: /*#__PURE__*/ jsx(Button, {
+                variant: variant,
+                size: size,
+                intent: intent,
+                fullWidth: fullWidth,
+                ripple: ripple,
+                className: classnames(copy_button_module["copy-button"], className),
+                onClick: handleCopied,
+                ...rest,
+                children: /*#__PURE__*/ jsx(CopyIcon, {
+                    svgClassName: classnames(svgColor, svgClassName),
+                    width: "18px",
+                    height: "18px"
+                })
+            })
+        })
+    });
+}
+export { CopyButton };

package/dist/components/button/copy-button.module.js

@@ -0,0 +1,13 @@
+import "./copy-button_module.css";
+const copy_button_module = {
+    "copy-button-container": "copy-button-container-vCNz8o",
+    copyButtonContainer: "copy-button-container-vCNz8o",
+    "copy-button": "copy-button-oa4bdj",
+    copyButton: "copy-button-oa4bdj",
+    "copy-button-foreground": "copy-button-foreground-peibK_",
+    copyButtonForeground: "copy-button-foreground-peibK_",
+    "copy-button-foreground-reversed": "copy-button-foreground-reversed-oeTW7Z",
+    copyButtonForegroundReversed: "copy-button-foreground-reversed-oeTW7Z",
+    dark: "dark-M9uAd8"
+};
+export { copy_button_module as default };

package/dist/components/button/copy-button_module.css

@@ -0,0 +1,30 @@
+@layer infonomic-base, infonomic-utilities, infonomic-theme, infonomic-typography;
+
+@layer infonomic-components {
+  .copy-button-container-vCNz8o {
+    display: inline-block;
+  }
+
+  .copy-button-oa4bdj {
+    width: 32px;
+    min-width: 32px;
+    height: 32px;
+  }
+
+  .copy-button-foreground-peibK_ {
+    fill: var(--gray-700);
+  }
+
+  .copy-button-foreground-reversed-oeTW7Z {
+    fill: var(--gray-200);
+  }
+
+  .dark-M9uAd8 .copy-button-foreground-peibK_ {
+    fill: var(--gray-200);
+  }
+
+  .dark-M9uAd8 .copy-button-foreground-reversed-oeTW7Z {
+    fill: var(--gray-700);
+  }
+}
+

package/dist/components/button/icon-button.d.ts

@@ -0,0 +1,9 @@
+import type React from 'react';
+import type { ButtonProps } from './button.js';
+type IconButtonProps<C extends React.ElementType = 'button'> = ButtonProps<C> & {
+    square?: boolean;
+    round?: boolean;
+};
+export declare const IconButton: <C extends React.ElementType = "button">({ square, round, variant, size, intent, className, children, ...rest }: IconButtonProps<C>) => React.JSX.Element;
+export {};
+//# sourceMappingURL=icon-button.d.ts.map

package/dist/components/button/icon-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../../src/components/button/icon-button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAI9C,KAAK,eAAe,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG;IAC9E,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,wEAShE,eAAe,CAAC,CAAC,CAAC,sBAYpB,CAAA"}

package/dist/components/button/icon-button.js

@@ -0,0 +1,18 @@
+'use client'
+import { jsx } from "react/jsx-runtime";
+import classnames from "classnames";
+import { Button } from "./button.js";
+import button_module from "./button.module.js";
+const IconButton = ({ square = false, round = true, variant, size = 'sm', intent, className, children, ...rest })=>/*#__PURE__*/ jsx(Button, {
+        variant: variant,
+        size: size,
+        intent: intent,
+        className: classnames({
+            [button_module.square]: square
+        }, {
+            [button_module.round]: !square && round
+        }, className),
+        ...rest,
+        children: children
+    });
+export { IconButton };

package/dist/components/button/index.d.ts

@@ -0,0 +1,6 @@
+export * from './button';
+export * from './icon-button';
+export * from './copy-button';
+export * from './control-buttons';
+export * from './button-group';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,eAAe,CAAA;AAC7B,cAAc,mBAAmB,CAAA;AACjC,cAAc,gBAAgB,CAAA"}

package/dist/components/button/index.js

@@ -0,0 +1,5 @@
+export * from "./button.js";
+export * from "./icon-button.js";
+export * from "./copy-button.js";
+export * from "./control-buttons.js";
+export * from "./button-group.js";

package/dist/components/calendar/calendar.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { type DayPickerProps } from 'react-day-picker';
+export type CalendarProps = DayPickerProps & {
+    ref?: React.RefObject<HTMLDivElement>;
+    captionLabelClassName?: string;
+    dayClassName?: string;
+    dayButtonClassName?: string;
+    dropdownsClassName?: string;
+    footerClassName?: string;
+    monthClassName?: string;
+    monthCaptionClassName?: string;
+    monthGridClassName?: string;
+    monthsClassName?: string;
+    weekClassName?: string;
+    weekdayClassName?: string;
+    weekdaysClassName?: string;
+    rangeEndClassName?: string;
+    rangeMiddleClassName?: string;
+    rangeStartClassName?: string;
+    selectedClassName?: string;
+    disabledClassName?: string;
+    hiddenClassName?: string;
+    outsideClassName?: string;
+    todayClassName?: string;
+    selectTriggerClassName?: string;
+};
+export declare function Calendar({ ref, className, classNames, hideNavigation, showOutsideDays, components: customComponents, ...props }: CalendarProps): React.JSX.Element;
+export declare namespace Calendar {
+    var displayName: string;
+}
+//# sourceMappingURL=calendar.d.ts.map

package/dist/components/calendar/calendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/calendar.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAEL,KAAK,cAAc,EAEpB,MAAM,kBAAkB,CAAA;AAOzB,MAAM,MAAM,aAAa,GAAG,cAAc,GAAG;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;IACrC,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,sBAAsB,CAAC,EAAE,MAAM,CAAA;CAChC,CAAA;AAED,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,SAAS,EACT,UAAU,EACV,cAAc,EACd,eAAsB,EACtB,UAAU,EAAE,gBAAgB,EAC5B,GAAG,KAAK,EACT,EAAE,aAAa,qBAmHf;yBA3He,QAAQ"}

package/dist/components/calendar/calendar.js

@@ -0,0 +1,122 @@
+'use client'
+import { jsx, jsxs } from "react/jsx-runtime";
+import classnames from "classnames";
+import { Select } from "radix-ui";
+import { useCallback } from "react";
+import { DayPicker } from "react-day-picker";
+import { ChevronsUpDown } from "../../icons/chevrons-up-down.js";
+import { Button } from "../button/button.js";
+import { ScrollArea } from "../scroll-area/scroll-area.js";
+import calendar_module from "./calendar.module.js";
+function Calendar({ ref, className, classNames, hideNavigation, showOutsideDays = true, components: customComponents, ...props }) {
+    const _monthsClassName = classnames(calendar_module.months, props.monthsClassName);
+    const _monthCaptionClassName = classnames(calendar_module["months-caption"], props.monthCaptionClassName);
+    const _dropdownsClassName = classnames(calendar_module.dropdowns, props.dropdownsClassName);
+    const _footerClassName = classnames(calendar_module.footer, props.footerClassName);
+    const _weekdaysClassName = classnames(calendar_module.weekdays, props.weekdaysClassName);
+    const _weekdayClassName = classnames(calendar_module.weekday, props.weekdayClassName);
+    const _captionLabelClassName = classnames(calendar_module["caption-label"], props.captionLabelClassName);
+    const _monthGridClassName = classnames(calendar_module["month-grid"], props.monthGridClassName);
+    const _weekClassName = classnames(calendar_module.week, props.weekClassName);
+    const _dayClassName = classnames(calendar_module.day, props.dayClassName);
+    const _dayButtonClassName = classnames(calendar_module["day-button"], props.dayButtonClassName);
+    const buttonRangeClassName = classnames(calendar_module["button-range"]);
+    const _rangeStartClassName = classnames(buttonRangeClassName, calendar_module["range-start"], props.rangeStartClassName);
+    const _rangeEndClassName = classnames(buttonRangeClassName, calendar_module["range-end"], props.rangeEndClassName);
+    const _rangeMiddleClassName = classnames(calendar_module["range-middle"], props.rangeMiddleClassName);
+    const _selectedClassName = classnames(calendar_module["day-selected"], props.selectedClassName);
+    const _todayClassName = classnames(calendar_module.today, props.todayClassName);
+    const _outsideClassName = classnames(calendar_module.outside, props.outsideClassName);
+    const _disabledClassName = classnames(calendar_module.disabled, props.disabledClassName);
+    const _hiddenClassName = classnames(calendar_module.hidden, props.hiddenClassName);
+    const Dropdown = useCallback(({ value, onChange, options })=>{
+        const selected = null == options ? void 0 : options.find((option)=>option.value === value);
+        const handleChange = (value)=>{
+            const changeEvent = {
+                target: {
+                    value
+                }
+            };
+            null == onChange || onChange(changeEvent);
+        };
+        return /*#__PURE__*/ jsxs(Select.Root, {
+            value: null == value ? void 0 : value.toString(),
+            onValueChange: (value)=>{
+                handleChange(value);
+            },
+            children: [
+                /*#__PURE__*/ jsx(Select.Trigger, {
+                    asChild: true,
+                    children: /*#__PURE__*/ jsxs(Button, {
+                        variant: "outlined",
+                        size: "sm",
+                        className: classnames(calendar_module["select-trigger"], props.selectTriggerClassName),
+                        children: [
+                            /*#__PURE__*/ jsx(Select.Value, {
+                                children: null == selected ? void 0 : selected.label
+                            }),
+                            /*#__PURE__*/ jsx(ChevronsUpDown, {
+                                height: "18px",
+                                width: "18px",
+                                svgClassName: calendar_module["select-chevrons"]
+                            })
+                        ]
+                    })
+                }),
+                /*#__PURE__*/ jsx(Select.Content, {
+                    className: calendar_module["select-content"],
+                    position: "popper",
+                    sideOffset: 4,
+                    align: "center",
+                    children: /*#__PURE__*/ jsx(ScrollArea, {
+                        className: classnames(calendar_module["scroll-area"]),
+                        children: null == options ? void 0 : options.map(({ value, label, disabled }, id)=>/*#__PURE__*/ jsx(Select.Item, {
+                                className: calendar_module["select-item"],
+                                value: null == value ? void 0 : value.toString(),
+                                disabled: disabled,
+                                children: label
+                            }, `${value}-${id}`))
+                    })
+                })
+            ]
+        });
+    }, [
+        props.selectTriggerClassName
+    ]);
+    return /*#__PURE__*/ jsx(DayPicker, {
+        showOutsideDays: showOutsideDays,
+        hideNavigation: true,
+        className: classnames(calendar_module["day-picker"], className),
+        classNames: {
+            caption_label: _captionLabelClassName,
+            day: _dayClassName,
+            day_button: _dayButtonClassName,
+            dropdowns: _dropdownsClassName,
+            footer: _footerClassName,
+            month: props.monthClassName,
+            month_caption: _monthCaptionClassName,
+            month_grid: _monthGridClassName,
+            months: _monthsClassName,
+            week: _weekClassName,
+            weekday: _weekdayClassName,
+            weekdays: _weekdaysClassName,
+            range_end: _rangeEndClassName,
+            range_middle: _rangeMiddleClassName,
+            range_start: _rangeStartClassName,
+            selected: _selectedClassName,
+            disabled: _disabledClassName,
+            hidden: _hiddenClassName,
+            outside: _outsideClassName,
+            today: _todayClassName,
+            nav: 'hidden',
+            ...classNames
+        },
+        components: {
+            Dropdown,
+            ...customComponents
+        },
+        ...props
+    });
+}
+Calendar.displayName = 'Calendar';
+export { Calendar };

package/dist/components/calendar/calendar.module.js

@@ -0,0 +1,45 @@
+import "./calendar_module.css";
+const calendar_module = {
+    "day-picker": "day-picker-HxQ06v",
+    dayPicker: "day-picker-HxQ06v",
+    months: "months-J7TsUl",
+    "months-caption": "months-caption-PiBupQ",
+    monthsCaption: "months-caption-PiBupQ",
+    dropdowns: "dropdowns-VSCOqg",
+    "select-trigger": "select-trigger-WeVDcK",
+    selectTrigger: "select-trigger-WeVDcK",
+    "select-content": "select-content-aP7E2D",
+    selectContent: "select-content-aP7E2D",
+    "select-item": "select-item-cZh04s",
+    selectItem: "select-item-cZh04s",
+    "select-chevrons": "select-chevrons-dzIT2u",
+    selectChevrons: "select-chevrons-dzIT2u",
+    "scroll-area": "scroll-area-RHBUqm",
+    scrollArea: "scroll-area-RHBUqm",
+    disabled: "disabled-LuShHt",
+    hidden: "hidden-MqCEoh",
+    outside: "outside-xAO7ei",
+    footer: "footer-svWbOa",
+    weekdays: "weekdays-P7Wn2B",
+    weekday: "weekday-sPtrWT",
+    "caption-label": "caption-label-inrEqz",
+    captionLabel: "caption-label-inrEqz",
+    "month-grid": "month-grid-BQtPCl",
+    monthGrid: "month-grid-BQtPCl",
+    week: "week-y9eP5X",
+    day: "day-r6Pemd",
+    today: "today-sC2iTu",
+    "day-selected": "day-selected-tJv7Z9",
+    daySelected: "day-selected-tJv7Z9",
+    "day-button": "day-button-UTNEY0",
+    dayButton: "day-button-UTNEY0",
+    "button-range": "button-range-m7XSpc",
+    buttonRange: "button-range-m7XSpc",
+    "range-start": "range-start-LrEVeH",
+    rangeStart: "range-start-LrEVeH",
+    "range-end": "range-end-sbDF9w",
+    rangeEnd: "range-end-sbDF9w",
+    "range-middle": "range-middle-Ptrd1e",
+    rangeMiddle: "range-middle-Ptrd1e"
+};
+export { calendar_module as default };