Fix Input Upload

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tawasukha/ui",
-  "version": "0.0.62",
+  "version": "0.0.63",
   "type": "module",
   "types": "dist/index.d.ts",
   "exports": {

src/components/inputSelect.tsx

@@ -13,7 +13,7 @@ import { Chip, XChip } from "./chip"
 import { AnimatePresence } from "framer-motion"
 import { debouncePromise } from "../helpers/debouncePromise"
 import { ChevronDownIcon } from "@heroicons/react/24/solid"
-import { useIsFirstRender } from "src/helpers/useIsFirstRender"
+import { useIsFirstRender } from "../helpers/useIsFirstRender"
 
 const _input = cva(
   [

src/components/inputUpload.tsx

@@ -4,6 +4,7 @@ import { Item } from "./upload/Item"
 import { Uploader, type UploaderProps } from "./upload/Uploader"
 import { useCallback, useEffect, useState } from "react"
 import { AnimatePresence } from "framer-motion"
+import { useIsFirstRender } from "../helpers/useIsFirstRender"
 
 const _input = cva(["flex flex-wrap gap-2 w-full bg-base rounded-lg border p-2 border-dashed"], {
   variants: {
@@ -41,6 +42,7 @@ export function InputUpload({
   maxSize = 20 * 1024 * 1024,
   disabled,
 }: InputUploadProps) {
+  const isFirstRender = useIsFirstRender()
   const [files, setFiles] = useState<string[]>(value ? (Array.isArray(value) ? value : []) : [])
 
   const onRemove = useCallback(
@@ -56,6 +58,13 @@ export function InputUpload({
     [files, setFiles],
   )
 
+  useEffect(() => {
+    const _values = value ? (Array.isArray(value) ? value : []) : []
+    if (files.length == 0 && _values.length !== 0) {
+      setFiles(_values)
+    }
+  }, [files, value, setFiles])
+
   useEffect(() => {
     if (onChange) onChange(files)
   }, [files])
@@ -65,7 +74,8 @@ export function InputUpload({
       <Uploader {...{ url, accept, maxSize, setFiles, responseKey, disabled }} />
       <AnimatePresence>
         {files.map((file) => {
-          const name = (file || "").split("/").pop() || "Untitled"
+          const url = new URL(file)
+          const name = url.searchParams.get("name") || (file || "").split("/").pop() || "Untitled"
           return (
             <Item
               disabled={disabled}

src/components/sidebar.tsx

@@ -71,9 +71,7 @@ export function SidebarMenu({
         className={cx(
           "flex flex-row py-3 px-4 border-base-2 border-b transition-colors",
           "duration-300 transform cursor-pointer items-center",
-          isOpen && !!children
-            ? "text-base bg-primary-3 hover:opacity-90"
-            : "text-primary-3 bg-primary-1 hover:text-primary-5",
+          "text-primary-4 bg-primary-2 bg-opacity-40 hover:bg-primary-1",
           className,
         )}
         onClick={onClick}

src/components/table.tsx

@@ -79,12 +79,9 @@ export const Table = forwardRef<HTMLDivElement, TableProps>(function Table(
   return (
     <div
       ref={ref}
-      className={cx(
-        "shadow shadow-offset inline-block min-w-full overflow-x-auto rounded-lg",
-        className,
-      )}
+      className={cx("shadow shadow-offset inline-block min-w-full overflow-x-auto", className)}
     >
-      <div className={"table table-fixed w-full border-collapse"} {...props} />
+      <div className={"table w-full border-collapse"} {...props} />
     </div>
   )
 })

themeGenerator.cjs

@@ -54,7 +54,7 @@ function themeGenerator() {
   }
   const mode = {
     base: "slate",
-    primary: "sky",
+    primary: "blue",
     secondary: "cyan",
     success: "emerald",
     warning: "amber",