import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Checkbox } from "../../../checkbox";
import { Collapsible, CollapsibleContent } from "../../../collapsible";
import { Label } from "../../../label";
import { Switch } from "../../../switch";
import { cn } from "../../../utils/css";
import { OrderType, MEDIA_TABLET } from "@orderly.network/types";
import { ChevronDown } from "lucide-react";
import { useState } from "react";
import { OrderTypesCheckbox } from "./orderTypes";
import { useLocalStorage, useMediaQuery } from "@orderly.network/hooks";
import { MobileHideenLabel, DesktopHiddenLabel } from "./hiddenLabel";
import { MobileReduceOnlyLabel, DesktopReduceOnlyLabel } from "./reduceOnly";
export const OrderOptions = (props)=>{
    const { reduceOnly, formattedOrder, onFieldChange } = props;
    const [optionsOpen, setOptionsOpen] = useLocalStorage("order_entry_options_open", false);
    const [open, setOpen] = useState(optionsOpen);
    // const { control, getValues, setValue } = useFormContext();
    const { order_type } = formattedOrder;
    const isTable = useMediaQuery(MEDIA_TABLET);
    // console.log("------", formattedOrder);
    return /*#__PURE__*/ _jsxs(_Fragment, {
        children: [
            /*#__PURE__*/ _jsxs("div", {
                className: "orderly-flex orderly-items-center orderly-py-[2px] orderly-justify-between orderly-text-base-contrast-54",
                children: [
                    /*#__PURE__*/ _jsxs("div", {
                        className: "orderly-flex orderly-gap-2 orderly-items-center",
                        children: [
                            /*#__PURE__*/ _jsx(Switch, {
                                id: "orderly-reduce-only-switch",
                                color: "primary",
                                checked: formattedOrder.reduce_only ?? reduceOnly,
                                onCheckedChange: (checked)=>{
                                    // onReduceOnlyChange?.(checked);
                                    onFieldChange("reduce_only", checked);
                                // field.onChange(checked);
                                }
                            }),
                            isTable ? /*#__PURE__*/ _jsx(MobileReduceOnlyLabel, {}) : /*#__PURE__*/ _jsx(DesktopReduceOnlyLabel, {})
                        ]
                    }),
                    /*#__PURE__*/ _jsx("button", {
                        id: "orderly-order-entry-expand-icon",
                        type: "button",
                        className: "orderly-w-[18px] orderly-h-[18px] orderly-px-5 orderly-text-base-contrast/60",
                        onClick: ()=>{
                            setOpen((open)=>!open);
                            setOptionsOpen(!open);
                        },
                        children: /*#__PURE__*/ _jsx(ChevronDown, {
                            size: 18,
                            className: cn("orderly-transition-transform orderly-text-base-contrast/50", open && "orderly-rotate-180")
                        })
                    })
                ]
            }),
            /*#__PURE__*/ _jsx(Collapsible, {
                open: open,
                children: /*#__PURE__*/ _jsx(CollapsibleContent, {
                    children: /*#__PURE__*/ _jsxs("div", {
                        id: "orderly-order-entry-expand-content",
                        className: "orderly-pb-2 orderly-space-y-4",
                        children: [
                            order_type === OrderType.LIMIT && /*#__PURE__*/ _jsx(OrderTypesCheckbox, {
                                value: formattedOrder.order_type_ext,
                                onValueChange: (value)=>{
                                    // field.onChange(value);
                                    onFieldChange("order_type_ext", value);
                                }
                            }),
                            /*#__PURE__*/ _jsxs("div", {
                                className: "orderly-flex orderly-gap-5",
                                children: [
                                    /*#__PURE__*/ _jsxs("div", {
                                        id: "orderly-order-entry-expand-content-order-confirm",
                                        className: "orderly-flex orderly-gap-1 first-letter:orderly-items-center",
                                        children: [
                                            /*#__PURE__*/ _jsx(Checkbox, {
                                                id: "orderConfirm",
                                                checked: props.showConfirm,
                                                onCheckedChange: (checked)=>{
                                                    props.onConfirmChange?.(!!checked);
                                                }
                                            }),
                                            /*#__PURE__*/ _jsx(Label, {
                                                htmlFor: "orderConfirm",
                                                className: "orderly-text-base-contrast-54",
                                                children: "Order confirm"
                                            })
                                        ]
                                    }),
                                    /*#__PURE__*/ _jsxs("div", {
                                        id: "orderly-order-entry-expand-content-hidden",
                                        className: "orderly-flex orderly-gap-1 orderly-items-center",
                                        children: [
                                            /*#__PURE__*/ _jsx(Checkbox, {
                                                id: "hidden",
                                                checked: formattedOrder.visible_quantity === 0,
                                                onCheckedChange: (checked)=>{
                                                    // props.setValue?.("visible_quantity", checked ? 0 : 1);
                                                    // field.onChange(checked ? 0 : 1);
                                                    onFieldChange("visible_quantity", checked ? 0 : 1);
                                                }
                                            }),
                                            isTable ? /*#__PURE__*/ _jsx(MobileHideenLabel, {}) : /*#__PURE__*/ _jsx(DesktopHiddenLabel, {})
                                        ]
                                    })
                                ]
                            })
                        ]
                    })
                })
            })
        ]
    });
};

//# sourceMappingURL=orderOptions.js.map