50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[544296,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"ItemStyles"] 52:I[34002,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"CodeEditor"] 53:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 54:T1760,"use client" import * as React from "react" import { mergeProps } from "@base-ui/react/merge-props" import { useRender } from "@base-ui/react/use-render" import { cn } from "cn" type ReceiptProps = useRender.ComponentProps<"div"> & { /** "carbon" adds the yellow copy behind, offset like a carbon book. */ variant?: "thermal" | "carbon" } const ReceiptContext = React.createContext<{ mountedRef: React.RefObject }>({ mountedRef: { current: false }, }) /** A strip of thermal paper. Lines added after it renders print in. */ function Receipt({ className, render, variant = "thermal", children, ...props }: ReceiptProps) { const mountedRef = React.useRef(false) React.useEffect(() => { mountedRef.current = true }, []) const context = React.useMemo(() => ({ mountedRef }), []) const element = useRender({ defaultTagName: "div", render, props: mergeProps<"div">( { "data-slot": "receipt", "data-variant": variant, className: cn("receipt-shadow relative isolate w-full max-w-xs", className), children: ( <> {variant === "carbon" && (

)}

{children}

), } as React.ComponentProps<"div">, props ), }) return {element} } function ReceiptHeader({ className, ...props }: React.ComponentProps<"div">) { return (

) } function ReceiptTitle({ className, ...props }: React.ComponentProps<"p">) { return (

) } function ReceiptMeta({ className, ...props }: React.ComponentProps<"p">) { return (

) } function ReceiptItems({ className, ...props }: React.ComponentProps<"dl">) { return

) } /** The item's name, followed by a dotted leader to the value. */ function ReceiptLabel({ className, ...props }: React.ComponentProps<"dt">) { return (

) } function ReceiptValue({ className, ...props }: React.ComponentProps<"dd">) { return

} function ReceiptSeparator({ className, ...props }: React.ComponentProps<"hr">) { return (

) } /** The total line: same parts as an item, printed bold. A list of its own. */ function ReceiptTotal({ className, ...props }: React.ComponentProps<"div">) { return (

) } function ReceiptFooter({ className, ...props }: React.ComponentProps<"p">) { return (

) } type ReceiptMarkProps = React.ComponentProps<"div"> & { /** * Press the mark over the printed lines instead of in its own space. Only * use it where it can't cover anything that must stay readable. */ overlay?: boolean } /** Holds a Stamp or Seal. By default it prints in its own space on the receipt, so it never covers a figure. */ function ReceiptMark({ className, overlay = false, ...props }: ReceiptMarkProps) { return (

) } export { Receipt, ReceiptHeader, ReceiptTitle, ReceiptMeta, ReceiptItems, ReceiptItem, ReceiptLabel, ReceiptValue, ReceiptSeparator, ReceiptTotal, ReceiptFooter, ReceiptMark, } export type { ReceiptProps, ReceiptMarkProps } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","@base-ui/react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/%40base-ui%2Freact","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"@base-ui/react"}]]}]}],["$","li","cn",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/cn","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"cn"}]]}]}]]}],["$","$L50",null,{"namespace":"@bevel","registryDependencies":["https://bevel-ui.vercel.app/r/bevel.json","https://bevel-ui.vercel.app/r/amount.json","https://bevel-ui.vercel.app/r/stamp.json"]}]]}],["$","$L51",null,{"children":["$","div",null,{"className":"@container","children":["$","div",null,{"className":"grid grid-cols-1 gap-4 @xl:grid-cols-2","children":[null,null,null,["$","div",null,{"className":"flex flex-col border rounded-md","children":[["$","p",null,{"className":"text-sm font-medium border-b p-2","children":"CSS"}],["$","div",null,{"children":["$","$L52",null,{"lang":"css","copyButton":true,"writing":false,"className":"rounded-none w-full max-h-80","header":false,"children":":root {\n\t--receipt-tooth: 0.625rem;\n\t--receipt-carbon: oklch(0.93 0.07 95);\n\t--receipt-carbon-offset: 0.375rem;\n\t--receipt-print-in: 0.5em;\n}\n\n@utility receipt-edges {\n\tmask-image: conic-gradient(from 135deg at top, transparent, black 1deg 89deg, transparent 90deg), conic-gradient(from -45deg at bottom, transparent, black 1deg 89deg, transparent 90deg), linear-gradient(black, black);\n\tmask-size: var(--receipt-tooth) var(--receipt-tooth), var(--receipt-tooth) var(--receipt-tooth), 100% calc(100% - var(--receipt-tooth));\n\tmask-position: top, bottom, center;\n\tmask-repeat: repeat-x, repeat-x, no-repeat;\n}\n\n@utility receipt-shadow {\n\tfilter: drop-shadow(0 1px 1px var(--bevel-cast)) drop-shadow(0 6px 10px var(--bevel-cast));\n}"}]}]]}]]}]}]}]]}],["$","$L53",null,{"files":[{"path":"registry/bevel/ui/receipt.tsx","content":"$54","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]