@pebble-software/bonsai 0.1.0 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -0
- package/dist/ast.js +10 -0
- package/dist/ast.js.map +1 -0
- package/dist/chunks/builder.meta-WpXc5VBB.js +666 -0
- package/dist/chunks/builder.meta-WpXc5VBB.js.map +1 -0
- package/dist/chunks/{button-CSLrIvsS.js → button-jfJanilw.js} +46 -51
- package/dist/chunks/button-jfJanilw.js.map +1 -0
- package/dist/chunks/{create-renderer-1cky1uN9.js → create-renderer-DHneTPd-.js} +8 -8
- package/dist/chunks/{create-renderer-1cky1uN9.js.map → create-renderer-DHneTPd-.js.map} +1 -1
- package/dist/chunks/index-DzpRdatr.js +359 -0
- package/dist/chunks/index-DzpRdatr.js.map +1 -0
- package/dist/chunks/{render-shared-CIUUkLDn.js → render-shared-Ci28BpkI.js} +601 -931
- package/dist/chunks/render-shared-Ci28BpkI.js.map +1 -0
- package/dist/constants.d.ts +1 -0
- package/dist/constants.js +11 -0
- package/dist/constants.js.map +1 -0
- package/dist/core.js +3 -3
- package/dist/index.js +308 -955
- package/dist/index.js.map +1 -1
- package/dist/library/constants/src/components.d.ts +59 -0
- package/dist/library/constants/src/index.d.ts +2 -0
- package/dist/library/constants/src/webhook-events.d.ts +6 -0
- package/dist/library/schemas/src/bonsai.schema.d.ts +24 -0
- package/dist/library/schemas/src/builder.meta.d.ts +26 -0
- package/dist/presets/calendar.js +83 -74
- package/dist/presets/calendar.js.map +1 -1
- package/dist/presets/signature.js +9 -8
- package/dist/presets/signature.js.map +1 -1
- package/dist/schemas.d.ts +2 -0
- package/dist/schemas.js +13 -0
- package/dist/schemas.js.map +1 -0
- package/dist/styles/css/base.css +144 -0
- package/dist/styles/css/fonts.css +25 -0
- package/dist/styles/css/maplibre.css +29 -0
- package/dist/styles/css/overrides.css +7 -0
- package/dist/styles/css/tailwind.css +1 -0
- package/dist/styles/css/theme.css +197 -0
- package/dist/styles/css/tw-animate.css +1 -0
- package/dist/styles/css/utilities.css +44 -0
- package/dist/styles/presets.json +20 -0
- package/dist/styles/vendor/maplibre-gl.css +701 -0
- package/dist/styles/vendor/tw-animate.css +692 -0
- package/package.json +19 -3
- package/dist/chunks/button-CSLrIvsS.js.map +0 -1
- package/dist/chunks/render-shared-CIUUkLDn.js.map +0 -1
|
@@ -1,12 +1,13 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { COMPONENT as C } from "../constants.js";
|
|
2
2
|
import { jsx as a, jsxs as u } from "react/jsx-runtime";
|
|
3
|
-
import { useState as S, useRef as x, useCallback as
|
|
3
|
+
import { useState as S, useRef as x, useCallback as D, useEffect as v } from "react";
|
|
4
|
+
import { c as n, H as G, B as L } from "../chunks/button-jfJanilw.js";
|
|
4
5
|
import { Tabs as _ } from "@base-ui/react/tabs";
|
|
5
6
|
import { cva as B } from "class-variance-authority";
|
|
6
7
|
import { useWebHaptics as U } from "web-haptics/react";
|
|
7
8
|
import F from "react-signature-canvas";
|
|
8
9
|
import { IconWriting as O, IconTextSize as $, IconEraser as H } from "@tabler/icons-react";
|
|
9
|
-
import { u as W, I as V,
|
|
10
|
+
import { u as W, I as V, g as X, h as Z } from "../chunks/render-shared-Ci28BpkI.js";
|
|
10
11
|
function q({
|
|
11
12
|
className: r,
|
|
12
13
|
orientation: s = "horizontal",
|
|
@@ -136,7 +137,7 @@ function R({
|
|
|
136
137
|
d
|
|
137
138
|
),
|
|
138
139
|
onClick: (o) => {
|
|
139
|
-
l(
|
|
140
|
+
l(G), c?.(o);
|
|
140
141
|
},
|
|
141
142
|
...t,
|
|
142
143
|
children: [
|
|
@@ -210,7 +211,7 @@ function at({
|
|
|
210
211
|
canvasClassname: i,
|
|
211
212
|
imageType: d = "image/png"
|
|
212
213
|
}) {
|
|
213
|
-
const c = W(), [t, l] = S("sign"), [o, p] = S(""), g = x(null), f = x(null), b = x(s), w = x(r ?? null), N = x(!1), z = x({ width: 0, height: 0 }), m =
|
|
214
|
+
const c = W(), [t, l] = S("sign"), [o, p] = S(""), g = x(null), f = x(null), b = x(s), w = x(r ?? null), N = x(!1), z = x({ width: 0, height: 0 }), m = D((e) => {
|
|
214
215
|
w.current !== e && (w.current = e, b.current?.(e));
|
|
215
216
|
}, []);
|
|
216
217
|
v(() => {
|
|
@@ -325,7 +326,7 @@ function at({
|
|
|
325
326
|
}
|
|
326
327
|
),
|
|
327
328
|
/* @__PURE__ */ u(
|
|
328
|
-
|
|
329
|
+
L,
|
|
329
330
|
{
|
|
330
331
|
size: "sm",
|
|
331
332
|
raised: "xs",
|
|
@@ -385,7 +386,7 @@ function at({
|
|
|
385
386
|
}
|
|
386
387
|
) });
|
|
387
388
|
}
|
|
388
|
-
const
|
|
389
|
+
const pt = {
|
|
389
390
|
components: {
|
|
390
391
|
[C.SIGNATURE]: at
|
|
391
392
|
},
|
|
@@ -399,6 +400,6 @@ const ct = {
|
|
|
399
400
|
};
|
|
400
401
|
export {
|
|
401
402
|
at as Signature,
|
|
402
|
-
|
|
403
|
+
pt as signaturePreset
|
|
403
404
|
};
|
|
404
405
|
//# sourceMappingURL=signature.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"signature.js","sources":["../../src/components/ui/tabs.tsx","../../src/components/ui/signature-pad.tsx","../../src/renderer/presets/signature.ts"],"sourcesContent":["\"use client\";\n\nimport { Tabs as TabsPrimitive } from \"@base-ui/react/tabs\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { useHaptics, HAPTIC_TAB } from \"@/lib/haptics\";\n\nfunction Tabs({\n className,\n orientation = \"horizontal\",\n ...props\n}: TabsPrimitive.Root.Props) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n data-orientation={orientation}\n className={cn(\n \"gap-2 group/tabs flex\",\n \"data-[orientation=horizontal]:flex-col\",\n \"data-[orientation=vertical]:w-full\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst tabsListVariants = cva(\n \"overflow-auto inline-flex bg-transparent w-fit items-start justify-start group-data-horizontal/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col\",\n {\n variants: {\n variant: {\n default:\n \"gap-1.5 border-2 rounded-base p-[calc(var(--trigger-translate)+6px)]\",\n ghost:\n \"gap-1 border-none rounded-none p-[calc(var(--trigger-translate)+6px)]\",\n icon: \"gap-1.5 border-2 rounded-base p-[calc(var(--trigger-translate)+6px)]\",\n contained:\n \"gap-0 border-0 rounded-md p-[calc(var(--trigger-translate)+2px)]\",\n },\n size: {\n sm: \"\",\n md: \"\",\n lg: \"\",\n xl: \"\",\n },\n extrude: {\n default:\n \"[--trigger-shadow:var(--shadow-none)] [--trigger-translate:0px] [--focus-trigger-translate:0px]\",\n xs: \"[--trigger-shadow:var(--shadow-min)] [--trigger-translate:1px] [--focus-trigger-shadow:var(--shadow-none)] [--focus-trigger-translate:0px]\",\n sm: \"[--trigger-shadow:var(--shadow-xs)] [--trigger-translate:2px] [--focus-trigger-shadow:var(--shadow-min)] [--focus-trigger-translate:1px]\",\n md: \"[--trigger-shadow:var(--shadow-sm)] [--trigger-translate:3px] [--focus-trigger-shadow:var(--shadow-xs)] [--focus-trigger-translate:2px]\",\n lg: \"[--trigger-shadow:var(--shadow-md)] [--trigger-translate:4px] [--focus-trigger-shadow:var(--shadow-xs)] [--focus-trigger-translate:2px]\",\n xl: \"[--trigger-shadow:var(--shadow-lg)] [--trigger-translate:5px] [--focus-trigger-shadow:var(--shadow-xs)] [--focus-trigger-translate:2px]\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"md\",\n extrude: \"default\",\n },\n },\n);\n\nfunction TabsList({\n className,\n variant = \"default\",\n size = \"md\",\n extrude = \"default\",\n ...props\n}: TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n data-variant={variant}\n data-size={size}\n className={cn(\n tabsListVariants({ variant, size, extrude }),\n \"group/tabs-list\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction TabsTrigger({\n label,\n description,\n children,\n className,\n onClick,\n ...props\n}: TabsPrimitive.Tab.Props & {\n label?: React.ReactNode;\n description?: React.ReactNode;\n}) {\n const { trigger } = useHaptics();\n return (\n <TabsPrimitive.Tab\n data-slot=\"tabs-trigger\"\n aria-label={props.value ?? \"tabs-trigger\"}\n className={cn(\n \"group/tabs-trigger neo-base relative inline-flex flex-1 items-center justify-center overflow-hidden cursor-pointer rounded-base border-2 py-1\",\n \"bg-surface data-active:bg-main\",\n \"font-medium h-[calc(100%-1px)] whitespace-nowrap [&_svg]:shrink-0\",\n \"transition-[translate,box-shadow,border,color] duration-200\",\n \"aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:shadow-none aria-disabled:translate-0\",\n \"group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start\",\n\n \"active:shadow-none active:translate-0\",\n \"data-active:shadow-(--trigger-shadow) data-active:-translate-(--trigger-translate)\",\n \"hover:shadow-(--trigger-shadow) hover:-translate-(--trigger-translate)\",\n \"focus-visible:shadow-(--focus-trigger-shadow) focus-visible:-translate-(--focus-trigger-translate)\",\n \"focus-visible:hover:-translate-(--focus-trigger-translate) focus-visible:**:font-semibold\",\n\n \"group-data-[size=xl]/tabs-list:min-h-12\",\n\n \"group-data-[size=sm]/tabs-list:[&_svg:not([class*='size-'])]:size-4\",\n \"group-data-[size=md]/tabs-list:[&_svg:not([class*='size-'])]:size-5\",\n \"group-data-[size=lg]/tabs-list:[&_svg:not([class*='size-'])]:size-6\",\n \"group-data-[size=xl]/tabs-list:[&_svg:not([class*='size-'])]:size-7\",\n\n \"group-data-[variant=default]/tabs-list:group-data-[size=sm]/tabs-list:px-3\",\n \"group-data-[variant=default]/tabs-list:group-data-[size=md]/tabs-list:px-4\",\n \"group-data-[variant=default]/tabs-list:group-data-[size=lg]/tabs-list:px-5\",\n \"group-data-[variant=default]/tabs-list:group-data-[size=xl]/tabs-list:px-6\",\n\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=sm]/tabs-list:px-3\",\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=md]/tabs-list:px-4\",\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=lg]/tabs-list:px-5\",\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=xl]/tabs-list:px-6\",\n \"group-data-[variant=ghost]/tabs-list:border-none\",\n \"group-data-[variant=ghost]/tabs-list:data-active:bg-transparent group-data-[variant=ghost]/tabs-list:shadow-none\",\n\n \"group-data-[variant=icon]/tabs-list:group-data-[size=sm]/tabs-list:px-1.5\",\n \"group-data-[variant=icon]/tabs-list:group-data-[size=md]/tabs-list:px-2\",\n \"group-data-[variant=icon]/tabs-list:group-data-[size=lg]/tabs-list:px-2.5\",\n \"group-data-[variant=icon]/tabs-list:group-data-[size=xl]/tabs-list:px-3\",\n \"group-data-[variant=icon]/tabs-list:m-auto group-data-[variant=icon]/tabs-list:max-w-fit group-data-[variant=icon]/tabs-list:aspect-square group-data-[variant=icon]/tabs-list:items-center group-data-[variant=icon]/tabs-list:justify-center group-data-[variant=icon]/tabs-list:hover:border-foreground group-data-[variant=icon]/tabs-list:border-transparent group-data-[variant=icon]/tabs-list:data-active:border-border\",\n\n \"group-data-[variant=contained]/tabs-list:group-data-[size=sm]/tabs-list:px-3\",\n \"group-data-[variant=contained]/tabs-list:group-data-[size=md]/tabs-list:px-4\",\n \"group-data-[variant=contained]/tabs-list:group-data-[size=lg]/tabs-list:px-5\",\n \"group-data-[variant=contained]/tabs-list:group-data-[size=xl]/tabs-list:px-6\",\n \"group-data-[orientation=horizontal]/tabs:group-data-[variant=contained]/tabs-list:not-last:rounded-r-none group-data-[orientation=horizontal]/tabs:group-data-[variant=contained]/tabs-list:not-first:rounded-l-none group-data-[orientation=vertical]/tabs:group-data-[variant=contained]/tabs-list:not-last:rounded-b-none group-data-[orientation=vertical]/tabs:group-data-[variant=contained]/tabs-list:not-first:rounded-t-none group-data-[variant=contained]/tabs-list:-m-px\",\n\n children ? \"gap-1.5\" : \"flex-col gap-0.5\",\n className,\n )}\n onClick={(event) => {\n trigger(HAPTIC_TAB);\n onClick?.(event);\n }}\n {...props}\n >\n {label && (\n <span\n data-slot=\"tabs-trigger-label\"\n className={cn(\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 font-medium font-heading\",\n \"group-data-[size=sm]/tabs-list:text-sm\",\n \"group-data-[size=md]/tabs-list:text-base\",\n \"group-data-[size=lg]/tabs-list:text-lg\",\n \"group-data-[size=xl]/tabs-list:text-2xl\",\n )}\n >\n {label}\n </span>\n )}\n {description && (\n <span\n data-slot=\"tabs-trigger-description\"\n className={cn(\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 whitespace-normal\",\n \"group-data-[size=sm]/tabs-list:text-xs\",\n \"group-data-[size=md]/tabs-list:text-sm\",\n \"group-data-[size=lg]/tabs-list:text-base\",\n \"group-data-[size=xl]/tabs-list:text-lg\",\n )}\n >\n {description}\n </span>\n )}\n {children}\n <div\n data-slot=\"tabs-trigger-indicator\"\n className={cn(\n \"pointer-events-none h-[3px] rounded-full bg-foreground absolute hidden bottom-0 left-1 right-1\",\n \"group-data-[variant=ghost]/tabs-list:group-data-active/tabs-trigger:block\",\n )}\n />\n </TabsPrimitive.Tab>\n );\n}\n\nfunction TabsContent({ className, ...props }: TabsPrimitive.Panel.Props) {\n return (\n <TabsPrimitive.Panel\n data-slot=\"tabs-content\"\n className={cn(\n \"text-sm flex-1 neo-base border-l-2 border-l-transparent focus-visible:border-l-border -ml-0.5 pl-0.5\",\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants };\n","\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { Button } from \"./button\";\nimport { Tabs, TabsList, TabsTrigger } from \"./tabs\";\nimport SignatureCanvas from \"react-signature-canvas\";\nimport type { ChangeEvent } from \"react\";\nimport { IconEraser, IconWriting, IconTextSize } from \"@tabler/icons-react\";\nimport { InputGroup, InputGroupAddon, InputGroupInput } from \"./input-group\";\nimport { cn } from \"@/lib/utils\";\nimport { useBonsaiRenderMode } from \"../core/bonsai\";\n\nexport type SignatureProps = {\n value?: string | null;\n onChange?: (value: string | null) => void;\n canvasClassname?: string;\n imageType?: \"image/png\" | \"image/jpeg\" | \"image/webp\";\n};\n\nconst FONT_FAMILY = '\"Great Vibes\", cursive';\nconst FONT_SIZE_MAX = 64;\nconst FONT_SIZE_MIN = 24;\nconst TEXT_PADDING_X = 20;\n\nfunction renderTypedSignature({\n canvas,\n text,\n width,\n height,\n ratio,\n}: {\n canvas: HTMLCanvasElement;\n text: string;\n width: number;\n height: number;\n ratio: number;\n}) {\n const ctx = canvas.getContext(\"2d\");\n if (!ctx) return false;\n\n const displayWidth = Math.max(1, Math.floor(width));\n const displayHeight = Math.max(1, Math.floor(height));\n const pixelRatio = Math.max(ratio || 1, 1);\n\n canvas.width = Math.max(1, Math.floor(displayWidth * pixelRatio));\n canvas.height = Math.max(1, Math.floor(displayHeight * pixelRatio));\n ctx.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);\n ctx.clearRect(0, 0, displayWidth, displayHeight);\n\n const value = text.trim();\n if (!value) return false;\n\n const maxTextWidth = Math.max(1, displayWidth - TEXT_PADDING_X * 2);\n\n ctx.fillStyle = \"#000\";\n ctx.textAlign = \"center\";\n ctx.textBaseline = \"middle\";\n\n let fontSize = FONT_SIZE_MAX;\n while (fontSize > FONT_SIZE_MIN) {\n ctx.font = `${fontSize}px ${FONT_FAMILY}`;\n if (ctx.measureText(value).width <= maxTextWidth) break;\n fontSize -= 1;\n }\n\n ctx.font = `${fontSize}px ${FONT_FAMILY}`;\n ctx.fillText(value, displayWidth / 2, displayHeight / 2, maxTextWidth);\n\n return true;\n}\n\nexport function Signature({\n value,\n onChange,\n canvasClassname,\n imageType = \"image/png\",\n}: SignatureProps) {\n const renderMode = useBonsaiRenderMode();\n const [mode, setMode] = useState<\"sign\" | \"type\">(\"sign\");\n const [text, setText] = useState(\"\");\n\n const signature = useRef<SignatureCanvas | null>(null);\n const textCanvas = useRef<HTMLCanvasElement | null>(null);\n const onChangeRef = useRef(onChange);\n const lastEmittedValue = useRef<string | null>(value ?? null);\n const initialized = useRef(false);\n const textCanvasSizeRef = useRef({ width: 0, height: 0 });\n\n const emitChange = useCallback((nextValue: string | null) => {\n if (lastEmittedValue.current === nextValue) return;\n lastEmittedValue.current = nextValue;\n onChangeRef.current?.(nextValue);\n }, []);\n\n useEffect(() => {\n onChangeRef.current = onChange;\n }, [onChange]);\n\n useEffect(() => {\n lastEmittedValue.current = value ?? null;\n }, [value]);\n\n useEffect(() => {\n if (initialized.current) return;\n initialized.current = true;\n\n if (!value || mode !== \"sign\") return;\n const instance = signature.current;\n if (!instance) return;\n\n try {\n instance.fromDataURL(value);\n } catch {\n instance.clear();\n }\n }, []);\n\n useEffect(() => {\n if (mode !== \"type\") return;\n\n const canvas = textCanvas.current;\n if (!canvas) return;\n\n if (textCanvasSizeRef.current.width === 0) {\n const rect = canvas.getBoundingClientRect();\n textCanvasSizeRef.current = {\n width: Math.max(1, Math.floor(rect.width)),\n height: Math.max(1, Math.floor(rect.height)),\n };\n }\n\n const size = textCanvasSizeRef.current;\n if (!size.width || !size.height) return;\n\n const ratio = window.devicePixelRatio || 1;\n const hasText = renderTypedSignature({\n canvas,\n text,\n width: size.width,\n height: size.height,\n ratio,\n });\n\n if (!hasText) {\n emitChange(null);\n return;\n }\n\n const exportCanvas = document.createElement(\"canvas\");\n renderTypedSignature({\n canvas: exportCanvas,\n text,\n width: size.width,\n height: size.height,\n ratio,\n });\n\n emitChange(exportCanvas.toDataURL(imageType));\n }, [mode, text, imageType, emitChange]);\n\n const clearSignature = () => {\n signature.current?.clear();\n setText(\"\");\n emitChange(null);\n };\n\n const handleDrawEnd = () => {\n if (mode !== \"sign\") return;\n const data = signature.current?.toDataURL(imageType) ?? null;\n emitChange(data);\n };\n\n const handleModeChange = (next: \"sign\" | \"type\") => {\n if (next === mode) return;\n clearSignature();\n setMode(next);\n };\n\n const handleTextChange = (event: ChangeEvent<HTMLInputElement>) => {\n setText(event.target.value);\n };\n\n // In a non-interactive document there is no client JS to draw a canvas, so\n // the captured value (a base64 data URI baked in at capture time) is shown as\n // a plain image, and an unsigned pad as an empty signature line — never the\n // interactive control, which would render as a blank grid with a toolbar.\n if (renderMode === \"pdf\") {\n return (\n <div id=\"signature\" className=\"w-full\">\n {value ? (\n <img\n src={value}\n alt=\"Signature\"\n className={cn(\n \"w-full h-[256px] object-contain\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"border-border border-2 rounded-base\",\n canvasClassname,\n )}\n />\n ) : (\n <div\n aria-label=\"Unsigned\"\n className={cn(\n \"w-full h-[256px] flex items-end\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"border-border border-2 rounded-base\",\n canvasClassname,\n )}\n >\n <div className=\"w-full border-t-2 border-dashed border-border mx-6 mb-8 pb-1 text-center text-sm text-muted-foreground\">\n Signature\n </div>\n </div>\n )}\n </div>\n );\n }\n\n return (\n <div id=\"signature\">\n <InputGroup\n className={cn(\n mode === \"type\" ? \"max-h-84\" : \"max-h-69\",\n \"overflow-hidden transition-[max-height] duration-300 has-[>[data-align=block-start]]:p-2 gap-2\",\n )}\n >\n <InputGroupAddon align=\"block-start\" className=\"p-0!\">\n <div className=\"relative w-full rounded-base\">\n <div className=\"absolute top-4 left-4 right-3 bg-transparent flex flex-row items-start justify-between gap-3\">\n <Tabs\n value={mode}\n onValueChange={(next) =>\n handleModeChange(next as \"sign\" | \"type\")\n }\n className=\"-mt-1\"\n >\n <TabsList variant=\"contained\" extrude=\"sm\" size=\"md\">\n <TabsTrigger value=\"sign\">\n <IconWriting />\n <span className=\"hidden sm:flex\">Draw</span>\n </TabsTrigger>\n <TabsTrigger value=\"type\">\n <IconTextSize />\n <span className=\"hidden sm:flex\">Type</span>\n </TabsTrigger>\n </TabsList>\n </Tabs>\n <Button\n size=\"sm\"\n raised=\"xs\"\n variant=\"outline\"\n onClick={clearSignature}\n >\n <IconEraser />\n <span className=\"hidden sm:flex\">Clear</span>\n </Button>\n </div>\n {mode === \"sign\" ? (\n <SignatureCanvas\n ref={signature}\n onEnd={handleDrawEnd}\n canvasProps={{\n className:\n canvasClassname ??\n cn(\n \"w-full h-[256px]\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"inset-shadow-sm\",\n \"border-border border-2 rounded-base\",\n \"cursor-crosshair\",\n ),\n }}\n />\n ) : (\n <canvas\n ref={textCanvas}\n className={cn(\n \"w-full h-64\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"inset-shadow-sm\",\n \"border-border border-2 rounded-base\",\n )}\n />\n )}\n </div>\n </InputGroupAddon>\n <InputGroupInput\n disabled={mode !== \"type\"}\n className={cn(\n mode === \"type\"\n ? \"animate-in zoom-in-0 spin-in-20 scale-100\"\n : \"animate-out zoom-out-0 spin-out-20 scale-0\",\n \"py-2 text-lg font-medium transition-[scale,translate,box-shadow] duration-300 origin-bottom-left\",\n )}\n placeholder=\"Enter Full Name\"\n value={text}\n onChange={handleTextChange}\n />\n </InputGroup>\n </div>\n );\n}\n","import { COMPONENT } from \"@bonsai/constants\";\n\nimport { Signature } from \"../../components/ui/signature-pad\";\nimport type { BonsaiPreset } from \"../core-registry\";\n\n/** Opt-in `signature` component. Pulls in react-signature-canvas. */\nexport const signaturePreset: BonsaiPreset = {\n components: {\n [COMPONENT.SIGNATURE]: Signature,\n },\n controlledInputs: {\n [COMPONENT.SIGNATURE]: {\n valueProp: \"value\",\n changeProp: \"onChange\",\n extractor: (val: string | null) => val,\n },\n },\n};\n\nexport { Signature };\nexport type { SignatureProps } from \"../../components/ui/signature-pad\";\n"],"names":["Tabs","className","orientation","props","jsx","TabsPrimitive","cn","tabsListVariants","cva","TabsList","variant","size","extrude","TabsTrigger","label","description","children","onClick","trigger","useHaptics","jsxs","event","HAPTIC_TAB","FONT_FAMILY","FONT_SIZE_MAX","FONT_SIZE_MIN","TEXT_PADDING_X","renderTypedSignature","canvas","text","width","height","ratio","ctx","displayWidth","displayHeight","pixelRatio","value","maxTextWidth","fontSize","Signature","onChange","canvasClassname","imageType","renderMode","useBonsaiRenderMode","mode","setMode","useState","setText","signature","useRef","textCanvas","onChangeRef","lastEmittedValue","initialized","textCanvasSizeRef","emitChange","useCallback","nextValue","useEffect","instance","rect","exportCanvas","clearSignature","handleDrawEnd","data","handleModeChange","next","handleTextChange","InputGroup","InputGroupAddon","IconWriting","IconTextSize","Button","IconEraser","SignatureCanvas","InputGroupInput","signaturePreset","COMPONENT","val"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"signature.js","sources":["../../src/components/ui/tabs.tsx","../../src/components/ui/signature-pad.tsx","../../src/renderer/presets/signature.ts"],"sourcesContent":["\"use client\";\n\nimport { Tabs as TabsPrimitive } from \"@base-ui/react/tabs\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { useHaptics, HAPTIC_TAB } from \"@/lib/haptics\";\n\nfunction Tabs({\n className,\n orientation = \"horizontal\",\n ...props\n}: TabsPrimitive.Root.Props) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n data-orientation={orientation}\n className={cn(\n \"gap-2 group/tabs flex\",\n \"data-[orientation=horizontal]:flex-col\",\n \"data-[orientation=vertical]:w-full\",\n className,\n )}\n {...props}\n />\n );\n}\n\nconst tabsListVariants = cva(\n \"overflow-auto inline-flex bg-transparent w-fit items-start justify-start group-data-horizontal/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col\",\n {\n variants: {\n variant: {\n default:\n \"gap-1.5 border-2 rounded-base p-[calc(var(--trigger-translate)+6px)]\",\n ghost:\n \"gap-1 border-none rounded-none p-[calc(var(--trigger-translate)+6px)]\",\n icon: \"gap-1.5 border-2 rounded-base p-[calc(var(--trigger-translate)+6px)]\",\n contained:\n \"gap-0 border-0 rounded-md p-[calc(var(--trigger-translate)+2px)]\",\n },\n size: {\n sm: \"\",\n md: \"\",\n lg: \"\",\n xl: \"\",\n },\n extrude: {\n default:\n \"[--trigger-shadow:var(--shadow-none)] [--trigger-translate:0px] [--focus-trigger-translate:0px]\",\n xs: \"[--trigger-shadow:var(--shadow-min)] [--trigger-translate:1px] [--focus-trigger-shadow:var(--shadow-none)] [--focus-trigger-translate:0px]\",\n sm: \"[--trigger-shadow:var(--shadow-xs)] [--trigger-translate:2px] [--focus-trigger-shadow:var(--shadow-min)] [--focus-trigger-translate:1px]\",\n md: \"[--trigger-shadow:var(--shadow-sm)] [--trigger-translate:3px] [--focus-trigger-shadow:var(--shadow-xs)] [--focus-trigger-translate:2px]\",\n lg: \"[--trigger-shadow:var(--shadow-md)] [--trigger-translate:4px] [--focus-trigger-shadow:var(--shadow-xs)] [--focus-trigger-translate:2px]\",\n xl: \"[--trigger-shadow:var(--shadow-lg)] [--trigger-translate:5px] [--focus-trigger-shadow:var(--shadow-xs)] [--focus-trigger-translate:2px]\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"md\",\n extrude: \"default\",\n },\n },\n);\n\nfunction TabsList({\n className,\n variant = \"default\",\n size = \"md\",\n extrude = \"default\",\n ...props\n}: TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n data-variant={variant}\n data-size={size}\n className={cn(\n tabsListVariants({ variant, size, extrude }),\n \"group/tabs-list\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction TabsTrigger({\n label,\n description,\n children,\n className,\n onClick,\n ...props\n}: TabsPrimitive.Tab.Props & {\n label?: React.ReactNode;\n description?: React.ReactNode;\n}) {\n const { trigger } = useHaptics();\n return (\n <TabsPrimitive.Tab\n data-slot=\"tabs-trigger\"\n aria-label={props.value ?? \"tabs-trigger\"}\n className={cn(\n \"group/tabs-trigger neo-base relative inline-flex flex-1 items-center justify-center overflow-hidden cursor-pointer rounded-base border-2 py-1\",\n \"bg-surface data-active:bg-main\",\n \"font-medium h-[calc(100%-1px)] whitespace-nowrap [&_svg]:shrink-0\",\n \"transition-[translate,box-shadow,border,color] duration-200\",\n \"aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:shadow-none aria-disabled:translate-0\",\n \"group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start\",\n\n \"active:shadow-none active:translate-0\",\n \"data-active:shadow-(--trigger-shadow) data-active:-translate-(--trigger-translate)\",\n \"hover:shadow-(--trigger-shadow) hover:-translate-(--trigger-translate)\",\n \"focus-visible:shadow-(--focus-trigger-shadow) focus-visible:-translate-(--focus-trigger-translate)\",\n \"focus-visible:hover:-translate-(--focus-trigger-translate) focus-visible:**:font-semibold\",\n\n \"group-data-[size=xl]/tabs-list:min-h-12\",\n\n \"group-data-[size=sm]/tabs-list:[&_svg:not([class*='size-'])]:size-4\",\n \"group-data-[size=md]/tabs-list:[&_svg:not([class*='size-'])]:size-5\",\n \"group-data-[size=lg]/tabs-list:[&_svg:not([class*='size-'])]:size-6\",\n \"group-data-[size=xl]/tabs-list:[&_svg:not([class*='size-'])]:size-7\",\n\n \"group-data-[variant=default]/tabs-list:group-data-[size=sm]/tabs-list:px-3\",\n \"group-data-[variant=default]/tabs-list:group-data-[size=md]/tabs-list:px-4\",\n \"group-data-[variant=default]/tabs-list:group-data-[size=lg]/tabs-list:px-5\",\n \"group-data-[variant=default]/tabs-list:group-data-[size=xl]/tabs-list:px-6\",\n\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=sm]/tabs-list:px-3\",\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=md]/tabs-list:px-4\",\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=lg]/tabs-list:px-5\",\n \"group-data-[variant=ghost]/tabs-list:group-data-[size=xl]/tabs-list:px-6\",\n \"group-data-[variant=ghost]/tabs-list:border-none\",\n \"group-data-[variant=ghost]/tabs-list:data-active:bg-transparent group-data-[variant=ghost]/tabs-list:shadow-none\",\n\n \"group-data-[variant=icon]/tabs-list:group-data-[size=sm]/tabs-list:px-1.5\",\n \"group-data-[variant=icon]/tabs-list:group-data-[size=md]/tabs-list:px-2\",\n \"group-data-[variant=icon]/tabs-list:group-data-[size=lg]/tabs-list:px-2.5\",\n \"group-data-[variant=icon]/tabs-list:group-data-[size=xl]/tabs-list:px-3\",\n \"group-data-[variant=icon]/tabs-list:m-auto group-data-[variant=icon]/tabs-list:max-w-fit group-data-[variant=icon]/tabs-list:aspect-square group-data-[variant=icon]/tabs-list:items-center group-data-[variant=icon]/tabs-list:justify-center group-data-[variant=icon]/tabs-list:hover:border-foreground group-data-[variant=icon]/tabs-list:border-transparent group-data-[variant=icon]/tabs-list:data-active:border-border\",\n\n \"group-data-[variant=contained]/tabs-list:group-data-[size=sm]/tabs-list:px-3\",\n \"group-data-[variant=contained]/tabs-list:group-data-[size=md]/tabs-list:px-4\",\n \"group-data-[variant=contained]/tabs-list:group-data-[size=lg]/tabs-list:px-5\",\n \"group-data-[variant=contained]/tabs-list:group-data-[size=xl]/tabs-list:px-6\",\n \"group-data-[orientation=horizontal]/tabs:group-data-[variant=contained]/tabs-list:not-last:rounded-r-none group-data-[orientation=horizontal]/tabs:group-data-[variant=contained]/tabs-list:not-first:rounded-l-none group-data-[orientation=vertical]/tabs:group-data-[variant=contained]/tabs-list:not-last:rounded-b-none group-data-[orientation=vertical]/tabs:group-data-[variant=contained]/tabs-list:not-first:rounded-t-none group-data-[variant=contained]/tabs-list:-m-px\",\n\n children ? \"gap-1.5\" : \"flex-col gap-0.5\",\n className,\n )}\n onClick={(event) => {\n trigger(HAPTIC_TAB);\n onClick?.(event);\n }}\n {...props}\n >\n {label && (\n <span\n data-slot=\"tabs-trigger-label\"\n className={cn(\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 font-medium font-heading\",\n \"group-data-[size=sm]/tabs-list:text-sm\",\n \"group-data-[size=md]/tabs-list:text-base\",\n \"group-data-[size=lg]/tabs-list:text-lg\",\n \"group-data-[size=xl]/tabs-list:text-2xl\",\n )}\n >\n {label}\n </span>\n )}\n {description && (\n <span\n data-slot=\"tabs-trigger-description\"\n className={cn(\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 whitespace-normal\",\n \"group-data-[size=sm]/tabs-list:text-xs\",\n \"group-data-[size=md]/tabs-list:text-sm\",\n \"group-data-[size=lg]/tabs-list:text-base\",\n \"group-data-[size=xl]/tabs-list:text-lg\",\n )}\n >\n {description}\n </span>\n )}\n {children}\n <div\n data-slot=\"tabs-trigger-indicator\"\n className={cn(\n \"pointer-events-none h-[3px] rounded-full bg-foreground absolute hidden bottom-0 left-1 right-1\",\n \"group-data-[variant=ghost]/tabs-list:group-data-active/tabs-trigger:block\",\n )}\n />\n </TabsPrimitive.Tab>\n );\n}\n\nfunction TabsContent({ className, ...props }: TabsPrimitive.Panel.Props) {\n return (\n <TabsPrimitive.Panel\n data-slot=\"tabs-content\"\n className={cn(\n \"text-sm flex-1 neo-base border-l-2 border-l-transparent focus-visible:border-l-border -ml-0.5 pl-0.5\",\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants };\n","\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { Button } from \"./button\";\nimport { Tabs, TabsList, TabsTrigger } from \"./tabs\";\nimport SignatureCanvas from \"react-signature-canvas\";\nimport type { ChangeEvent } from \"react\";\nimport { IconEraser, IconWriting, IconTextSize } from \"@tabler/icons-react\";\nimport { InputGroup, InputGroupAddon, InputGroupInput } from \"./input-group\";\nimport { cn } from \"@/lib/utils\";\nimport { useBonsaiRenderMode } from \"../core/bonsai\";\n\nexport type SignatureProps = {\n value?: string | null;\n onChange?: (value: string | null) => void;\n canvasClassname?: string;\n imageType?: \"image/png\" | \"image/jpeg\" | \"image/webp\";\n};\n\nconst FONT_FAMILY = '\"Great Vibes\", cursive';\nconst FONT_SIZE_MAX = 64;\nconst FONT_SIZE_MIN = 24;\nconst TEXT_PADDING_X = 20;\n\nfunction renderTypedSignature({\n canvas,\n text,\n width,\n height,\n ratio,\n}: {\n canvas: HTMLCanvasElement;\n text: string;\n width: number;\n height: number;\n ratio: number;\n}) {\n const ctx = canvas.getContext(\"2d\");\n if (!ctx) return false;\n\n const displayWidth = Math.max(1, Math.floor(width));\n const displayHeight = Math.max(1, Math.floor(height));\n const pixelRatio = Math.max(ratio || 1, 1);\n\n canvas.width = Math.max(1, Math.floor(displayWidth * pixelRatio));\n canvas.height = Math.max(1, Math.floor(displayHeight * pixelRatio));\n ctx.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);\n ctx.clearRect(0, 0, displayWidth, displayHeight);\n\n const value = text.trim();\n if (!value) return false;\n\n const maxTextWidth = Math.max(1, displayWidth - TEXT_PADDING_X * 2);\n\n ctx.fillStyle = \"#000\";\n ctx.textAlign = \"center\";\n ctx.textBaseline = \"middle\";\n\n let fontSize = FONT_SIZE_MAX;\n while (fontSize > FONT_SIZE_MIN) {\n ctx.font = `${fontSize}px ${FONT_FAMILY}`;\n if (ctx.measureText(value).width <= maxTextWidth) break;\n fontSize -= 1;\n }\n\n ctx.font = `${fontSize}px ${FONT_FAMILY}`;\n ctx.fillText(value, displayWidth / 2, displayHeight / 2, maxTextWidth);\n\n return true;\n}\n\nexport function Signature({\n value,\n onChange,\n canvasClassname,\n imageType = \"image/png\",\n}: SignatureProps) {\n const renderMode = useBonsaiRenderMode();\n const [mode, setMode] = useState<\"sign\" | \"type\">(\"sign\");\n const [text, setText] = useState(\"\");\n\n const signature = useRef<SignatureCanvas | null>(null);\n const textCanvas = useRef<HTMLCanvasElement | null>(null);\n const onChangeRef = useRef(onChange);\n const lastEmittedValue = useRef<string | null>(value ?? null);\n const initialized = useRef(false);\n const textCanvasSizeRef = useRef({ width: 0, height: 0 });\n\n const emitChange = useCallback((nextValue: string | null) => {\n if (lastEmittedValue.current === nextValue) return;\n lastEmittedValue.current = nextValue;\n onChangeRef.current?.(nextValue);\n }, []);\n\n useEffect(() => {\n onChangeRef.current = onChange;\n }, [onChange]);\n\n useEffect(() => {\n lastEmittedValue.current = value ?? null;\n }, [value]);\n\n useEffect(() => {\n if (initialized.current) return;\n initialized.current = true;\n\n if (!value || mode !== \"sign\") return;\n const instance = signature.current;\n if (!instance) return;\n\n try {\n instance.fromDataURL(value);\n } catch {\n instance.clear();\n }\n }, []);\n\n useEffect(() => {\n if (mode !== \"type\") return;\n\n const canvas = textCanvas.current;\n if (!canvas) return;\n\n if (textCanvasSizeRef.current.width === 0) {\n const rect = canvas.getBoundingClientRect();\n textCanvasSizeRef.current = {\n width: Math.max(1, Math.floor(rect.width)),\n height: Math.max(1, Math.floor(rect.height)),\n };\n }\n\n const size = textCanvasSizeRef.current;\n if (!size.width || !size.height) return;\n\n const ratio = window.devicePixelRatio || 1;\n const hasText = renderTypedSignature({\n canvas,\n text,\n width: size.width,\n height: size.height,\n ratio,\n });\n\n if (!hasText) {\n emitChange(null);\n return;\n }\n\n const exportCanvas = document.createElement(\"canvas\");\n renderTypedSignature({\n canvas: exportCanvas,\n text,\n width: size.width,\n height: size.height,\n ratio,\n });\n\n emitChange(exportCanvas.toDataURL(imageType));\n }, [mode, text, imageType, emitChange]);\n\n const clearSignature = () => {\n signature.current?.clear();\n setText(\"\");\n emitChange(null);\n };\n\n const handleDrawEnd = () => {\n if (mode !== \"sign\") return;\n const data = signature.current?.toDataURL(imageType) ?? null;\n emitChange(data);\n };\n\n const handleModeChange = (next: \"sign\" | \"type\") => {\n if (next === mode) return;\n clearSignature();\n setMode(next);\n };\n\n const handleTextChange = (event: ChangeEvent<HTMLInputElement>) => {\n setText(event.target.value);\n };\n\n // In a non-interactive document there is no client JS to draw a canvas, so\n // the captured value (a base64 data URI baked in at capture time) is shown as\n // a plain image, and an unsigned pad as an empty signature line — never the\n // interactive control, which would render as a blank grid with a toolbar.\n if (renderMode === \"pdf\") {\n return (\n <div id=\"signature\" className=\"w-full\">\n {value ? (\n <img\n src={value}\n alt=\"Signature\"\n className={cn(\n \"w-full h-[256px] object-contain\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"border-border border-2 rounded-base\",\n canvasClassname,\n )}\n />\n ) : (\n <div\n aria-label=\"Unsigned\"\n className={cn(\n \"w-full h-[256px] flex items-end\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"border-border border-2 rounded-base\",\n canvasClassname,\n )}\n >\n <div className=\"w-full border-t-2 border-dashed border-border mx-6 mb-8 pb-1 text-center text-sm text-muted-foreground\">\n Signature\n </div>\n </div>\n )}\n </div>\n );\n }\n\n return (\n <div id=\"signature\">\n <InputGroup\n className={cn(\n mode === \"type\" ? \"max-h-84\" : \"max-h-69\",\n \"overflow-hidden transition-[max-height] duration-300 has-[>[data-align=block-start]]:p-2 gap-2\",\n )}\n >\n <InputGroupAddon align=\"block-start\" className=\"p-0!\">\n <div className=\"relative w-full rounded-base\">\n <div className=\"absolute top-4 left-4 right-3 bg-transparent flex flex-row items-start justify-between gap-3\">\n <Tabs\n value={mode}\n onValueChange={(next) =>\n handleModeChange(next as \"sign\" | \"type\")\n }\n className=\"-mt-1\"\n >\n <TabsList variant=\"contained\" extrude=\"sm\" size=\"md\">\n <TabsTrigger value=\"sign\">\n <IconWriting />\n <span className=\"hidden sm:flex\">Draw</span>\n </TabsTrigger>\n <TabsTrigger value=\"type\">\n <IconTextSize />\n <span className=\"hidden sm:flex\">Type</span>\n </TabsTrigger>\n </TabsList>\n </Tabs>\n <Button\n size=\"sm\"\n raised=\"xs\"\n variant=\"outline\"\n onClick={clearSignature}\n >\n <IconEraser />\n <span className=\"hidden sm:flex\">Clear</span>\n </Button>\n </div>\n {mode === \"sign\" ? (\n <SignatureCanvas\n ref={signature}\n onEnd={handleDrawEnd}\n canvasProps={{\n className:\n canvasClassname ??\n cn(\n \"w-full h-[256px]\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"inset-shadow-sm\",\n \"border-border border-2 rounded-base\",\n \"cursor-crosshair\",\n ),\n }}\n />\n ) : (\n <canvas\n ref={textCanvas}\n className={cn(\n \"w-full h-64\",\n \"bg-size-[32px_32px] bg-surface\",\n \"bg-[linear-gradient(to_right,#80808022_1px,transparent_1px),linear-gradient(to_bottom,#80808022_1px,transparent_1px)]\",\n \"inset-shadow-sm\",\n \"border-border border-2 rounded-base\",\n )}\n />\n )}\n </div>\n </InputGroupAddon>\n <InputGroupInput\n disabled={mode !== \"type\"}\n className={cn(\n mode === \"type\"\n ? \"animate-in zoom-in-0 spin-in-20 scale-100\"\n : \"animate-out zoom-out-0 spin-out-20 scale-0\",\n \"py-2 text-lg font-medium transition-[scale,translate,box-shadow] duration-300 origin-bottom-left\",\n )}\n placeholder=\"Enter Full Name\"\n value={text}\n onChange={handleTextChange}\n />\n </InputGroup>\n </div>\n );\n}\n","import { COMPONENT } from \"@bonsai/constants\";\n\nimport { Signature } from \"../../components/ui/signature-pad\";\nimport type { BonsaiPreset } from \"../core-registry\";\n\n/** Opt-in `signature` component. Pulls in react-signature-canvas. */\nexport const signaturePreset: BonsaiPreset = {\n components: {\n [COMPONENT.SIGNATURE]: Signature,\n },\n controlledInputs: {\n [COMPONENT.SIGNATURE]: {\n valueProp: \"value\",\n changeProp: \"onChange\",\n extractor: (val: string | null) => val,\n },\n },\n};\n\nexport { Signature };\nexport type { SignatureProps } from \"../../components/ui/signature-pad\";\n"],"names":["Tabs","className","orientation","props","jsx","TabsPrimitive","cn","tabsListVariants","cva","TabsList","variant","size","extrude","TabsTrigger","label","description","children","onClick","trigger","useHaptics","jsxs","event","HAPTIC_TAB","FONT_FAMILY","FONT_SIZE_MAX","FONT_SIZE_MIN","TEXT_PADDING_X","renderTypedSignature","canvas","text","width","height","ratio","ctx","displayWidth","displayHeight","pixelRatio","value","maxTextWidth","fontSize","Signature","onChange","canvasClassname","imageType","renderMode","useBonsaiRenderMode","mode","setMode","useState","setText","signature","useRef","textCanvas","onChangeRef","lastEmittedValue","initialized","textCanvasSizeRef","emitChange","useCallback","nextValue","useEffect","instance","rect","exportCanvas","clearSignature","handleDrawEnd","data","handleModeChange","next","handleTextChange","InputGroup","InputGroupAddon","IconWriting","IconTextSize","Button","IconEraser","SignatureCanvas","InputGroupInput","signaturePreset","COMPONENT","val"],"mappings":";;;;;;;;;;AAOA,SAASA,EAAK;AAAA,EACZ,WAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,GAAGC;AACL,GAA6B;AAC3B,SACE,gBAAAC;AAAA,IAACC,EAAc;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,oBAAkBH;AAAA,MAClB,WAAWI;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACAL;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,MAAMI,IAAmBC;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SACE;AAAA,QACF,OACE;AAAA,QACF,MAAM;AAAA,QACN,WACE;AAAA,MAAA;AAAA,MAEJ,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,MAEN,SAAS;AAAA,QACP,SACE;AAAA,QACF,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;AAEA,SAASC,EAAS;AAAA,EAChB,WAAAR;AAAA,EACA,SAAAS,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,GAAGT;AACL,GAAqE;AACnE,SACE,gBAAAC;AAAA,IAACC,EAAc;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,gBAAcK;AAAA,MACd,aAAWC;AAAA,MACX,WAAWL;AAAA,QACTC,EAAiB,EAAE,SAAAG,GAAS,MAAAC,GAAM,SAAAC,GAAS;AAAA,QAC3C;AAAA,QACAX;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASU,EAAY;AAAA,EACnB,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAf;AAAA,EACA,SAAAgB;AAAA,EACA,GAAGd;AACL,GAGG;AACD,QAAM,EAAE,SAAAe,EAAA,IAAYC,EAAA;AACpB,SACE,gBAAAC;AAAA,IAACf,EAAc;AAAA,IAAd;AAAA,MACC,aAAU;AAAA,MACV,cAAYF,EAAM,SAAS;AAAA,MAC3B,WAAWG;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEAU,IAAW,YAAY;AAAA,QACvBf;AAAA,MAAA;AAAA,MAEF,SAAS,CAACoB,MAAU;AAClB,QAAAH,EAAQI,CAAU,GAClBL,IAAUI,CAAK;AAAA,MACjB;AAAA,MACC,GAAGlB;AAAA,MAEH,UAAA;AAAA,QAAAW,KACC,gBAAAV;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAU;AAAA,YACV,WAAWE;AAAA,cACT;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,YAAA;AAAA,YAGD,UAAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJC,KACC,gBAAAX;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAU;AAAA,YACV,WAAWE;AAAA,cACT;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,YAAA;AAAA,YAGD,UAAAS;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJC;AAAA,QACD,gBAAAZ;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAU;AAAA,YACV,WAAWE;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;AC/KA,MAAMiB,IAAc,0BACdC,IAAgB,IAChBC,IAAgB,IAChBC,KAAiB;AAEvB,SAASC,EAAqB;AAAA,EAC5B,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,OAAAC;AACF,GAMG;AACD,QAAMC,IAAML,EAAO,WAAW,IAAI;AAClC,MAAI,CAACK,EAAK,QAAO;AAEjB,QAAMC,IAAe,KAAK,IAAI,GAAG,KAAK,MAAMJ,CAAK,CAAC,GAC5CK,IAAgB,KAAK,IAAI,GAAG,KAAK,MAAMJ,CAAM,CAAC,GAC9CK,IAAa,KAAK,IAAIJ,KAAS,GAAG,CAAC;AAEzC,EAAAJ,EAAO,QAAQ,KAAK,IAAI,GAAG,KAAK,MAAMM,IAAeE,CAAU,CAAC,GAChER,EAAO,SAAS,KAAK,IAAI,GAAG,KAAK,MAAMO,IAAgBC,CAAU,CAAC,GAClEH,EAAI,aAAaG,GAAY,GAAG,GAAGA,GAAY,GAAG,CAAC,GACnDH,EAAI,UAAU,GAAG,GAAGC,GAAcC,CAAa;AAE/C,QAAME,IAAQR,EAAK,KAAA;AACnB,MAAI,CAACQ,EAAO,QAAO;AAEnB,QAAMC,IAAe,KAAK,IAAI,GAAGJ,IAAeR,KAAiB,CAAC;AAElE,EAAAO,EAAI,YAAY,QAChBA,EAAI,YAAY,UAChBA,EAAI,eAAe;AAEnB,MAAIM,IAAWf;AACf,SAAOe,IAAWd,MAChBQ,EAAI,OAAO,GAAGM,CAAQ,MAAMhB,CAAW,IACnC,EAAAU,EAAI,YAAYI,CAAK,EAAE,SAASC;AACpC,IAAAC,KAAY;AAGd,SAAAN,EAAI,OAAO,GAAGM,CAAQ,MAAMhB,CAAW,IACvCU,EAAI,SAASI,GAAOH,IAAe,GAAGC,IAAgB,GAAGG,CAAY,GAE9D;AACT;AAEO,SAASE,GAAU;AAAA,EACxB,OAAAH;AAAA,EACA,UAAAI;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAmB;AACjB,QAAMC,IAAaC,EAAA,GACb,CAACC,GAAMC,CAAO,IAAIC,EAA0B,MAAM,GAClD,CAACnB,GAAMoB,CAAO,IAAID,EAAS,EAAE,GAE7BE,IAAYC,EAA+B,IAAI,GAC/CC,IAAaD,EAAiC,IAAI,GAClDE,IAAcF,EAAOV,CAAQ,GAC7Ba,IAAmBH,EAAsBd,KAAS,IAAI,GACtDkB,IAAcJ,EAAO,EAAK,GAC1BK,IAAoBL,EAAO,EAAE,OAAO,GAAG,QAAQ,GAAG,GAElDM,IAAaC,EAAY,CAACC,MAA6B;AAC3D,IAAIL,EAAiB,YAAYK,MACjCL,EAAiB,UAAUK,GAC3BN,EAAY,UAAUM,CAAS;AAAA,EACjC,GAAG,CAAA,CAAE;AAEL,EAAAC,EAAU,MAAM;AACd,IAAAP,EAAY,UAAUZ;AAAA,EACxB,GAAG,CAACA,CAAQ,CAAC,GAEbmB,EAAU,MAAM;AACd,IAAAN,EAAiB,UAAUjB,KAAS;AAAA,EACtC,GAAG,CAACA,CAAK,CAAC,GAEVuB,EAAU,MAAM;AAId,QAHIL,EAAY,YAChBA,EAAY,UAAU,IAElB,CAAClB,KAASS,MAAS,QAAQ;AAC/B,UAAMe,IAAWX,EAAU;AAC3B,QAAKW;AAEL,UAAI;AACF,QAAAA,EAAS,YAAYxB,CAAK;AAAA,MAC5B,QAAQ;AACN,QAAAwB,EAAS,MAAA;AAAA,MACX;AAAA,EACF,GAAG,CAAA,CAAE,GAELD,EAAU,MAAM;AACd,QAAId,MAAS,OAAQ;AAErB,UAAMlB,IAASwB,EAAW;AAC1B,QAAI,CAACxB,EAAQ;AAEb,QAAI4B,EAAkB,QAAQ,UAAU,GAAG;AACzC,YAAMM,IAAOlC,EAAO,sBAAA;AACpB,MAAA4B,EAAkB,UAAU;AAAA,QAC1B,OAAO,KAAK,IAAI,GAAG,KAAK,MAAMM,EAAK,KAAK,CAAC;AAAA,QACzC,QAAQ,KAAK,IAAI,GAAG,KAAK,MAAMA,EAAK,MAAM,CAAC;AAAA,MAAA;AAAA,IAE/C;AAEA,UAAMnD,IAAO6C,EAAkB;AAC/B,QAAI,CAAC7C,EAAK,SAAS,CAACA,EAAK,OAAQ;AAEjC,UAAMqB,IAAQ,OAAO,oBAAoB;AASzC,QAAI,CARYL,EAAqB;AAAA,MACnC,QAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAOlB,EAAK;AAAA,MACZ,QAAQA,EAAK;AAAA,MACb,OAAAqB;AAAA,IAAA,CACD,GAEa;AACZ,MAAAyB,EAAW,IAAI;AACf;AAAA,IACF;AAEA,UAAMM,IAAe,SAAS,cAAc,QAAQ;AACpD,IAAApC,EAAqB;AAAA,MACnB,QAAQoC;AAAA,MACR,MAAAlC;AAAA,MACA,OAAOlB,EAAK;AAAA,MACZ,QAAQA,EAAK;AAAA,MACb,OAAAqB;AAAA,IAAA,CACD,GAEDyB,EAAWM,EAAa,UAAUpB,CAAS,CAAC;AAAA,EAC9C,GAAG,CAACG,GAAMjB,GAAMc,GAAWc,CAAU,CAAC;AAEtC,QAAMO,IAAiB,MAAM;AAC3B,IAAAd,EAAU,SAAS,MAAA,GACnBD,EAAQ,EAAE,GACVQ,EAAW,IAAI;AAAA,EACjB,GAEMQ,IAAgB,MAAM;AAC1B,QAAInB,MAAS,OAAQ;AACrB,UAAMoB,IAAOhB,EAAU,SAAS,UAAUP,CAAS,KAAK;AACxD,IAAAc,EAAWS,CAAI;AAAA,EACjB,GAEMC,IAAmB,CAACC,MAA0B;AAClD,IAAIA,MAAStB,MACbkB,EAAA,GACAjB,EAAQqB,CAAI;AAAA,EACd,GAEMC,IAAmB,CAAChD,MAAyC;AACjE,IAAA4B,EAAQ5B,EAAM,OAAO,KAAK;AAAA,EAC5B;AAMA,SAAIuB,MAAe,0BAEd,OAAA,EAAI,IAAG,aAAY,WAAU,UAC3B,UAAAP,IACC,gBAAAjC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAKiC;AAAA,MACL,KAAI;AAAA,MACJ,WAAW/B;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACAoC;AAAA,MAAA;AAAA,IACF;AAAA,EAAA,IAGF,gBAAAtC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAW;AAAA,MACX,WAAWE;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACAoC;AAAA,MAAA;AAAA,MAGF,UAAA,gBAAAtC,EAAC,OAAA,EAAI,WAAU,0GAAyG,UAAA,YAAA,CAExH;AAAA,IAAA;AAAA,EAAA,GAGN,IAKF,gBAAAA,EAAC,OAAA,EAAI,IAAG,aACN,UAAA,gBAAAgB;AAAA,IAACkD;AAAA,IAAA;AAAA,MACC,WAAWhE;AAAA,QACTwC,MAAS,SAAS,aAAa;AAAA,QAC/B;AAAA,MAAA;AAAA,MAGF,UAAA;AAAA,QAAA,gBAAA1C,EAACmE,GAAA,EAAgB,OAAM,eAAc,WAAU,QAC7C,UAAA,gBAAAnD,EAAC,OAAA,EAAI,WAAU,gCACb,UAAA;AAAA,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,gGACb,UAAA;AAAA,YAAA,gBAAAhB;AAAA,cAACJ;AAAA,cAAA;AAAA,gBACC,OAAO8C;AAAA,gBACP,eAAe,CAACsB,MACdD,EAAiBC,CAAuB;AAAA,gBAE1C,WAAU;AAAA,gBAEV,4BAAC3D,GAAA,EAAS,SAAQ,aAAY,SAAQ,MAAK,MAAK,MAC9C,UAAA;AAAA,kBAAA,gBAAAW,EAACP,GAAA,EAAY,OAAM,QACjB,UAAA;AAAA,oBAAA,gBAAAT,EAACoE,GAAA,EAAY;AAAA,oBACb,gBAAApE,EAAC,QAAA,EAAK,WAAU,kBAAiB,UAAA,OAAA,CAAI;AAAA,kBAAA,GACvC;AAAA,kBACA,gBAAAgB,EAACP,GAAA,EAAY,OAAM,QACjB,UAAA;AAAA,oBAAA,gBAAAT,EAACqE,GAAA,EAAa;AAAA,oBACd,gBAAArE,EAAC,QAAA,EAAK,WAAU,kBAAiB,UAAA,OAAA,CAAI;AAAA,kBAAA,EAAA,CACvC;AAAA,gBAAA,EAAA,CACF;AAAA,cAAA;AAAA,YAAA;AAAA,YAEF,gBAAAgB;AAAA,cAACsD;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,QAAO;AAAA,gBACP,SAAQ;AAAA,gBACR,SAASV;AAAA,gBAET,UAAA;AAAA,kBAAA,gBAAA5D,EAACuE,GAAA,EAAW;AAAA,kBACZ,gBAAAvE,EAAC,QAAA,EAAK,WAAU,kBAAiB,UAAA,QAAA,CAAK;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UACxC,GACF;AAAA,UACC0C,MAAS,SACR,gBAAA1C;AAAA,YAACwE;AAAA,YAAA;AAAA,cACC,KAAK1B;AAAA,cACL,OAAOe;AAAA,cACP,aAAa;AAAA,gBACX,WACEvB,KACApC;AAAA,kBACE;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,gBAAA;AAAA,cACF;AAAA,YACJ;AAAA,UAAA,IAGF,gBAAAF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAKgD;AAAA,cACL,WAAW9C;AAAA,gBACT;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,QACF,EAAA,CAEJ,EAAA,CACF;AAAA,QACA,gBAAAF;AAAA,UAACyE;AAAA,UAAA;AAAA,YACC,UAAU/B,MAAS;AAAA,YACnB,WAAWxC;AAAA,cACTwC,MAAS,SACL,8CACA;AAAA,cACJ;AAAA,YAAA;AAAA,YAEF,aAAY;AAAA,YACZ,OAAOjB;AAAA,YACP,UAAUwC;AAAA,UAAA;AAAA,QAAA;AAAA,MACZ;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;AC5SO,MAAMS,KAAgC;AAAA,EAC3C,YAAY;AAAA,IACV,CAACC,EAAU,SAAS,GAAGvC;AAAA,EAAA;AAAA,EAEzB,kBAAkB;AAAA,IAChB,CAACuC,EAAU,SAAS,GAAG;AAAA,MACrB,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,WAAW,CAACC,MAAuBA;AAAA,IAAA;AAAA,EACrC;AAEJ;"}
|
package/dist/schemas.js
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { C as s, a as o, N as t, P as m, c as n, f as N, g as c, b as d, n as g } from "./chunks/builder.meta-WpXc5VBB.js";
|
|
2
|
+
export {
|
|
3
|
+
s as ComponentNode,
|
|
4
|
+
o as Config,
|
|
5
|
+
t as NodeSchemas,
|
|
6
|
+
m as PEBBLE_COMPONENT_SCHEMAS,
|
|
7
|
+
n as createTemplateSchema,
|
|
8
|
+
N as fieldHints,
|
|
9
|
+
c as getArgsSchema,
|
|
10
|
+
d as getNodeRules,
|
|
11
|
+
g as nodeRules
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=schemas.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"schemas.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|
|
@@ -0,0 +1,144 @@
|
|
|
1
|
+
/* --- Global Resets & Theme Overrides --- */
|
|
2
|
+
@layer base {
|
|
3
|
+
/* THEME DEFINITIONS
|
|
4
|
+
Usage: <html data-theme="red"> or <body data-theme="indigo">
|
|
5
|
+
Logic:
|
|
6
|
+
- Main: The vibrant accent color
|
|
7
|
+
- Background: The secondary pastel version
|
|
8
|
+
- Main-Foreground: White for dark accents, Black for light accents (EX. text on buttons)
|
|
9
|
+
*/
|
|
10
|
+
|
|
11
|
+
[data-theme="red"] {
|
|
12
|
+
--color-main: var(--color-accent-red);
|
|
13
|
+
--color-main-secondary: var(--color-accent-red-secondary);
|
|
14
|
+
--color-background: var(--color-accent-red-secondary);
|
|
15
|
+
--color-main-foreground: oklch(100% 0 0);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
[data-theme="orange"] {
|
|
19
|
+
--color-main: var(--color-accent-orange);
|
|
20
|
+
--color-main-secondary: var(--color-accent-orange-secondary);
|
|
21
|
+
--color-background: var(--color-accent-orange-secondary);
|
|
22
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
[data-theme="amber"] {
|
|
26
|
+
--color-main: var(--color-accent-amber);
|
|
27
|
+
--color-main-secondary: var(--color-accent-amber-secondary);
|
|
28
|
+
--color-background: var(--color-accent-amber-secondary);
|
|
29
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
[data-theme="yellow"] {
|
|
33
|
+
--color-main: var(--color-accent-yellow);
|
|
34
|
+
--color-main-secondary: var(--color-accent-yellow-secondary);
|
|
35
|
+
--color-background: var(--color-accent-yellow-secondary);
|
|
36
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
[data-theme="lime"] {
|
|
40
|
+
--color-main: var(--color-accent-lime);
|
|
41
|
+
--color-main-secondary: var(--color-accent-lime-secondary);
|
|
42
|
+
--color-background: var(--color-accent-lime-secondary);
|
|
43
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
[data-theme="green"] {
|
|
47
|
+
--color-main: var(--color-accent-green);
|
|
48
|
+
--color-main-secondary: var(--color-accent-green-secondary);
|
|
49
|
+
--color-background: var(--color-accent-green-secondary);
|
|
50
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
[data-theme="emerald"] {
|
|
54
|
+
--color-main: var(--color-accent-emerald);
|
|
55
|
+
--color-main-secondary: var(--color-accent-emerald-secondary);
|
|
56
|
+
--color-background: var(--color-accent-emerald-secondary);
|
|
57
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
[data-theme="teal"] {
|
|
61
|
+
--color-main: var(--color-accent-teal);
|
|
62
|
+
--color-main-secondary: var(--color-accent-teal-secondary);
|
|
63
|
+
--color-background: var(--color-accent-teal-secondary);
|
|
64
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
[data-theme="cyan"] {
|
|
68
|
+
--color-main: var(--color-accent-cyan);
|
|
69
|
+
--color-main-secondary: var(--color-accent-cyan-secondary);
|
|
70
|
+
--color-background: var(--color-accent-cyan-secondary);
|
|
71
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
[data-theme="sky"] {
|
|
75
|
+
--color-main: var(--color-accent-sky);
|
|
76
|
+
--color-main-secondary: var(--color-accent-sky-secondary);
|
|
77
|
+
--color-background: var(--color-accent-sky-secondary);
|
|
78
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
[data-theme="blue"] {
|
|
82
|
+
--color-main: var(--color-accent-blue);
|
|
83
|
+
--color-main-secondary: var(--color-accent-blue-secondary);
|
|
84
|
+
--color-background: var(--color-accent-blue-secondary);
|
|
85
|
+
--color-main-foreground: oklch(100% 0 0);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
[data-theme="indigo"] {
|
|
89
|
+
--color-main: var(--color-accent-indigo);
|
|
90
|
+
--color-main-secondary: var(--color-accent-indigo-secondary);
|
|
91
|
+
--color-background: var(--color-accent-indigo-secondary);
|
|
92
|
+
--color-main-foreground: oklch(100% 0 0);
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
[data-theme="violet"] {
|
|
96
|
+
--color-main: var(--color-accent-violet);
|
|
97
|
+
--color-main-secondary: var(--color-accent-violet-secondary);
|
|
98
|
+
--color-background: var(--color-accent-violet-secondary);
|
|
99
|
+
--color-main-foreground: oklch(100% 0 0);
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
[data-theme="purple"] {
|
|
103
|
+
--color-main: var(--color-accent-purple);
|
|
104
|
+
--color-main-secondary: var(--color-accent-purple-secondary);
|
|
105
|
+
--color-background: var(--color-accent-purple-secondary);
|
|
106
|
+
--color-main-foreground: oklch(100% 0 0);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
[data-theme="fuchsia"] {
|
|
110
|
+
--color-main: var(--color-accent-fuchsia);
|
|
111
|
+
--color-main-secondary: var(--color-accent-fuchsia-secondary);
|
|
112
|
+
--color-background: var(--color-accent-fuchsia-secondary);
|
|
113
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
[data-theme="pink"] {
|
|
117
|
+
--color-main: var(--color-accent-pink);
|
|
118
|
+
--color-main-secondary: var(--color-accent-pink-secondary);
|
|
119
|
+
--color-background: var(--color-accent-pink-secondary);
|
|
120
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
[data-theme="rose"] {
|
|
124
|
+
--color-main: var(--color-accent-rose);
|
|
125
|
+
--color-main-secondary: var(--color-accent-rose-secondary);
|
|
126
|
+
--color-background: var(--color-accent-rose-secondary);
|
|
127
|
+
--color-main-foreground: oklch(100% 0 0);
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
body {
|
|
131
|
+
font-family: var(--font-body);
|
|
132
|
+
background-color: var(--color-background);
|
|
133
|
+
color: var(--color-foreground);
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
h1,
|
|
137
|
+
h2,
|
|
138
|
+
h3,
|
|
139
|
+
h4,
|
|
140
|
+
h5,
|
|
141
|
+
h6 {
|
|
142
|
+
font-family: var(--font-heading);
|
|
143
|
+
}
|
|
144
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/* --- Fonts --- */
|
|
2
|
+
@font-face {
|
|
3
|
+
font-family: "Great Vibes";
|
|
4
|
+
src: url("https://brand.pebble.software/fonts/GreatVibes-Regular.ttf")
|
|
5
|
+
format("truetype");
|
|
6
|
+
font-weight: auto;
|
|
7
|
+
font-style: normal;
|
|
8
|
+
font-display: swap;
|
|
9
|
+
}
|
|
10
|
+
@font-face {
|
|
11
|
+
font-family: "Sora";
|
|
12
|
+
src: url("https://brand.pebble.software/fonts/Sora-VariableFont_wght.ttf")
|
|
13
|
+
format("truetype");
|
|
14
|
+
font-weight: 100 900;
|
|
15
|
+
font-style: normal;
|
|
16
|
+
font-display: swap;
|
|
17
|
+
}
|
|
18
|
+
@font-face {
|
|
19
|
+
font-family: "Fredoka";
|
|
20
|
+
src: url("https://brand.pebble.software/fonts/Fredoka-VariableFont_wdth,wght.ttf")
|
|
21
|
+
format("truetype");
|
|
22
|
+
font-weight: 300 700;
|
|
23
|
+
font-style: normal;
|
|
24
|
+
font-display: swap;
|
|
25
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
@import "maplibre-gl/dist/maplibre-gl.css";
|
|
2
|
+
|
|
3
|
+
/* --- MapLibre Pebble Overrides --- */
|
|
4
|
+
.maplibregl-ctrl {
|
|
5
|
+
@apply bg-surface! outline-0! shadow-none! *:[button]:rounded-base *:[button]:bg-surface! *:[button]:hover:bg-main! *:[button]:transition-all *:[button]:duration-200 *:[button]:border-2! *:[button]:border-border! *:[button]:shadow-xs! *:[button]:-translate-0.5! *:[button]:hover:shadow-min! *:[button]:hover:-translate-px! *:[button]:focus-visible:-translate-px! *:[button]:focus-visible:shadow-min! *:[button]:active:shadow-none! *:[button]:active:translate-0! *:[button]:aria-disabled:shadow-none! *:[button]:aria-disabled:translate-0!;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
.maplibregl-ctrl-zoom-in {
|
|
9
|
+
@apply -mb-0.5! rounded-b-none!;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.maplibregl-ctrl-zoom-out {
|
|
13
|
+
@apply rounded-t-none!;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.maplibregl-ctrl-fullscreen {
|
|
17
|
+
@apply p-1!;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.maplibregl-ctrl-scale {
|
|
21
|
+
@apply transition-[width] duration-500 delay-100 rounded-sm! border-2! border-border! hover:bg-main! bg-surface! font-bold! leading-none! py-1! shadow-sm! font-mono! text-xs!;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.maplibregl-user-location-dot {
|
|
25
|
+
@apply shadow-xl! bg-accent-blue! before:bg-accent-blue! after:border-border!;
|
|
26
|
+
}
|
|
27
|
+
.maplibregl-user-location-accuracy-circle {
|
|
28
|
+
@apply bg-accent-blue/20!;
|
|
29
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@import "tailwindcss";
|
|
@@ -0,0 +1,197 @@
|
|
|
1
|
+
@theme {
|
|
2
|
+
/* --- Typography --- */
|
|
3
|
+
--font-body: "Sora", ui-sans-serif, system-ui, sans-serif;
|
|
4
|
+
--font-heading: "Fredoka", ui-monospace, monospace;
|
|
5
|
+
--font-signature: "Great Vibes", cursive;
|
|
6
|
+
--font-weight-base: 400;
|
|
7
|
+
--font-weight-heading: 600;
|
|
8
|
+
|
|
9
|
+
/* --- Core Colors (Default - Emerald) --- */
|
|
10
|
+
--color-main: var(--color-accent-emerald);
|
|
11
|
+
--color-main-secondary: var(--color-accent-emerald-secondary);
|
|
12
|
+
--color-main-foreground: oklch(0% 0 0);
|
|
13
|
+
|
|
14
|
+
--color-background: var(--color-white);
|
|
15
|
+
--color-foreground: oklch(0% 0 0);
|
|
16
|
+
--color-surface: oklch(100% 0 0);
|
|
17
|
+
--color-muted: oklch(0% 0 0 / 0.65);
|
|
18
|
+
--color-subtle: oklch(0% 0 0 / 0.5);
|
|
19
|
+
|
|
20
|
+
--color-border: oklch(0% 0 0);
|
|
21
|
+
--color-ring: oklch(0% 0 0);
|
|
22
|
+
--color-overlay: oklch(0% 0 0 / 0.8);
|
|
23
|
+
|
|
24
|
+
/* --- Accent Palette --- */
|
|
25
|
+
--color-accent-red: oklch(67.28% 0.2147 24.22);
|
|
26
|
+
--color-accent-red-secondary: oklch(93.3% 0.0339 17.77);
|
|
27
|
+
|
|
28
|
+
--color-accent-orange: oklch(72.27% 0.1894 50.19);
|
|
29
|
+
--color-accent-orange-secondary: oklch(95.38% 0.0357 72.89);
|
|
30
|
+
|
|
31
|
+
--color-accent-amber: oklch(84.08% 0.1725 84.2);
|
|
32
|
+
--color-accent-amber-secondary: oklch(96% 0.04 85);
|
|
33
|
+
|
|
34
|
+
--color-accent-yellow: oklch(86.03% 0.176 92.36);
|
|
35
|
+
--color-accent-yellow-secondary: oklch(96.79% 0.0654 102.26);
|
|
36
|
+
|
|
37
|
+
--color-accent-lime: oklch(83.29% 0.2331 132.51);
|
|
38
|
+
--color-accent-lime-secondary: oklch(95.37% 0.0549 125.19);
|
|
39
|
+
|
|
40
|
+
--color-accent-green: oklch(79.76% 0.2044 153.08);
|
|
41
|
+
--color-accent-green-secondary: oklch(96.47% 0.0401 157.79);
|
|
42
|
+
|
|
43
|
+
--color-accent-emerald: oklch(77.54% 0.1681 162.78);
|
|
44
|
+
--color-accent-emerald-secondary: oklch(95.31% 0.0496 169.04);
|
|
45
|
+
|
|
46
|
+
--color-accent-teal: oklch(78.57% 0.1422 180.36);
|
|
47
|
+
--color-accent-teal-secondary: oklch(95.08% 0.0481 184.07);
|
|
48
|
+
|
|
49
|
+
--color-accent-cyan: oklch(76.89% 0.139164 219.13);
|
|
50
|
+
--color-accent-cyan-secondary: oklch(94.61% 0.043 211.12);
|
|
51
|
+
|
|
52
|
+
--color-accent-sky: oklch(66.9% 0.18368 248.8066);
|
|
53
|
+
--color-accent-sky-secondary: oklch(94.27% 0.0268 242.57);
|
|
54
|
+
|
|
55
|
+
--color-accent-blue: oklch(67.47% 0.1726 259.49);
|
|
56
|
+
--color-accent-blue-secondary: oklch(93.46% 0.0305 255.11);
|
|
57
|
+
|
|
58
|
+
--color-accent-indigo: oklch(66.34% 0.1806 277.2);
|
|
59
|
+
--color-accent-indigo-secondary: oklch(92.13% 0.0388 282.36);
|
|
60
|
+
|
|
61
|
+
--color-accent-violet: oklch(70.28% 0.1753 295.36);
|
|
62
|
+
--color-accent-violet-secondary: oklch(93% 0.04 295);
|
|
63
|
+
|
|
64
|
+
--color-accent-purple: oklch(71.9% 0.198 310.03);
|
|
65
|
+
--color-accent-purple-secondary: oklch(94.11% 0.036556 308.0303);
|
|
66
|
+
|
|
67
|
+
--color-accent-fuchsia: oklch(73.43% 0.2332 321.41);
|
|
68
|
+
--color-accent-fuchsia-secondary: oklch(94% 0.04 321);
|
|
69
|
+
|
|
70
|
+
--color-accent-pink: oklch(71.5% 0.197 354.23);
|
|
71
|
+
--color-accent-pink-secondary: oklch(95.16% 0.0242 343.23);
|
|
72
|
+
|
|
73
|
+
--color-accent-rose: oklch(70.79% 0.1862 16.25);
|
|
74
|
+
--color-accent-rose-secondary: oklch(93.37% 0.0339 12.05);
|
|
75
|
+
|
|
76
|
+
/* --- Chart Colors (for Recharts graphs only) --- */
|
|
77
|
+
--color-chart-1: var(--color-accent-red);
|
|
78
|
+
--color-chart-2: var(--color-accent-orange);
|
|
79
|
+
--color-chart-3: var(--color-accent-amber);
|
|
80
|
+
--color-chart-4: var(--color-accent-yellow);
|
|
81
|
+
--color-chart-5: var(--color-accent-lime);
|
|
82
|
+
--color-chart-6: var(--color-accent-green);
|
|
83
|
+
--color-chart-7: var(--color-accent-emerald);
|
|
84
|
+
--color-chart-8: var(--color-accent-teal);
|
|
85
|
+
--color-chart-9: var(--color-accent-cyan);
|
|
86
|
+
--color-chart-10: var(--color-accent-sky);
|
|
87
|
+
--color-chart-11: var(--color-accent-blue);
|
|
88
|
+
--color-chart-12: var(--color-accent-indigo);
|
|
89
|
+
--color-chart-13: var(--color-accent-violet);
|
|
90
|
+
--color-chart-14: var(--color-accent-purple);
|
|
91
|
+
--color-chart-15: var(--color-accent-fuchsia);
|
|
92
|
+
--color-chart-16: var(--color-accent-pink);
|
|
93
|
+
--color-chart-17: var(--color-accent-rose);
|
|
94
|
+
--color-chart-active-dot: var(--color-foreground);
|
|
95
|
+
|
|
96
|
+
/* --- Borders --- */
|
|
97
|
+
--default-border-width: 2px;
|
|
98
|
+
|
|
99
|
+
/* --- Shadows & Spacing --- */
|
|
100
|
+
--radius-base: var(--radius-lg);
|
|
101
|
+
--spacing-boxShadowX: 3px;
|
|
102
|
+
--spacing-boxShadowY: 3px;
|
|
103
|
+
|
|
104
|
+
/* --- Drop Shadows --- */
|
|
105
|
+
--shadow-min: 1px 1px 0px 0px var(--color-border);
|
|
106
|
+
--shadow-xs: 2px 2px 0px 0px var(--color-border);
|
|
107
|
+
--shadow-sm: 3px 3px 0px 0px var(--color-border);
|
|
108
|
+
--shadow-md: 4px 4px 0px 0px var(--color-border);
|
|
109
|
+
--shadow-lg: 4.75px 4.75px 0px 0px var(--color-border);
|
|
110
|
+
--shadow-xl: 5.5px 5.5px 0px 0px var(--color-border);
|
|
111
|
+
|
|
112
|
+
--shadow-default: var(--shadow-md);
|
|
113
|
+
|
|
114
|
+
/* --- Inset Shadows --- */
|
|
115
|
+
--inset-shadow-xs: inset 1px 1px 0px 0px var(--color-border);
|
|
116
|
+
--inset-shadow-sm: inset 2px 2px 0px 0px var(--color-border);
|
|
117
|
+
--inset-shadow-md: inset 3px 3px 0px 0px var(--color-border);
|
|
118
|
+
--inset-shadow-lg: inset 4px 4px 0px 0px var(--color-border);
|
|
119
|
+
--inset-shadow-xl: inset 5px 5px 0px 0px var(--color-border);
|
|
120
|
+
|
|
121
|
+
/* --- Aspect Ratios --- */
|
|
122
|
+
--aspect-a4: 210/297;
|
|
123
|
+
--aspect-a4-landscape: 297/210;
|
|
124
|
+
|
|
125
|
+
/* --- Animations & Keyframes --- */
|
|
126
|
+
--animate-cloud-move: cloud-move 60s linear infinite alternate;
|
|
127
|
+
--animate-float: float 3s ease-in-out infinite;
|
|
128
|
+
--animate-subtle-float: subtle-float 3s ease-in-out infinite;
|
|
129
|
+
--animate-color-cycle: color-cycle 30s ease-in-out infinite;
|
|
130
|
+
--animate-color-cycle-vibrant: color-cycle-vibrant 30s ease-in-out infinite;
|
|
131
|
+
--animate-bg-color-cycle: bg-color-cycle 30s ease-in-out infinite;
|
|
132
|
+
--animate-bg-color-cycle-vibrant: bg-color-cycle-vibrant 30s ease-in-out
|
|
133
|
+
infinite;
|
|
134
|
+
--animate-font-color-cycle-vibrant: font-color-cycle-vibrant 30s ease-in-out
|
|
135
|
+
infinite;
|
|
136
|
+
|
|
137
|
+
@keyframes cloud-move {
|
|
138
|
+
0% {
|
|
139
|
+
transform: translateX(0);
|
|
140
|
+
}
|
|
141
|
+
100% {
|
|
142
|
+
transform: translateX(-100vw);
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
@keyframes float {
|
|
146
|
+
0%,
|
|
147
|
+
100% {
|
|
148
|
+
transform: translateY(0%);
|
|
149
|
+
}
|
|
150
|
+
50% {
|
|
151
|
+
transform: translateY(-5%);
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
@keyframes subtle-float {
|
|
155
|
+
0%,
|
|
156
|
+
100% {
|
|
157
|
+
transform: translateY(0%);
|
|
158
|
+
}
|
|
159
|
+
50% {
|
|
160
|
+
transform: translateY(-2%);
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
@keyframes bg-color-cycle {
|
|
165
|
+
0% {
|
|
166
|
+
background-color: var(--color-accent-red-secondary);
|
|
167
|
+
}
|
|
168
|
+
50% {
|
|
169
|
+
background-color: var(--color-accent-cyan-secondary);
|
|
170
|
+
}
|
|
171
|
+
100% {
|
|
172
|
+
background-color: var(--color-accent-rose-secondary);
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
@keyframes bg-color-cycle-vibrant {
|
|
176
|
+
0% {
|
|
177
|
+
background-color: var(--color-accent-red);
|
|
178
|
+
}
|
|
179
|
+
50% {
|
|
180
|
+
background-color: var(--color-accent-cyan);
|
|
181
|
+
}
|
|
182
|
+
100% {
|
|
183
|
+
background-color: var(--color-accent-rose);
|
|
184
|
+
}
|
|
185
|
+
}
|
|
186
|
+
@keyframes font-color-cycle-vibrant {
|
|
187
|
+
0% {
|
|
188
|
+
color: var(--color-accent-red);
|
|
189
|
+
}
|
|
190
|
+
50% {
|
|
191
|
+
color: var(--color-accent-cyan);
|
|
192
|
+
}
|
|
193
|
+
100% {
|
|
194
|
+
color: var(--color-accent-rose);
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@import "tw-animate-css";
|