akanjs 2.2.4 → 2.2.5

package/types/webkit/usePurchase.d.ts

@@ -0,0 +1,19 @@
+import "cordova-plugin-purchase/www/store";
+export type PlatformType = "android" | "ios" | "all";
+export interface ProductType {
+    id: string;
+    type: keyof typeof CdvPurchase.ProductType;
+}
+export type CdvProductType = CdvPurchase.ProductType;
+export declare const usePurchase: ({ platform, productInfo, url, onPay, onSubscribe, }: {
+    platform: PlatformType;
+    productInfo: ProductType[];
+    url: string;
+    onPay?: (transaction: CdvPurchase.Transaction) => void | Promise<void>;
+    onSubscribe?: (transaction: CdvPurchase.Transaction) => void | Promise<void>;
+}) => {
+    isLoading: boolean;
+    products: CdvPurchase.Product[];
+    purchaseProduct: (product: CdvPurchase.Product) => Promise<void>;
+    restorePurchases: () => Promise<void>;
+};

package/types/webkit/usePushNoti.d.ts

@@ -0,0 +1,7 @@
+/** Capacitor push/FCM hook for permission, registration, and token retrieval. */
+export declare const usePushNoti: () => {
+    init: () => Promise<void>;
+    checkPermission: () => Promise<boolean>;
+    register: () => Promise<void>;
+    getToken: () => Promise<string | undefined>;
+};

package/types/webkit/useThrottle.d.ts

@@ -0,0 +1,2 @@
+/** Returns a callback that executes immediately, then ignores calls until delay passes. */
+export declare const useThrottle: <Args extends unknown[], Return>(func: (...args: Args) => Return, delay?: number, deps?: unknown[]) => (...args: Args) => void;

package/types/webkit.d.ts

@@ -0,0 +1 @@
+export * from "./webkit/index.d.ts";

package/ui/BottomSheet.tsx

@@ -27,7 +27,7 @@ export const BottomSheet = forwardRef<BottomSheetRef, BottomSheetProps>(
     const [{ y, opacity }, api] = useSpring(() => ({ y: window.innerHeight, opacity: 0 }));
 
     const openModal = async () => {
-      //rubber band
+      
       await Promise.all(api.start({ y: 0, opacity: 100, immediate: false, config: config.default }));
     };
     const closeModal = async () => {

package/ui/Clipboard.tsx

@@ -21,7 +21,7 @@ export const Clipboard = ({ text, className }: ClipboardProps): ReactElement =>
 
   const handleCopy = async () => {
     if (!text) return;
-    // 예시로 "복사할 텍스트"를 복사합니다
+    
     await navigator.clipboard.writeText(text);
     setIsCopied(true);
   };

package/ui/CsrImage.tsx

@@ -18,20 +18,9 @@ export const CsrImage = ({ src, file, className, abstractData, ...props }: CsrIm
   const [width, height] = [props.width ?? file?.imageSize[0], props.height ?? file?.imageSize[1]];
   const defaultAbstractData =
     "data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAFklEQVR42mN8//HLfwYiAOOoQvoqBABbWyZJf74GZgAAAABJRU5ErkJggg==";
-  //CSRImage로 파일 만들어서 불러서 변경
+  
   const blurDataURL = abstractData ?? file?.abstractData ?? defaultAbstractData;
-  // const [loadedImage, setLoadedImage] = useState(false);
-  // const fetchImage = (src) => {
-  //   const loadingImage = getNewImage();
-  //   loadingImage.src = src;
-  //   loadingImage.onload = () => {
-  //     setLoadedImage(true);
-  //   };
-  // };
 
-  // useEffect(() => {
-  //   // fetchImage(url);
-  // }, []);
   const { priority, preload, quality, unoptimized, fill, ...csrProps } = props;
   return (
     <img
@@ -39,10 +28,10 @@ export const CsrImage = ({ src, file, className, abstractData, ...props }: CsrIm
       data-src={blurDataURL}
       width={width}
       height={height}
-      // className={clsx("object-cover w-full", className)}
+      
       className={className}
       alt="image"
-      // placeholder="blur"
+      
       {...csrProps}
     />
   );

package/ui/Data/ListContainer.tsx

@@ -28,7 +28,7 @@ import { Loading } from "../Loading";
 import { Model } from "../Model";
 import { Select } from "../Select";
 import DataCardList from "./CardList";
-// import QueryMaker from "./QueryMaker";
+
 import DataTableList from "./TableList";
 
 const downloadBlob = (blob: Blob, filename: string) => {

package/ui/Data/Pagination.tsx

@@ -42,7 +42,7 @@ export default function Pagination<T extends string>({ className, slice }: Pagin
     <div className={clsx("mt-4 flex flex-wrap justify-center", className)}>
       <Pagn
         currentPage={pageOfModel}
-        // showQuickJumper={lastPageOfModel > 10}
+        
         total={modelInsight.count}
         onPageSelect={(page) => {
           void storeDo[namesOfSlice.setPageOfModel](page);

package/ui/Data/QueryMaker.tsx

@@ -17,344 +17,5 @@ const byStatusQuerySetting: QuerySetting = { queryKey: "byStatuses", arg: { stat
 export default function QueryMaker({ className, slice, query }: QueryMakerProps) {
   const { sliceName } = slice;
   return null;
-  // const { l } = usePage();
-  // const storeDo = st.do as unknown as { [key: string]: (...args) => Promise<void> };
-  // const cnstInfo = constantInfo.getDatabase(sliceName);
-  // const isModelSearchable = hasTextField(cnstInfo.full);
-  // const { subMenu, filter } = st.use.searchParams();
-  // const filterRef = cnstInfo.filter;
-  // const filterQueryMap = getFilterQueryMap(filterRef);
-  // const defaultQuerySetting = { ...(isModelSearchable ? searchQuerySetting : byStatusQuerySetting), ...(query ?? {}) };
-  // const isInitialized = useRef(false);
-  // const [querySetting, setQuerySetting] = useState<QuerySetting>(defaultQuerySetting);
-  // const getQuery = useCallback(
-  //   (querySetting: QuerySetting) => {
-  //     if (querySetting.queryKey === "search") {
-  //       const query = querySetting.arg;
-  //       return query;
-  //     } else {
-  //       const queryFn = getFilterQuery(filterRef, querySetting.queryKey);
-  //       const filterQueryArgMetas = getFilterArgMetas(filterRef, querySetting.queryKey);
-  //       const queryArgs = filterQueryArgMetas.map((queryArgMeta) => querySetting.arg[queryArgMeta.name] as string);
-  //       const query = queryFn(...queryArgs);
-  //       return query;
-  //     }
-  //   },
-  //   [filter]
-  // );
-  // const setQueryOfModel = useDebounce((querySetting: QuerySetting) => {
-  //   const query = getQuery(querySetting);
-  //   if (!isInitialized.current) {
-  //     void storeDo[`init${capitalize(sliceName)}`](query);
-  //     isInitialized.current = true;
-  //   } else void storeDo[`setQueryArgsOf${capitalize(sliceName)}`](query);
-  // });
-  // useEffect(() => {
-  //   if (filter && subMenu === sliceName) setQuerySetting({ queryKey: filter, arg: {} });
-  // }, [filter, subMenu]);
-  // useEffect(() => {
-  //   setQueryOfModel(querySetting);
-  // }, [querySetting]);
-  // return (
-  //   <div className={clsx("flex w-full items-center gap-4", className)}>
-  //     <div className="flex flex-col gap-2">
-  //       Query
-  //       <Select<string>
-  //         value={querySetting.queryKey}
-  //         options={Object.keys(filterQueryMap).map((queryKey) => ({
-  //           label: l.field("summary", queryKey),
-  //           value: queryKey,
-  //         }))}
-  //         onChange={(queryKey: string) => {
-  //           const filterQueryArgMetas = getFilterArgMetas(filterRef, queryKey);
-  //           const defaultArg = Object.fromEntries(
-  //             filterQueryArgMetas.map((queryArgMeta) => [
-  //               queryArgMeta.name,
-  //               queryArgMeta.nullable
-  //                 ? null
-  //                 : queryArgMeta.arrDepth
-  //                   ? { oneOf: [] }
-  //                   : queryArgMeta.default
-  //                     ? typeof queryArgMeta.default === "function"
-  //                       ? queryArgMeta.default()
-  //                       : queryArgMeta.default
-  //                     : (scalarDefaultMap.get(queryArgMeta.modelRef) ?? null),
-  //             ])
-  //           );
-  //           setQuerySetting({ queryKey, arg: defaultArg });
-  //         }}
-  //       />
-  //     </div>
-  //     {querySetting.queryKey === "search" ? (
-  //       <div className="flex w-full flex-col gap-2">
-  //         Search
-  //         <label className="input flex w-full items-center gap-2">
-  //           <input
-  //             type="text"
-  //             className="grow"
-  //             placeholder="Type to search..."
-  //             value={(querySetting.arg.$search as string | undefined) ?? ""}
-  //             onChange={(e) => {
-  //               setQuerySetting({ ...querySetting, arg: e.target.value ? { $search: e.target.value } : {} });
-  //             }}
-  //           />
-  //           <BiSearch className="size-4 opacity-70" />
-  //         </label>
-  //       </div>
-  //     ) : (
-  //       getFilterArgMetas(filterRef, querySetting.queryKey).map((queryArgMeta, idx) => (
-  //         <div className="flex flex-col gap-2" key={idx}>
-  //           <div className="text-sm text-gray-500">{l.qarg(slice, querySetting.queryKey, queryArgMeta.name)}</div>
-  //           <QueryArg
-  //             queryArgMeta={queryArgMeta}
-  //             value={querySetting.arg[queryArgMeta.name] as string}
-  //             onChange={(value) => {
-  //               setQuerySetting({
-  //                 ...querySetting,
-  //                 arg: { ...querySetting.arg, [queryArgMeta.name]: value as string },
-  //               });
-  //             }}
-  //           />
-  //         </div>
-  //       ))
-  //     )}
-  //   </div>
-  // );
 }
 
-// interface QueryArgProps {
-//   queryArgMeta: FilterArgMeta;
-//   value: any;
-//   onChange: (value: any) => void;
-// }
-// function QueryArg({ queryArgMeta, value, onChange }: QueryArgProps) {
-//   const argType = getGqlTypeStr(queryArgMeta.modelRef) as GqlScalarName;
-//   if (queryArgMeta.enum && queryArgMeta.arrDepth && queryArgMeta.arrDepth < 2)
-//     return (
-//       <QueryArg.Enum
-//         options={queryArgMeta.enum.values}
-//         value={value as (string | number)[] | null}
-//         onChange={onChange}
-//         nullable={queryArgMeta.nullable}
-//         multiple={queryArgMeta.arrDepth ? queryArgMeta.arrDepth >= 1 : false}
-//       />
-//     );
-//   return argType === "ID" ? (
-//     <QueryArg.ID queryArgMeta={queryArgMeta} value={value as string} onChange={onChange} />
-//   ) : argType === "Int" ? (
-//     <QueryArg.Int value={value as number} onChange={onChange} />
-//   ) : argType === "Float" ? (
-//     <QueryArg.Float value={value as number} onChange={onChange} />
-//   ) : argType === "String" ? (
-//     <QueryArg.String value={value as string} onChange={onChange} />
-//   ) : argType === "Boolean" ? (
-//     <QueryArg.Boolean value={value as boolean} onChange={onChange} />
-//   ) : argType === "Date" ? (
-//     <QueryArg.Date value={value as Dayjs} onChange={onChange} />
-//   ) : argType === "JSON" ? (
-//     <QueryArg.Json value={value as string} onChange={onChange} />
-//   ) : (
-//     <></>
-//   );
-// }
-
-// interface ArgEnumProps {
-//   options: (string | number)[];
-//   value: (string | number)[] | string | number | null;
-//   onChange: (value: (string | number)[] | string | number | null) => void;
-//   nullable?: boolean;
-//   multiple?: boolean;
-// }
-// const ArgEnum = ({ options, value, onChange, nullable, multiple }: ArgEnumProps) => {
-//   return (
-//     <Select
-//       options={options.map((option) => ({
-//         label: option.toString(),
-//         value: option,
-//       }))}
-//       value={value ?? []}
-//       onChange={(val) => {
-//         onChange(val as (string | number)[] | string | number | null);
-//       }}
-//       multiple={multiple}
-//     />
-//   );
-// };
-// QueryArg.Enum = ArgEnum;
-
-// interface ArgIDProps {
-//   queryArgMeta: FilterArgMeta;
-//   value: string | null;
-//   onChange: (value: string | null) => void;
-// }
-// const ArgID = ({ queryArgMeta, value, onChange }: ArgIDProps) => {
-//   if (!queryArgMeta.ref)
-//     return (
-//       <Input
-//         inputClassName="w-full"
-//         value={value ?? ""}
-//         onChange={(value) => {
-//           onChange(value ? value : null);
-//         }}
-//         validate={(e) => true}
-//       />
-//     );
-//   else return <SelectIDWithRef queryArgMeta={queryArgMeta} value={value} onChange={onChange} />;
-// };
-// QueryArg.ID = ArgID;
-
-// interface SelectIDWithRefProps {
-//   queryArgMeta: FilterArgMeta;
-//   value: string | null;
-//   onChange: (value: string | null) => void;
-// }
-// const SelectIDWithRef = ({ queryArgMeta, value, onChange }: SelectIDWithRefProps) => {
-//   if (!queryArgMeta.ref) throw new Error("No ref in queryArgMeta");
-//   const [modalOpen, setModalOpen] = useState(false);
-//   const storeUse = st.use as { [key: string]: () => unknown };
-//   const modelList = storeUse[`${queryArgMeta.ref}List`]() as DataList<{ id: string }>;
-//   const renderOption = queryArgMeta.renderOption ?? ((value: { id: string }) => value.id);
-//   const selectedModel = value ? modelList.get(value) : null;
-//   return (
-//     <>
-//       <button
-//         className="btn"
-//         onClick={() => {
-//           setModalOpen(true);
-//         }}
-//       >
-//         {selectedModel ? renderOption(selectedModel) : `Select ${queryArgMeta.ref}`}
-//       </button>
-//       <Modal
-//         open={modalOpen}
-//         onCancel={() => {
-//           setModalOpen(false);
-//         }}
-//       >
-//         <div className="flex w-full flex-col gap-4 pb-[256px]">
-//           <QueryMaker sliceName={queryArgMeta.ref} />
-//           <Select<string | null>
-//             value={value}
-//             options={modelList.map((model) => ({
-//               label: renderOption(model),
-//               value: model.id,
-//             }))}
-//             onChange={(value) => {
-//               onChange(value);
-//             }}
-//           />
-//         </div>
-//       </Modal>
-//     </>
-//   );
-// };
-
-// interface ArgIntProps {
-//   value: number;
-//   onChange: (value: number) => void;
-// }
-// const ArgInt = ({ value, onChange }: ArgIntProps) => {
-//   return (
-//     <Input.Number
-//       inputClassName="w-full"
-//       value={value}
-//       onChange={(value) => {
-//         onChange(value ?? 0);
-//       }}
-//       validate={(e) => true}
-//     />
-//   );
-// };
-// QueryArg.Int = ArgInt;
-
-// interface ArgFloatProps {
-//   value: number;
-//   onChange: (value: number) => void;
-// }
-// const ArgFloat = ({ value, onChange }: ArgFloatProps) => {
-//   return (
-//     <Input.Number
-//       inputClassName="w-full"
-//       value={value}
-//       onChange={(value) => {
-//         onChange(value ?? 0);
-//       }}
-//       validate={(e) => true}
-//     />
-//   );
-// };
-// QueryArg.Float = ArgFloat;
-
-// interface ArgStringProps {
-//   value: string | null | undefined;
-//   onChange: (value: string | null) => void;
-// }
-// const ArgString = ({ value, onChange }: ArgStringProps) => {
-//   return (
-//     <Input
-//       inputClassName="w-full"
-//       value={value ?? ""}
-//       onChange={(value) => {
-//         onChange(value ? value : null);
-//       }}
-//       validate={(e) => true}
-//     />
-//   );
-// };
-// QueryArg.String = ArgString;
-
-// interface ArgBooleanProps {
-//   value: boolean;
-//   onChange: (value: boolean) => void;
-// }
-// const ArgBoolean = ({ value, onChange }: ArgBooleanProps) => {
-//   return (
-//     <Input.Checkbox
-//       className="w-full"
-//       checked={value}
-//       onChange={(value) => {
-//         onChange(value);
-//       }}
-//     />
-//   );
-// };
-// QueryArg.Boolean = ArgBoolean;
-
-// interface ArgDateProps {
-//   value: Dayjs;
-//   onChange: (value: Dayjs | null) => void;
-// }
-// const ArgDate = ({ value, onChange }: ArgDateProps) => {
-//   return (
-//     <DatePicker
-//       className="w-full"
-//       value={value}
-//       onChange={(value) => {
-//         onChange(value);
-//       }}
-//     />
-//   );
-// };
-// QueryArg.Date = ArgDate;
-
-// interface ArgJsonProps {
-//   value: string;
-//   onChange: (value: string) => void;
-// }
-// const ArgJson = ({ value, onChange }: ArgJsonProps) => {
-//   return (
-//     <Input.TextArea
-//       validate={(e) => true}
-//       className="w-full"
-//       inputClassName="w-full min-h-[300px]"
-//       value={value}
-//       onPressEnter={(value) => {
-//         onChange(value);
-//       }}
-//       onChange={(value) => {
-//         onChange(value);
-//       }}
-//     />
-//   );
-// };
-// QueryArg.Json = ArgJson;

package/ui/Data/index.ts

@@ -8,5 +8,4 @@ export const Data = {
   ListContainer,
   Pagination,
   TableList,
-  // QueryMaker,
 };

package/ui/DatePicker.tsx

@@ -60,7 +60,7 @@ export const DatePicker = ({
       selected={value ? value.toDate() : new Date()}
       disabledKeyboardNavigation
       onFocus={(e: FocusEvent<HTMLInputElement>) => {
-        // 더블클릭 시 수동인풋 할 수 있게
+        
         if (clickNum.current % 2 === 0) e.target.blur();
         clickNum.current++;
       }}
@@ -189,97 +189,3 @@ const TimePicker = ({
 
 DatePicker.TimePicker = TimePicker;
 
-// interface MonthPickerProps {
-//   className?: string;
-//   yearClassName?: string;
-//   monthClassName?: string;
-//   value: Dayjs | null;
-//   onChange: (value: Dayjs) => void;
-//   min?: Dayjs;
-//   max?: Dayjs;
-//   dateOfMonth?: "first" | "last";
-// }
-
-// const MonthPicker = ({
-//   className,
-//   yearClassName,
-//   monthClassName,
-//   value,
-//   onChange,
-//   min = dayjs()
-//     .subtract(1, "year")
-//     .set("month", 0)
-//     .set("date", 1)
-//     .set("hour", 0)
-//     .set("minute", 0)
-//     .set("second", 0)
-//     .set("millisecond", 0),
-//   max = dayjs()
-//     .add(1, "year")
-//     .set("month", 11)
-//     .set("date", 1)
-//     .set("hour", 0)
-//     .set("minute", 0)
-//     .set("second", 0)
-//     .set("millisecond", 0),
-//   dateOfMonth = "first",
-// }: MonthPickerProps) => {
-//   const [year, month] = [value?.year(), value?.month()];
-//   const availableYears = Array.from({ length: max.year() - min.year() + 1 }, (_, i) => min.year() + i);
-//   const availableMonths = Array.from({ length: 12 }, (_, i) => i)
-//     .filter((month) => (year === min.year() ? month >= min.month() : true))
-//     .filter((month) => (year === max.year() ? month <= max.month() : true));
-//   return (
-//     <div className={clsx("flex gap-2", className)}>
-//       <Select
-//         className={yearClassName}
-//         value={year}
-//         onChange={(year) => {
-//           if (month)
-//             onChange(
-//               dayjs(value)
-//                 .set("year", year)
-//                 .set("month", year === max.year() ? max.month() : month)
-//                 .set("date", 1)
-//                 .set("hour", 0)
-//                 .set("minute", 0)
-//                 .set("second", 0)
-//                 .set("millisecond", 0)
-//                 .add(dateOfMonth === "first" ? 0 : 1, "month")
-//                 .subtract(dateOfMonth === "first" ? 0 : -1, "millisecond")
-//             );
-//         }}
-//       >
-//         {availableYears.map((year, idx) => (
-//           <Select.Option key={idx} value={year}>
-//             {year}년
-//           </Select.Option>
-//         ))}
-//       </Select>
-//       <Select
-//         className={monthClassName}
-//         value={month}
-//         onChange={(month) => {
-//           onChange(
-//             dayjs(value)
-//               .set("month", month)
-//               .set("date", 1)
-//               .set("hour", 0)
-//               .set("minute", 0)
-//               .set("second", 0)
-//               .set("millisecond", 0)
-//               .add(dateOfMonth === "first" ? 0 : 1, "month")
-//               .subtract(dateOfMonth === "first" ? 0 : -1, "millisecond")
-//           );
-//         }}
-//       >
-//         {availableMonths.map((month, idx) => (
-//           <Select.Option key={idx} value={month}>
-//             {month + 1}월
-//           </Select.Option>
-//         ))}
-//       </Select>
-//     </div>
-//   );
-// };
-// DatePicker.MonthPicker = MonthPicker;

package/ui/Dialog/Modal.tsx

@@ -9,7 +9,7 @@ import { config, useSpring } from "react-spring";
 
 import { DialogContext } from "./context";
 
-const MODAL_MARGIN = 0; // px
+const MODAL_MARGIN = 0; 
 const OPACITY = { START: 0, END: 1 };
 let bodyScrollLockCount = 0;
 let previousBodyOverflow = "";

package/ui/DraggableList.tsx

@@ -43,14 +43,14 @@ const DragList = <V,>({ className, mode = "vertical", children, onChange, onRemo
     shadow: number;
   }>(
     children.length,
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+    
     fn(
       order.current,
       new Array(children.length).fill(0) as number[],
       new Array(children.length).fill(0) as number[],
       children.length,
     ) as any,
-  ); // Create springs, each corresponds to an item, controlling its transform, scale, etc.
+  ); 
   const bind = useGesture({
     onDragStart: () => {
       order.current = children.map((_, index) => index);
@@ -76,7 +76,7 @@ const DragList = <V,>({ className, mode = "vertical", children, onChange, onRemo
       const newClientHeights = (swap as (...args: any[]) => number[])([...clientLengths.current], originIdx, curRow);
       void api.start(
         fn(newOrder, clientLengths.current, newClientHeights, children.length, active, originIdx, movement),
-      ); // Feed springs new style data, they'll animate the view without causing a single render
+      ); 
       if (!active) {
         const draggedValue = (children[originIdx].props as { value: V }).value;
         void api.start(
@@ -113,7 +113,7 @@ const DragList = <V,>({ className, mode = "vertical", children, onChange, onRemo
             boxShadow: shadow.to((s) => `rgba(0, 0, 0, 0.15) 0px ${s}px ${2 * s}px 0px`),
             scale,
             ...(mode === "vertical" ? { y: movement } : { x: movement }),
-            // cursor: "grab",
+            
           }}
         >
           <dragListContext.Provider
@@ -207,7 +207,7 @@ const fn =
           movement,
           scale: 1.01,
           zIndex: total + 1,
-          // shadow: 15,
+          
           immediate: (key: string) => key === "zIndex",
           config: (key: string) => (key === "y" ? config.stiff : config.default),
         }

package/ui/Field.tsx

@@ -197,7 +197,6 @@ const Text = ({
 };
 Field.Text = memo(Text);
 
-//! 삭제
 interface PriceProps {
   label?: string;
   desc?: string;
@@ -872,7 +871,7 @@ const Number = ({
         className={clsx("w-full", "")}
         inputClassName={clsx("w-full", inputClassName)}
         validate={(value) => {
-          //수정여지
+          
           if (min !== undefined && (value as number) < min) return l("base.numberTooSmallError", { min });
           else if (max !== undefined && (value as number) > max) return l("base.numberTooBigError", { max });
           else return validate?.(value as number) ?? true;
@@ -1529,7 +1528,7 @@ const ChildrenId = <T extends string, State, Input, Full extends { id: string },
         label={label}
         labelClassName={labelClassName}
         multiple
-        // selectClassName={selectClassName}
+        
         value={value}
         options={modelList.map((model) => {
           const label = renderOption(model);

package/ui/Image.tsx

@@ -3,7 +3,6 @@ import { clsx } from "akanjs/client";
 import type { ProtoFile } from "akanjs/constant";
 import type { ImgHTMLAttributes } from "react";
 import { preload as preloadResource } from "react-dom";
-// import NextImage, { ImageProps } from "next/image";
 
 import { CsrImage } from "./CsrImage";
 
@@ -112,11 +111,11 @@ export const Image = ({
 
   return (
     <img
-      // <NextImage
+      
       src={optimized.src}
       srcSet={optimized.srcSet}
       sizes={props.sizes}
-      // fill={props.fill ?? (!width && !height)}
+      
       width={width}
       height={height}
       className={clsx("object-cover", className)}