@sqlrooms/notebook 0.29.0-rc.2 → 0.29.0-rc.3

package/dist/cells/Input/InputConfigPanel/DropdownConfig.js

@@ -1,44 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from 'react';
-import { Button, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@sqlrooms/ui';
-import { OctagonAlertIcon, XIcon } from 'lucide-react';
-import { useFormContext, useFieldArray } from 'react-hook-form';
-export const DropdownConfig = () => {
-    const { control, setValue, watch, setError, clearErrors, formState: { errors }, } = useFormContext();
-    const options = watch('options') || [];
-    const dropdownValue = watch('value') || '';
-    const [option, setOption] = useState('');
-    const { remove, append } = useFieldArray({ control, name: 'options' });
-    const handleAddOption = () => {
-        const trimmedOption = option.trim();
-        if (!trimmedOption)
-            return;
-        if (options.includes(trimmedOption)) {
-            setError('options', {
-                type: 'manual',
-                message: 'This value already exists',
-            });
-            return;
-        }
-        append(trimmedOption);
-        setOption('');
-        if (errors.options) {
-            clearErrors('options');
-        }
-    };
-    const handleRemoveOption = (index) => {
-        remove(index);
-    };
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs(Label, { children: ["Values ", _jsx("span", { className: "text-gray-500", children: "(strings)" })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("div", { className: "flex max-h-32 flex-wrap gap-1 overflow-auto text-xs", children: options.map((value, index) => (_jsxs("span", { className: "bg-secondary flex items-center gap-1 rounded-md px-2 py-1", children: [value, _jsx(Button, { type: "button", variant: "ghost", size: "xs", className: "h-4 w-4 p-0", onClick: () => handleRemoveOption(index), children: _jsx(XIcon, { size: 12, strokeWidth: 1.5 }) })] }, index))) }), _jsxs("div", { className: "flex gap-1", children: [_jsx(Input, { className: "h-8 text-sm", value: option, onChange: (e) => {
-                                            setOption(e.target.value);
-                                            if (errors.options) {
-                                                clearErrors('options');
-                                            }
-                                        }, onKeyDown: (e) => {
-                                            if (e.key === 'Enter') {
-                                                e.preventDefault();
-                                                handleAddOption();
-                                            }
-                                        } }), _jsx(Button, { type: "button", variant: "outline", size: "xs", onClick: handleAddOption, children: "Add" })] }), errors.options && (_jsxs("div", { className: "flex items-center gap-1 text-xs text-red-500", children: [_jsx(OctagonAlertIcon, { size: 16, strokeWidth: 1.5 }), errors.options.message] }))] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Value" }), _jsxs(Select, { value: dropdownValue, onValueChange: (v) => setValue('value', v), children: [_jsx(SelectTrigger, { className: "h-8 shadow-none", children: _jsx(SelectValue, { placeholder: "Select a default value" }) }), _jsx(SelectContent, { onCloseAutoFocus: (e) => e.preventDefault(), children: options.map((option) => (_jsx(SelectItem, { className: "text-xs", value: option, children: option }, option))) })] })] })] }));
-};
-//# sourceMappingURL=DropdownConfig.js.map

package/dist/cells/Input/InputConfigPanel/DropdownConfig.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DropdownConfig.js","sourceRoot":"","sources":["../../../../src/cells/Input/InputConfigPanel/DropdownConfig.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useState} from 'react';\nimport {\n  Button,\n  Input,\n  Label,\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@sqlrooms/ui';\nimport {OctagonAlertIcon, XIcon} from 'lucide-react';\nimport {useFormContext, useFieldArray} from 'react-hook-form';\n\nexport const DropdownConfig = () => {\n  const {\n    control,\n    setValue,\n    watch,\n    setError,\n    clearErrors,\n    formState: {errors},\n  } = useFormContext();\n  const options = watch('options') || [];\n  const dropdownValue = watch('value') || '';\n\n  const [option, setOption] = useState('');\n\n  const {remove, append} = useFieldArray({control, name: 'options'});\n\n  const handleAddOption = () => {\n    const trimmedOption = option.trim();\n    if (!trimmedOption) return;\n\n    if (options.includes(trimmedOption)) {\n      setError('options', {\n        type: 'manual',\n        message: 'This value already exists',\n      });\n      return;\n    }\n\n    append(trimmedOption);\n    setOption('');\n    if (errors.options) {\n      clearErrors('options');\n    }\n  };\n\n  const handleRemoveOption = (index: number) => {\n    remove(index);\n  };\n\n  return (\n    <>\n      <div className=\"flex flex-col gap-2\">\n        <Label>\n          Values <span className=\"text-gray-500\">(strings)</span>\n        </Label>\n        <div className=\"flex flex-col gap-2\">\n          <div className=\"flex max-h-32 flex-wrap gap-1 overflow-auto text-xs\">\n            {options.map((value: string, index: number) => (\n              <span\n                className=\"bg-secondary flex items-center gap-1 rounded-md px-2 py-1\"\n                key={index}\n              >\n                {value}\n                <Button\n                  type=\"button\"\n                  variant=\"ghost\"\n                  size=\"xs\"\n                  className=\"h-4 w-4 p-0\"\n                  onClick={() => handleRemoveOption(index)}\n                >\n                  <XIcon size={12} strokeWidth={1.5} />\n                </Button>\n              </span>\n            ))}\n          </div>\n\n          <div className=\"flex gap-1\">\n            <Input\n              className=\"h-8 text-sm\"\n              value={option}\n              onChange={(e) => {\n                setOption(e.target.value);\n                if (errors.options) {\n                  clearErrors('options');\n                }\n              }}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter') {\n                  e.preventDefault();\n                  handleAddOption();\n                }\n              }}\n            />\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              size=\"xs\"\n              onClick={handleAddOption}\n            >\n              Add\n            </Button>\n          </div>\n\n          {errors.options && (\n            <div className=\"flex items-center gap-1 text-xs text-red-500\">\n              <OctagonAlertIcon size={16} strokeWidth={1.5} />\n              {errors.options.message as string}\n            </div>\n          )}\n        </div>\n      </div>\n\n      <div className=\"flex flex-col gap-2\">\n        <Label>Value</Label>\n        <Select\n          value={dropdownValue}\n          onValueChange={(v) => setValue('value', v)}\n        >\n          <SelectTrigger className=\"h-8 shadow-none\">\n            <SelectValue placeholder=\"Select a default value\" />\n          </SelectTrigger>\n          <SelectContent onCloseAutoFocus={(e) => e.preventDefault()}>\n            {options.map((option: string) => (\n              <SelectItem className=\"text-xs\" key={option} value={option}>\n                {option}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </Select>\n      </div>\n    </>\n  );\n};\n"]}

package/dist/cells/Input/InputConfigPanel/InputConfigPanel.d.ts

@@ -1,11 +0,0 @@
-import { FC } from 'react';
-import { InputUnion } from '../../../cellSchemas';
-type Props = {
-    className?: string;
-    input: InputUnion;
-    updateInput: (patch: InputUnion) => void;
-    onRemove?: () => void;
-};
-export declare const InputConfigPanel: FC<Props>;
-export {};
-//# sourceMappingURL=InputConfigPanel.d.ts.map

package/dist/cells/Input/InputConfigPanel/InputConfigPanel.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InputConfigPanel.d.ts","sourceRoot":"","sources":["../../../../src/cells/Input/InputConfigPanel/InputConfigPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,EAAE,EAAY,MAAM,OAAO,CAAC;AAsBpC,OAAO,EAAa,UAAU,EAAC,MAAM,sBAAsB,CAAC;AAG5D,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,UAAU,CAAC;IAClB,WAAW,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,KAAK,CA2FtC,CAAC"}

package/dist/cells/Input/InputConfigPanel/InputConfigPanel.js

@@ -1,65 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect } from 'react';
-import { FormProvider, useForm } from 'react-hook-form';
-import { Button, cn, Input, Label, Popover, PopoverContent, PopoverTrigger, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Spinner, } from '@sqlrooms/ui';
-import { SettingsIcon } from 'lucide-react';
-import { TextConfig } from './TextConfig';
-import { DropdownConfig } from './DropdownConfig';
-import { initializeInput } from '../../../NotebookUtils';
-import { InputTypes } from '../../../cellSchemas';
-import { SliderConfig } from './SliderConfig';
-export const InputConfigPanel = ({ className, input, updateInput, onRemove, }) => {
-    const methods = useForm({
-        defaultValues: input,
-        mode: 'onChange',
-        reValidateMode: 'onChange',
-    });
-    const { handleSubmit, reset, formState: { isSubmitting, errors }, } = methods;
-    // Keep form in sync when `input` prop changes externally
-    useEffect(() => {
-        reset(input);
-    }, [input, reset]);
-    const onSubmit = (data) => {
-        if (data.kind === 'dropdown' && !data.value && data.options.length > 0) {
-            const newValue = data.options[0] ?? '';
-            updateInput({ ...data, value: newValue });
-            return;
-        }
-        else if (data.kind === 'slider') {
-            const clampedValue = Math.min(Math.max(data.value, data.min), data.max);
-            updateInput({ ...data, value: clampedValue });
-            return;
-        }
-        updateInput(data);
-    };
-    const onInteractOutside = (e) => {
-        if (Object.keys(errors).length > 0) {
-            e.preventDefault();
-            return;
-        }
-        handleSubmit(onSubmit)();
-    };
-    return (_jsx("div", { className: cn(className), children: _jsx(FormProvider, { ...methods, children: _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: isSubmitting ? (_jsx(Spinner, {})) : (_jsx(SettingsIcon, { size: 18, strokeWidth: 1.5, className: "cursor-pointer" })) }), _jsxs(PopoverContent, { className: "flex flex-col gap-5", onInteractOutside: onInteractOutside, children: [_jsxs("form", { className: "flex flex-col gap-5", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Name" }), _jsx(Input, { className: "h-8 text-sm", ...methods.register('varName') })] }), _jsx(InputTypeDropdown, { methods: methods }), _jsx(InputConfig, { methods: methods })] }), _jsx(Button, { type: "button", variant: "outline", size: "xs", className: "w-full border-red-500 text-red-500 hover:bg-red-500/10 hover:text-red-600", onClick: onRemove, children: "Remove input" })] })] }) }) }));
-};
-const InputConfig = ({ methods }) => {
-    const draftInput = methods.watch();
-    switch (draftInput.kind) {
-        case 'text':
-            return _jsx(TextConfig, {});
-        case 'slider':
-            return _jsx(SliderConfig, {});
-        case 'dropdown':
-            return _jsx(DropdownConfig, {});
-    }
-};
-const InputTypeDropdown = ({ methods, }) => {
-    const { watch, reset, getValues, trigger } = methods;
-    const kind = watch('kind');
-    const onTypeChange = (kind) => {
-        const newInput = initializeInput(kind, getValues());
-        reset(newInput, { keepErrors: false });
-        trigger();
-    };
-    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Type" }), _jsxs(Select, { value: kind, onValueChange: onTypeChange, children: [_jsx(SelectTrigger, { className: "h-8 shadow-none", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { onCloseAutoFocus: (e) => e.preventDefault(), children: InputTypes.options.map((option) => (_jsx(SelectItem, { className: "text-xs", value: option, children: option }, option))) })] })] }));
-};
-//# sourceMappingURL=InputConfigPanel.js.map

package/dist/cells/Input/InputConfigPanel/InputConfigPanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InputConfigPanel.js","sourceRoot":"","sources":["../../../../src/cells/Input/InputConfigPanel/InputConfigPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import {FC, useEffect} from 'react';\nimport {FormProvider, useForm, UseFormReturn} from 'react-hook-form';\nimport {\n  Button,\n  cn,\n  Input,\n  Label,\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n  Spinner,\n} from '@sqlrooms/ui';\nimport {SettingsIcon} from 'lucide-react';\n\nimport {TextConfig} from './TextConfig';\nimport {DropdownConfig} from './DropdownConfig';\nimport {initializeInput} from '../../../NotebookUtils';\nimport {InputTypes, InputUnion} from '../../../cellSchemas';\nimport {SliderConfig} from './SliderConfig';\n\ntype Props = {\n  className?: string;\n  input: InputUnion;\n  updateInput: (patch: InputUnion) => void;\n  onRemove?: () => void;\n};\n\nexport const InputConfigPanel: FC<Props> = ({\n  className,\n  input,\n  updateInput,\n  onRemove,\n}) => {\n  const methods = useForm<InputUnion>({\n    defaultValues: input,\n    mode: 'onChange',\n    reValidateMode: 'onChange',\n  });\n\n  const {\n    handleSubmit,\n    reset,\n    formState: {isSubmitting, errors},\n  } = methods;\n\n  // Keep form in sync when `input` prop changes externally\n  useEffect(() => {\n    reset(input);\n  }, [input, reset]);\n\n  const onSubmit = (data: InputUnion) => {\n    if (data.kind === 'dropdown' && !data.value && data.options.length > 0) {\n      const newValue = data.options[0] ?? '';\n      updateInput({...data, value: newValue});\n      return;\n    } else if (data.kind === 'slider') {\n      const clampedValue = Math.min(Math.max(data.value, data.min), data.max);\n      updateInput({...data, value: clampedValue});\n      return;\n    }\n\n    updateInput(data);\n  };\n\n  const onInteractOutside = (e: {preventDefault: () => void}) => {\n    if (Object.keys(errors).length > 0) {\n      e.preventDefault();\n      return;\n    }\n    handleSubmit(onSubmit)();\n  };\n\n  return (\n    <div className={cn(className)}>\n      <FormProvider {...methods}>\n        <Popover>\n          <PopoverTrigger asChild>\n            {isSubmitting ? (\n              <Spinner />\n            ) : (\n              <SettingsIcon\n                size={18}\n                strokeWidth={1.5}\n                className=\"cursor-pointer\"\n              />\n            )}\n          </PopoverTrigger>\n          <PopoverContent\n            className=\"flex flex-col gap-5\"\n            onInteractOutside={onInteractOutside}\n          >\n            <form className=\"flex flex-col gap-5\">\n              <div className=\"flex flex-col gap-2\">\n                <Label>Name</Label>\n                <Input\n                  className=\"h-8 text-sm\"\n                  {...methods.register('varName')}\n                />\n              </div>\n\n              <InputTypeDropdown methods={methods} />\n\n              <InputConfig methods={methods} />\n            </form>\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              size=\"xs\"\n              className=\"w-full border-red-500 text-red-500 hover:bg-red-500/10 hover:text-red-600\"\n              onClick={onRemove}\n            >\n              Remove input\n            </Button>\n          </PopoverContent>\n        </Popover>\n      </FormProvider>\n    </div>\n  );\n};\n\nconst InputConfig: FC<{methods: UseFormReturn<InputUnion>}> = ({methods}) => {\n  const draftInput = methods.watch();\n  switch (draftInput.kind) {\n    case 'text':\n      return <TextConfig />;\n    case 'slider':\n      return <SliderConfig />;\n    case 'dropdown':\n      return <DropdownConfig />;\n  }\n};\n\nconst InputTypeDropdown: FC<{methods: UseFormReturn<InputUnion>}> = ({\n  methods,\n}) => {\n  const {watch, reset, getValues, trigger} = methods;\n  const kind = watch('kind');\n\n  const onTypeChange = (kind: InputTypes) => {\n    const newInput = initializeInput(kind, getValues());\n    reset(newInput, {keepErrors: false});\n    trigger();\n  };\n\n  return (\n    <div className=\"flex flex-col gap-2\">\n      <Label>Type</Label>\n      <Select value={kind} onValueChange={onTypeChange}>\n        <SelectTrigger className=\"h-8 shadow-none\">\n          <SelectValue />\n        </SelectTrigger>\n        <SelectContent onCloseAutoFocus={(e) => e.preventDefault()}>\n          {InputTypes.options.map((option) => (\n            <SelectItem className=\"text-xs\" key={option} value={option}>\n              {option}\n            </SelectItem>\n          ))}\n        </SelectContent>\n      </Select>\n    </div>\n  );\n};\n"]}

package/dist/cells/Input/InputConfigPanel/SliderConfig.d.ts

@@ -1,2 +0,0 @@
-export declare const SliderConfig: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=SliderConfig.d.ts.map

package/dist/cells/Input/InputConfigPanel/SliderConfig.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SliderConfig.d.ts","sourceRoot":"","sources":["../../../../src/cells/Input/InputConfigPanel/SliderConfig.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,+CAmExB,CAAC"}

package/dist/cells/Input/InputConfigPanel/SliderConfig.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Input, Label } from '@sqlrooms/ui';
-import { OctagonAlertIcon } from 'lucide-react';
-import { useFormContext } from 'react-hook-form';
-export const SliderConfig = () => {
-    const { register, formState: { errors }, } = useFormContext();
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsx(Label, { children: "Min" }), _jsx(Label, { children: "Max" }), _jsx(Input, { type: "number", className: "h-8 text-sm", ...register('min', {
-                                    valueAsNumber: true,
-                                    validate: (v, formValues) => v <= formValues.max || 'Min should not exceed Max',
-                                }) }), _jsx(Input, { type: "number", className: "h-8 text-sm", ...register('max', {
-                                    valueAsNumber: true,
-                                    validate: (v, formValues) => v >= formValues.min || 'Max should not be less than Min',
-                                }) })] }), errors.min && (_jsxs("span", { className: "flex items-center gap-1 text-xs text-red-500", children: [_jsx(OctagonAlertIcon, { size: 16, strokeWidth: 1.5 }), String(errors.min.message)] })), errors.max && (_jsxs("span", { className: "flex items-center gap-1 text-xs text-red-500", children: [_jsx(OctagonAlertIcon, { size: 16, strokeWidth: 1.5 }), String(errors.max.message)] }))] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: "Step" }), _jsx(Input, { type: "number", className: "h-8 text-sm", min: 0, ...register('step', {
-                            valueAsNumber: true,
-                            validate: (v) => v > 0 || 'Step must be greater than 0',
-                        }) }), errors.step && (_jsxs("span", { className: "flex items-center gap-1 text-xs text-red-500", children: [_jsx(OctagonAlertIcon, { size: 16, strokeWidth: 1.5 }), String(errors.step.message)] }))] })] }));
-};
-//# sourceMappingURL=SliderConfig.js.map

package/dist/cells/Input/InputConfigPanel/SliderConfig.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SliderConfig.js","sourceRoot":"","sources":["../../../../src/cells/Input/InputConfigPanel/SliderConfig.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,KAAK,EAAE,KAAK,EAAC,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAC,cAAc,EAAC,MAAM,iBAAiB,CAAC;AAE/C,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,EACJ,QAAQ,EACR,SAAS,EAAE,EAAC,MAAM,EAAC,GACpB,GAAG,cAAc,EAAE,CAAC;IAErB,OAAO,CACL,8BACE,eAAK,SAAS,EAAC,qBAAqB,aAClC,eAAK,SAAS,EAAC,wBAAwB,aACrC,KAAC,KAAK,sBAAY,EAClB,KAAC,KAAK,sBAAY,EAElB,KAAC,KAAK,IACJ,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,aAAa,KACnB,QAAQ,CAAC,KAAK,EAAE;oCAClB,aAAa,EAAE,IAAI;oCACnB,QAAQ,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,CAC1B,CAAC,IAAI,UAAU,CAAC,GAAG,IAAI,2BAA2B;iCACrD,CAAC,GACF,EAEF,KAAC,KAAK,IACJ,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,aAAa,KACnB,QAAQ,CAAC,KAAK,EAAE;oCAClB,aAAa,EAAE,IAAI;oCACnB,QAAQ,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE,CAC1B,CAAC,IAAI,UAAU,CAAC,GAAG,IAAI,iCAAiC;iCAC3D,CAAC,GACF,IACE,EACL,MAAM,CAAC,GAAG,IAAI,CACb,gBAAM,SAAS,EAAC,8CAA8C,aAC5D,KAAC,gBAAgB,IAAC,IAAI,EAAE,EAAE,EAAE,WAAW,EAAE,GAAG,GAAI,EAC/C,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,IACtB,CACR,EACA,MAAM,CAAC,GAAG,IAAI,CACb,gBAAM,SAAS,EAAC,8CAA8C,aAC5D,KAAC,gBAAgB,IAAC,IAAI,EAAE,EAAE,EAAE,WAAW,EAAE,GAAG,GAAI,EAC/C,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,IACtB,CACR,IACG,EAEN,eAAK,SAAS,EAAC,qBAAqB,aAClC,KAAC,KAAK,uBAAa,EACnB,KAAC,KAAK,IACJ,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,aAAa,EACvB,GAAG,EAAE,CAAC,KACF,QAAQ,CAAC,MAAM,EAAE;4BACnB,aAAa,EAAE,IAAI;4BACnB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,6BAA6B;yBACxD,CAAC,GACF,EACD,MAAM,CAAC,IAAI,IAAI,CACd,gBAAM,SAAS,EAAC,8CAA8C,aAC5D,KAAC,gBAAgB,IAAC,IAAI,EAAE,EAAE,EAAE,WAAW,EAAE,GAAG,GAAI,EAC/C,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,IACvB,CACR,IACG,IACL,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {Input, Label} from '@sqlrooms/ui';\nimport {OctagonAlertIcon} from 'lucide-react';\nimport {useFormContext} from 'react-hook-form';\n\nexport const SliderConfig = () => {\n  const {\n    register,\n    formState: {errors},\n  } = useFormContext();\n\n  return (\n    <>\n      <div className=\"flex flex-col gap-2\">\n        <div className=\"grid grid-cols-2 gap-2\">\n          <Label>Min</Label>\n          <Label>Max</Label>\n\n          <Input\n            type=\"number\"\n            className=\"h-8 text-sm\"\n            {...register('min', {\n              valueAsNumber: true,\n              validate: (v, formValues) =>\n                v <= formValues.max || 'Min should not exceed Max',\n            })}\n          />\n\n          <Input\n            type=\"number\"\n            className=\"h-8 text-sm\"\n            {...register('max', {\n              valueAsNumber: true,\n              validate: (v, formValues) =>\n                v >= formValues.min || 'Max should not be less than Min',\n            })}\n          />\n        </div>\n        {errors.min && (\n          <span className=\"flex items-center gap-1 text-xs text-red-500\">\n            <OctagonAlertIcon size={16} strokeWidth={1.5} />\n            {String(errors.min.message)}\n          </span>\n        )}\n        {errors.max && (\n          <span className=\"flex items-center gap-1 text-xs text-red-500\">\n            <OctagonAlertIcon size={16} strokeWidth={1.5} />\n            {String(errors.max.message)}\n          </span>\n        )}\n      </div>\n\n      <div className=\"flex flex-col gap-2\">\n        <Label>Step</Label>\n        <Input\n          type=\"number\"\n          className=\"h-8 text-sm\"\n          min={0}\n          {...register('step', {\n            valueAsNumber: true,\n            validate: (v) => v > 0 || 'Step must be greater than 0',\n          })}\n        />\n        {errors.step && (\n          <span className=\"flex items-center gap-1 text-xs text-red-500\">\n            <OctagonAlertIcon size={16} strokeWidth={1.5} />\n            {String(errors.step.message)}\n          </span>\n        )}\n      </div>\n    </>\n  );\n};\n"]}

package/dist/cells/Input/InputConfigPanel/TextConfig.d.ts

@@ -1,2 +0,0 @@
-export declare const TextConfig: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=TextConfig.d.ts.map

package/dist/cells/Input/InputConfigPanel/TextConfig.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextConfig.d.ts","sourceRoot":"","sources":["../../../../src/cells/Input/InputConfigPanel/TextConfig.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU,+CAStB,CAAC"}

package/dist/cells/Input/InputConfigPanel/TextConfig.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Input, Label } from '@sqlrooms/ui';
-import { useFormContext } from 'react-hook-form';
-export const TextConfig = () => {
-    const { register } = useFormContext();
-    return (_jsxs(_Fragment, { children: [_jsx(Label, { children: "Value" }), _jsx(Input, { className: "h-8 text-sm", ...register('value') })] }));
-};
-//# sourceMappingURL=TextConfig.js.map

package/dist/cells/Input/InputConfigPanel/TextConfig.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextConfig.js","sourceRoot":"","sources":["../../../../src/cells/Input/InputConfigPanel/TextConfig.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,KAAK,EAAE,KAAK,EAAC,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAC,cAAc,EAAC,MAAM,iBAAiB,CAAC;AAE/C,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE;IAC7B,MAAM,EAAC,QAAQ,EAAC,GAAG,cAAc,EAAE,CAAC;IAEpC,OAAO,CACL,8BACE,KAAC,KAAK,wBAAc,EACpB,KAAC,KAAK,IAAC,SAAS,EAAC,aAAa,KAAK,QAAQ,CAAC,OAAO,CAAC,GAAI,IACvD,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {Input, Label} from '@sqlrooms/ui';\nimport {useFormContext} from 'react-hook-form';\n\nexport const TextConfig = () => {\n  const {register} = useFormContext();\n\n  return (\n    <>\n      <Label>Value</Label>\n      <Input className=\"h-8 text-sm\" {...register('value')} />\n    </>\n  );\n};\n"]}

package/dist/cells/InputBar.d.ts

@@ -1,9 +0,0 @@
-import { FC } from 'react';
-export declare const ShowInputBarToggle: FC<{
-    inputBarOrder: string[];
-}>;
-export declare const InputBar: FC<{
-    inputBarOrder: string[];
-    showInputBar: boolean;
-}>;
-//# sourceMappingURL=InputBar.d.ts.map

package/dist/cells/InputBar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InputBar.d.ts","sourceRoot":"","sources":["../../src/cells/InputBar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAKzB,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC;IAAC,aAAa,EAAE,MAAM,EAAE,CAAA;CAAC,CA8B5D,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC;IAAC,aAAa,EAAE,MAAM,EAAE,CAAC;IAAC,YAAY,EAAE,OAAO,CAAA;CAAC,CAczE,CAAC"}

package/dist/cells/InputBar.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Toggle } from '@sqlrooms/ui';
-import { useStoreWithNotebook } from '../useStoreWithNotebook';
-import { CellView } from './CellView';
-export const ShowInputBarToggle = ({ inputBarOrder, }) => {
-    const toggleShowInputBar = useStoreWithNotebook((s) => s.notebook.toggleShowInputBar);
-    const currentTabId = useStoreWithNotebook((s) => s.cells.config.currentSheetId);
-    const showInputBar = useStoreWithNotebook((s) => {
-        const sheet = currentTabId
-            ? s.notebook.config.sheets[currentTabId]
-            : undefined;
-        return sheet?.meta.showInputBar ?? true;
-    });
-    if (!currentTabId)
-        return null;
-    return (_jsx("div", { className: "flex items-center space-x-1", children: _jsx(Toggle, { id: "input-bar-mode", pressed: showInputBar, disabled: !(inputBarOrder.length > 0), onPressedChange: () => toggleShowInputBar(currentTabId), className: "h-7 text-xs", children: "Show inputs" }) }));
-};
-export const InputBar = ({ inputBarOrder, showInputBar, }) => {
-    if (!showInputBar || !(inputBarOrder.length > 0))
-        return null;
-    return (_jsx("div", { className: "relative flex h-[85px] flex-wrap gap-2 overflow-auto border-b py-2 text-xs", children: _jsx("div", { className: "flex flex-wrap", children: inputBarOrder.map((id) => (_jsx(CellView, { id: id }, `cellOrder-${id}`))) }) }));
-};
-//# sourceMappingURL=InputBar.js.map

package/dist/cells/InputBar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InputBar.js","sourceRoot":"","sources":["../../src/cells/InputBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,cAAc,CAAC;AAGpC,OAAO,EAAC,oBAAoB,EAAC,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAC,QAAQ,EAAC,MAAM,YAAY,CAAC;AAEpC,MAAM,CAAC,MAAM,kBAAkB,GAAkC,CAAC,EAChE,aAAa,GACd,EAAE,EAAE;IACH,MAAM,kBAAkB,GAAG,oBAAoB,CAC7C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,kBAAkB,CACrC,CAAC;IACF,MAAM,YAAY,GAAG,oBAAoB,CACvC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,cAAc,CACrC,CAAC;IACF,MAAM,YAAY,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE;QAC9C,MAAM,KAAK,GAAG,YAAY;YACxB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC;YACxC,CAAC,CAAC,SAAS,CAAC;QACd,OAAO,KAAK,EAAE,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,YAAY;QAAE,OAAO,IAAI,CAAC;IAC/B,OAAO,CACL,cAAK,SAAS,EAAC,6BAA6B,YAC1C,KAAC,MAAM,IACL,EAAE,EAAC,gBAAgB,EACnB,OAAO,EAAE,YAAY,EACrB,QAAQ,EAAE,CAAC,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC,EACrC,eAAe,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,YAAY,CAAC,EACvD,SAAS,EAAC,aAAa,4BAGhB,GACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAyD,CAAC,EAC7E,aAAa,EACb,YAAY,GACb,EAAE,EAAE;IACH,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;QAAE,OAAO,IAAI,CAAC;IAC9D,OAAO,CACL,cAAK,SAAS,EAAC,4EAA4E,YACzF,cAAK,SAAS,EAAC,gBAAgB,YAC5B,aAAa,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CACzB,KAAC,QAAQ,IAAC,EAAE,EAAE,EAAE,IAAO,aAAa,EAAE,EAAE,CAAI,CAC7C,CAAC,GACE,GACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {Toggle} from '@sqlrooms/ui';\nimport {FC} from 'react';\n\nimport {useStoreWithNotebook} from '../useStoreWithNotebook';\nimport {CellView} from './CellView';\n\nexport const ShowInputBarToggle: FC<{inputBarOrder: string[]}> = ({\n  inputBarOrder,\n}) => {\n  const toggleShowInputBar = useStoreWithNotebook(\n    (s) => s.notebook.toggleShowInputBar,\n  );\n  const currentTabId = useStoreWithNotebook(\n    (s) => s.cells.config.currentSheetId,\n  );\n  const showInputBar = useStoreWithNotebook((s) => {\n    const sheet = currentTabId\n      ? s.notebook.config.sheets[currentTabId]\n      : undefined;\n    return sheet?.meta.showInputBar ?? true;\n  });\n\n  if (!currentTabId) return null;\n  return (\n    <div className=\"flex items-center space-x-1\">\n      <Toggle\n        id=\"input-bar-mode\"\n        pressed={showInputBar}\n        disabled={!(inputBarOrder.length > 0)}\n        onPressedChange={() => toggleShowInputBar(currentTabId)}\n        className=\"h-7 text-xs\"\n      >\n        Show inputs\n      </Toggle>\n    </div>\n  );\n};\n\nexport const InputBar: FC<{inputBarOrder: string[]; showInputBar: boolean}> = ({\n  inputBarOrder,\n  showInputBar,\n}) => {\n  if (!showInputBar || !(inputBarOrder.length > 0)) return null;\n  return (\n    <div className=\"relative flex h-[85px] flex-wrap gap-2 overflow-auto border-b py-2 text-xs\">\n      <div className=\"flex flex-wrap\">\n        {inputBarOrder.map((id) => (\n          <CellView id={id} key={`cellOrder-${id}`} />\n        ))}\n      </div>\n    </div>\n  );\n};\n"]}

package/dist/cells/SqlCell.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const SqlCell: React.FC<{
-    id: string;
-}>;
-//# sourceMappingURL=SqlCell.d.ts.map

package/dist/cells/SqlCell.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SqlCell.d.ts","sourceRoot":"","sources":["../../src/cells/SqlCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAC,CAsE1C,CAAC"}

package/dist/cells/SqlCell.js

@@ -1,29 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { QueryDataTable, QueryDataTableActionsMenu } from '@sqlrooms/data-table';
-import { SqlCellBody } from '@sqlrooms/cells';
-import { CellContainer } from './CellContainer';
-import { useStoreWithNotebook } from '../useStoreWithNotebook';
-import { AddSqlCellResultToNewTable } from '../cellOperations/AddSqlCellResultToNewTable';
-import { findCellInNotebook, useRelativeTimeDisplay } from '../NotebookUtils';
-export const SqlCell = ({ id }) => {
-    const cell = useStoreWithNotebook((s) => findCellInNotebook(s, id)?.cell);
-    const update = useStoreWithNotebook((s) => s.notebook.updateCell);
-    const run = useStoreWithNotebook((s) => s.notebook.runCell);
-    const cancel = useStoreWithNotebook((s) => s.notebook.cancelRunCell);
-    const cellStatus = useStoreWithNotebook((s) => s.cells.status[id]);
-    const lastRunTime = useRelativeTimeDisplay(cellStatus && cellStatus.type === 'sql' && cellStatus.status === 'success'
-        ? (cellStatus.lastRunTime ?? null)
-        : null);
-    if (!cell || cell.type !== 'sql')
-        return null;
-    const status = cellStatus?.type === 'sql'
-        ? {
-            state: cellStatus.status,
-            message: cellStatus.lastError,
-            resultName: cellStatus.resultView,
-        }
-        : undefined;
-    const renderResult = cellStatus?.type === 'sql' && cellStatus.resultView ? (_jsx("div", { className: "overflow-hidden border-t", children: _jsx(QueryDataTable, { query: `SELECT * FROM ${cellStatus.resultView}`, fontSize: "text-xs", pageSize: 10, className: "overflow-hidden rounded-b", lastRunTime: cellStatus.lastRunTime, isLoading: cellStatus.status === 'running', renderActions: () => (_jsxs(_Fragment, { children: [lastRunTime && (_jsxs("div", { className: "hidden border-l px-2 text-xs lg:inline-flex", children: ["Refreshed ", lastRunTime] })), _jsx(QueryDataTableActionsMenu, { query: `SELECT * FROM ${cellStatus.resultView}` }), _jsx(AddSqlCellResultToNewTable, { query: cell.data.sql })] })) }) })) : null;
-    return (_jsx(CellContainer, { id: id, typeLabel: "SQL", rightControls: _jsx(_Fragment, {}), children: _jsx(SqlCellBody, { sql: cell.data.sql, onSqlChange: (v) => update(id, (c) => ({ ...c, data: { ...c.data, sql: v } })), onRun: () => run(id), onCancel: () => cancel(id), status: status, resultName: cellStatus?.type === 'sql' ? cellStatus.resultView : undefined, renderResult: renderResult }) }));
-};
-//# sourceMappingURL=SqlCell.js.map

package/dist/cells/SqlCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SqlCell.js","sourceRoot":"","sources":["../../src/cells/SqlCell.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,cAAc,EAAE,yBAAyB,EAAC,MAAM,sBAAsB,CAAC;AAC/E,OAAO,EAAC,WAAW,EAAC,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAC,oBAAoB,EAAC,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAC,0BAA0B,EAAC,MAAM,8CAA8C,CAAC;AACxF,OAAO,EAAC,kBAAkB,EAAE,sBAAsB,EAAC,MAAM,kBAAkB,CAAC;AAE5E,MAAM,CAAC,MAAM,OAAO,GAA2B,CAAC,EAAC,EAAE,EAAC,EAAE,EAAE;IACtD,MAAM,IAAI,GAAG,oBAAoB,CAC/B,CAAC,CAAC,EAAE,EAAE,CAAC,kBAAkB,CAAC,CAAQ,EAAE,EAAE,CAAC,EAAE,IAAI,CAC9C,CAAC;IACF,MAAM,MAAM,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;IAClE,MAAM,GAAG,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC5D,MAAM,MAAM,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;IACrE,MAAM,UAAU,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC;IAEnE,MAAM,WAAW,GAAG,sBAAsB,CACxC,UAAU,IAAI,UAAU,CAAC,IAAI,KAAK,KAAK,IAAI,UAAU,CAAC,MAAM,KAAK,SAAS;QACxE,CAAC,CAAC,CAAC,UAAU,CAAC,WAAW,IAAI,IAAI,CAAC;QAClC,CAAC,CAAC,IAAI,CACT,CAAC;IAEF,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,KAAK;QAAE,OAAO,IAAI,CAAC;IAE9C,MAAM,MAAM,GACV,UAAU,EAAE,IAAI,KAAK,KAAK;QACxB,CAAC,CAAC;YACE,KAAK,EAAE,UAAU,CAAC,MAAM;YACxB,OAAO,EAAE,UAAU,CAAC,SAAS;YAC7B,UAAU,EAAE,UAAU,CAAC,UAAU;SAClC;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,YAAY,GAChB,UAAU,EAAE,IAAI,KAAK,KAAK,IAAI,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CACpD,cAAK,SAAS,EAAC,0BAA0B,YACvC,KAAC,cAAc,IACb,KAAK,EAAE,iBAAiB,UAAU,CAAC,UAAU,EAAE,EAC/C,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAE,EAAE,EACZ,SAAS,EAAC,2BAA2B,EACrC,WAAW,EAAE,UAAU,CAAC,WAAW,EACnC,SAAS,EAAE,UAAU,CAAC,MAAM,KAAK,SAAS,EAC1C,aAAa,EAAE,GAAG,EAAE,CAAC,CACnB,8BACG,WAAW,IAAI,CACd,eAAK,SAAS,EAAC,6CAA6C,2BAC/C,WAAW,IAClB,CACP,EACD,KAAC,yBAAyB,IACxB,KAAK,EAAE,iBAAiB,UAAU,CAAC,UAAU,EAAE,GAC/C,EACF,KAAC,0BAA0B,IAAC,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,GAAI,IACnD,CACJ,GACD,GACE,CACP,CAAC,CAAC,CAAC,IAAI,CAAC;IAEX,OAAO,CACL,KAAC,aAAa,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAC,KAAK,EAAC,aAAa,EAAE,mBAAK,YACzD,KAAC,WAAW,IACV,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,EAClB,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CACjB,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAC,GAAG,CAAC,EAAE,IAAI,EAAE,EAAC,GAAG,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,EAAC,EAAC,CAAQ,CAAC,EAE/D,KAAK,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EACpB,QAAQ,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,EAC1B,MAAM,EAAE,MAAM,EACd,UAAU,EACR,UAAU,EAAE,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,EAEhE,YAAY,EAAE,YAAY,GAC1B,GACY,CACjB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport {QueryDataTable, QueryDataTableActionsMenu} from '@sqlrooms/data-table';\nimport {SqlCellBody} from '@sqlrooms/cells';\n\nimport {CellContainer} from './CellContainer';\nimport {useStoreWithNotebook} from '../useStoreWithNotebook';\nimport {AddSqlCellResultToNewTable} from '../cellOperations/AddSqlCellResultToNewTable';\nimport {findCellInNotebook, useRelativeTimeDisplay} from '../NotebookUtils';\n\nexport const SqlCell: React.FC<{id: string}> = ({id}) => {\n  const cell = useStoreWithNotebook(\n    (s) => findCellInNotebook(s as any, id)?.cell,\n  );\n  const update = useStoreWithNotebook((s) => s.notebook.updateCell);\n  const run = useStoreWithNotebook((s) => s.notebook.runCell);\n  const cancel = useStoreWithNotebook((s) => s.notebook.cancelRunCell);\n  const cellStatus = useStoreWithNotebook((s) => s.cells.status[id]);\n\n  const lastRunTime = useRelativeTimeDisplay(\n    cellStatus && cellStatus.type === 'sql' && cellStatus.status === 'success'\n      ? (cellStatus.lastRunTime ?? null)\n      : null,\n  );\n\n  if (!cell || cell.type !== 'sql') return null;\n\n  const status =\n    cellStatus?.type === 'sql'\n      ? {\n          state: cellStatus.status,\n          message: cellStatus.lastError,\n          resultName: cellStatus.resultView,\n        }\n      : undefined;\n\n  const renderResult =\n    cellStatus?.type === 'sql' && cellStatus.resultView ? (\n      <div className=\"overflow-hidden border-t\">\n        <QueryDataTable\n          query={`SELECT * FROM ${cellStatus.resultView}`}\n          fontSize=\"text-xs\"\n          pageSize={10}\n          className=\"overflow-hidden rounded-b\"\n          lastRunTime={cellStatus.lastRunTime}\n          isLoading={cellStatus.status === 'running'}\n          renderActions={() => (\n            <>\n              {lastRunTime && (\n                <div className=\"hidden border-l px-2 text-xs lg:inline-flex\">\n                  Refreshed {lastRunTime}\n                </div>\n              )}\n              <QueryDataTableActionsMenu\n                query={`SELECT * FROM ${cellStatus.resultView}`}\n              />\n              <AddSqlCellResultToNewTable query={cell.data.sql} />\n            </>\n          )}\n        />\n      </div>\n    ) : null;\n\n  return (\n    <CellContainer id={id} typeLabel=\"SQL\" rightControls={<></>}>\n      <SqlCellBody\n        sql={cell.data.sql}\n        onSqlChange={(v) =>\n          update(id, (c) => ({...c, data: {...c.data, sql: v}}) as any)\n        }\n        onRun={() => run(id)}\n        onCancel={() => cancel(id)}\n        status={status}\n        resultName={\n          cellStatus?.type === 'sql' ? cellStatus.resultView : undefined\n        }\n        renderResult={renderResult}\n      />\n    </CellContainer>\n  );\n};\n"]}

package/dist/cells/TextCell.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const TextCell: React.FC<{
-    id: string;
-}>;
-//# sourceMappingURL=TextCell.d.ts.map

package/dist/cells/TextCell.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextCell.d.ts","sourceRoot":"","sources":["../../src/cells/TextCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AASjD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAC,CAgF3C,CAAC"}

package/dist/cells/TextCell.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import Markdown from 'react-markdown';
-import remarkGfm from 'remark-gfm';
-import { Button, cn } from '@sqlrooms/ui';
-import { CellContainer } from './CellContainer';
-import { useStoreWithNotebook } from '../useStoreWithNotebook';
-import { findCellInNotebook, getCellTypeLabel } from '../NotebookUtils';
-export const TextCell = ({ id }) => {
-    const cell = useStoreWithNotebook((s) => findCellInNotebook(s, id)?.cell);
-    const update = useStoreWithNotebook((s) => s.notebook.updateCell);
-    const currentCellId = useStoreWithNotebook((s) => s.notebook.config.currentCellId);
-    const [isEditing, setIsEditing] = useState(currentCellId === id);
-    const [draftText, setDraftText] = useState(cell?.type === 'text' ? cell.data.text : '');
-    useEffect(() => {
-        if (currentCellId === id || !isEditing) {
-            return;
-        }
-        const timeoutId = setTimeout(() => {
-            setIsEditing(false);
-            update(id, (c) => ({ ...c, data: { ...c.data, text: draftText } }));
-        }, 0);
-        return () => clearTimeout(timeoutId);
-    }, [currentCellId, id, isEditing, draftText, update]);
-    const isCurrent = currentCellId === id;
-    if (!cell || cell.type !== 'text')
-        return null;
-    return (_jsx(CellContainer, { id: id, typeLabel: getCellTypeLabel(cell.type), rightControls: isEditing ? (_jsx(Button, { size: "xs", variant: "secondary", className: "h-6", onClick: () => {
-                update(id, (c) => ({
-                    ...c,
-                    data: { ...c.data, text: draftText },
-                }));
-                setIsEditing(false);
-            }, children: "Save" })) : (_jsx(Button, { size: "xs", variant: "secondary", onClick: () => setIsEditing(true), className: cn({ hidden: !isCurrent }, 'h-6 group-hover:flex'), children: "Edit text" })), children: _jsxs("div", { className: "divide-x-muted flex min-h-20", onDoubleClick: () => setIsEditing((prev) => !prev), children: [isEditing && (_jsx("textarea", { className: "bg-accent w-full flex-1 px-3 py-2 text-xs outline-none", value: draftText, onChange: (e) => setDraftText(e.target.value), placeholder: "Write text...(Double click to save and preview)", autoFocus: true })), _jsx("div", { className: "prose dark:prose-invert max-w-none flex-1 px-3 py-2 text-sm", children: _jsx(Markdown, { remarkPlugins: [remarkGfm], children: draftText }) })] }) }));
-};
-//# sourceMappingURL=TextCell.js.map

package/dist/cells/TextCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextCell.js","sourceRoot":"","sources":["../../src/cells/TextCell.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, {useEffect, useState} from 'react';\nimport Markdown from 'react-markdown';\nimport remarkGfm from 'remark-gfm';\nimport {Button, cn} from '@sqlrooms/ui';\n\nimport {CellContainer} from './CellContainer';\nimport {useStoreWithNotebook} from '../useStoreWithNotebook';\nimport {findCellInNotebook, getCellTypeLabel} from '../NotebookUtils';\n\nexport const TextCell: React.FC<{id: string}> = ({id}) => {\n  const cell = useStoreWithNotebook(\n    (s) => findCellInNotebook(s as any, id)?.cell,\n  );\n  const update = useStoreWithNotebook((s) => s.notebook.updateCell);\n  const currentCellId = useStoreWithNotebook(\n    (s) => s.notebook.config.currentCellId,\n  );\n  const [isEditing, setIsEditing] = useState(currentCellId === id);\n  const [draftText, setDraftText] = useState(\n    cell?.type === 'text' ? cell.data.text : '',\n  );\n\n  useEffect(() => {\n    if (currentCellId === id || !isEditing) {\n      return;\n    }\n    const timeoutId = setTimeout(() => {\n      setIsEditing(false);\n      update(id, (c: any) => ({...c, data: {...c.data, text: draftText}}));\n    }, 0);\n    return () => clearTimeout(timeoutId);\n  }, [currentCellId, id, isEditing, draftText, update]);\n\n  const isCurrent = currentCellId === id;\n\n  if (!cell || cell.type !== 'text') return null;\n\n  return (\n    <CellContainer\n      id={id}\n      typeLabel={getCellTypeLabel(cell.type)}\n      rightControls={\n        isEditing ? (\n          <Button\n            size=\"xs\"\n            variant=\"secondary\"\n            className=\"h-6\"\n            onClick={() => {\n              update(id, (c: any) => ({\n                ...c,\n                data: {...c.data, text: draftText},\n              }));\n              setIsEditing(false);\n            }}\n          >\n            Save\n          </Button>\n        ) : (\n          <Button\n            size=\"xs\"\n            variant=\"secondary\"\n            onClick={() => setIsEditing(true)}\n            className={cn({hidden: !isCurrent}, 'h-6 group-hover:flex')}\n          >\n            Edit text\n          </Button>\n        )\n      }\n    >\n      <div\n        className=\"divide-x-muted flex min-h-20\"\n        onDoubleClick={() => setIsEditing((prev) => !prev)}\n      >\n        {isEditing && (\n          <textarea\n            className=\"bg-accent w-full flex-1 px-3 py-2 text-xs outline-none\"\n            value={draftText}\n            onChange={(e) => setDraftText(e.target.value)}\n            placeholder=\"Write text...(Double click to save and preview)\"\n            autoFocus\n          />\n        )}\n\n        <div className=\"prose dark:prose-invert max-w-none flex-1 px-3 py-2 text-sm\">\n          <Markdown remarkPlugins={[remarkGfm]}>{draftText}</Markdown>\n        </div>\n      </div>\n    </CellContainer>\n  );\n};\n"]}

package/dist/cells/Vega/VegaCell.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare const VegaCell: React.FC<{
-    id: string;
-}>;
-//# sourceMappingURL=VegaCell.d.ts.map

package/dist/cells/Vega/VegaCell.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"VegaCell.d.ts","sourceRoot":"","sources":["../../../src/cells/Vega/VegaCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAoBjD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAC,CAsK3C,CAAC"}

package/dist/cells/Vega/VegaCell.js

@@ -1,78 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { Button, cn, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@sqlrooms/ui';
-import { VegaLiteChart } from '@sqlrooms/vega';
-import { CellContainer } from '../CellContainer';
-import { useStoreWithNotebook } from '../../useStoreWithNotebook';
-import { findCellInNotebook, getCellTypeLabel } from '../../NotebookUtils';
-import { VegaConfigPanel } from './VegaConfigPanel';
-import { IconWithTooltip } from '../../cellOperations/IconWithTooltip';
-import { produce } from 'immer';
-export const VegaCell = ({ id }) => {
-    const { cell, sheetCellIds } = useStoreWithNotebook((s) => {
-        const info = findCellInNotebook(s, id);
-        const sheet = info?.sheetId
-            ? s.notebook.config.sheets[info.sheetId]
-            : undefined;
-        return {
-            cell: info?.cell,
-            sheetCellIds: sheet?.meta.cellOrder || [],
-        };
-    });
-    const cellsData = useStoreWithNotebook((s) => s.cells.config.data);
-    const update = useStoreWithNotebook((s) => s.notebook.updateCell);
-    const currentCellId = useStoreWithNotebook((s) => s.notebook.config.currentCellId);
-    const availableSqlCells = sheetCellIds
-        .map((id) => cellsData[id])
-        .filter((c) => c?.type === 'sql');
-    const selectedSqlStatus = useStoreWithNotebook((s) => cell?.type === 'vega' ? s.cells.status[cell.data.sqlId || ''] : undefined);
-    const lastRunTime = selectedSqlStatus?.type === 'sql'
-        ? selectedSqlStatus?.lastRunTime
-        : undefined;
-    const [draftSpec, setDraftSpec] = useState((cell?.type === 'vega'
-        ? (cell.data.vegaSpec ?? {
-            data: { name: 'queryResult' },
-            mark: 'bar',
-            padding: 20,
-        })
-        : {}));
-    const [isEditing, setIsEditing] = useState(false);
-    const selectedSqlQuery = selectedSqlStatus?.type === 'sql' && selectedSqlStatus.resultView
-        ? `SELECT * FROM ${selectedSqlStatus.resultView}`
-        : '';
-    const isCurrent = currentCellId === id;
-    const handleValueChange = (value) => {
-        if (!cell)
-            return;
-        update(id, (c) => produce(c, (draft) => {
-            if (draft.type === 'vega')
-                draft.data.sqlId = value;
-        }));
-        if (!isEditing)
-            setIsEditing(true);
-    };
-    useEffect(() => {
-        if (currentCellId === id || !isEditing) {
-            return;
-        }
-        const timeoutId = setTimeout(() => {
-            setIsEditing(false);
-            update(id, (c) => produce(c, (draft) => {
-                if (draft.type === 'vega')
-                    draft.data.vegaSpec = draftSpec;
-            }));
-        }, 0);
-        return () => clearTimeout(timeoutId);
-    }, [currentCellId, id, isEditing, draftSpec, update]);
-    if (!cell || cell.type !== 'vega')
-        return null;
-    return (_jsx(CellContainer, { id: id, typeLabel: getCellTypeLabel(cell.type), leftControls: _jsxs(Select, { value: cell.data.sqlId, onValueChange: handleValueChange, children: [_jsx(SelectTrigger, { className: "h-6 text-xs shadow-none", children: _jsx(SelectValue, { placeholder: "Select a SQL cell" }) }), _jsx(SelectContent, { onCloseAutoFocus: (e) => e.preventDefault(), children: availableSqlCells.map((sql) => (_jsx(SelectItem, { className: "text-xs", value: sql.id, children: sql.data.title }, sql.id))) })] }), rightControls: isEditing ? (_jsx(Button, { size: "xs", variant: "secondary", className: "h-6", onClick: () => {
-                update(id, (c) => produce(c, (draft) => {
-                    if (draft.type === 'vega')
-                        draft.data.vegaSpec = draftSpec;
-                }));
-                setIsEditing(false);
-            }, children: "Save" })) : (_jsx(IconWithTooltip, { title: !cell.data.sqlId ? 'Select a SQL cell first' : '', icon: _jsx(Button, { size: "xs", variant: "secondary", onClick: () => setIsEditing(true), className: cn({ hidden: !isCurrent }, 'h-6 group-hover:flex'), disabled: !cell.data.sqlId, children: "Edit chart" }) })), children: _jsxs("div", { className: "flex h-[500px]", children: [isEditing && (_jsx(VegaConfigPanel, { sqlQuery: selectedSqlQuery, lastRunTime: lastRunTime, spec: draftSpec, onSpecChange: setDraftSpec })), _jsx("div", { onDoubleClick: () => setIsEditing((prev) => !prev), className: "flex h-full w-full", children: !draftSpec?.encoding ? (_jsx("div", { className: "flex h-full w-full items-center justify-center text-gray-400", children: "Empty chart, please 1) select a SQL cell and then 2) edit chart." })) : !selectedSqlStatus ? (_jsx("div", { className: "flex h-full w-full items-center justify-center text-gray-400", children: "No chart data available, please run the SQL cell first." })) : (_jsx(VegaLiteChart, { sqlQuery: selectedSqlQuery, isLoading: selectedSqlStatus?.type === 'sql' &&
-                            selectedSqlStatus.status === 'running', lastRunTime: lastRunTime, spec: draftSpec, className: "rounded-b" })) })] }) }));
-};
-//# sourceMappingURL=VegaCell.js.map

package/dist/cells/Vega/VegaCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"VegaCell.js","sourceRoot":"","sources":["../../../src/cells/Vega/VegaCell.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAC,SAAS,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AACjD,OAAO,EACL,MAAM,EACN,EAAE,EACF,MAAM,EACN,aAAa,EACb,UAAU,EACV,aAAa,EACb,WAAW,GACZ,MAAM,cAAc,CAAC;AACtB,OAAO,EAAC,aAAa,EAAC,MAAM,gBAAgB,CAAC;AAE7C,OAAO,EAAC,aAAa,EAAC,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAC,oBAAoB,EAAC,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAC,kBAAkB,EAAE,gBAAgB,EAAC,MAAM,qBAAqB,CAAC;AACzE,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAC,eAAe,EAAC,MAAM,sCAAsC,CAAC;AACrE,OAAO,EAAC,OAAO,EAAC,MAAM,OAAO,CAAC;AAE9B,MAAM,CAAC,MAAM,QAAQ,GAA2B,CAAC,EAAC,EAAE,EAAC,EAAE,EAAE;IACvD,MAAM,EAAC,IAAI,EAAE,YAAY,EAAC,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE;QACtD,MAAM,IAAI,GAAG,kBAAkB,CAAC,CAAQ,EAAE,EAAE,CAAC,CAAC;QAC9C,MAAM,KAAK,GAAG,IAAI,EAAE,OAAO;YACzB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC;YACxC,CAAC,CAAC,SAAS,CAAC;QACd,OAAO;YACL,IAAI,EAAE,IAAI,EAAE,IAAgC;YAC5C,YAAY,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,IAAI,EAAE;SAC1C,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACnE,MAAM,MAAM,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;IAClE,MAAM,aAAa,GAAG,oBAAoB,CACxC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CACvC,CAAC;IAEF,MAAM,iBAAiB,GAAG,YAAY;SACnC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC;SAC1B,MAAM,CAAC,CAAC,CAAC,EAAqC,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,KAAK,CAAC,CAAC;IAEvE,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,CAAC,CAAC,EAAE,EAAE,CACnD,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAC1E,CAAC;IAEF,MAAM,WAAW,GACf,iBAAiB,EAAE,IAAI,KAAK,KAAK;QAC/B,CAAC,CAAC,iBAAiB,EAAE,WAAW;QAChC,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CACxC,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM;QACpB,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI;YACrB,IAAI,EAAE,EAAC,IAAI,EAAE,aAAa,EAAC;YAC3B,IAAI,EAAE,KAAK;YACX,OAAO,EAAE,EAAE;SACZ,CAAC;QACJ,CAAC,CAAC,EAAE,CAAqC,CAC5C,CAAC;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,MAAM,gBAAgB,GACpB,iBAAiB,EAAE,IAAI,KAAK,KAAK,IAAI,iBAAiB,CAAC,UAAU;QAC/D,CAAC,CAAC,iBAAiB,iBAAiB,CAAC,UAAU,EAAE;QACjD,CAAC,CAAC,EAAE,CAAC;IAET,MAAM,SAAS,GAAG,aAAa,KAAK,EAAE,CAAC;IAEvC,MAAM,iBAAiB,GAAG,CAAC,KAAa,EAAE,EAAE;QAC1C,IAAI,CAAC,IAAI;YAAE,OAAO;QAClB,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,CACf,OAAO,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE;YACnB,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM;gBAAE,KAAK,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACtD,CAAC,CAAC,CACH,CAAC;QACF,IAAI,CAAC,SAAS;YAAE,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,aAAa,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC;YACvC,OAAO;QACT,CAAC;QACD,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;YAChC,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,CACf,OAAO,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE;gBACnB,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM;oBAAE,KAAK,CAAC,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;YAC7D,CAAC,CAAC,CACH,CAAC;QACJ,CAAC,EAAE,CAAC,CAAC,CAAC;QACN,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACvC,CAAC,EAAE,CAAC,aAAa,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IAEtD,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM;QAAE,OAAO,IAAI,CAAC;IAE/C,OAAO,CACL,KAAC,aAAa,IACZ,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EACtC,YAAY,EACV,MAAC,MAAM,IAAC,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,aAAa,EAAE,iBAAiB,aAC9D,KAAC,aAAa,IAAC,SAAS,EAAC,yBAAyB,YAChD,KAAC,WAAW,IAAC,WAAW,EAAC,mBAAmB,GAAG,GACjC,EAChB,KAAC,aAAa,IAAC,gBAAgB,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,YACvD,iBAAiB,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAC9B,KAAC,UAAU,IAAC,SAAS,EAAC,SAAS,EAAc,KAAK,EAAE,GAAG,CAAC,EAAE,YACtD,GAAG,CAAC,IAAY,CAAC,KAAK,IADW,GAAG,CAAC,EAAE,CAE9B,CACd,CAAC,GACY,IACT,EAEX,aAAa,EACX,SAAS,CAAC,CAAC,CAAC,CACV,KAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,WAAW,EACnB,SAAS,EAAC,KAAK,EACf,OAAO,EAAE,GAAG,EAAE;gBACZ,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,CACf,OAAO,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE;oBACnB,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM;wBAAE,KAAK,CAAC,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;gBAC7D,CAAC,CAAC,CACH,CAAC;gBACF,YAAY,CAAC,KAAK,CAAC,CAAC;YACtB,CAAC,qBAGM,CACV,CAAC,CAAC,CAAC,CACF,KAAC,eAAe,IACd,KAAK,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE,EACxD,IAAI,EACF,KAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,WAAW,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,EACjC,SAAS,EAAE,EAAE,CAAC,EAAC,MAAM,EAAE,CAAC,SAAS,EAAC,EAAE,sBAAsB,CAAC,EAC3D,QAAQ,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,2BAGnB,GAEX,CACH,YAGH,eAAK,SAAS,EAAC,gBAAgB,aAC5B,SAAS,IAAI,CACZ,KAAC,eAAe,IACd,QAAQ,EAAE,gBAAgB,EAC1B,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,SAAS,EACf,YAAY,EAAE,YAAY,GAC1B,CACH,EACD,cACE,aAAa,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,EAClD,SAAS,EAAC,oBAAoB,YAE7B,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,CACtB,cAAK,SAAS,EAAC,8DAA8D,iFAEvE,CACP,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CACvB,cAAK,SAAS,EAAC,8DAA8D,wEAEvE,CACP,CAAC,CAAC,CAAC,CACF,KAAC,aAAa,IACZ,QAAQ,EAAE,gBAAgB,EAC1B,SAAS,EACP,iBAAiB,EAAE,IAAI,KAAK,KAAK;4BACjC,iBAAiB,CAAC,MAAM,KAAK,SAAS,EAExC,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,SAAS,EACf,SAAS,EAAC,WAAW,GACrB,CACH,GACG,IACF,GACQ,CACjB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {\n  Button,\n  cn,\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@sqlrooms/ui';\nimport {VegaLiteChart} from '@sqlrooms/vega';\n\nimport {CellContainer} from '../CellContainer';\nimport {useStoreWithNotebook} from '../../useStoreWithNotebook';\nimport {findCellInNotebook, getCellTypeLabel} from '../../NotebookUtils';\nimport {VegaConfigPanel} from './VegaConfigPanel';\nimport {NotebookCell, VegaCell as VegaCellType} from '../../cellSchemas';\nimport {IconWithTooltip} from '../../cellOperations/IconWithTooltip';\nimport {produce} from 'immer';\n\nexport const VegaCell: React.FC<{id: string}> = ({id}) => {\n  const {cell, sheetCellIds} = useStoreWithNotebook((s) => {\n    const info = findCellInNotebook(s as any, id);\n    const sheet = info?.sheetId\n      ? s.notebook.config.sheets[info.sheetId]\n      : undefined;\n    return {\n      cell: info?.cell as VegaCellType | undefined,\n      sheetCellIds: sheet?.meta.cellOrder || [],\n    };\n  });\n\n  const cellsData = useStoreWithNotebook((s) => s.cells.config.data);\n  const update = useStoreWithNotebook((s) => s.notebook.updateCell);\n  const currentCellId = useStoreWithNotebook(\n    (s) => s.notebook.config.currentCellId,\n  );\n\n  const availableSqlCells = sheetCellIds\n    .map((id) => cellsData[id])\n    .filter((c): c is NotebookCell & {type: 'sql'} => c?.type === 'sql');\n\n  const selectedSqlStatus = useStoreWithNotebook((s) =>\n    cell?.type === 'vega' ? s.cells.status[cell.data.sqlId || ''] : undefined,\n  );\n\n  const lastRunTime =\n    selectedSqlStatus?.type === 'sql'\n      ? selectedSqlStatus?.lastRunTime\n      : undefined;\n\n  const [draftSpec, setDraftSpec] = useState(\n    (cell?.type === 'vega'\n      ? (cell.data.vegaSpec ?? {\n          data: {name: 'queryResult'},\n          mark: 'bar',\n          padding: 20,\n        })\n      : {}) as VegaCellType['data']['vegaSpec'],\n  );\n  const [isEditing, setIsEditing] = useState(false);\n\n  const selectedSqlQuery =\n    selectedSqlStatus?.type === 'sql' && selectedSqlStatus.resultView\n      ? `SELECT * FROM ${selectedSqlStatus.resultView}`\n      : '';\n\n  const isCurrent = currentCellId === id;\n\n  const handleValueChange = (value: string) => {\n    if (!cell) return;\n    update(id, (c) =>\n      produce(c, (draft) => {\n        if (draft.type === 'vega') draft.data.sqlId = value;\n      }),\n    );\n    if (!isEditing) setIsEditing(true);\n  };\n\n  useEffect(() => {\n    if (currentCellId === id || !isEditing) {\n      return;\n    }\n    const timeoutId = setTimeout(() => {\n      setIsEditing(false);\n      update(id, (c) =>\n        produce(c, (draft) => {\n          if (draft.type === 'vega') draft.data.vegaSpec = draftSpec;\n        }),\n      );\n    }, 0);\n    return () => clearTimeout(timeoutId);\n  }, [currentCellId, id, isEditing, draftSpec, update]);\n\n  if (!cell || cell.type !== 'vega') return null;\n\n  return (\n    <CellContainer\n      id={id}\n      typeLabel={getCellTypeLabel(cell.type)}\n      leftControls={\n        <Select value={cell.data.sqlId} onValueChange={handleValueChange}>\n          <SelectTrigger className=\"h-6 text-xs shadow-none\">\n            <SelectValue placeholder=\"Select a SQL cell\" />\n          </SelectTrigger>\n          <SelectContent onCloseAutoFocus={(e) => e.preventDefault()}>\n            {availableSqlCells.map((sql) => (\n              <SelectItem className=\"text-xs\" key={sql.id} value={sql.id}>\n                {(sql.data as any).title}\n              </SelectItem>\n            ))}\n          </SelectContent>\n        </Select>\n      }\n      rightControls={\n        isEditing ? (\n          <Button\n            size=\"xs\"\n            variant=\"secondary\"\n            className=\"h-6\"\n            onClick={() => {\n              update(id, (c) =>\n                produce(c, (draft) => {\n                  if (draft.type === 'vega') draft.data.vegaSpec = draftSpec;\n                }),\n              );\n              setIsEditing(false);\n            }}\n          >\n            Save\n          </Button>\n        ) : (\n          <IconWithTooltip\n            title={!cell.data.sqlId ? 'Select a SQL cell first' : ''}\n            icon={\n              <Button\n                size=\"xs\"\n                variant=\"secondary\"\n                onClick={() => setIsEditing(true)}\n                className={cn({hidden: !isCurrent}, 'h-6 group-hover:flex')}\n                disabled={!cell.data.sqlId}\n              >\n                Edit chart\n              </Button>\n            }\n          />\n        )\n      }\n    >\n      <div className=\"flex h-[500px]\">\n        {isEditing && (\n          <VegaConfigPanel\n            sqlQuery={selectedSqlQuery}\n            lastRunTime={lastRunTime}\n            spec={draftSpec}\n            onSpecChange={setDraftSpec}\n          />\n        )}\n        <div\n          onDoubleClick={() => setIsEditing((prev) => !prev)}\n          className=\"flex h-full w-full\"\n        >\n          {!draftSpec?.encoding ? (\n            <div className=\"flex h-full w-full items-center justify-center text-gray-400\">\n              Empty chart, please 1) select a SQL cell and then 2) edit chart.\n            </div>\n          ) : !selectedSqlStatus ? (\n            <div className=\"flex h-full w-full items-center justify-center text-gray-400\">\n              No chart data available, please run the SQL cell first.\n            </div>\n          ) : (\n            <VegaLiteChart\n              sqlQuery={selectedSqlQuery}\n              isLoading={\n                selectedSqlStatus?.type === 'sql' &&\n                selectedSqlStatus.status === 'running'\n              }\n              lastRunTime={lastRunTime}\n              spec={draftSpec}\n              className=\"rounded-b\"\n            />\n          )}\n        </div>\n      </div>\n    </CellContainer>\n  );\n};\n"]}

package/dist/cells/Vega/VegaConfigPanel.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-export declare const VegaConfigPanel: React.FC<{
-    spec: any;
-    sqlQuery: string;
-    lastRunTime?: number;
-    onSpecChange: (spec: any) => void;
-}>;
-//# sourceMappingURL=VegaConfigPanel.d.ts.map

package/dist/cells/Vega/VegaConfigPanel.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"VegaConfigPanel.d.ts","sourceRoot":"","sources":["../../../src/cells/Vega/VegaConfigPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmC1B,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC;IACrC,IAAI,EAAE,GAAG,CAAC;IACV,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CACnC,CA6KA,CAAC"}