@health-samurai/react-components 0.0.0-alpha.2 → 0.0.0-alpha.21

package/dist/src/components/operation-outcome-view.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/operation-outcome-view.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport { OperationOutcomeView } from \"./operation-outcome-view\";\n\nconst meta = {\n\ttitle: \"Component/OperationOutcomeView\",\n\tcomponent: OperationOutcomeView,\n\tparameters: {\n\t\tlayout: \"padded\",\n\t},\n} satisfies Meta<typeof OperationOutcomeView>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n\targs: {\n\t\tresource: {\n\t\t\tresourceType: \"OperationOutcome\",\n\t\t\tissue: [\n\t\t\t\t{\n\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\texpression: ['\"communication\"'],\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\texpression: ['\"address\"'],\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\texpression: ['\"temp1\"'],\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\texpression: ['\"temp2\"'],\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t},\n};\n\nexport const Demo: Story = {\n\ttags: [\"!autodocs\"],\n\targs: Default.args,\n\trender: () => (\n\t\t<div className=\"flex flex-col gap-6\">\n\t\t\t<div>\n\t\t\t\t<h3 className=\"typo-h4 mb-2\">Errors only</h3>\n\t\t\t\t<OperationOutcomeView\n\t\t\t\t\tresource={{\n\t\t\t\t\t\tresourceType: \"OperationOutcome\",\n\t\t\t\t\t\tissue: [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\t\t\t\texpression: ['\"communication\"'],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\t\t\t\texpression: ['\"address\"'],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t],\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div>\n\t\t\t\t<h3 className=\"typo-h4 mb-2\">Warnings only</h3>\n\t\t\t\t<OperationOutcomeView\n\t\t\t\t\tresource={{\n\t\t\t\t\t\tresourceType: \"OperationOutcome\",\n\t\t\t\t\t\tissue: [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"business-rule\",\n\t\t\t\t\t\t\t\tseverity: \"warning\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Resource has no narrative text\",\n\t\t\t\t\t\t\t\texpression: [\"Patient.text\"],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"informational\",\n\t\t\t\t\t\t\t\tseverity: \"warning\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Best practice violation\",\n\t\t\t\t\t\t\t\texpression: [\"Patient.contact\"],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t],\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div>\n\t\t\t\t<h3 className=\"typo-h4 mb-2\">Mixed severities</h3>\n\t\t\t\t<OperationOutcomeView\n\t\t\t\t\tresource={{\n\t\t\t\t\t\tresourceType: \"OperationOutcome\",\n\t\t\t\t\t\tissue: [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"structure\",\n\t\t\t\t\t\t\t\tseverity: \"fatal\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Invalid JSON\",\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\t\t\t\texpression: ['\"temp1\"'],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"invalid\",\n\t\t\t\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Unknown key:\",\n\t\t\t\t\t\t\t\texpression: ['\"temp2\"'],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"business-rule\",\n\t\t\t\t\t\t\t\tseverity: \"warning\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Missing preferred field\",\n\t\t\t\t\t\t\t\texpression: [\"Patient.name.given\"],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"informational\",\n\t\t\t\t\t\t\t\tseverity: \"information\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Validation completed with issues\",\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t],\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\n\t\t\t<div>\n\t\t\t\t<h3 className=\"typo-h4 mb-2\">With multiple expressions</h3>\n\t\t\t\t<OperationOutcomeView\n\t\t\t\t\tresource={{\n\t\t\t\t\t\tresourceType: \"OperationOutcome\",\n\t\t\t\t\t\tissue: [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"required\",\n\t\t\t\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Missing required element\",\n\t\t\t\t\t\t\t\texpression: [\"Patient.identifier\", \"Patient.name\"],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcode: \"value\",\n\t\t\t\t\t\t\t\tseverity: \"error\",\n\t\t\t\t\t\t\t\tdiagnostics: \"Invalid date format\",\n\t\t\t\t\t\t\t\texpression: [\"Patient.birthDate\"],\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t],\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t),\n};\n"],"names":["OperationOutcomeView","meta","title","component","parameters","layout","Default","args","resource","resourceType","issue","code","severity","diagnostics","expression","Demo","tags","render","div","className","h3"],"mappings":";AACA,SAASA,oBAAoB,QAAQ,8BAA2B;AAEhE,MAAMC,OAAO;IACZC,OAAO;IACPC,WAAWH;IACXI,YAAY;QACXC,QAAQ;IACT;AACD;AAEA,eAAeJ,KAAK;AAGpB,OAAO,MAAMK,UAAiB;IAC7BC,MAAM;QACLC,UAAU;YACTC,cAAc;YACdC,OAAO;gBACN;oBACCC,MAAM;oBACNC,UAAU;oBACVC,aAAa;oBACbC,YAAY;wBAAC;qBAAkB;gBAChC;gBACA;oBACCH,MAAM;oBACNC,UAAU;oBACVC,aAAa;oBACbC,YAAY;wBAAC;qBAAY;gBAC1B;gBACA;oBACCH,MAAM;oBACNC,UAAU;oBACVC,aAAa;oBACbC,YAAY;wBAAC;qBAAU;gBACxB;gBACA;oBACCH,MAAM;oBACNC,UAAU;oBACVC,aAAa;oBACbC,YAAY;wBAAC;qBAAU;gBACxB;aACA;QACF;IACD;AACD,EAAE;AAEF,OAAO,MAAMC,OAAc;IAC1BC,MAAM;QAAC;KAAY;IACnBT,MAAMD,QAAQC,IAAI;IAClBU,QAAQ,kBACP,MAACC;YAAIC,WAAU;;8BACd,MAACD;;sCACA,KAACE;4BAAGD,WAAU;sCAAe;;sCAC7B,KAACnB;4BACAQ,UAAU;gCACTC,cAAc;gCACdC,OAAO;oCACN;wCACCC,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAkB;oCAChC;oCACA;wCACCH,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAY;oCAC1B;iCACA;4BACF;;;;8BAIF,MAACI;;sCACA,KAACE;4BAAGD,WAAU;sCAAe;;sCAC7B,KAACnB;4BACAQ,UAAU;gCACTC,cAAc;gCACdC,OAAO;oCACN;wCACCC,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAe;oCAC7B;oCACA;wCACCH,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAkB;oCAChC;iCACA;4BACF;;;;8BAIF,MAACI;;sCACA,KAACE;4BAAGD,WAAU;sCAAe;;sCAC7B,KAACnB;4BACAQ,UAAU;gCACTC,cAAc;gCACdC,OAAO;oCACN;wCACCC,MAAM;wCACNC,UAAU;wCACVC,aAAa;oCACd;oCACA;wCACCF,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAU;oCACxB;oCACA;wCACCH,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAU;oCACxB;oCACA;wCACCH,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAqB;oCACnC;oCACA;wCACCH,MAAM;wCACNC,UAAU;wCACVC,aAAa;oCACd;iCACA;4BACF;;;;8BAIF,MAACK;;sCACA,KAACE;4BAAGD,WAAU;sCAAe;;sCAC7B,KAACnB;4BACAQ,UAAU;gCACTC,cAAc;gCACdC,OAAO;oCACN;wCACCC,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;4CAAsB;yCAAe;oCACnD;oCACA;wCACCH,MAAM;wCACNC,UAAU;wCACVC,aAAa;wCACbC,YAAY;4CAAC;yCAAoB;oCAClC;iCACA;4BACF;;;;;;AAKL,EAAE"}

package/dist/src/components/request-line-editor.d.ts

@@ -1,38 +1,16 @@
 import type * as React from "react";
-interface RequestLineEditorProps extends React.ComponentProps<"div"> {
-    selectedMethod: string;
-    setMethod: (value: string) => void;
-    methods: string[];
-    inputValue?: string | undefined;
-    onInputChange?: React.ChangeEventHandler<HTMLInputElement>;
-}
-declare const METHOD_COLORS: {
-    GET: {
-        text: string;
-        background: string;
-        border: string;
-    };
-    POST: {
-        text: string;
-        background: string;
-        border: string;
-    };
-    PUT: {
-        text: string;
-        background: string;
-        border: string;
-    };
-    PATCH: {
-        text: string;
-        background: string;
-        border: string;
-    };
-    DELETE: {
-        text: string;
-        background: string;
-        border: string;
-    };
+declare const requestMethodVariants: (props?: ({
+    method?: "GET" | "POST" | "PUT" | "PATCH" | "DELETE" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+type RequestLineEditorProps = {
+    method: string;
+    placeholder?: string;
+    autoFocus?: boolean;
+    onMethodChange: (newMethod: string) => void;
+    path?: string | undefined;
+    onPathChange?: React.ChangeEventHandler<HTMLInputElement>;
+    className?: string;
 };
-declare function RequestLineEditor({ className, selectedMethod, setMethod, methods, inputValue, onInputChange, }: RequestLineEditorProps): import("react/jsx-runtime").JSX.Element;
-export { RequestLineEditor, type RequestLineEditorProps, METHOD_COLORS };
+declare function RequestLineEditor({ className, method, onMethodChange, path, placeholder, autoFocus, onPathChange, }: RequestLineEditorProps): import("react/jsx-runtime").JSX.Element;
+export { RequestLineEditor, type RequestLineEditorProps, requestMethodVariants, };
 //# sourceMappingURL=request-line-editor.d.ts.map

package/dist/src/components/request-line-editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"request-line-editor.d.ts","sourceRoot":"","sources":["../../../src/components/request-line-editor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAYpC,UAAU,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACnE,cAAc,EAAE,MAAM,CAAC;IACvB,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,aAAa,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;CAC3D;AAED,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BlB,CAAC;AA8BF,iBAAS,iBAAiB,CAAC,EAC1B,SAAS,EACT,cAAc,EACd,SAAS,EACT,OAAO,EACP,UAAU,EACV,aAAa,GACb,EAAE,sBAAsB,2CAgBxB;AAED,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"request-line-editor.d.ts","sourceRoot":"","sources":["../../../src/components/request-line-editor.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAgBpC,QAAA,MAAM,qBAAqB;;8EA0B1B,CAAC;AAyCF,KAAK,sBAAsB,GAAG;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,iBAAS,iBAAiB,CAAC,EAC1B,SAAS,EACT,MAAM,EACN,cAAc,EACd,IAAI,EACJ,WAAW,EACX,SAAS,EACT,YAAY,GACZ,EAAE,sBAAsB,2CAoCxB;AAED,OAAO,EACN,iBAAiB,EACjB,KAAK,sBAAsB,EAC3B,qBAAqB,GACrB,CAAC"}

package/dist/src/components/request-line-editor.js

@@ -1,82 +1,106 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { toast } from "sonner";
 import { Input } from "../shadcn/components/ui/input.js";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../shadcn/components/ui/select.js";
 import { cn } from "../shadcn/lib/utils.js";
 import { CopyIcon } from "./copy-icon.js";
-const METHOD_COLORS = {
-    GET: {
-        text: "text-[#6D9F0F] [&_svg]:text-[#6D9F0F]!",
-        background: "bg-green-200",
-        border: "border-fg-success-secondary! hover:border-fg-success-secondary ring-green-200!"
-    },
-    POST: {
-        text: "text-yellow-600 [&_svg]:text-yellow-600!",
-        background: "bg-yellow-200",
-        border: "border-[#F4CB00]! hover:border-[#F4CB00] ring-yellow-200!"
-    },
-    PUT: {
-        text: "text-blue-500 [&_svg]:text-blue-500!",
-        background: "bg-blue-200",
-        border: "border-blue-400! hover:border-blue-400 ring-blue-200!"
-    },
-    PATCH: {
-        text: "text-violet-600 [&_svg]:text-violet-600",
-        background: "bg-violet-200",
-        border: "border-violet-400! hover:border-violet-400 ring-violet-200!"
-    },
-    DELETE: {
-        text: "text-red-600 [&_svg]:text-red-600!",
-        background: "bg-red-200",
-        border: "border-red-300! hover:border-red-300 ring-red-200!"
+const METHODS = [
+    "GET",
+    "POST",
+    "PUT",
+    "PATCH",
+    "DELETE"
+];
+const requestMethodVariants = cva(cn("cursor-pointer", "border-r-0", "rounded-r-none", "shadow-none", "typo-label", "text-left", "items-center", "w-26", // Focus states
+"focus-visible:ring-3", "focus-visible:ring-ring-blue", "focus-visible:border-border-link"), {
+    variants: {
+        method: {
+            GET: "text-utility-green [&_svg]:text-utility-green",
+            POST: "text-utility-yellow [&_svg]:text-utility-yellow",
+            PUT: "text-utility-blue [&_svg]:text-utility-blue ",
+            PATCH: "text-utility-violet [&_svg]:text-utility-violet",
+            DELETE: "text-utility-red [&_svg]:text-utility-red"
+        }
     }
-};
-function RequestMethodSelector({ selectedMethod, setMethod, methods }) {
+});
+function isKnownMethod(candidate) {
+    const methods = METHODS;
+    return methods.includes(candidate);
+}
+function RequestMethodSelector({ value, onValueChange }) {
     return /*#__PURE__*/ _jsxs(Select, {
-        value: selectedMethod,
-        onValueChange: setMethod,
+        value: value,
+        ...onValueChange ? {
+            onValueChange: onValueChange
+        } : {},
         children: [
             /*#__PURE__*/ _jsx(SelectTrigger, {
-                className: `min-w-26 border-r-0 rounded-r-none shadow-none ${METHOD_COLORS[selectedMethod].text} ${METHOD_COLORS[selectedMethod].background} ${METHOD_COLORS[selectedMethod].border}`,
-                children: /*#__PURE__*/ _jsx(SelectValue, {})
+                className: requestMethodVariants(isKnownMethod(value) ? {
+                    method: value
+                } : undefined),
+                children: /*#__PURE__*/ _jsx(SelectValue, {
+                    children: value
+                })
             }),
             /*#__PURE__*/ _jsx(SelectContent, {
-                children: methods.map((method)=>/*#__PURE__*/ _jsx(SelectItem, {
+                children: METHODS.map((method)=>/*#__PURE__*/ _jsx(SelectItem, {
                         value: method,
-                        children: /*#__PURE__*/ _jsxs("span", {
-                            className: `${METHOD_COLORS[method].text}`,
-                            children: [
-                                " ",
-                                method,
-                                " "
-                            ]
+                        children: /*#__PURE__*/ _jsx("span", {
+                            className: requestMethodVariants({
+                                method: method
+                            }),
+                            children: method
                         })
                     }, method))
             })
         ]
     });
 }
-function RequestLineEditor({ className, selectedMethod, setMethod, methods, inputValue, onInputChange }) {
+function RequestLineEditor({ className, method, onMethodChange, path, placeholder, autoFocus, onPathChange }) {
     return /*#__PURE__*/ _jsxs("div", {
         className: cn("flex", className),
         children: [
             /*#__PURE__*/ _jsx(RequestMethodSelector, {
-                selectedMethod: selectedMethod,
-                setMethod: setMethod,
-                methods: methods
+                value: method,
+                onValueChange: onMethodChange
             }),
             /*#__PURE__*/ _jsx(Input, {
-                className: `rounded-l-none ${METHOD_COLORS[selectedMethod].border}`,
-                value: inputValue,
+                className: "rounded-l-none",
+                value: path,
+                autoFocus: autoFocus,
+                placeholder: placeholder,
                 rightSlot: /*#__PURE__*/ _jsx(CopyIcon, {
-                    text: `${selectedMethod} ${inputValue}`
+                    text: `${method} ${path}`,
+                    tooltipText: "Copy request line",
+                    showToast: false,
+                    onCopy: (text)=>{
+                        // Custom toast for request line
+                        const truncatedText = text.length > 30 ? `${text.slice(0, 30)}...` : text;
+                        toast(/*#__PURE__*/ _jsxs("div", {
+                            className: "flex flex-col gap-1",
+                            children: [
+                                /*#__PURE__*/ _jsx("span", {
+                                    className: "typo-body",
+                                    children: "Request line copied"
+                                }),
+                                /*#__PURE__*/ _jsx("span", {
+                                    className: "typo-code text-text-secondary",
+                                    children: truncatedText
+                                })
+                            ]
+                        }), {
+                            duration: 2000
+                        });
+                    }
                 }),
-                ...onInputChange !== undefined ? {
-                    onChange: onInputChange
+                ...onPathChange !== undefined ? {
+                    onChange: onPathChange
                 } : {}
             })
         ]
     });
 }
-export { RequestLineEditor, METHOD_COLORS };
+export { RequestLineEditor, requestMethodVariants };
 
 //# sourceMappingURL=request-line-editor.js.map

package/dist/src/components/request-line-editor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/request-line-editor.tsx"],"sourcesContent":["import type * as React from \"react\";\nimport { Input } from \"#shadcn/components/ui/input\";\nimport {\n\tSelect,\n\tSelectContent,\n\tSelectItem,\n\tSelectTrigger,\n\tSelectValue,\n} from \"#shadcn/components/ui/select\";\nimport { cn } from \"#shadcn/lib/utils\";\nimport { CopyIcon } from \"./copy-icon\";\n\ninterface RequestLineEditorProps extends React.ComponentProps<\"div\"> {\n\tselectedMethod: string;\n\tsetMethod: (value: string) => void;\n\tmethods: string[];\n\tinputValue?: string | undefined;\n\tonInputChange?: React.ChangeEventHandler<HTMLInputElement>;\n}\n\nconst METHOD_COLORS = {\n\tGET: {\n\t\ttext: \"text-[#6D9F0F] [&_svg]:text-[#6D9F0F]!\",\n\t\tbackground: \"bg-green-200\",\n\t\tborder:\n\t\t\t\"border-fg-success-secondary! hover:border-fg-success-secondary ring-green-200!\",\n\t},\n\tPOST: {\n\t\ttext: \"text-yellow-600 [&_svg]:text-yellow-600!\",\n\t\tbackground: \"bg-yellow-200\",\n\t\tborder: \"border-[#F4CB00]! hover:border-[#F4CB00] ring-yellow-200!\",\n\t},\n\tPUT: {\n\t\ttext: \"text-blue-500 [&_svg]:text-blue-500!\",\n\t\tbackground: \"bg-blue-200\",\n\t\tborder: \"border-blue-400! hover:border-blue-400 ring-blue-200!\",\n\t},\n\tPATCH: {\n\t\ttext: \"text-violet-600 [&_svg]:text-violet-600\",\n\t\tbackground: \"bg-violet-200\",\n\t\tborder: \"border-violet-400! hover:border-violet-400 ring-violet-200!\",\n\t},\n\tDELETE: {\n\t\ttext: \"text-red-600 [&_svg]:text-red-600!\",\n\t\tbackground: \"bg-red-200\",\n\t\tborder: \"border-red-300! hover:border-red-300 ring-red-200!\",\n\t},\n};\n\nfunction RequestMethodSelector({\n\tselectedMethod,\n\tsetMethod,\n\tmethods,\n}: RequestLineEditorProps) {\n\treturn (\n\t\t<Select value={selectedMethod} onValueChange={setMethod}>\n\t\t\t<SelectTrigger\n\t\t\t\tclassName={`min-w-26 border-r-0 rounded-r-none shadow-none ${METHOD_COLORS[selectedMethod as keyof typeof METHOD_COLORS].text} ${METHOD_COLORS[selectedMethod as keyof typeof METHOD_COLORS].background} ${METHOD_COLORS[selectedMethod as keyof typeof METHOD_COLORS].border}`}\n\t\t\t>\n\t\t\t\t<SelectValue />\n\t\t\t</SelectTrigger>\n\t\t\t<SelectContent>\n\t\t\t\t{methods.map((method) => (\n\t\t\t\t\t<SelectItem key={method} value={method}>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={`${METHOD_COLORS[method as keyof typeof METHOD_COLORS].text}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{\" \"}\n\t\t\t\t\t\t\t{method}{\" \"}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</SelectItem>\n\t\t\t\t))}\n\t\t\t</SelectContent>\n\t\t</Select>\n\t);\n}\n\nfunction RequestLineEditor({\n\tclassName,\n\tselectedMethod,\n\tsetMethod,\n\tmethods,\n\tinputValue,\n\tonInputChange,\n}: RequestLineEditorProps) {\n\treturn (\n\t\t<div className={cn(\"flex\", className)}>\n\t\t\t<RequestMethodSelector\n\t\t\t\tselectedMethod={selectedMethod}\n\t\t\t\tsetMethod={setMethod}\n\t\t\t\tmethods={methods}\n\t\t\t/>\n\t\t\t<Input\n\t\t\t\tclassName={`rounded-l-none ${METHOD_COLORS[selectedMethod as keyof typeof METHOD_COLORS].border}`}\n\t\t\t\tvalue={inputValue}\n\t\t\t\trightSlot={<CopyIcon text={`${selectedMethod} ${inputValue}`} />}\n\t\t\t\t{...(onInputChange !== undefined ? { onChange: onInputChange } : {})}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport { RequestLineEditor, type RequestLineEditorProps, METHOD_COLORS };\n"],"names":["Input","Select","SelectContent","SelectItem","SelectTrigger","SelectValue","cn","CopyIcon","METHOD_COLORS","GET","text","background","border","POST","PUT","PATCH","DELETE","RequestMethodSelector","selectedMethod","setMethod","methods","value","onValueChange","className","map","method","span","RequestLineEditor","inputValue","onInputChange","div","rightSlot","undefined","onChange"],"mappings":";AACA,SAASA,KAAK,QAAQ,mCAA8B;AACpD,SACCC,MAAM,EACNC,aAAa,EACbC,UAAU,EACVC,aAAa,EACbC,WAAW,QACL,oCAA+B;AACtC,SAASC,EAAE,QAAQ,yBAAoB;AACvC,SAASC,QAAQ,QAAQ,iBAAc;AAUvC,MAAMC,gBAAgB;IACrBC,KAAK;QACJC,MAAM;QACNC,YAAY;QACZC,QACC;IACF;IACAC,MAAM;QACLH,MAAM;QACNC,YAAY;QACZC,QAAQ;IACT;IACAE,KAAK;QACJJ,MAAM;QACNC,YAAY;QACZC,QAAQ;IACT;IACAG,OAAO;QACNL,MAAM;QACNC,YAAY;QACZC,QAAQ;IACT;IACAI,QAAQ;QACPN,MAAM;QACNC,YAAY;QACZC,QAAQ;IACT;AACD;AAEA,SAASK,sBAAsB,EAC9BC,cAAc,EACdC,SAAS,EACTC,OAAO,EACiB;IACxB,qBACC,MAACnB;QAAOoB,OAAOH;QAAgBI,eAAeH;;0BAC7C,KAACf;gBACAmB,WAAW,CAAC,+CAA+C,EAAEf,aAAa,CAACU,eAA6C,CAACR,IAAI,CAAC,CAAC,EAAEF,aAAa,CAACU,eAA6C,CAACP,UAAU,CAAC,CAAC,EAAEH,aAAa,CAACU,eAA6C,CAACN,MAAM,EAAE;0BAE/Q,cAAA,KAACP;;0BAEF,KAACH;0BACCkB,QAAQI,GAAG,CAAC,CAACC,uBACb,KAACtB;wBAAwBkB,OAAOI;kCAC/B,cAAA,MAACC;4BACAH,WAAW,GAAGf,aAAa,CAACiB,OAAqC,CAACf,IAAI,EAAE;;gCAEvE;gCACAe;gCAAQ;;;uBALMA;;;;AAYtB;AAEA,SAASE,kBAAkB,EAC1BJ,SAAS,EACTL,cAAc,EACdC,SAAS,EACTC,OAAO,EACPQ,UAAU,EACVC,aAAa,EACW;IACxB,qBACC,MAACC;QAAIP,WAAWjB,GAAG,QAAQiB;;0BAC1B,KAACN;gBACAC,gBAAgBA;gBAChBC,WAAWA;gBACXC,SAASA;;0BAEV,KAACpB;gBACAuB,WAAW,CAAC,eAAe,EAAEf,aAAa,CAACU,eAA6C,CAACN,MAAM,EAAE;gBACjGS,OAAOO;gBACPG,yBAAW,KAACxB;oBAASG,MAAM,GAAGQ,eAAe,CAAC,EAAEU,YAAY;;gBAC3D,GAAIC,kBAAkBG,YAAY;oBAAEC,UAAUJ;gBAAc,IAAI,CAAC,CAAC;;;;AAIvE;AAEA,SAASF,iBAAiB,EAA+BnB,aAAa,GAAG"}
+{"version":3,"sources":["../../../src/components/request-line-editor.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { toast } from \"sonner\";\nimport { Input } from \"#shadcn/components/ui/input\";\nimport {\n\tSelect,\n\tSelectContent,\n\tSelectItem,\n\tSelectTrigger,\n\tSelectValue,\n} from \"#shadcn/components/ui/select\";\nimport { cn } from \"#shadcn/lib/utils\";\nimport { CopyIcon } from \"./copy-icon\";\n\nconst METHODS = [\"GET\", \"POST\", \"PUT\", \"PATCH\", \"DELETE\"] as const;\ntype RequestMethod = (typeof METHODS)[number];\n\nconst requestMethodVariants = cva<{ method: { [K in RequestMethod]: string } }>(\n\tcn(\n\t\t\"cursor-pointer\",\n\t\t\"border-r-0\",\n\t\t\"rounded-r-none\",\n\t\t\"shadow-none\",\n\t\t\"typo-label\",\n\t\t\"text-left\",\n\t\t\"items-center\",\n\t\t\"w-26\",\n\t\t// Focus states\n\t\t\"focus-visible:ring-3\",\n\t\t\"focus-visible:ring-ring-blue\",\n\t\t\"focus-visible:border-border-link\",\n\t),\n\t{\n\t\tvariants: {\n\t\t\tmethod: {\n\t\t\t\tGET: \"text-utility-green [&_svg]:text-utility-green\",\n\t\t\t\tPOST: \"text-utility-yellow [&_svg]:text-utility-yellow\",\n\t\t\t\tPUT: \"text-utility-blue [&_svg]:text-utility-blue \",\n\t\t\t\tPATCH: \"text-utility-violet [&_svg]:text-utility-violet\",\n\t\t\t\tDELETE: \"text-utility-red [&_svg]:text-utility-red\",\n\t\t\t},\n\t\t},\n\t},\n);\n\ntype RequestMethodSelectorProps = {\n\tvalue: string;\n\tonValueChange?: (newMethod: string) => void;\n};\n\nfunction isKnownMethod(candidate: string): candidate is RequestMethod {\n\tconst methods: readonly string[] = METHODS;\n\treturn methods.includes(candidate);\n}\n\nfunction RequestMethodSelector({\n\tvalue,\n\tonValueChange,\n}: RequestMethodSelectorProps) {\n\treturn (\n\t\t<Select\n\t\t\tvalue={value}\n\t\t\t{...(onValueChange ? { onValueChange: onValueChange } : {})}\n\t\t>\n\t\t\t<SelectTrigger\n\t\t\t\tclassName={requestMethodVariants(\n\t\t\t\t\tisKnownMethod(value) ? { method: value } : undefined,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<SelectValue>{value}</SelectValue>\n\t\t\t</SelectTrigger>\n\t\t\t<SelectContent>\n\t\t\t\t{METHODS.map((method) => (\n\t\t\t\t\t<SelectItem key={method} value={method}>\n\t\t\t\t\t\t<span className={requestMethodVariants({ method: method })}>\n\t\t\t\t\t\t\t{method}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</SelectItem>\n\t\t\t\t))}\n\t\t\t</SelectContent>\n\t\t</Select>\n\t);\n}\n\ntype RequestLineEditorProps = {\n\tmethod: string;\n\tplaceholder?: string;\n\tautoFocus?: boolean;\n\tonMethodChange: (newMethod: string) => void;\n\tpath?: string | undefined;\n\tonPathChange?: React.ChangeEventHandler<HTMLInputElement>;\n\tclassName?: string;\n};\n\nfunction RequestLineEditor({\n\tclassName,\n\tmethod,\n\tonMethodChange,\n\tpath,\n\tplaceholder,\n\tautoFocus,\n\tonPathChange,\n}: RequestLineEditorProps) {\n\treturn (\n\t\t<div className={cn(\"flex\", className)}>\n\t\t\t<RequestMethodSelector value={method} onValueChange={onMethodChange} />\n\t\t\t<Input\n\t\t\t\tclassName=\"rounded-l-none\"\n\t\t\t\tvalue={path}\n\t\t\t\tautoFocus={autoFocus}\n\t\t\t\tplaceholder={placeholder}\n\t\t\t\trightSlot={\n\t\t\t\t\t<CopyIcon\n\t\t\t\t\t\ttext={`${method} ${path}`}\n\t\t\t\t\t\ttooltipText=\"Copy request line\"\n\t\t\t\t\t\tshowToast={false}\n\t\t\t\t\t\tonCopy={(text) => {\n\t\t\t\t\t\t\t// Custom toast for request line\n\t\t\t\t\t\t\tconst truncatedText =\n\t\t\t\t\t\t\t\ttext.length > 30 ? `${text.slice(0, 30)}...` : text;\n\t\t\t\t\t\t\ttoast(\n\t\t\t\t\t\t\t\t<div className=\"flex flex-col gap-1\">\n\t\t\t\t\t\t\t\t\t<span className=\"typo-body\">Request line copied</span>\n\t\t\t\t\t\t\t\t\t<span className=\"typo-code text-text-secondary\">\n\t\t\t\t\t\t\t\t\t\t{truncatedText}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</div>,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tduration: 2000,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\t{...(onPathChange !== undefined ? { onChange: onPathChange } : {})}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport {\n\tRequestLineEditor,\n\ttype RequestLineEditorProps,\n\trequestMethodVariants,\n};\n"],"names":["cva","toast","Input","Select","SelectContent","SelectItem","SelectTrigger","SelectValue","cn","CopyIcon","METHODS","requestMethodVariants","variants","method","GET","POST","PUT","PATCH","DELETE","isKnownMethod","candidate","methods","includes","RequestMethodSelector","value","onValueChange","className","undefined","map","span","RequestLineEditor","onMethodChange","path","placeholder","autoFocus","onPathChange","div","rightSlot","text","tooltipText","showToast","onCopy","truncatedText","length","slice","duration","onChange"],"mappings":";AAAA,SAASA,GAAG,QAAQ,2BAA2B;AAE/C,SAASC,KAAK,QAAQ,SAAS;AAC/B,SAASC,KAAK,QAAQ,mCAA8B;AACpD,SACCC,MAAM,EACNC,aAAa,EACbC,UAAU,EACVC,aAAa,EACbC,WAAW,QACL,oCAA+B;AACtC,SAASC,EAAE,QAAQ,yBAAoB;AACvC,SAASC,QAAQ,QAAQ,iBAAc;AAEvC,MAAMC,UAAU;IAAC;IAAO;IAAQ;IAAO;IAAS;CAAS;AAGzD,MAAMC,wBAAwBX,IAC7BQ,GACC,kBACA,cACA,kBACA,eACA,cACA,aACA,gBACA,QACA,eAAe;AACf,wBACA,gCACA,qCAED;IACCI,UAAU;QACTC,QAAQ;YACPC,KAAK;YACLC,MAAM;YACNC,KAAK;YACLC,OAAO;YACPC,QAAQ;QACT;IACD;AACD;AAQD,SAASC,cAAcC,SAAiB;IACvC,MAAMC,UAA6BX;IACnC,OAAOW,QAAQC,QAAQ,CAACF;AACzB;AAEA,SAASG,sBAAsB,EAC9BC,KAAK,EACLC,aAAa,EACe;IAC5B,qBACC,MAACtB;QACAqB,OAAOA;QACN,GAAIC,gBAAgB;YAAEA,eAAeA;QAAc,IAAI,CAAC,CAAC;;0BAE1D,KAACnB;gBACAoB,WAAWf,sBACVQ,cAAcK,SAAS;oBAAEX,QAAQW;gBAAM,IAAIG;0BAG5C,cAAA,KAACpB;8BAAaiB;;;0BAEf,KAACpB;0BACCM,QAAQkB,GAAG,CAAC,CAACf,uBACb,KAACR;wBAAwBmB,OAAOX;kCAC/B,cAAA,KAACgB;4BAAKH,WAAWf,sBAAsB;gCAAEE,QAAQA;4BAAO;sCACtDA;;uBAFcA;;;;AAStB;AAYA,SAASiB,kBAAkB,EAC1BJ,SAAS,EACTb,MAAM,EACNkB,cAAc,EACdC,IAAI,EACJC,WAAW,EACXC,SAAS,EACTC,YAAY,EACY;IACxB,qBACC,MAACC;QAAIV,WAAWlB,GAAG,QAAQkB;;0BAC1B,KAACH;gBAAsBC,OAAOX;gBAAQY,eAAeM;;0BACrD,KAAC7B;gBACAwB,WAAU;gBACVF,OAAOQ;gBACPE,WAAWA;gBACXD,aAAaA;gBACbI,yBACC,KAAC5B;oBACA6B,MAAM,GAAGzB,OAAO,CAAC,EAAEmB,MAAM;oBACzBO,aAAY;oBACZC,WAAW;oBACXC,QAAQ,CAACH;wBACR,gCAAgC;wBAChC,MAAMI,gBACLJ,KAAKK,MAAM,GAAG,KAAK,GAAGL,KAAKM,KAAK,CAAC,GAAG,IAAI,GAAG,CAAC,GAAGN;wBAChDrC,oBACC,MAACmC;4BAAIV,WAAU;;8CACd,KAACG;oCAAKH,WAAU;8CAAY;;8CAC5B,KAACG;oCAAKH,WAAU;8CACdgB;;;4BAGH;4BACCG,UAAU;wBACX;oBAEF;;gBAGD,GAAIV,iBAAiBR,YAAY;oBAAEmB,UAAUX;gBAAa,IAAI,CAAC,CAAC;;;;AAIrE;AAEA,SACCL,iBAAiB,EAEjBnB,qBAAqB,GACpB"}

package/dist/src/components/request-line-editor.stories.js

@@ -13,9 +13,9 @@ const meta = {
     ]
 };
 export default meta;
-function RequestLineEditorWrapper({ selectedMethod, methods, inputValue }) {
-    const [currentSelectedMethod, setMethod] = React.useState(selectedMethod);
-    const [currentInputValue, setInputValue] = React.useState(inputValue);
+function RequestLineEditorWrapper({ method, path }) {
+    const [currentSelectedMethod, setMethod] = React.useState(method);
+    const [currentInputValue, setInputValue] = React.useState(path);
     const actionSetMethod = (method)=>{
         action("setMethod")(method);
         setMethod(method);
@@ -25,24 +25,16 @@ function RequestLineEditorWrapper({ selectedMethod, methods, inputValue }) {
         setInputValue(event.target.value);
     };
     return /*#__PURE__*/ _jsx(RequestLineEditor, {
-        methods: methods,
-        selectedMethod: currentSelectedMethod,
-        setMethod: actionSetMethod,
-        inputValue: currentInputValue,
-        onInputChange: actionSetInputValue
+        method: currentSelectedMethod,
+        onMethodChange: actionSetMethod,
+        path: currentInputValue,
+        onPathChange: actionSetInputValue
     });
 }
 export const GET = {
     args: {
-        selectedMethod: "GET",
-        methods: [
-            "GET",
-            "POST",
-            "PUT",
-            "PATCH",
-            "DELETE"
-        ],
-        inputValue: "/fhir/Patient"
+        method: "GET",
+        path: "/fhir/Patient"
     },
     render: (args)=>/*#__PURE__*/ _jsx(RequestLineEditorWrapper, {
             ...args
@@ -50,15 +42,8 @@ export const GET = {
 };
 export const POST = {
     args: {
-        selectedMethod: "POST",
-        methods: [
-            "GET",
-            "POST",
-            "PUT",
-            "PATCH",
-            "DELETE"
-        ],
-        inputValue: "/fhir/Patient"
+        method: "POST",
+        path: "/fhir/Patient"
     },
     render: (args)=>/*#__PURE__*/ _jsx(RequestLineEditorWrapper, {
             ...args
@@ -66,15 +51,8 @@ export const POST = {
 };
 export const PUT = {
     args: {
-        selectedMethod: "PUT",
-        methods: [
-            "GET",
-            "POST",
-            "PUT",
-            "PATCH",
-            "DELETE"
-        ],
-        inputValue: "/fhir/Patient"
+        method: "PUT",
+        path: "/fhir/Patient"
     },
     render: (args)=>/*#__PURE__*/ _jsx(RequestLineEditorWrapper, {
             ...args
@@ -82,15 +60,8 @@ export const PUT = {
 };
 export const PATCH = {
     args: {
-        selectedMethod: "PATCH",
-        methods: [
-            "GET",
-            "POST",
-            "PUT",
-            "PATCH",
-            "DELETE"
-        ],
-        inputValue: "/fhir/Patient"
+        method: "PATCH",
+        path: "/fhir/Patient"
     },
     render: (args)=>/*#__PURE__*/ _jsx(RequestLineEditorWrapper, {
             ...args
@@ -98,15 +69,8 @@ export const PATCH = {
 };
 export const DELETE = {
     args: {
-        selectedMethod: "DELETE",
-        methods: [
-            "GET",
-            "POST",
-            "PUT",
-            "PATCH",
-            "DELETE"
-        ],
-        inputValue: "/fhir/Patient"
+        method: "DELETE",
+        path: "/fhir/Patient"
     },
     render: (args)=>/*#__PURE__*/ _jsx(RequestLineEditorWrapper, {
             ...args

package/dist/src/components/request-line-editor.stories.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/request-line-editor.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport * as React from \"react\";\nimport { action } from \"storybook/actions\";\nimport {\n\tRequestLineEditor,\n\ttype RequestLineEditorProps,\n} from \"./request-line-editor\";\n\nconst meta: Meta<typeof RequestLineEditor> = {\n\ttitle: \"Component/Request line editor\",\n\tcomponent: RequestLineEditor,\n\tparameters: {\n\t\tlayout: \"centered\",\n\t},\n\ttags: [\"autodocs\"],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof RequestLineEditor>;\n\nfunction RequestLineEditorWrapper({\n\tselectedMethod,\n\tmethods,\n\tinputValue,\n}: RequestLineEditorProps) {\n\tconst [currentSelectedMethod, setMethod] = React.useState(selectedMethod);\n\tconst [currentInputValue, setInputValue] = React.useState(inputValue);\n\tconst actionSetMethod = (method: string) => {\n\t\taction(\"setMethod\")(method);\n\t\tsetMethod(method);\n\t};\n\tconst actionSetInputValue = (event: React.ChangeEvent<HTMLInputElement>) => {\n\t\taction(\"setMethod\")(event);\n\t\tsetInputValue(event.target.value);\n\t};\n\treturn (\n\t\t<RequestLineEditor\n\t\t\tmethods={methods}\n\t\t\tselectedMethod={currentSelectedMethod}\n\t\t\tsetMethod={actionSetMethod}\n\t\t\tinputValue={currentInputValue}\n\t\t\tonInputChange={actionSetInputValue}\n\t\t/>\n\t);\n}\n\nexport const GET: Story = {\n\targs: {\n\t\tselectedMethod: \"GET\",\n\t\tmethods: [\"GET\", \"POST\", \"PUT\", \"PATCH\", \"DELETE\"],\n\t\tinputValue: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const POST: Story = {\n\targs: {\n\t\tselectedMethod: \"POST\",\n\t\tmethods: [\"GET\", \"POST\", \"PUT\", \"PATCH\", \"DELETE\"],\n\t\tinputValue: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const PUT: Story = {\n\targs: {\n\t\tselectedMethod: \"PUT\",\n\t\tmethods: [\"GET\", \"POST\", \"PUT\", \"PATCH\", \"DELETE\"],\n\t\tinputValue: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const PATCH: Story = {\n\targs: {\n\t\tselectedMethod: \"PATCH\",\n\t\tmethods: [\"GET\", \"POST\", \"PUT\", \"PATCH\", \"DELETE\"],\n\t\tinputValue: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const DELETE: Story = {\n\targs: {\n\t\tselectedMethod: \"DELETE\",\n\t\tmethods: [\"GET\", \"POST\", \"PUT\", \"PATCH\", \"DELETE\"],\n\t\tinputValue: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n"],"names":["React","action","RequestLineEditor","meta","title","component","parameters","layout","tags","RequestLineEditorWrapper","selectedMethod","methods","inputValue","currentSelectedMethod","setMethod","useState","currentInputValue","setInputValue","actionSetMethod","method","actionSetInputValue","event","target","value","onInputChange","GET","args","render","POST","PUT","PATCH","DELETE"],"mappings":";AACA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,MAAM,QAAQ,oBAAoB;AAC3C,SACCC,iBAAiB,QAEX,2BAAwB;AAE/B,MAAMC,OAAuC;IAC5CC,OAAO;IACPC,WAAWH;IACXI,YAAY;QACXC,QAAQ;IACT;IACAC,MAAM;QAAC;KAAW;AACnB;AAEA,eAAeL,KAAK;AAGpB,SAASM,yBAAyB,EACjCC,cAAc,EACdC,OAAO,EACPC,UAAU,EACc;IACxB,MAAM,CAACC,uBAAuBC,UAAU,GAAGd,MAAMe,QAAQ,CAACL;IAC1D,MAAM,CAACM,mBAAmBC,cAAc,GAAGjB,MAAMe,QAAQ,CAACH;IAC1D,MAAMM,kBAAkB,CAACC;QACxBlB,OAAO,aAAakB;QACpBL,UAAUK;IACX;IACA,MAAMC,sBAAsB,CAACC;QAC5BpB,OAAO,aAAaoB;QACpBJ,cAAcI,MAAMC,MAAM,CAACC,KAAK;IACjC;IACA,qBACC,KAACrB;QACAS,SAASA;QACTD,gBAAgBG;QAChBC,WAAWI;QACXN,YAAYI;QACZQ,eAAeJ;;AAGlB;AAEA,OAAO,MAAMK,MAAa;IACzBC,MAAM;QACLhB,gBAAgB;QAChBC,SAAS;YAAC;YAAO;YAAQ;YAAO;YAAS;SAAS;QAClDC,YAAY;IACb;IACAe,QAAQ,CAACD,qBAAS,KAACjB;YAA0B,GAAGiB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAME,OAAc;IAC1BF,MAAM;QACLhB,gBAAgB;QAChBC,SAAS;YAAC;YAAO;YAAQ;YAAO;YAAS;SAAS;QAClDC,YAAY;IACb;IACAe,QAAQ,CAACD,qBAAS,KAACjB;YAA0B,GAAGiB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAMG,MAAa;IACzBH,MAAM;QACLhB,gBAAgB;QAChBC,SAAS;YAAC;YAAO;YAAQ;YAAO;YAAS;SAAS;QAClDC,YAAY;IACb;IACAe,QAAQ,CAACD,qBAAS,KAACjB;YAA0B,GAAGiB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAMI,QAAe;IAC3BJ,MAAM;QACLhB,gBAAgB;QAChBC,SAAS;YAAC;YAAO;YAAQ;YAAO;YAAS;SAAS;QAClDC,YAAY;IACb;IACAe,QAAQ,CAACD,qBAAS,KAACjB;YAA0B,GAAGiB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAMK,SAAgB;IAC5BL,MAAM;QACLhB,gBAAgB;QAChBC,SAAS;YAAC;YAAO;YAAQ;YAAO;YAAS;SAAS;QAClDC,YAAY;IACb;IACAe,QAAQ,CAACD,qBAAS,KAACjB;YAA0B,GAAGiB,IAAI;;AACrD,EAAE"}
+{"version":3,"sources":["../../../src/components/request-line-editor.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport * as React from \"react\";\nimport { action } from \"storybook/actions\";\nimport {\n\tRequestLineEditor,\n\ttype RequestLineEditorProps,\n} from \"./request-line-editor\";\n\nconst meta: Meta<typeof RequestLineEditor> = {\n\ttitle: \"Component/Request line editor\",\n\tcomponent: RequestLineEditor,\n\tparameters: {\n\t\tlayout: \"centered\",\n\t},\n\ttags: [\"autodocs\"],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof RequestLineEditor>;\n\nfunction RequestLineEditorWrapper({ method, path }: RequestLineEditorProps) {\n\tconst [currentSelectedMethod, setMethod] = React.useState(method);\n\tconst [currentInputValue, setInputValue] = React.useState(path);\n\tconst actionSetMethod = (method: string) => {\n\t\taction(\"setMethod\")(method);\n\t\tsetMethod(method);\n\t};\n\tconst actionSetInputValue = (event: React.ChangeEvent<HTMLInputElement>) => {\n\t\taction(\"setMethod\")(event);\n\t\tsetInputValue(event.target.value);\n\t};\n\treturn (\n\t\t<RequestLineEditor\n\t\t\tmethod={currentSelectedMethod}\n\t\t\tonMethodChange={actionSetMethod}\n\t\t\tpath={currentInputValue}\n\t\t\tonPathChange={actionSetInputValue}\n\t\t/>\n\t);\n}\n\nexport const GET: Story = {\n\targs: {\n\t\tmethod: \"GET\",\n\t\tpath: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const POST: Story = {\n\targs: {\n\t\tmethod: \"POST\",\n\t\tpath: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const PUT: Story = {\n\targs: {\n\t\tmethod: \"PUT\",\n\t\tpath: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const PATCH: Story = {\n\targs: {\n\t\tmethod: \"PATCH\",\n\t\tpath: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n\nexport const DELETE: Story = {\n\targs: {\n\t\tmethod: \"DELETE\",\n\t\tpath: \"/fhir/Patient\",\n\t},\n\trender: (args) => <RequestLineEditorWrapper {...args} />,\n};\n"],"names":["React","action","RequestLineEditor","meta","title","component","parameters","layout","tags","RequestLineEditorWrapper","method","path","currentSelectedMethod","setMethod","useState","currentInputValue","setInputValue","actionSetMethod","actionSetInputValue","event","target","value","onMethodChange","onPathChange","GET","args","render","POST","PUT","PATCH","DELETE"],"mappings":";AACA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,MAAM,QAAQ,oBAAoB;AAC3C,SACCC,iBAAiB,QAEX,2BAAwB;AAE/B,MAAMC,OAAuC;IAC5CC,OAAO;IACPC,WAAWH;IACXI,YAAY;QACXC,QAAQ;IACT;IACAC,MAAM;QAAC;KAAW;AACnB;AAEA,eAAeL,KAAK;AAGpB,SAASM,yBAAyB,EAAEC,MAAM,EAAEC,IAAI,EAA0B;IACzE,MAAM,CAACC,uBAAuBC,UAAU,GAAGb,MAAMc,QAAQ,CAACJ;IAC1D,MAAM,CAACK,mBAAmBC,cAAc,GAAGhB,MAAMc,QAAQ,CAACH;IAC1D,MAAMM,kBAAkB,CAACP;QACxBT,OAAO,aAAaS;QACpBG,UAAUH;IACX;IACA,MAAMQ,sBAAsB,CAACC;QAC5BlB,OAAO,aAAakB;QACpBH,cAAcG,MAAMC,MAAM,CAACC,KAAK;IACjC;IACA,qBACC,KAACnB;QACAQ,QAAQE;QACRU,gBAAgBL;QAChBN,MAAMI;QACNQ,cAAcL;;AAGjB;AAEA,OAAO,MAAMM,MAAa;IACzBC,MAAM;QACLf,QAAQ;QACRC,MAAM;IACP;IACAe,QAAQ,CAACD,qBAAS,KAAChB;YAA0B,GAAGgB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAME,OAAc;IAC1BF,MAAM;QACLf,QAAQ;QACRC,MAAM;IACP;IACAe,QAAQ,CAACD,qBAAS,KAAChB;YAA0B,GAAGgB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAMG,MAAa;IACzBH,MAAM;QACLf,QAAQ;QACRC,MAAM;IACP;IACAe,QAAQ,CAACD,qBAAS,KAAChB;YAA0B,GAAGgB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAMI,QAAe;IAC3BJ,MAAM;QACLf,QAAQ;QACRC,MAAM;IACP;IACAe,QAAQ,CAACD,qBAAS,KAAChB;YAA0B,GAAGgB,IAAI;;AACrD,EAAE;AAEF,OAAO,MAAMK,SAAgB;IAC5BL,MAAM;QACLf,QAAQ;QACRC,MAAM;IACP;IACAe,QAAQ,CAACD,qBAAS,KAAChB;YAA0B,GAAGgB,IAAI;;AACrD,EAAE"}

package/dist/src/components/sandbox.d.ts

@@ -0,0 +1,13 @@
+import type React from "react";
+export interface SandboxProps extends Omit<React.ComponentProps<"div">, "children" | "onCopy"> {
+    url: string;
+    showCopy?: boolean;
+    showEye?: boolean;
+    copyIcon?: React.ReactNode;
+    tooltipText?: string;
+    showToast?: boolean;
+    onCopy?: (text: string) => void;
+}
+declare function Sandbox({ url, showCopy, showEye, copyIcon, tooltipText, showToast, onCopy, className, ...props }: SandboxProps): import("react/jsx-runtime").JSX.Element;
+export { Sandbox };
+//# sourceMappingURL=sandbox.d.ts.map

package/dist/src/components/sandbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sandbox.d.ts","sourceRoot":"","sources":["../../../src/components/sandbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA8F/B,MAAM,WAAW,YAChB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,QAAQ,CAAC;IAChE,GAAG,EAAE,MAAM,CAAC;IAEZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC;AAED,iBAAS,OAAO,CAAC,EAChB,GAAG,EACH,QAAe,EACf,OAAc,EACd,QAAmB,EACnB,WAAwB,EACxB,SAAgB,EAChB,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACR,EAAE,YAAY,2CAkEd;AAED,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/src/components/sandbox.js

@@ -0,0 +1,107 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Copy, Eye, EyeOff } from "lucide-react";
+import { useState } from "react";
+import { toast } from "sonner";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../shadcn/components/ui/tooltip.js";
+import { cn } from "../shadcn/lib/utils.js";
+// Base sandbox styles
+const baseSandboxStyles = cn(// Layout
+"flex", "flex-col", "items-start", "relative", "size-full", // Spacing
+"gap-2");
+// Input container styles
+const inputContainerStyles = cn(// Layout
+"flex", "items-center", "gap-2", "w-full", // Spacing
+"px-3", "py-2", // Background & Border
+"bg-bg-tertiary", "rounded", // Overflow
+"overflow-hidden");
+// Content styles
+const contentStyles = cn(// Layout
+"flex", "items-center", "gap-2", "flex-1", "min-w-0");
+// Text styles
+const textStyles = cn(// Typography
+"typo-body", "text-text-primary", // Layout
+"flex-1", "min-w-0", "truncate");
+// Copy button styles
+const copyButtonStyles = cn(// Layout
+"flex", "items-center", "justify-center", "shrink-0", // Sizing
+"size-4", // Cursor
+"cursor-pointer", // Hover
+"hover:opacity-80", "transition-opacity", "duration-200");
+// Eye button styles
+const eyeButtonStyles = cn(// Layout
+"flex", "items-center", "justify-center", "shrink-0", // Sizing
+"size-4", // Cursor
+"cursor-pointer", // Hover
+"hover:opacity-80", "transition-opacity", "duration-200");
+function Sandbox({ url, showCopy = true, showEye = true, copyIcon = /*#__PURE__*/ _jsx(Copy, {}), tooltipText = "Copy URL", showToast = true, onCopy, className, ...props }) {
+    const [isVisible, setIsVisible] = useState(true);
+    return /*#__PURE__*/ _jsx("div", {
+        "data-slot": "sandbox",
+        className: cn(baseSandboxStyles, className),
+        ...props,
+        children: /*#__PURE__*/ _jsxs("div", {
+            className: inputContainerStyles,
+            children: [
+                /*#__PURE__*/ _jsx("div", {
+                    className: contentStyles,
+                    children: /*#__PURE__*/ _jsx("span", {
+                        className: textStyles,
+                        children: isVisible ? url : "•".repeat(url.length)
+                    })
+                }),
+                showEye && /*#__PURE__*/ _jsxs(Tooltip, {
+                    children: [
+                        /*#__PURE__*/ _jsx(TooltipTrigger, {
+                            asChild: true,
+                            children: /*#__PURE__*/ _jsx("button", {
+                                type: "button",
+                                className: eyeButtonStyles,
+                                onClick: ()=>setIsVisible(!isVisible),
+                                children: isVisible ? /*#__PURE__*/ _jsx(Eye, {}) : /*#__PURE__*/ _jsx(EyeOff, {})
+                            })
+                        }),
+                        /*#__PURE__*/ _jsx(TooltipContent, {
+                            children: /*#__PURE__*/ _jsx("p", {
+                                children: isVisible ? "Hide URL" : "Show URL"
+                            })
+                        })
+                    ]
+                }),
+                showCopy && /*#__PURE__*/ _jsxs(Tooltip, {
+                    children: [
+                        /*#__PURE__*/ _jsx(TooltipTrigger, {
+                            asChild: true,
+                            children: /*#__PURE__*/ _jsx("button", {
+                                type: "button",
+                                className: copyButtonStyles,
+                                onClick: async ()=>{
+                                    try {
+                                        await navigator.clipboard.writeText(url);
+                                        if (showToast) {
+                                            toast("Copied", {
+                                                description: url.length > 50 ? `${url.slice(0, 50)}...` : url,
+                                                duration: 2000
+                                            });
+                                        }
+                                        onCopy?.(url);
+                                    } catch (error) {
+                                        console.error("Failed to copy to clipboard:", error);
+                                    }
+                                },
+                                children: copyIcon
+                            })
+                        }),
+                        /*#__PURE__*/ _jsx(TooltipContent, {
+                            children: /*#__PURE__*/ _jsx("p", {
+                                children: tooltipText
+                            })
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+export { Sandbox };
+
+//# sourceMappingURL=sandbox.js.map

package/dist/src/components/sandbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/sandbox.tsx"],"sourcesContent":["import { Copy, Eye, EyeOff } from \"lucide-react\";\nimport type React from \"react\";\nimport { useState } from \"react\";\nimport { toast } from \"sonner\";\nimport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipTrigger,\n} from \"../shadcn/components/ui/tooltip\";\nimport { cn } from \"../shadcn/lib/utils\";\n\n// Base sandbox styles\nconst baseSandboxStyles = cn(\n\t// Layout\n\t\"flex\",\n\t\"flex-col\",\n\t\"items-start\",\n\t\"relative\",\n\t\"size-full\",\n\t// Spacing\n\t\"gap-2\",\n);\n\n// Input container styles\nconst inputContainerStyles = cn(\n\t// Layout\n\t\"flex\",\n\t\"items-center\",\n\t\"gap-2\",\n\t\"w-full\",\n\t// Spacing\n\t\"px-3\",\n\t\"py-2\",\n\t// Background & Border\n\t\"bg-bg-tertiary\",\n\t\"rounded\",\n\t// Overflow\n\t\"overflow-hidden\",\n);\n\n// Content styles\nconst contentStyles = cn(\n\t// Layout\n\t\"flex\",\n\t\"items-center\",\n\t\"gap-2\",\n\t\"flex-1\",\n\t\"min-w-0\",\n);\n\n// Text styles\nconst textStyles = cn(\n\t// Typography\n\t\"typo-body\",\n\t\"text-text-primary\",\n\t// Layout\n\t\"flex-1\",\n\t\"min-w-0\",\n\t\"truncate\",\n);\n\n// Copy button styles\nconst copyButtonStyles = cn(\n\t// Layout\n\t\"flex\",\n\t\"items-center\",\n\t\"justify-center\",\n\t\"shrink-0\",\n\t// Sizing\n\t\"size-4\",\n\t// Cursor\n\t\"cursor-pointer\",\n\t// Hover\n\t\"hover:opacity-80\",\n\t\"transition-opacity\",\n\t\"duration-200\",\n);\n\n// Eye button styles\nconst eyeButtonStyles = cn(\n\t// Layout\n\t\"flex\",\n\t\"items-center\",\n\t\"justify-center\",\n\t\"shrink-0\",\n\t// Sizing\n\t\"size-4\",\n\t// Cursor\n\t\"cursor-pointer\",\n\t// Hover\n\t\"hover:opacity-80\",\n\t\"transition-opacity\",\n\t\"duration-200\",\n);\n\nexport interface SandboxProps\n\textends Omit<React.ComponentProps<\"div\">, \"children\" | \"onCopy\"> {\n\turl: string;\n\n\tshowCopy?: boolean;\n\n\tshowEye?: boolean;\n\n\tcopyIcon?: React.ReactNode;\n\n\ttooltipText?: string;\n\n\tshowToast?: boolean;\n\n\tonCopy?: (text: string) => void;\n}\n\nfunction Sandbox({\n\turl,\n\tshowCopy = true,\n\tshowEye = true,\n\tcopyIcon = <Copy />,\n\ttooltipText = \"Copy URL\",\n\tshowToast = true,\n\tonCopy,\n\tclassName,\n\t...props\n}: SandboxProps) {\n\tconst [isVisible, setIsVisible] = useState(true);\n\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sandbox\"\n\t\t\tclassName={cn(baseSandboxStyles, className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div className={inputContainerStyles}>\n\t\t\t\t<div className={contentStyles}>\n\t\t\t\t\t<span className={textStyles}>\n\t\t\t\t\t\t{isVisible ? url : \"•\".repeat(url.length)}\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\t\t\t\t{showEye && (\n\t\t\t\t\t<Tooltip>\n\t\t\t\t\t\t<TooltipTrigger asChild>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tclassName={eyeButtonStyles}\n\t\t\t\t\t\t\t\tonClick={() => setIsVisible(!isVisible)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{isVisible ? <Eye /> : <EyeOff />}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</TooltipTrigger>\n\t\t\t\t\t\t<TooltipContent>\n\t\t\t\t\t\t\t<p>{isVisible ? \"Hide URL\" : \"Show URL\"}</p>\n\t\t\t\t\t\t</TooltipContent>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t\t{showCopy && (\n\t\t\t\t\t<Tooltip>\n\t\t\t\t\t\t<TooltipTrigger asChild>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tclassName={copyButtonStyles}\n\t\t\t\t\t\t\t\tonClick={async () => {\n\t\t\t\t\t\t\t\t\ttry {\n\t\t\t\t\t\t\t\t\t\tawait navigator.clipboard.writeText(url);\n\n\t\t\t\t\t\t\t\t\t\tif (showToast) {\n\t\t\t\t\t\t\t\t\t\t\ttoast(\"Copied\", {\n\t\t\t\t\t\t\t\t\t\t\t\tdescription:\n\t\t\t\t\t\t\t\t\t\t\t\t\turl.length > 50 ? `${url.slice(0, 50)}...` : url,\n\t\t\t\t\t\t\t\t\t\t\t\tduration: 2000,\n\t\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\tonCopy?.(url);\n\t\t\t\t\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\t\t\t\t\tconsole.error(\"Failed to copy to clipboard:\", error);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{copyIcon}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</TooltipTrigger>\n\t\t\t\t\t\t<TooltipContent>\n\t\t\t\t\t\t\t<p>{tooltipText}</p>\n\t\t\t\t\t\t</TooltipContent>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nexport { Sandbox };\n"],"names":["Copy","Eye","EyeOff","useState","toast","Tooltip","TooltipContent","TooltipTrigger","cn","baseSandboxStyles","inputContainerStyles","contentStyles","textStyles","copyButtonStyles","eyeButtonStyles","Sandbox","url","showCopy","showEye","copyIcon","tooltipText","showToast","onCopy","className","props","isVisible","setIsVisible","div","data-slot","span","repeat","length","asChild","button","type","onClick","p","navigator","clipboard","writeText","description","slice","duration","error","console"],"mappings":";AAAA,SAASA,IAAI,EAAEC,GAAG,EAAEC,MAAM,QAAQ,eAAe;AAEjD,SAASC,QAAQ,QAAQ,QAAQ;AACjC,SAASC,KAAK,QAAQ,SAAS;AAC/B,SACCC,OAAO,EACPC,cAAc,EACdC,cAAc,QACR,qCAAkC;AACzC,SAASC,EAAE,QAAQ,yBAAsB;AAEzC,sBAAsB;AACtB,MAAMC,oBAAoBD,GACzB,SAAS;AACT,QACA,YACA,eACA,YACA,aACA,UAAU;AACV;AAGD,yBAAyB;AACzB,MAAME,uBAAuBF,GAC5B,SAAS;AACT,QACA,gBACA,SACA,UACA,UAAU;AACV,QACA,QACA,sBAAsB;AACtB,kBACA,WACA,WAAW;AACX;AAGD,iBAAiB;AACjB,MAAMG,gBAAgBH,GACrB,SAAS;AACT,QACA,gBACA,SACA,UACA;AAGD,cAAc;AACd,MAAMI,aAAaJ,GAClB,aAAa;AACb,aACA,qBACA,SAAS;AACT,UACA,WACA;AAGD,qBAAqB;AACrB,MAAMK,mBAAmBL,GACxB,SAAS;AACT,QACA,gBACA,kBACA,YACA,SAAS;AACT,UACA,SAAS;AACT,kBACA,QAAQ;AACR,oBACA,sBACA;AAGD,oBAAoB;AACpB,MAAMM,kBAAkBN,GACvB,SAAS;AACT,QACA,gBACA,kBACA,YACA,SAAS;AACT,UACA,SAAS;AACT,kBACA,QAAQ;AACR,oBACA,sBACA;AAoBD,SAASO,QAAQ,EAChBC,GAAG,EACHC,WAAW,IAAI,EACfC,UAAU,IAAI,EACdC,yBAAW,KAACnB,SAAO,EACnBoB,cAAc,UAAU,EACxBC,YAAY,IAAI,EAChBC,MAAM,EACNC,SAAS,EACT,GAAGC,OACW;IACd,MAAM,CAACC,WAAWC,aAAa,GAAGvB,SAAS;IAE3C,qBACC,KAACwB;QACAC,aAAU;QACVL,WAAWf,GAAGC,mBAAmBc;QAChC,GAAGC,KAAK;kBAET,cAAA,MAACG;YAAIJ,WAAWb;;8BACf,KAACiB;oBAAIJ,WAAWZ;8BACf,cAAA,KAACkB;wBAAKN,WAAWX;kCACfa,YAAYT,MAAM,IAAIc,MAAM,CAACd,IAAIe,MAAM;;;gBAGzCb,yBACA,MAACb;;sCACA,KAACE;4BAAeyB,OAAO;sCACtB,cAAA,KAACC;gCACAC,MAAK;gCACLX,WAAWT;gCACXqB,SAAS,IAAMT,aAAa,CAACD;0CAE5BA,0BAAY,KAACxB,yBAAS,KAACC;;;sCAG1B,KAACI;sCACA,cAAA,KAAC8B;0CAAGX,YAAY,aAAa;;;;;gBAI/BR,0BACA,MAACZ;;sCACA,KAACE;4BAAeyB,OAAO;sCACtB,cAAA,KAACC;gCACAC,MAAK;gCACLX,WAAWV;gCACXsB,SAAS;oCACR,IAAI;wCACH,MAAME,UAAUC,SAAS,CAACC,SAAS,CAACvB;wCAEpC,IAAIK,WAAW;4CACdjB,MAAM,UAAU;gDACfoC,aACCxB,IAAIe,MAAM,GAAG,KAAK,GAAGf,IAAIyB,KAAK,CAAC,GAAG,IAAI,GAAG,CAAC,GAAGzB;gDAC9C0B,UAAU;4CACX;wCACD;wCAEApB,SAASN;oCACV,EAAE,OAAO2B,OAAO;wCACfC,QAAQD,KAAK,CAAC,gCAAgCA;oCAC/C;gCACD;0CAECxB;;;sCAGH,KAACb;sCACA,cAAA,KAAC8B;0CAAGhB;;;;;;;;AAOX;AAEA,SAASL,OAAO,GAAG"}