@byline/ui 0.9.3 → 0.10.1

package/dist/widgets/datepicker/datepicker.d.ts

@@ -0,0 +1,38 @@
+/**
+ * @file DatePicker component using react-day-picker and @base-ui/react
+ * Portions copyright (c) 2023 Maliksidk19 licensed under the MIT
+ * license found in the LICENSE file in the root directory of this source tree.
+ * of https://github.com/Maliksidk19/shadcn-datetime-picker/
+ */
+import type React from 'react';
+import type { Intent, Size, Variant } from '../../components/inputs/@types/input.js';
+export interface DatePickerProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    id: string;
+    name: string;
+    label?: string;
+    required?: boolean;
+    initialValue?: Date | null;
+    mode?: 'date' | 'datetime';
+    yearsInFuture?: number;
+    yearsInPast?: number;
+    variant?: Variant;
+    inputSize?: Size;
+    inputWrapperClassName?: string;
+    inputClassName?: string;
+    intent?: Intent;
+    containerClassName?: string;
+    contentClassName?: string;
+    helpText?: string;
+    errorText?: string;
+    ariaLabelForSearch?: string;
+    ariaLabelForClear?: string;
+    onClear?: () => void;
+    onDateChange?: (value: Date | null) => void;
+    validatorFn?: (value: Date) => {
+        valid: boolean;
+        value: Date;
+    };
+    placeHolderText?: string;
+}
+export declare function DatePicker({ id, name, label, required, initialValue, mode, yearsInFuture, yearsInPast, variant, intent, inputSize, inputClassName, inputWrapperClassName, containerClassName, contentClassName, onClear, onDateChange, validatorFn, helpText, errorText, placeHolderText, ariaLabelForSearch, ariaLabelForClear, ...rest }: DatePickerProps): React.JSX.Element;
+//# sourceMappingURL=datepicker.d.ts.map

package/dist/widgets/datepicker/datepicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datepicker.d.ts","sourceRoot":"","sources":["../../../src/widgets/datepicker/datepicker.tsx"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAgB9B,OAAO,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yCAAyC,CAAA;AAEpF,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IAClF,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,IAAI,CAAA;IAChB,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAA;IAC3C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK;QAC7B,KAAK,EAAE,OAAO,CAAA;QACd,KAAK,EAAE,IAAI,CAAA;KACZ,CAAA;IACD,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB;AAED,wBAAgB,UAAU,CAAC,EACzB,EAAE,EACF,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,IAAiB,EACjB,aAAiB,EACjB,WAAgB,EAChB,OAAO,EACP,MAAM,EACN,SAAS,EACT,cAAc,EACd,qBAAqB,EACrB,kBAAkB,EAClB,gBAAgB,EAChB,OAAkB,EAClB,YAAuB,EACvB,WAAW,EACX,QAAQ,EACR,SAAS,EACT,eAAoB,EACpB,kBAA2B,EAC3B,iBAA2B,EAC3B,GAAG,IAAI,EACR,EAAE,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAiRrC"}

package/dist/widgets/datepicker/datepicker.js

@@ -0,0 +1,262 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Popover } from "@base-ui/react/popover";
+import classnames from "classnames";
+import { format } from "date-fns";
+import { Button } from "../../components/button/button.js";
+import { IconButton } from "../../components/button/icon-button.js";
+import { Calendar } from "../../components/inputs/calendar.js";
+import { Input } from "../../components/inputs/input.js";
+import { InputAdornment } from "../../components/inputs/input-adornment.js";
+import { ScrollArea } from "../../components/scroll-area/scroll-area.js";
+import { CalendarIcon } from "../../icons/calendar-icon.js";
+import { CloseIcon } from "../../icons/close-icon.js";
+import datepicker_module from "./datepicker.module.js";
+function DatePicker({ id, name, label, required, initialValue, mode = 'datetime', yearsInFuture = 1, yearsInPast = 10, variant, intent, inputSize, inputClassName, inputWrapperClassName, containerClassName, contentClassName, onClear = ()=>{}, onDateChange = ()=>{}, validatorFn, helpText, errorText, placeHolderText = '', ariaLabelForSearch = 'date', ariaLabelForClear = 'clear', ...rest }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [time, setTime] = useState('08:00');
+    const [date, setDate] = useState(()=>{
+        if (initialValue) return initialValue;
+        if (null == initialValue && true === required) return new Date();
+        return null;
+    });
+    const [month, setMonth] = useState(date);
+    const calendarRef = useRef(null);
+    const inputRef = useRef(null);
+    const hasInitialized = useRef(false);
+    const handleClear = ()=>{
+        if (inputRef?.current != null) inputRef.current.value = '';
+        setDate(null);
+        onDateChange(null);
+        onClear();
+    };
+    const handleOnDateChange = (value)=>{
+        if (null != onDateChange && 'function' == typeof onDateChange) onDateChange(value);
+    };
+    const handleOnKeyDown = (e)=>{
+        if ('ArrowDown' === e.key) {
+            e.preventDefault();
+            setIsOpen(true);
+        }
+    };
+    useEffect(()=>{
+        if (null == initialValue && null != date && true === required && false === hasInitialized.current) {
+            hasInitialized.current = true;
+            onDateChange(date);
+        }
+    });
+    return /*#__PURE__*/ jsxs("div", {
+        className: classnames('infonomic-datepicker-container', datepicker_module.container, containerClassName),
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    gap: 'var(--spacing-8)'
+                },
+                children: /*#__PURE__*/ jsx(Input, {
+                    id: id,
+                    label: label,
+                    readOnly: true,
+                    required: required,
+                    name: name,
+                    variant: variant,
+                    intent: intent,
+                    inputSize: inputSize,
+                    ref: inputRef,
+                    className: classnames('infonomic-datepicker-input', datepicker_module.input, inputClassName),
+                    inputWrapperClassName: classnames('infonomic-datepicker-input-wrapper', datepicker_module["input-wrapper"], inputWrapperClassName),
+                    onKeyDown: handleOnKeyDown,
+                    onClick: (e)=>{
+                        e.preventDefault();
+                        e.stopPropagation();
+                        setIsOpen(true);
+                    },
+                    value: date ? format(date, 'datetime' === mode ? 'PP HH:mm' : 'PP') : '',
+                    placeHolder: placeHolderText,
+                    helpText: helpText,
+                    disabled: false,
+                    error: false,
+                    endAdornment: /*#__PURE__*/ jsxs(InputAdornment, {
+                        position: "end",
+                        children: [
+                            /*#__PURE__*/ jsx(IconButton, {
+                                role: "button",
+                                intent: "noeffect",
+                                variant: "text",
+                                "arial-label": ariaLabelForClear,
+                                size: "xs",
+                                onClick: ()=>{
+                                    handleClear();
+                                },
+                                children: /*#__PURE__*/ jsx(CloseIcon, {
+                                    width: "14px",
+                                    height: "14px"
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(IconButton, {
+                                role: "button",
+                                intent: "noeffect",
+                                variant: "text",
+                                "arial-label": ariaLabelForClear,
+                                size: "xs",
+                                onClick: ()=>{
+                                    setIsOpen(true);
+                                },
+                                children: /*#__PURE__*/ jsx(CalendarIcon, {
+                                    width: "18px",
+                                    height: "18px"
+                                })
+                            })
+                        ]
+                    }),
+                    ...rest
+                })
+            }),
+            /*#__PURE__*/ jsxs(Popover.Root, {
+                open: isOpen,
+                onOpenChange: setIsOpen,
+                children: [
+                    /*#__PURE__*/ jsx(Popover.Trigger, {
+                        nativeButton: false,
+                        render: /*#__PURE__*/ jsx("div", {
+                            style: {
+                                position: 'relative',
+                                height: '1px'
+                            }
+                        }),
+                        children: /*#__PURE__*/ jsx("span", {
+                            className: "sr-only",
+                            children: "Select date"
+                        })
+                    }),
+                    /*#__PURE__*/ jsx(Popover.Portal, {
+                        children: /*#__PURE__*/ jsx(Popover.Positioner, {
+                            sideOffset: 5,
+                            children: /*#__PURE__*/ jsxs(Popover.Popup, {
+                                className: classnames('infonomic-datepicker-content', datepicker_module.content, contentClassName),
+                                children: [
+                                    /*#__PURE__*/ jsxs("div", {
+                                        className: classnames('infonomic-datepicker-content-components', datepicker_module["content-components"]),
+                                        children: [
+                                            /*#__PURE__*/ jsx("div", {
+                                                ref: calendarRef,
+                                                children: /*#__PURE__*/ jsx(Calendar, {
+                                                    mode: "single",
+                                                    required: true,
+                                                    captionLayout: "dropdown",
+                                                    selected: date ?? void 0,
+                                                    month: month ?? void 0,
+                                                    onMonthChange: setMonth,
+                                                    onSelect: (selectedDate)=>{
+                                                        if (selectedDate) {
+                                                            const [hours, minutes] = time.split(':');
+                                                            selectedDate.setHours(Number.parseInt(hours, 10), Number.parseInt(minutes, 10));
+                                                            setDate(selectedDate);
+                                                            setMonth(selectedDate);
+                                                            handleOnDateChange(selectedDate);
+                                                        }
+                                                    },
+                                                    startMonth: new Date(new Date().getFullYear() - yearsInPast, 0),
+                                                    endMonth: new Date(new Date().getFullYear() + yearsInFuture, 0)
+                                                })
+                                            }),
+                                            'datetime' === mode && /*#__PURE__*/ jsx("div", {
+                                                className: datepicker_module["time-picker-container"],
+                                                children: /*#__PURE__*/ jsx(ScrollArea, {
+                                                    className: datepicker_module["time-picker-scroll-area"],
+                                                    children: /*#__PURE__*/ jsx("div", {
+                                                        className: datepicker_module["time-picker"],
+                                                        children: Array.from({
+                                                            length: 96
+                                                        }).map((_, i)=>{
+                                                            const hour = Math.floor(i / 4).toString().padStart(2, '0');
+                                                            const minute = (i % 4 * 15).toString().padStart(2, '0');
+                                                            const timeValue = `${hour}:${minute}`;
+                                                            return /*#__PURE__*/ jsx(Button, {
+                                                                size: "sm",
+                                                                className: datepicker_module["time-picker-button"],
+                                                                variant: "outlined",
+                                                                onClick: ()=>{
+                                                                    setTime(timeValue);
+                                                                    if (date) {
+                                                                        const newDate = new Date(date.getTime());
+                                                                        newDate.setHours(Number.parseInt(hour, 10), Number.parseInt(minute, 10), 0);
+                                                                        setDate(newDate);
+                                                                        handleOnDateChange(newDate);
+                                                                    }
+                                                                },
+                                                                children: timeValue
+                                                            }, i);
+                                                        })
+                                                    })
+                                                })
+                                            })
+                                        ]
+                                    }),
+                                    /*#__PURE__*/ jsxs("div", {
+                                        className: classnames('infonomic-datepicker-status-and-actions', datepicker_module["status-and-actions"]),
+                                        children: [
+                                            /*#__PURE__*/ jsx("div", {
+                                                className: classnames('infonomic-datepicker-content-status', datepicker_module["content-status"]),
+                                                children: date ? format(date, 'datetime' === mode ? 'PPPp' : 'PPP') : 'No date selected'
+                                            }),
+                                            /*#__PURE__*/ jsxs("div", {
+                                                className: classnames('infonomic-datepicker-content-actions', datepicker_module["content-actions"]),
+                                                children: [
+                                                    /*#__PURE__*/ jsx("div", {
+                                                        children: /*#__PURE__*/ jsx(Button, {
+                                                            variant: "outlined",
+                                                            size: "sm",
+                                                            className: classnames('infonomic-datepicker-content-actions-button', datepicker_module["content-actions-button"]),
+                                                            onClick: ()=>{
+                                                                const today = new Date();
+                                                                setDate(today);
+                                                                setMonth(today);
+                                                                handleOnDateChange(today);
+                                                            },
+                                                            children: "Today"
+                                                        })
+                                                    }),
+                                                    /*#__PURE__*/ jsxs("div", {
+                                                        style: {
+                                                            display: 'flex',
+                                                            gap: 'var(--spacing-12)'
+                                                        },
+                                                        children: [
+                                                            /*#__PURE__*/ jsx(Button, {
+                                                                size: "sm",
+                                                                intent: "noeffect",
+                                                                className: classnames('infonomic-datepicker-content-actions-button', datepicker_module["content-actions-button"]),
+                                                                onClick: ()=>{
+                                                                    setIsOpen(false);
+                                                                },
+                                                                children: "Cancel"
+                                                            }),
+                                                            /*#__PURE__*/ jsx(Button, {
+                                                                variant: "outlined",
+                                                                size: "sm",
+                                                                className: classnames('infonomic-datepicker-content-actions-button', datepicker_module["content-actions-button"]),
+                                                                onClick: ()=>{
+                                                                    setIsOpen(false);
+                                                                    handleOnDateChange(date);
+                                                                },
+                                                                children: "Select"
+                                                            })
+                                                        ]
+                                                    })
+                                                ]
+                                            })
+                                        ]
+                                    })
+                                ]
+                            })
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+}
+export { DatePicker };

package/dist/widgets/datepicker/datepicker.module.js

@@ -0,0 +1,33 @@
+import "./datepicker_module.css";
+const datepicker_module = {
+    container: "container-u5_VUp",
+    input: "input-SaODq9",
+    "input-wrapper": "input-wrapper-qwAckv",
+    inputWrapper: "input-wrapper-qwAckv",
+    content: "content-UK9iLF",
+    slideDownAndFade: "slideDownAndFade-dohHTE",
+    slideLeftAndFade: "slideLeftAndFade-ugM6Hs",
+    slideUpAndFade: "slideUpAndFade-bAwQJS",
+    slideRightAndFade: "slideRightAndFade-o0jl7q",
+    "content-components": "content-components-jcG649",
+    contentComponents: "content-components-jcG649",
+    "status-and-actions": "status-and-actions-Px_b57",
+    statusAndActions: "status-and-actions-Px_b57",
+    "content-status": "content-status-XRGKXg",
+    contentStatus: "content-status-XRGKXg",
+    "content-actions": "content-actions-GVU14S",
+    contentActions: "content-actions-GVU14S",
+    "content-actions-button": "content-actions-button-YCN1ho",
+    contentActionsButton: "content-actions-button-YCN1ho",
+    arrow: "arrow-mhGcHb",
+    close: "close-bJApom",
+    "time-picker-container": "time-picker-container-sVEGKe",
+    timePickerContainer: "time-picker-container-sVEGKe",
+    "time-picker-scroll-area": "time-picker-scroll-area-q5TiRD",
+    timePickerScrollArea: "time-picker-scroll-area-q5TiRD",
+    "time-picker": "time-picker-Xhertk",
+    timePicker: "time-picker-Xhertk",
+    "time-picker-button": "time-picker-button-WA4IUz",
+    timePickerButton: "time-picker-button-WA4IUz"
+};
+export default datepicker_module;

package/dist/widgets/datepicker/datepicker_module.css

@@ -0,0 +1,188 @@
+@layer byline-base, byline-utilities, byline-theme;
+
+@layer byline-components {
+  :is(.container-u5_VUp, .infonomic-datepicker-container) {
+    position: relative;
+  }
+
+  :is(.input-SaODq9, .input-wrapper-qwAckv, .infonomic-datepicker-input, .infonomic-datepicker-input-wrapper) {
+    width: 100%;
+  }
+
+  :is(.content-UK9iLF, .infonomic-datepicker-content) {
+    z-index: 50;
+    width: 100%;
+    padding-top: var(--spacing-16);
+    padding-bottom: var(--spacing-8);
+    padding-left: var(--spacing-8);
+    padding-right: var(--spacing-4);
+    background-color: var(--background);
+    border: 1px solid var(--border-color);
+    box-shadow: var(--shadow-md);
+    will-change: transform, opacity;
+    border-radius: 4px;
+    animation-duration: .4s;
+    animation-timing-function: cubic-bezier(.16, 1, .3, 1);
+  }
+
+  :is(.content-UK9iLF, .infonomic-datepicker-content):focus {
+    box-shadow: var(--shadow-md);
+  }
+
+  :is(.content-UK9iLF, .infonomic-datepicker-content)[data-open][data-side="top"] {
+    animation-name: slideDownAndFade-dohHTE;
+  }
+
+  :is(.content-UK9iLF, .infonomic-datepicker-content)[data-open][data-side="right"] {
+    animation-name: slideLeftAndFade-ugM6Hs;
+  }
+
+  :is(.content-UK9iLF, .infonomic-datepicker-content)[data-open][data-side="bottom"] {
+    animation-name: slideUpAndFade-bAwQJS;
+  }
+
+  :is(.content-UK9iLF, .infonomic-datepicker-content)[data-open][data-side="left"] {
+    animation-name: slideRightAndFade-o0jl7q;
+  }
+
+  :is(.dark, [data-theme="dark"]) .content-UK9iLF {
+    background: var(--canvas-800);
+  }
+
+  :is(.content-components-jcG649, .infonomic-datepicker-content-components) {
+    gap: var(--spacing-8);
+    width: 100%;
+    display: flex;
+  }
+
+  :is(.status-and-actions-Px_b57, .infonomic-datepicker-status-and-actions) {
+    flex-direction: column;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    display: flex;
+  }
+
+  :is(.content-status-XRGKXg, .infonomic-datepicker-content-status) {
+    padding-left: var(--spacing-16);
+    padding-right: var(--spacing-8);
+    font-size: var(--font-size-sm);
+    color: var(--foreground);
+    align-items: center;
+    width: 100%;
+    display: flex;
+  }
+
+  :is(.content-actions-GVU14S, .infonomic-datepicker-content-actions) {
+    margin-top: var(--spacing-12);
+    padding-left: var(--spacing-16);
+    padding-right: var(--spacing-6);
+    justify-content: space-between;
+    gap: var(--spacing-8);
+    flex-direction: row;
+    width: 100%;
+    display: flex;
+  }
+
+  :is(.content-actions-button-YCN1ho, .infonomic-datepicker-content-actions-button) {
+    --ring-color: var(--violet-7);
+  }
+
+  :is(.arrow-mhGcHb, .infonomic-datepicker-arrow) {
+    fill: var(--gray-50);
+  }
+
+  :is(.close-bJApom, .infonomic-datepicker-close) {
+    all: unset;
+    width: 25px;
+    height: 25px;
+    color: var(--violet-11);
+    border-radius: 100%;
+    justify-content: center;
+    align-items: center;
+    font-family: inherit;
+    display: inline-flex;
+    position: absolute;
+    top: 5px;
+    right: 5px;
+  }
+
+  :is(.close-bJApom, .infonomic-datepicker-close):hover {
+    background-color: var(--primary-400);
+  }
+
+  :is(.close-bJApom, .infonomic-datepicker-close):focus {
+    box-shadow: 0 0 0 2px var(--primary-600);
+  }
+
+  :is(.time-picker-container-sVEGKe, .infonomic-datepicker-time-picker-container) {
+    width: 80px;
+    margin: .6rem .5rem 1rem 0;
+  }
+
+  :is(.time-picker-scroll-area-q5TiRD, .infonomic-datepicker-time-picker-scroll-area) {
+    height: 280px;
+    padding-right: var(--spacing-16);
+  }
+
+  :is(.time-picker-Xhertk, .infonomic-datepicker-time-picker) {
+    padding-left: var(--spacing-4);
+    padding-right: var(--spacing-4);
+    flex-direction: column;
+    gap: .5rem;
+    display: flex;
+  }
+
+  :is(.time-picker-button-WA4IUz, .infonomic-datepicker-time-picker-button) {
+    width: 100%;
+  }
+
+  @keyframes slideUpAndFade-bAwQJS {
+    from {
+      opacity: 0;
+      transform: translateY(2px);
+    }
+
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  @keyframes slideRightAndFade-o0jl7q {
+    from {
+      opacity: 0;
+      transform: translateX(-2px);
+    }
+
+    to {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+
+  @keyframes slideDownAndFade-dohHTE {
+    from {
+      opacity: 0;
+      transform: translateY(-2px);
+    }
+
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  @keyframes slideLeftAndFade-ugM6Hs {
+    from {
+      opacity: 0;
+      transform: translateX(2px);
+    }
+
+    to {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+}
+

package/dist/widgets/drawer/drawer-container.d.ts

@@ -0,0 +1,10 @@
+import type * as React from 'react';
+type DrawerContainerIntrinsicProps = React.JSX.IntrinsicElements['div'];
+export interface DrawerContainerProps extends DrawerContainerIntrinsicProps {
+    className?: string;
+}
+export declare function DrawerContainer({ ref, children, className, ...rest }: DrawerContainerProps & {
+    ref?: React.RefObject<HTMLDivElement>;
+}): React.JSX.Element;
+export {};
+//# sourceMappingURL=drawer-container.d.ts.map

package/dist/widgets/drawer/drawer-container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-container.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer-container.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAMnC,KAAK,6BAA6B,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAA;AACvE,MAAM,WAAW,oBAAqB,SAAQ,6BAA6B;IACzE,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,eAAe,CAAC,EAC9B,GAAG,EACH,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,oBAAoB,GAAG;IACxB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;CACtC,qBAUA"}

package/dist/widgets/drawer/drawer-container.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import classnames from "classnames";
+import drawer_module from "./drawer.module.js";
+function DrawerContainer({ ref, children, className, ...rest }) {
+    return /*#__PURE__*/ jsx("div", {
+        ref: ref,
+        className: classnames('infonomic-drawer-container', drawer_module["drawer-container"], className),
+        ...rest,
+        children: children
+    });
+}
+export { DrawerContainer };

package/dist/widgets/drawer/drawer-content.d.ts

@@ -0,0 +1,10 @@
+import type * as React from 'react';
+type DrawerContentIntrinsicProps = React.JSX.IntrinsicElements['div'];
+export interface DrawerContentProps extends DrawerContentIntrinsicProps {
+    className?: string;
+}
+export declare function DrawerContent({ ref, children, className, ...rest }: DrawerContentProps & {
+    ref?: React.RefObject<HTMLDivElement>;
+}): React.JSX.Element;
+export {};
+//# sourceMappingURL=drawer-content.d.ts.map

package/dist/widgets/drawer/drawer-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-content.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer-content.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAMnC,KAAK,2BAA2B,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAA;AACrE,MAAM,WAAW,kBAAmB,SAAQ,2BAA2B;IACrE,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,aAAa,CAAC,EAC5B,GAAG,EACH,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,kBAAkB,GAAG;IACtB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;CACtC,qBAUA"}

package/dist/widgets/drawer/drawer-content.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import classnames from "classnames";
+import drawer_module from "./drawer.module.js";
+function DrawerContent({ ref, children, className, ...rest }) {
+    return /*#__PURE__*/ jsx("div", {
+        ref: ref,
+        ...rest,
+        className: classnames('infonomic-drawer-content', drawer_module["drawer-content"], className),
+        children: children
+    });
+}
+export { DrawerContent };

package/dist/widgets/drawer/drawer-context.d.ts

@@ -0,0 +1,14 @@
+import type React from 'react';
+import type { ReactNode } from 'react';
+interface DrawerContextType {
+    drawers: string[];
+    addDrawer: (id: string) => void;
+    removeDrawer: (id: string) => void;
+}
+interface DrawerProviderProps {
+    children: ReactNode;
+}
+export declare const DrawerProvider: React.FC<DrawerProviderProps>;
+export declare function useDrawer(): DrawerContextType;
+export {};
+//# sourceMappingURL=drawer-context.d.ts.map

package/dist/widgets/drawer/drawer-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-context.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer-context.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,UAAU,iBAAiB;IACzB,OAAO,EAAE,MAAM,EAAE,CAAA;IACjB,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAQD,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAgBxD,CAAA;AAED,wBAAgB,SAAS,IAAI,iBAAiB,CAM7C"}

package/dist/widgets/drawer/drawer-context.js

@@ -0,0 +1,34 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useState } from "react";
+const DrawerContext = /*#__PURE__*/ createContext({
+    drawers: [],
+    addDrawer: ()=>{},
+    removeDrawer: ()=>{}
+});
+const DrawerProvider = ({ children })=>{
+    const [drawers, setDrawers] = useState([]);
+    const addDrawer = useCallback((id)=>{
+        setDrawers((prev)=>[
+                ...prev,
+                id
+            ]);
+    }, []);
+    const removeDrawer = useCallback((id)=>{
+        setDrawers((prev)=>prev.filter((drawerId)=>drawerId !== id));
+    }, []);
+    return /*#__PURE__*/ jsx(DrawerContext.Provider, {
+        value: {
+            drawers,
+            addDrawer,
+            removeDrawer
+        },
+        children: children
+    });
+};
+function useDrawer() {
+    const context = useContext(DrawerContext);
+    if (void 0 === context) throw new Error('useDrawer must be used within a DrawerProvider');
+    return context;
+}
+export { DrawerProvider, useDrawer };

package/dist/widgets/drawer/drawer-header.d.ts

@@ -0,0 +1,10 @@
+import type * as React from 'react';
+type DrawerHeaderIntrinsicProps = React.JSX.IntrinsicElements['div'];
+export interface DrawerHeaderProps extends DrawerHeaderIntrinsicProps {
+    className?: string;
+}
+export declare const DrawerHeader: ({ ref, children, className, ...rest }: DrawerHeaderProps & {
+    ref?: React.RefObject<HTMLDivElement>;
+}) => React.JSX.Element;
+export {};
+//# sourceMappingURL=drawer-header.d.ts.map

package/dist/widgets/drawer/drawer-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-header.d.ts","sourceRoot":"","sources":["../../../src/widgets/drawer/drawer-header.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAMnC,KAAK,0BAA0B,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAA;AACpE,MAAM,WAAW,iBAAkB,SAAQ,0BAA0B;IACnE,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,YAAY,GAAyB,uCAK/C,iBAAiB,GAAG;IACrB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;CACtC,sBAOA,CAAA"}