torch-glare 1.1.6 → 1.1.7

package/dist/src/shared/getDependenciesAndInstallNestedComponents.js

@@ -29,7 +29,7 @@ export function getDependenciesAndInstallNestedComponents(componentPath, install
         else if (moduleName &&
             moduleName.startsWith("../hooks") &&
             !installedDependencies.has(moduleName)) {
-            addHook(moduleName.slice(9) + ".tsx");
+            addHook(moduleName.slice(9) + ".ts");
         }
         // install required nested components
         else if (moduleName &&

package/dist/src/shared/getDependenciesAndInstallNestedComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"getDependenciesAndInstallNestedComponents.js","sourceRoot":"","sources":["../../../cli/src/shared/getDependenciesAndInstallNestedComponents.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,IAAI,CAAC;AACzB,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAEzC;;;;;GAKG;AAEH,MAAM,UAAU,yCAAyC,CACrD,aAAqB,EACrB,qBAAkC;IAElC,MAAM,gBAAgB,GAAG,EAAE,CAAC,YAAY,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;IACjE,MAAM,WAAW,GAAG,yCAAyC,CAAC;IAC9D,MAAM,qBAAqB,GAAG,IAAI,GAAG,EAAU,CAAC;IAEhD,IAAI,KAAK,CAAC;IACV,OAAO,CAAC,KAAK,GAAG,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC;QAC3D,MAAM,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;QAE5B,sCAAsC;QACtC,IAAI,UAAU,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;YACtF,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QAC1C,CAAC;QAED,oCAAoC;aAC/B,IACD,UAAU;YACV,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC;YACjC,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC;QACzC,CAAC;QAED,oCAAoC;aAC/B,IACD,UAAU;YACV,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC;YACjC,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC;QAC1C,CAAC;QACD,qCAAqC;aAChC,IACD,UAAU;YACV,CAAC,UAAU,CAAC,UAAU,CAAC,IAAI,CAAC;gBACxB,CAAC,UAAU,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;YAC5C,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,GAAG,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC;QACtC,CAAC;QACD,0CAA0C;aACrC,IACD,UAAU;YACV,UAAU,CAAC,UAAU,CAAC,eAAe,CAAC;YACtC,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,GAAG,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC;QACvC,CAAC;IACL,CAAC;IAED,OAAO,qBAAqB,CAAC;AACjC,CAAC"}
+{"version":3,"file":"getDependenciesAndInstallNestedComponents.js","sourceRoot":"","sources":["../../../cli/src/shared/getDependenciesAndInstallNestedComponents.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,IAAI,CAAC;AACzB,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAEzC;;;;;GAKG;AAEH,MAAM,UAAU,yCAAyC,CACrD,aAAqB,EACrB,qBAAkC;IAElC,MAAM,gBAAgB,GAAG,EAAE,CAAC,YAAY,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;IACjE,MAAM,WAAW,GAAG,yCAAyC,CAAC;IAC9D,MAAM,qBAAqB,GAAG,IAAI,GAAG,EAAU,CAAC;IAEhD,IAAI,KAAK,CAAC;IACV,OAAO,CAAC,KAAK,GAAG,WAAW,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC;QAC3D,MAAM,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;QAE5B,sCAAsC;QACtC,IAAI,UAAU,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;YACtF,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QAC1C,CAAC;QAED,oCAAoC;aAC/B,IACD,UAAU;YACV,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC;YACjC,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC;QACzC,CAAC;QAED,oCAAoC;aAC/B,IACD,UAAU;YACV,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC;YACjC,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC;QACzC,CAAC;QACD,qCAAqC;aAChC,IACD,UAAU;YACV,CAAC,UAAU,CAAC,UAAU,CAAC,IAAI,CAAC;gBACxB,CAAC,UAAU,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;YAC5C,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,GAAG,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC;QACtC,CAAC;QACD,0CAA0C;aACrC,IACD,UAAU;YACV,UAAU,CAAC,UAAU,CAAC,eAAe,CAAC;YACtC,CAAC,qBAAqB,CAAC,GAAG,CAAC,UAAU,CAAC,EACxC,CAAC;YACC,GAAG,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC;QACvC,CAAC;IACL,CAAC;IAED,OAAO,qBAAqB,CAAC;AACjC,CAAC"}

package/lib/components/DatePicker.tsx

@@ -6,14 +6,14 @@ import React, {
     useEffect,
     cloneElement,
     isValidElement,
+    useRef,
+    Ref,
 } from "react";
 import { Popover, PopoverContent, PopoverTrigger } from "./Popover";
 import { Calendar } from "./Calendar";
-import { Input, Trilling } from "./Input";
 import { ActionButton } from "./ActionButton";
-import { Group } from "./Input";
 import { DateRange } from "react-day-picker";
-import Picker, { PickerValue } from "torch-react-mobile-picker";
+import Picker from "torch-react-mobile-picker";
 
 import {
     applyTimeToDateValue,
@@ -59,7 +59,9 @@ export const DatePicker = forwardRef(
     ) => {
         const initialDate =
             mode == "multiple"
-                ? [value]
+                ? Array.isArray(value)
+                    ? value
+                    : [value]
                 : mode == "range"
                     ? { from: value, to: value }
                     : value;
@@ -72,6 +74,7 @@ export const DatePicker = forwardRef(
             time: date instanceof Date && date.getHours() < 12 ? "AM" : "PM",
         });
         const [isOpen, setIsOpen] = useState(false);
+        const triggerRef = useRef<HTMLButtonElement>(null);
 
         // Call the onChange function when the date or picker value changes
         useEffect(() => {
@@ -103,7 +106,7 @@ export const DatePicker = forwardRef(
 
         return (
             <Popover onOpenChange={setIsOpen}>
-                <PopoverTrigger asChild>
+                <PopoverTrigger ref={triggerRef} asChild>
                     {/* Clone the children element and pass the formatted value to the input element */}
                     {isValidElement(children) ? (
                         cloneElement(children as React.ReactElement<HTMLInputElement>, {
@@ -119,7 +122,9 @@ export const DatePicker = forwardRef(
                             readOnly
                             type="input"
                             childrenSide={
-                                <ActionButton type="button" size={"M"}>
+                                <ActionButton type="button" size={"M"} onClick={() => {
+                                    triggerRef.current?.click();
+                                }}>
                                     <i className="ri-calendar-event-fill"></i>
                                 </ActionButton>
                             }

package/lib/components/Input.tsx

@@ -45,13 +45,14 @@ export const Icon = ({ children, className }: IconProps) => {
 };
 
 
-interface TrillingProps {
+interface TrillingProps extends HTMLAttributes<HTMLDivElement> {
     children: React.ReactNode;
     className?: string;
 }
-export const Trilling = ({ children, className }: TrillingProps) => {
+export const Trilling = ({ children, className, ...props }: TrillingProps) => {
     return (
         <div
+            {...props}
             className={cn(
                 "flex items-center justify-center h-full gap-1 py-1",
                 className
@@ -96,7 +97,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
                 autoComplete="off"
                 className={cn(
                     // Base styles
-                    "typography-body-large-regular focus:pe-[30px]",
+                    "typography-body-large-regular",
                     "text-content-presentation-action-light-primary",
                     "bg-transparent",
                     "h-full",

package/lib/components/InputField.tsx

@@ -48,6 +48,7 @@ export const InputField = forwardRef<HTMLInputElement, Props>(
     const [isPopoverOpen, setIsPopoverOpen] = useState(false);
     const [PopoverWidth, setPopoverWidth] = useState(0);
     const inputRef = useRef<HTMLInputElement>(null);
+    const triggerRef = useRef<HTMLButtonElement>(null);
 
     useEffect(() => {
       if (!forwardedRef) return;
@@ -56,14 +57,14 @@ export const InputField = forwardRef<HTMLInputElement, Props>(
     }, [forwardedRef]);
     // TODO: make the user input visible when input is focused
     return (
-      <Popover open={isPopoverOpen}>
+      <Popover onOpenChange={setIsPopoverOpen}>
         <Tooltip
           theme={theme}
           toolTipSide={toolTipSide}
           open={errorMessage !== undefined}
           text={errorMessage}
         >
-          <PopoverTrigger asChild>
+          <PopoverTrigger ref={triggerRef} asChild>
             <Group
               error={errorMessage !== undefined}
               onTable={onTable}
@@ -113,6 +114,9 @@ export const InputField = forwardRef<HTMLInputElement, Props>(
               variant={variant}
               onOpenAutoFocus={(e: any) => e.preventDefault()}
               style={{ width: PopoverWidth }}
+              onClick={(e) => {
+                triggerRef.current?.click();
+              }}
             >
               {popoverChildren}
             </PopoverContent>

package/lib/components/LinkButton.tsx

@@ -1,4 +1,4 @@
-import React, { AnchorHTMLAttributes, HTMLAttributes, SVGProps } from "react";
+import React, { HTMLAttributes, SVGProps } from "react";
 import { cva } from "class-variance-authority";
 import { cn } from "../utils/cn";
 import { Themes } from "../utils/types";

package/lib/components/RadioCard.tsx

@@ -1,6 +1,6 @@
 import { forwardRef, ReactNode } from "react";
 import { cn } from "../utils/cn";
-import { Radio, RadioGroup } from "./Radio";
+import { Radio } from "./Radio";
 import { Card, CardContent, CardDescription, CardHeader } from "./Card";
 
 

package/lib/components/SlideDatePicker.tsx

@@ -1,10 +1,10 @@
-import { cloneElement, ComponentProps, forwardRef, isValidElement, useState, useEffect } from 'react';
+import { cloneElement, ComponentProps, forwardRef, isValidElement, useState, useEffect, useRef } from 'react';
 import { getDaysInMonth } from 'date-fns';
 import Picker from 'torch-react-mobile-picker';
 import { Popover, PopoverContent, PopoverTrigger } from './Popover';
 import { InputField } from './InputField';
 import { ActionButton } from './ActionButton';
-import { formatDateValueToString } from '@/utils/dateFormat';
+import { formatDateValueToString } from '../utils/dateFormat';
 
 function getDayArray(year: number, month: number): string[] {
   const dayCount = getDaysInMonth(new Date(year, month - 1));
@@ -15,9 +15,10 @@ interface SlideDatePickerProps extends Omit<ComponentProps<typeof InputField>, '
   onChange?: (e: any) => void;
   theme?: "dark" | "light" | "default";
   dateFormat?: string;
+  value?: any;
 }
 
-type SlideVlaues = {
+type SlideValues = {
   year: string,
   month: string,
   day: string,
@@ -32,22 +33,25 @@ export const SlideDatePicker = forwardRef<HTMLInputElement, SlideDatePickerProps
     onChange,
     dateFormat = "yyyy/MM/dd",
     children,
+    value = new Date(),
     ...props
   }, forwardedRef) => {
 
-  const today = new Date();
+  const today = value
   const defaultPickerValue = {
     year: String(today.getFullYear()),
-    month: String(today.getMonth() + 1).padStart(2, '0'),
-    day: String(today.getDate()).padStart(2, '0'),
-    hour: "00",
-    minute: "00",
-    time: "AM"
+    month: String(today.getMonth() + 1),
+    day: String(today.getDate()),
+    hour: String(today.getHours()),
+    minute: String(today.getMinutes()),
+    time: today.getHours() < 12 ? "AM" : "PM"
   };
 
-  const [pickerValue, setPickerValue] = useState<SlideVlaues>(defaultPickerValue);
-  const [date, setDate] = useState<Date>(new Date());
+  const [pickerValue, setPickerValue] = useState<SlideValues>(defaultPickerValue);
+  const [date, setDate] = useState<Date>(value);
   const [isOpen, setIsOpen] = useState(false);
+  const triggerRef = useRef<HTMLButtonElement>(null);
+
   const currentYear = new Date().getFullYear();
   const years = Array.from({ length: 200 }, (_, i) => `${currentYear - 100 + i}`);
   const months = Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, ''));
@@ -57,7 +61,7 @@ export const SlideDatePicker = forwardRef<HTMLInputElement, SlideDatePickerProps
     "July", "August", "September", "October", "November", "December",
   ];
 
-  const handlePickerChange = (newValue: SlideVlaues, key: string) => {
+  const handlePickerChange = (newValue: SlideValues, key: string) => {
     let { year, month, day, hour, minute, time } = newValue;
 
     if (key === 'year' || key === 'month') {
@@ -118,7 +122,7 @@ export const SlideDatePicker = forwardRef<HTMLInputElement, SlideDatePickerProps
 
   return (
     <Popover onOpenChange={setIsOpen}>
-      <PopoverTrigger asChild data-theme={theme} className='w-full flex-1' >
+      <PopoverTrigger ref={triggerRef} asChild data-theme={theme} className='w-full flex-1' >
         {
           isValidElement(children) ?
             cloneElement(children as React.ReactElement<HTMLInputElement>, {
@@ -131,12 +135,14 @@ export const SlideDatePicker = forwardRef<HTMLInputElement, SlideDatePickerProps
             <InputField
               readOnly
               type="input"
+              {...props}
               childrenSide={
-                <ActionButton type='button' size={"M"}>
+                <ActionButton type='button' size={"M"} onClick={() => {
+                  triggerRef.current?.click();
+                }}>
                   <i className="ri-calendar-event-fill"></i>
                 </ActionButton>
               }
-              {...props}
               value={formattedValue}
               ref={forwardedRef}
             />

package/lib/components/Textarea.tsx

@@ -2,7 +2,6 @@ import * as React from "react";
 import { cn } from "../utils/cn";
 import { Label } from "./Label";
 import { cva, VariantProps } from "class-variance-authority";
-import { Input } from "./Input";
 
 // Define the styles for the textarea using cva
 const textareaStyles = cva(

package/lib/components/Toast.tsx

@@ -0,0 +1,87 @@
+import React from 'react'
+import { Toaster as ToasterComponent, toast } from 'react-hot-toast'
+
+
+const Toaster = ({
+    position = 'top-left',
+    reverseOrder = false,
+    gutter = 8,
+    containerClassName = '',
+    containerStyle = {},
+    toastOptions = {},
+    ...props }: React.ComponentPropsWithoutRef<typeof ToasterComponent>) => {
+    return (
+        <ToasterComponent
+            position={position}
+            reverseOrder={reverseOrder}
+            gutter={gutter}
+            containerClassName={containerClassName}
+            containerStyle={containerStyle}
+            {...props}
+            toastOptions={{
+                // Define default options
+                className: '',
+                duration: 8000,
+                removeDelay: 1000,
+                style: {
+                    background: 'var(--background-presentation-state-information-secondary)',
+                    color: 'var(--content-presentation-global-primary)',
+                    borderRadius: '16px',
+                },
+
+                // Default options for specific types
+                success: {
+                    duration: 3000,
+                    style: {
+                        background: 'var(--background-presentation-state-success-secondary)',
+                        color: 'var(--content-presentation-global-primary)',
+                        borderRadius: '16px',
+                    },
+                    iconTheme: {
+                        primary: 'var(--background-presentation-state-success-primary)',
+                        secondary: 'var(--background-presentation-state-success-secondary)',
+                    },
+                },
+                error: {
+                    duration: 5000,
+                    style: {
+                        background: 'var(--background-presentation-state-negative-secondary)',
+                        color: 'var(--content-presentation-global-primary)',
+                        borderRadius: '16px',
+                    },
+                    iconTheme: {
+                        primary: 'var(--background-presentation-state-negative-primary)',
+                        secondary: 'var(--background-presentation-state-negative-secondary)',
+                    },
+                },
+                loading: {
+                    duration: 4000,
+                    style: {
+                        background: 'var(--background-presentation-state-warning-secondary)',
+                        color: 'var(--content-presentation-global-primary)',
+                        borderRadius: '16px',
+                    },
+                    iconTheme: {
+                        primary: 'var(--background-presentation-state-warning-primary)',
+                        secondary: 'var(--background-presentation-state-warning-secondary)',
+                    },
+                },
+                blank: {
+                    duration: 4000,
+                    style: {
+                        background: 'var(--background-presentation-state-information-secondary)',
+                        color: 'var(--content-presentation-global-primary)',
+                        borderRadius: '16px',
+                    },
+                    iconTheme: {
+                        primary: 'var(--background-presentation-state-information-primary)',
+                        secondary: 'var(--background-presentation-state-information-secondary)',
+                    },
+                },
+                ...toastOptions,
+            }}
+        />
+    )
+}
+
+export { Toaster, toast }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "torch-glare",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "type": "module",
   "license": "MIT",
   "files": [