geoiq-frontend-ui-kit 2.0.4 → 2.0.6

package/dist/{index.es171.js.map → index176.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index.es171.js","sources":["../src/components/organisms/image-editor/components/panel-selected.tsx"],"sourcesContent":["import { Bookmark, Spline, Trash2 } from 'lucide-react'\nimport React, { useState } from 'react'\n\nimport { Button } from '@/components/atoms/button'\nimport { Input } from '@/components/atoms/input'\nimport { Textarea } from '@/components/atoms/textarea'\nimport { Slider } from '@/components/molecules/slider'\nimport { Switch } from '@/components/atoms/switch'\nimport { SingleSelect } from '@/components/molecules/single-select'\n\nimport {\n  ImageEditorEngine,\n  ImageEditorSelectedLayer,\n} from '../image-editor.types'\nimport { FONTS } from '../picture-studio-engine'\nimport { ColorPicker } from './color-picker'\nimport { useImageEditorPortalContainer } from './portal-context'\n\ninterface PanelSelectedProps {\n  selected: ImageEditorSelectedLayer\n  engine: ImageEditorEngine\n}\n\nconst FILL_ITEMS = [\n  { label: 'Outline only', value: 'stroke' },\n  { label: 'Solid fill', value: 'fill' },\n]\n\nconst CLOSED_SHAPES = ['rect', 'ellipse', 'circle']\n\nconst MULTI_POINT_SHAPES = ['line', 'dashedLine']\n\nconst DIRECTIONAL_SHAPES = [\n  'line',\n  'dashedLine',\n  'arrow',\n  'dashedArrow',\n  'doubleArrow',\n  'dashedDoubleArrow',\n]\n\nexport function PanelSelected({ selected, engine }: PanelSelectedProps) {\n  const container = useImageEditorPortalContainer()\n  const [naming, setNaming] = useState(false)\n  const [layerName, setLayerName] = useState('')\n\n  const suggestedName = () => {\n    if (selected.type === 'text')\n      return (selected.text ?? '').trim().slice(0, 40)\n    if (selected.label) return selected.label.trim().slice(0, 40)\n    return selected.shape ?? selected.type ?? ''\n  }\n\n  const commitSave = () => {\n    engine.saveSelectedLayer(layerName.trim() || undefined)\n    setNaming(false)\n    setLayerName('')\n  }\n  return (\n    <div>\n      {selected.type === 'text' && (\n        <div className=\"mb-3.5\">\n          <span className=\"mb-1 block text-xs text-light-4\">Text</span>\n          <Textarea\n            className=\"min-h-[52px]\"\n            value={selected.text ?? ''}\n            onChange={(e) => engine.setSelectedText(e.target.value)}\n          />\n          <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">Font</span>\n          <SingleSelect\n            items={FONTS}\n            value={selected.font ?? ''}\n            onValueChange={engine.setSelectedFont}\n            container={container}\n          />\n          <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n            <span>Size</span>\n            <span>{selected.size}px</span>\n          </div>\n          <Slider\n            min={10}\n            max={240}\n            step={1}\n            value={[selected.size ?? 24]}\n            onValueChange={([v]) => engine.setSelectedTextSize(v)}\n          />\n          <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n            <span>Box size</span>\n            <span>{selected.boxWidth}px</span>\n          </div>\n          <Slider\n            min={20}\n            max={2000}\n            step={1}\n            value={[selected.boxWidth ?? 200]}\n            onValueChange={([v]) => engine.setSelectedBoxWidth(v)}\n          />\n        </div>\n      )}\n\n      {selected.type === 'shape' && (\n        <div className=\"mb-3.5\">\n          <span className=\"mb-1 block text-xs text-light-4\">Fill style</span>\n          <SingleSelect\n            items={FILL_ITEMS}\n            value={selected.fill ?? 'stroke'}\n            onValueChange={(v) =>\n              engine.setSelectedShapeFill(v as 'stroke' | 'fill')\n            }\n            container={container}\n          />\n          <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n            Thickness\n          </span>\n          <Slider\n            min={1}\n            max={40}\n            step={1}\n            value={[selected.width ?? 6]}\n            onValueChange={([v]) => engine.setSelectedWidth(v)}\n          />\n\n          {MULTI_POINT_SHAPES.includes(selected.shape ?? '') && (\n            <>\n              <div className=\"my-3 h-px bg-neutral-1\" />\n              <Button\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={engine.continueSelectedLine}\n                prefixIcon={<Spline className=\"h-4 w-4\" />}\n              >\n                Continue this line\n              </Button>\n              <p className=\"mt-1.5 text-[11px] leading-snug text-light-4\">\n                Reopens the line so you can click more corners onto the end.\n              </p>\n            </>\n          )}\n\n          {(DIRECTIONAL_SHAPES.includes(selected.shape ?? '') ||\n            CLOSED_SHAPES.includes(selected.shape ?? '')) && (\n            <>\n              <div className=\"my-3 h-px bg-neutral-1\" />\n              <span className=\"mb-1 block text-xs text-light-4\">\n                {CLOSED_SHAPES.includes(selected.shape ?? '') || selected.closed\n                  ? 'Text inside shape'\n                  : 'Label above line'}\n              </span>\n              <Textarea\n                className=\"min-h-[44px]\"\n                placeholder=\"Add a caption…\"\n                value={selected.label ?? ''}\n                onChange={(e) => engine.setSelectedLabel(e.target.value)}\n              />\n              {!!selected.label && (\n                <>\n                  <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n                    Label font\n                  </span>\n                  <SingleSelect\n                    items={FONTS}\n                    value={selected.labelFont ?? FONTS[1].value}\n                    onValueChange={engine.setSelectedLabelFont}\n                    container={container}\n                  />\n                  <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                    <span>Label size</span>\n                    <span>{selected.labelSize ?? 42}px</span>\n                  </div>\n                  <Slider\n                    min={10}\n                    max={200}\n                    step={1}\n                    value={[selected.labelSize ?? 42]}\n                    onValueChange={([v]) => engine.setSelectedLabelSize(v)}\n                  />\n\n                  {!CLOSED_SHAPES.includes(selected.shape ?? '') &&\n                    !selected.closed && (\n                      <>\n                        <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n                          Label side\n                        </span>\n                        <SingleSelect\n                          items={[\n                            { label: 'Above the line', value: 'above' },\n                            { label: 'Below the line', value: 'below' },\n                          ]}\n                          value={selected.labelSide ?? 'above'}\n                          onValueChange={(v) =>\n                            engine.setSelectedLabelSide(v as 'above' | 'below')\n                          }\n                          container={container}\n                        />\n\n                        <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                          <span>Distance from line</span>\n                          <span>{selected.labelOffset ?? 10}px</span>\n                        </div>\n                        <Slider\n                          min={0}\n                          max={200}\n                          step={1}\n                          value={[selected.labelOffset ?? 10]}\n                          onValueChange={([v]) =>\n                            engine.setSelectedLabelOffset(v)\n                          }\n                        />\n\n                        <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                          <span>Position along line</span>\n                          <span>\n                            {Math.round((selected.labelPos ?? 0.5) * 100)}%\n                          </span>\n                        </div>\n                        <Slider\n                          min={0}\n                          max={100}\n                          step={1}\n                          value={[Math.round((selected.labelPos ?? 0.5) * 100)]}\n                          onValueChange={([v]) =>\n                            engine.setSelectedLabelPos(v / 100)\n                          }\n                        />\n\n                        <div className=\"mt-3 flex items-center justify-between gap-3\">\n                          <span className=\"text-xs text-light-4\">\n                            Follow line angle\n                          </span>\n                          <Switch\n                            checked={selected.labelRotate !== false}\n                            onCheckedChange={engine.setSelectedLabelRotate}\n                          />\n                        </div>\n                      </>\n                    )}\n\n                  {(CLOSED_SHAPES.includes(selected.shape ?? '') ||\n                    selected.closed) && (\n                    <>\n                      <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                        <span>Horizontal position</span>\n                        <span>{selected.labelDx ?? 0}px</span>\n                      </div>\n                      <Slider\n                        min={-300}\n                        max={300}\n                        step={1}\n                        value={[selected.labelDx ?? 0]}\n                        onValueChange={([v]) => engine.setSelectedLabelDx(v)}\n                      />\n                      <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                        <span>Vertical position</span>\n                        <span>{selected.labelDy ?? 0}px</span>\n                      </div>\n                      <Slider\n                        min={-300}\n                        max={300}\n                        step={1}\n                        value={[selected.labelDy ?? 0]}\n                        onValueChange={([v]) => engine.setSelectedLabelDy(v)}\n                      />\n                    </>\n                  )}\n                </>\n              )}\n              {(selected.pointCount ?? 0) >= 3 && (\n                <>\n                  <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n                    Path\n                  </span>\n                  <SingleSelect\n                    items={[\n                      { label: 'Open line', value: 'open' },\n                      { label: 'Closed shape', value: 'closed' },\n                    ]}\n                    value={selected.closed ? 'closed' : 'open'}\n                    onValueChange={(v) =>\n                      engine.setSelectedClosed(v === 'closed')\n                    }\n                    container={container}\n                  />\n                </>\n              )}\n            </>\n          )}\n        </div>\n      )}\n\n      {selected.type === 'stroke' && (\n        <div className=\"mb-3.5\">\n          <span className=\"mb-1 block text-xs text-light-4\">Brush size</span>\n          <Slider\n            min={1}\n            max={60}\n            step={1}\n            value={[selected.width ?? 8]}\n            onValueChange={([v]) => engine.setSelectedWidth(v)}\n          />\n        </div>\n      )}\n\n      {selected.type !== 'sticker' && (\n        <ColorPicker\n          value={selected.color ?? '#d24b2f'}\n          onChange={engine.setSelectedColor}\n        />\n      )}\n\n      <div className=\"my-3.5 h-px bg-neutral-1\" />\n\n      <div className=\"flex flex-col gap-2\">\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.bringSelectedToFront}\n        >\n          Bring to front\n        </Button>\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.sendSelectedToBack}\n        >\n          Send to back\n        </Button>\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.duplicateSelected}\n        >\n          Duplicate\n        </Button>\n        {naming ? (\n          <div className=\"rounded-lg border border-neutral-2 bg-rest-s1 p-2\">\n            <span className=\"mb-1 block text-xs text-light-4\">Layer name</span>\n            <Input\n              autoFocus\n              value={layerName}\n              placeholder={suggestedName() || 'Layer name'}\n              onChange={(e) => setLayerName(e.target.value)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter') commitSave()\n                if (e.key === 'Escape') setNaming(false)\n              }}\n            />\n            <div className=\"mt-2 flex gap-2\">\n              <Button size=\"sm\" onClick={commitSave} title=\"Save\" />\n              <Button\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={() => setNaming(false)}\n                title=\"Cancel\"\n              />\n            </div>\n          </div>\n        ) : (\n          <Button\n            variant=\"secondary\"\n            size=\"sm\"\n            onClick={() => {\n              setLayerName(suggestedName())\n              setNaming(true)\n            }}\n            prefixIcon={<Bookmark className=\"h-4 w-4\" />}\n          >\n            Save for reuse\n          </Button>\n        )}\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.deleteSelected}\n          prefixIcon={<Trash2 className=\"h-4 w-4\" />}\n          className=\"text-danger-1\"\n        >\n          Delete layer\n        </Button>\n      </div>\n    </div>\n  )\n}\n"],"names":["FILL_ITEMS","CLOSED_SHAPES","MULTI_POINT_SHAPES","DIRECTIONAL_SHAPES","PanelSelected","selected","engine","container","useImageEditorPortalContainer","naming","setNaming","useState","layerName","setLayerName","suggestedName","commitSave","React","Textarea","e","SingleSelect","FONTS","Slider","v","Button","Spline","Switch","ColorPicker","Input","Bookmark","Trash2"],"mappings":"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"}
+{"version":3,"file":"index176.es.js","sources":["../src/components/organisms/image-editor/components/panel-selected.tsx"],"sourcesContent":["import { Bookmark, Spline, Trash2 } from 'lucide-react'\nimport React, { useState } from 'react'\n\nimport { Button } from '@/components/atoms/button'\nimport { Input } from '@/components/atoms/input'\nimport { Textarea } from '@/components/atoms/textarea'\nimport { Slider } from '@/components/molecules/slider'\nimport { Switch } from '@/components/atoms/switch'\nimport { SingleSelect } from '@/components/molecules/single-select'\n\nimport {\n  ImageEditorEngine,\n  ImageEditorSelectedLayer,\n} from '../image-editor.types'\nimport { FONTS } from '../picture-studio-engine'\nimport { ColorPicker } from './color-picker'\nimport { useImageEditorPortalContainer } from './portal-context'\n\ninterface PanelSelectedProps {\n  selected: ImageEditorSelectedLayer\n  engine: ImageEditorEngine\n}\n\nconst FILL_ITEMS = [\n  { label: 'Outline only', value: 'stroke' },\n  { label: 'Solid fill', value: 'fill' },\n]\n\nconst CLOSED_SHAPES = ['rect', 'ellipse', 'circle']\n\nconst MULTI_POINT_SHAPES = ['line', 'dashedLine']\n\nconst DIRECTIONAL_SHAPES = [\n  'line',\n  'dashedLine',\n  'arrow',\n  'dashedArrow',\n  'doubleArrow',\n  'dashedDoubleArrow',\n]\n\nexport function PanelSelected({ selected, engine }: PanelSelectedProps) {\n  const container = useImageEditorPortalContainer()\n  const [naming, setNaming] = useState(false)\n  const [layerName, setLayerName] = useState('')\n\n  const suggestedName = () => {\n    if (selected.type === 'text')\n      return (selected.text ?? '').trim().slice(0, 40)\n    if (selected.label) return selected.label.trim().slice(0, 40)\n    return selected.shape ?? selected.type ?? ''\n  }\n\n  const commitSave = () => {\n    engine.saveSelectedLayer(layerName.trim() || undefined)\n    setNaming(false)\n    setLayerName('')\n  }\n  return (\n    <div>\n      {selected.type === 'text' && (\n        <div className=\"mb-3.5\">\n          <span className=\"mb-1 block text-xs text-light-4\">Text</span>\n          <Textarea\n            className=\"min-h-[52px]\"\n            value={selected.text ?? ''}\n            onChange={(e) => engine.setSelectedText(e.target.value)}\n          />\n          <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">Font</span>\n          <SingleSelect\n            items={FONTS}\n            value={selected.font ?? ''}\n            onValueChange={engine.setSelectedFont}\n            container={container}\n          />\n          <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n            <span>Size</span>\n            <span>{selected.size}px</span>\n          </div>\n          <Slider\n            min={10}\n            max={240}\n            step={1}\n            value={[selected.size ?? 24]}\n            onValueChange={([v]) => engine.setSelectedTextSize(v)}\n          />\n          <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n            <span>Box size</span>\n            <span>{selected.boxWidth}px</span>\n          </div>\n          <Slider\n            min={20}\n            max={2000}\n            step={1}\n            value={[selected.boxWidth ?? 200]}\n            onValueChange={([v]) => engine.setSelectedBoxWidth(v)}\n          />\n        </div>\n      )}\n\n      {selected.type === 'shape' && (\n        <div className=\"mb-3.5\">\n          <span className=\"mb-1 block text-xs text-light-4\">Fill style</span>\n          <SingleSelect\n            items={FILL_ITEMS}\n            value={selected.fill ?? 'stroke'}\n            onValueChange={(v) =>\n              engine.setSelectedShapeFill(v as 'stroke' | 'fill')\n            }\n            container={container}\n          />\n          <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n            Thickness\n          </span>\n          <Slider\n            min={1}\n            max={40}\n            step={1}\n            value={[selected.width ?? 6]}\n            onValueChange={([v]) => engine.setSelectedWidth(v)}\n          />\n\n          {MULTI_POINT_SHAPES.includes(selected.shape ?? '') && (\n            <>\n              <div className=\"my-3 h-px bg-neutral-1\" />\n              <Button\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={engine.continueSelectedLine}\n                prefixIcon={<Spline className=\"h-4 w-4\" />}\n              >\n                Continue this line\n              </Button>\n              <p className=\"mt-1.5 text-[11px] leading-snug text-light-4\">\n                Reopens the line so you can click more corners onto the end.\n              </p>\n            </>\n          )}\n\n          {(DIRECTIONAL_SHAPES.includes(selected.shape ?? '') ||\n            CLOSED_SHAPES.includes(selected.shape ?? '')) && (\n            <>\n              <div className=\"my-3 h-px bg-neutral-1\" />\n              <span className=\"mb-1 block text-xs text-light-4\">\n                {CLOSED_SHAPES.includes(selected.shape ?? '') || selected.closed\n                  ? 'Text inside shape'\n                  : 'Label above line'}\n              </span>\n              <Textarea\n                className=\"min-h-[44px]\"\n                placeholder=\"Add a caption…\"\n                value={selected.label ?? ''}\n                onChange={(e) => engine.setSelectedLabel(e.target.value)}\n              />\n              {!!selected.label && (\n                <>\n                  <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n                    Label font\n                  </span>\n                  <SingleSelect\n                    items={FONTS}\n                    value={selected.labelFont ?? FONTS[1].value}\n                    onValueChange={engine.setSelectedLabelFont}\n                    container={container}\n                  />\n                  <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                    <span>Label size</span>\n                    <span>{selected.labelSize ?? 42}px</span>\n                  </div>\n                  <Slider\n                    min={10}\n                    max={200}\n                    step={1}\n                    value={[selected.labelSize ?? 42]}\n                    onValueChange={([v]) => engine.setSelectedLabelSize(v)}\n                  />\n\n                  {!CLOSED_SHAPES.includes(selected.shape ?? '') &&\n                    !selected.closed && (\n                      <>\n                        <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n                          Label side\n                        </span>\n                        <SingleSelect\n                          items={[\n                            { label: 'Above the line', value: 'above' },\n                            { label: 'Below the line', value: 'below' },\n                          ]}\n                          value={selected.labelSide ?? 'above'}\n                          onValueChange={(v) =>\n                            engine.setSelectedLabelSide(v as 'above' | 'below')\n                          }\n                          container={container}\n                        />\n\n                        <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                          <span>Distance from line</span>\n                          <span>{selected.labelOffset ?? 10}px</span>\n                        </div>\n                        <Slider\n                          min={0}\n                          max={200}\n                          step={1}\n                          value={[selected.labelOffset ?? 10]}\n                          onValueChange={([v]) =>\n                            engine.setSelectedLabelOffset(v)\n                          }\n                        />\n\n                        <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                          <span>Position along line</span>\n                          <span>\n                            {Math.round((selected.labelPos ?? 0.5) * 100)}%\n                          </span>\n                        </div>\n                        <Slider\n                          min={0}\n                          max={100}\n                          step={1}\n                          value={[Math.round((selected.labelPos ?? 0.5) * 100)]}\n                          onValueChange={([v]) =>\n                            engine.setSelectedLabelPos(v / 100)\n                          }\n                        />\n\n                        <div className=\"mt-3 flex items-center justify-between gap-3\">\n                          <span className=\"text-xs text-light-4\">\n                            Follow line angle\n                          </span>\n                          <Switch\n                            checked={selected.labelRotate !== false}\n                            onCheckedChange={engine.setSelectedLabelRotate}\n                          />\n                        </div>\n                      </>\n                    )}\n\n                  {(CLOSED_SHAPES.includes(selected.shape ?? '') ||\n                    selected.closed) && (\n                    <>\n                      <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                        <span>Horizontal position</span>\n                        <span>{selected.labelDx ?? 0}px</span>\n                      </div>\n                      <Slider\n                        min={-300}\n                        max={300}\n                        step={1}\n                        value={[selected.labelDx ?? 0]}\n                        onValueChange={([v]) => engine.setSelectedLabelDx(v)}\n                      />\n                      <div className=\"mb-1 mt-2.5 flex justify-between text-xs text-light-4\">\n                        <span>Vertical position</span>\n                        <span>{selected.labelDy ?? 0}px</span>\n                      </div>\n                      <Slider\n                        min={-300}\n                        max={300}\n                        step={1}\n                        value={[selected.labelDy ?? 0]}\n                        onValueChange={([v]) => engine.setSelectedLabelDy(v)}\n                      />\n                    </>\n                  )}\n                </>\n              )}\n              {(selected.pointCount ?? 0) >= 3 && (\n                <>\n                  <span className=\"mb-1 mt-2.5 block text-xs text-light-4\">\n                    Path\n                  </span>\n                  <SingleSelect\n                    items={[\n                      { label: 'Open line', value: 'open' },\n                      { label: 'Closed shape', value: 'closed' },\n                    ]}\n                    value={selected.closed ? 'closed' : 'open'}\n                    onValueChange={(v) =>\n                      engine.setSelectedClosed(v === 'closed')\n                    }\n                    container={container}\n                  />\n                </>\n              )}\n            </>\n          )}\n        </div>\n      )}\n\n      {selected.type === 'stroke' && (\n        <div className=\"mb-3.5\">\n          <span className=\"mb-1 block text-xs text-light-4\">Brush size</span>\n          <Slider\n            min={1}\n            max={60}\n            step={1}\n            value={[selected.width ?? 8]}\n            onValueChange={([v]) => engine.setSelectedWidth(v)}\n          />\n        </div>\n      )}\n\n      {selected.type !== 'sticker' && (\n        <ColorPicker\n          value={selected.color ?? '#d24b2f'}\n          onChange={engine.setSelectedColor}\n        />\n      )}\n\n      <div className=\"my-3.5 h-px bg-neutral-1\" />\n\n      <div className=\"flex flex-col gap-2\">\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.bringSelectedToFront}\n        >\n          Bring to front\n        </Button>\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.sendSelectedToBack}\n        >\n          Send to back\n        </Button>\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.duplicateSelected}\n        >\n          Duplicate\n        </Button>\n        {naming ? (\n          <div className=\"rounded-lg border border-neutral-2 bg-rest-s1 p-2\">\n            <span className=\"mb-1 block text-xs text-light-4\">Layer name</span>\n            <Input\n              autoFocus\n              value={layerName}\n              placeholder={suggestedName() || 'Layer name'}\n              onChange={(e) => setLayerName(e.target.value)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter') commitSave()\n                if (e.key === 'Escape') setNaming(false)\n              }}\n            />\n            <div className=\"mt-2 flex gap-2\">\n              <Button size=\"sm\" onClick={commitSave} title=\"Save\" />\n              <Button\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={() => setNaming(false)}\n                title=\"Cancel\"\n              />\n            </div>\n          </div>\n        ) : (\n          <Button\n            variant=\"secondary\"\n            size=\"sm\"\n            onClick={() => {\n              setLayerName(suggestedName())\n              setNaming(true)\n            }}\n            prefixIcon={<Bookmark className=\"h-4 w-4\" />}\n          >\n            Save for reuse\n          </Button>\n        )}\n        <Button\n          variant=\"secondary\"\n          size=\"sm\"\n          onClick={engine.deleteSelected}\n          prefixIcon={<Trash2 className=\"h-4 w-4\" />}\n          className=\"text-danger-1\"\n        >\n          Delete layer\n        </Button>\n      </div>\n    </div>\n  )\n}\n"],"names":["FILL_ITEMS","CLOSED_SHAPES","MULTI_POINT_SHAPES","DIRECTIONAL_SHAPES","PanelSelected","selected","engine","container","useImageEditorPortalContainer","naming","setNaming","useState","layerName","setLayerName","suggestedName","commitSave","React","Textarea","e","SingleSelect","FONTS","Slider","v","Button","Spline","Switch","ColorPicker","Input","Bookmark","Trash2"],"mappings":";;;;;;;;;;;AAuBA,MAAMA,IAAa;AAAA,EACjB,EAAE,OAAO,gBAAgB,OAAO,SAAA;AAAA,EAChC,EAAE,OAAO,cAAc,OAAO,OAAA;AAChC,GAEMC,IAAgB,CAAC,QAAQ,WAAW,QAAQ,GAE5CC,IAAqB,CAAC,QAAQ,YAAY,GAE1CC,IAAqB;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,SAASC,EAAc,EAAE,UAAAC,GAAU,QAAAC,KAA8B;AACtE,QAAMC,IAAYC,EAAA,GACZ,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK,GACpC,CAACC,GAAWC,CAAY,IAAIF,EAAS,EAAE,GAEvCG,IAAgB,MAChBT,EAAS,SAAS,UACZA,EAAS,QAAQ,IAAI,OAAO,MAAM,GAAG,EAAE,IAC7CA,EAAS,QAAcA,EAAS,MAAM,OAAO,MAAM,GAAG,EAAE,IACrDA,EAAS,SAASA,EAAS,QAAQ,IAGtCU,IAAa,MAAM;AACvB,IAAAT,EAAO,kBAAkBM,EAAU,KAAA,KAAU,MAAS,GACtDF,EAAU,EAAK,GACfG,EAAa,EAAE;AAAA,EACjB;AACA,SACEG,gBAAAA,EAAA,cAAC,OAAA,MACEX,EAAS,SAAS,UACjBW,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,YACbA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,qCAAkC,MAAI,GACtDA,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAOZ,EAAS,QAAQ;AAAA,MACxB,UAAU,CAACa,MAAMZ,EAAO,gBAAgBY,EAAE,OAAO,KAAK;AAAA,IAAA;AAAA,EAAA,GAExDF,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,4CAAyC,MAAI,GAC7DA,gBAAAA,EAAA;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,OAAOC;AAAA,MACP,OAAOf,EAAS,QAAQ;AAAA,MACxB,eAAeC,EAAO;AAAA,MACtB,WAAAC;AAAA,IAAA;AAAA,EAAA,GAEFS,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,2DACbA,gBAAAA,EAAA,cAAC,QAAA,MAAK,MAAI,mCACT,QAAA,MAAMX,EAAS,MAAK,IAAE,CACzB,GACAW,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,QAAQ,EAAE;AAAA,MAC3B,eAAe,CAAC,CAACiB,CAAC,MAAMhB,EAAO,oBAAoBgB,CAAC;AAAA,IAAA;AAAA,EAAA,GAEtDN,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,2DACbA,gBAAAA,EAAA,cAAC,QAAA,MAAK,UAAQ,mCACb,QAAA,MAAMX,EAAS,UAAS,IAAE,CAC7B,GACAW,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,YAAY,GAAG;AAAA,MAChC,eAAe,CAAC,CAACiB,CAAC,MAAMhB,EAAO,oBAAoBgB,CAAC;AAAA,IAAA;AAAA,EAAA,CAExD,GAGDjB,EAAS,SAAS,WACjBW,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,SAAA,GACbA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,qCAAkC,YAAU,GAC5DA,gBAAAA,EAAA;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,OAAOnB;AAAA,MACP,OAAOK,EAAS,QAAQ;AAAA,MACxB,eAAe,CAACiB,MACdhB,EAAO,qBAAqBgB,CAAsB;AAAA,MAEpD,WAAAf;AAAA,IAAA;AAAA,EAAA,GAEFS,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,4CAAyC,WAEzD,GACAA,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,SAAS,CAAC;AAAA,MAC3B,eAAe,CAAC,CAACiB,CAAC,MAAMhB,EAAO,iBAAiBgB,CAAC;AAAA,IAAA;AAAA,EAAA,GAGlDpB,EAAmB,SAASG,EAAS,SAAS,EAAE,KAC/CW,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACEA,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,yBAAA,CAAyB,GACxCA,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAASjB,EAAO;AAAA,MAChB,YAAYU,gBAAAA,EAAA,cAACQ,GAAA,EAAO,WAAU,UAAA,CAAU;AAAA,IAAA;AAAA,IACzC;AAAA,EAAA,GAGDR,gBAAAA,EAAA,cAAC,KAAA,EAAE,WAAU,+CAAA,GAA+C,8DAE5D,CACF,IAGAb,EAAmB,SAASE,EAAS,SAAS,EAAE,KAChDJ,EAAc,SAASI,EAAS,SAAS,EAAE,MAC3CW,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACEA,gBAAAA,EAAA,cAAC,SAAI,WAAU,0BAAyB,GACxCA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,qCACbf,EAAc,SAASI,EAAS,SAAS,EAAE,KAAKA,EAAS,SACtD,sBACA,kBACN,GACAW,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,aAAY;AAAA,MACZ,OAAOZ,EAAS,SAAS;AAAA,MACzB,UAAU,CAACa,MAAMZ,EAAO,iBAAiBY,EAAE,OAAO,KAAK;AAAA,IAAA;AAAA,EAAA,GAExD,CAAC,CAACb,EAAS,SACVW,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACEA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,yCAAA,GAAyC,YAEzD,GACAA,gBAAAA,EAAA;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,OAAOC;AAAA,MACP,OAAOf,EAAS,aAAae,EAAM,CAAC,EAAE;AAAA,MACtC,eAAed,EAAO;AAAA,MACtB,WAAAC;AAAA,IAAA;AAAA,EAAA,GAEFS,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,wDAAA,mCACZ,QAAA,MAAK,YAAU,GAChBA,gBAAAA,EAAA,cAAC,cAAMX,EAAS,aAAa,IAAG,IAAE,CACpC,GACAW,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,aAAa,EAAE;AAAA,MAChC,eAAe,CAAC,CAACiB,CAAC,MAAMhB,EAAO,qBAAqBgB,CAAC;AAAA,IAAA;AAAA,EAAA,GAGtD,CAACrB,EAAc,SAASI,EAAS,SAAS,EAAE,KAC3C,CAACA,EAAS,UACRW,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACEA,gBAAAA,EAAA,cAAC,UAAK,WAAU,yCAAA,GAAyC,YAEzD,GACAA,gBAAAA,EAAA;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,EAAE,OAAO,kBAAkB,OAAO,QAAA;AAAA,QAClC,EAAE,OAAO,kBAAkB,OAAO,QAAA;AAAA,MAAQ;AAAA,MAE5C,OAAOd,EAAS,aAAa;AAAA,MAC7B,eAAe,CAACiB,MACdhB,EAAO,qBAAqBgB,CAAsB;AAAA,MAEpD,WAAAf;AAAA,IAAA;AAAA,EAAA,GAGFS,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,wDAAA,mCACZ,QAAA,MAAK,oBAAkB,GACxBA,gBAAAA,EAAA,cAAC,cAAMX,EAAS,eAAe,IAAG,IAAE,CACtC,GACAW,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,eAAe,EAAE;AAAA,MAClC,eAAe,CAAC,CAACiB,CAAC,MAChBhB,EAAO,uBAAuBgB,CAAC;AAAA,IAAA;AAAA,EAAA,mCAIlC,OAAA,EAAI,WAAU,2DACbN,gBAAAA,EAAA,cAAC,QAAA,MAAK,qBAAmB,GACzBA,gBAAAA,EAAA,cAAC,cACE,KAAK,OAAOX,EAAS,YAAY,OAAO,GAAG,GAAE,GAChD,CACF,GACAW,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAC,KAAK,OAAOhB,EAAS,YAAY,OAAO,GAAG,CAAC;AAAA,MACpD,eAAe,CAAC,CAACiB,CAAC,MAChBhB,EAAO,oBAAoBgB,IAAI,GAAG;AAAA,IAAA;AAAA,EAAA,GAItCN,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,+CAAA,mCACZ,QAAA,EAAK,WAAU,uBAAA,GAAuB,mBAEvC,GACAA,gBAAAA,EAAA;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,SAASpB,EAAS,gBAAgB;AAAA,MAClC,iBAAiBC,EAAO;AAAA,IAAA;AAAA,EAAA,CAE5B,CACF,IAGFL,EAAc,SAASI,EAAS,SAAS,EAAE,KAC3CA,EAAS,WACTW,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACEA,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,wDAAA,GACbA,gBAAAA,EAAA,cAAC,QAAA,MAAK,qBAAmB,GACzBA,gBAAAA,EAAA,cAAC,QAAA,MAAMX,EAAS,WAAW,GAAE,IAAE,CACjC,GACAW,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,WAAW,CAAC;AAAA,MAC7B,eAAe,CAAC,CAACiB,CAAC,MAAMhB,EAAO,mBAAmBgB,CAAC;AAAA,IAAA;AAAA,EAAA,GAErDN,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,wDAAA,mCACZ,QAAA,MAAK,mBAAiB,GACvBA,gBAAAA,EAAA,cAAC,cAAMX,EAAS,WAAW,GAAE,IAAE,CACjC,GACAW,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,WAAW,CAAC;AAAA,MAC7B,eAAe,CAAC,CAACiB,CAAC,MAAMhB,EAAO,mBAAmBgB,CAAC;AAAA,IAAA;AAAA,EAAA,CAEvD,CAEJ,IAEAjB,EAAS,cAAc,MAAM,KAC7BW,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACEA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,4CAAyC,MAEzD,GACAA,gBAAAA,EAAA;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,EAAE,OAAO,aAAa,OAAO,OAAA;AAAA,QAC7B,EAAE,OAAO,gBAAgB,OAAO,SAAA;AAAA,MAAS;AAAA,MAE3C,OAAOd,EAAS,SAAS,WAAW;AAAA,MACpC,eAAe,CAACiB,MACdhB,EAAO,kBAAkBgB,MAAM,QAAQ;AAAA,MAEzC,WAAAf;AAAA,IAAA;AAAA,EAAA,CAEJ,CAEJ,CAEJ,GAGDF,EAAS,SAAS,YACjBW,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,YACbA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,qCAAkC,YAAU,GAC5DA,gBAAAA,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO,CAAChB,EAAS,SAAS,CAAC;AAAA,MAC3B,eAAe,CAAC,CAACiB,CAAC,MAAMhB,EAAO,iBAAiBgB,CAAC;AAAA,IAAA;AAAA,EAAA,CAErD,GAGDjB,EAAS,SAAS,aACjBW,gBAAAA,EAAA;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,OAAOrB,EAAS,SAAS;AAAA,MACzB,UAAUC,EAAO;AAAA,IAAA;AAAA,EAAA,mCAIpB,OAAA,EAAI,WAAU,4BAA2B,GAE1CU,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,sBAAA,GACbA,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAASjB,EAAO;AAAA,IAAA;AAAA,IACjB;AAAA,EAAA,GAGDU,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAASjB,EAAO;AAAA,IAAA;AAAA,IACjB;AAAA,EAAA,GAGDU,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAASjB,EAAO;AAAA,IAAA;AAAA,IACjB;AAAA,EAAA,GAGAG,IACCO,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,uDACbA,gBAAAA,EAAA,cAAC,QAAA,EAAK,WAAU,kCAAA,GAAkC,YAAU,GAC5DA,gBAAAA,EAAA;AAAA,IAACW;AAAA,IAAA;AAAA,MACC,WAAS;AAAA,MACT,OAAOf;AAAA,MACP,aAAaE,OAAmB;AAAA,MAChC,UAAU,CAACI,MAAML,EAAaK,EAAE,OAAO,KAAK;AAAA,MAC5C,WAAW,CAACA,MAAM;AAChB,QAAIA,EAAE,QAAQ,WAASH,EAAA,GACnBG,EAAE,QAAQ,YAAUR,EAAU,EAAK;AAAA,MACzC;AAAA,IAAA;AAAA,EAAA,GAEFM,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,kBAAA,GACbA,gBAAAA,EAAA,cAACO,GAAA,EAAO,MAAK,MAAK,SAASR,GAAY,OAAM,QAAO,GACpDC,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAAS,MAAMb,EAAU,EAAK;AAAA,MAC9B,OAAM;AAAA,IAAA;AAAA,EAAA,CAEV,CACF,IAEAM,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAAS,MAAM;AACb,QAAAV,EAAaC,GAAe,GAC5BJ,EAAU,EAAI;AAAA,MAChB;AAAA,MACA,YAAYM,gBAAAA,EAAA,cAACY,GAAA,EAAS,WAAU,UAAA,CAAU;AAAA,IAAA;AAAA,IAC3C;AAAA,EAAA,GAIHZ,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAASjB,EAAO;AAAA,MAChB,YAAYU,gBAAAA,EAAA,cAACa,GAAA,EAAO,WAAU,WAAU;AAAA,MACxC,WAAU;AAAA,IAAA;AAAA,IACX;AAAA,EAAA,CAGH,CACF;AAEJ;"}

package/dist/{index.es172.js → index177.es.js}

@@ -1,6 +1,6 @@
 import { Bookmark as f, SearchIcon as v, Loader2 as E, Plus as b, Trash2 as N } from "lucide-react";
 import e, { useState as o, useEffect as S } from "react";
-import { Input as k } from "./index.es11.js";
+import { Input as k } from "./index11.es.js";
 const L = {
   text: "Text",
   shape: "Shape",
@@ -63,4 +63,4 @@ function R({ ui: r, engine: a }) {
 export {
   R as SavedLayersList
 };
-//# sourceMappingURL=index.es172.js.map
+//# sourceMappingURL=index177.es.js.map

package/dist/{index.es172.js.map → index177.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index.es172.js","sources":["../src/components/organisms/image-editor/components/saved-layers-list.tsx"],"sourcesContent":["import { Bookmark, Loader2, Plus, SearchIcon, Trash2 } from 'lucide-react'\nimport React, { useEffect, useState } from 'react'\n\nimport { Input } from '@/components/atoms/input'\n\nimport {\n  ImageEditorEngine,\n  ImageEditorSavedLayer,\n  ImageEditorUiState,\n} from '../image-editor.types'\n\ninterface SavedLayersListProps {\n  ui: ImageEditorUiState\n  engine: ImageEditorEngine\n}\n\nconst TYPE_LABEL: Record<string, string> = {\n  text: 'Text',\n  shape: 'Shape',\n  stroke: 'Drawing',\n  sticker: 'Sticker',\n}\n\nconst SEARCH_DEBOUNCE_MS = 350\n\nexport function SavedLayersList({ ui, engine }: SavedLayersListProps) {\n  const [query, setQuery] = useState('')\n  const [results, setResults] = useState<ImageEditorSavedLayer[] | null>(null)\n  const [searching, setSearching] = useState(false)\n\n  const saved = ui.savedLayers ?? []\n  const searchable = ui.canSearchSavedLayers || saved.length > 0\n\n  useEffect(() => {\n    const q = query.trim()\n    if (!q) {\n      setResults(null)\n      setSearching(false)\n      return\n    }\n    setSearching(true)\n    let cancelled = false\n    const t = setTimeout(() => {\n      engine\n        .searchSavedLayers(q)\n        // A slow response for an old query must not overwrite a newer one.\n        .then((r) => !cancelled && setResults(r))\n        .catch(() => !cancelled && setResults([]))\n        .finally(() => !cancelled && setSearching(false))\n    }, SEARCH_DEBOUNCE_MS)\n    return () => {\n      cancelled = true\n      clearTimeout(t)\n    }\n  }, [query, engine])\n\n  if (!searchable) return null\n\n  const rows = results ?? saved\n  const isSearchResults = results !== null\n\n  return (\n    <div className=\"mt-4 border-t border-neutral-1 pt-3.5\">\n      <span className=\"mb-2 flex items-center gap-1.5 text-xs font-medium text-light-2\">\n        <Bookmark className=\"h-3.5 w-3.5\" />\n        Saved layers\n      </span>\n\n      <div className=\"relative mb-2\">\n        <Input\n          value={query}\n          onChange={(e) => setQuery(e.target.value)}\n          placeholder=\"Search saved layers\"\n          className=\"pl-2 bg-light-1\"\n          prefix={<SearchIcon className='h-5 w-5 text-light-4'/>}\n          aria-label=\"Search saved layers\"\n        />\n        {searching && (\n          <Loader2 className=\"absolute right-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 animate-spin text-light-4\" />\n        )}\n      </div>\n\n      {rows.length === 0 ? (\n        <p className=\"px-0.5 py-2 text-xs text-light-4\">\n          {isSearchResults ? 'No layers match that.' : 'Nothing saved yet.'}\n        </p>\n      ) : (\n        <ul className=\"flex flex-col gap-1\">\n          {rows.map((item) => (\n            <li key={item.id} className=\"flex items-center gap-1\">\n              <button\n                type=\"button\"\n                onClick={() =>\n                  isSearchResults\n                    ? engine.insertSavedLayerEntry(\n                        item as ImageEditorSavedLayer\n                      )\n                    : engine.insertSavedLayer(item.id)\n                }\n                disabled={!ui.hasImage}\n                title={`Add \"${item.name}\"`}\n                className=\"flex min-h-9 flex-1 items-center gap-2 overflow-hidden rounded-lg border border-neutral-2 bg-rest-s1 px-2.5 text-left text-xs hover:bg-hover-s1 disabled:pointer-events-none disabled:opacity-50\"\n              >\n                <Plus className=\"h-4 w-4 shrink-0 text-light-4\" />\n                <span className=\"truncate text-light-2\">{item.name}</span>\n                <span className=\"ml-auto shrink-0 text-[10px] uppercase tracking-wide text-light-4\">\n                  {TYPE_LABEL[\n                    ('type' in item\n                      ? (item.type as string)\n                      : ((item as ImageEditorSavedLayer).layer\n                          ?.type as string)) ?? ''\n                  ] ?? ''}\n                </span>\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => engine.deleteSavedLayer(item.id)}\n                aria-label={`Delete saved layer ${item.name}`}\n                className=\"flex min-h-9 w-9 shrink-0 items-center justify-center rounded-lg text-light-4 hover:bg-hover-s1 hover:text-danger-1\"\n              >\n                <Trash2 className=\"h-3.5 w-3.5\" />\n              </button>\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  )\n}\n"],"names":["TYPE_LABEL","SEARCH_DEBOUNCE_MS","SavedLayersList","ui","engine","query","setQuery","useState","results","setResults","searching","setSearching","saved","searchable","useEffect","q","cancelled","t","r","rows","isSearchResults","React","Bookmark","Input","e","SearchIcon","Loader2","item","Plus","Trash2"],"mappings":"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"}
+{"version":3,"file":"index177.es.js","sources":["../src/components/organisms/image-editor/components/saved-layers-list.tsx"],"sourcesContent":["import { Bookmark, Loader2, Plus, SearchIcon, Trash2 } from 'lucide-react'\nimport React, { useEffect, useState } from 'react'\n\nimport { Input } from '@/components/atoms/input'\n\nimport {\n  ImageEditorEngine,\n  ImageEditorSavedLayer,\n  ImageEditorUiState,\n} from '../image-editor.types'\n\ninterface SavedLayersListProps {\n  ui: ImageEditorUiState\n  engine: ImageEditorEngine\n}\n\nconst TYPE_LABEL: Record<string, string> = {\n  text: 'Text',\n  shape: 'Shape',\n  stroke: 'Drawing',\n  sticker: 'Sticker',\n}\n\nconst SEARCH_DEBOUNCE_MS = 350\n\nexport function SavedLayersList({ ui, engine }: SavedLayersListProps) {\n  const [query, setQuery] = useState('')\n  const [results, setResults] = useState<ImageEditorSavedLayer[] | null>(null)\n  const [searching, setSearching] = useState(false)\n\n  const saved = ui.savedLayers ?? []\n  const searchable = ui.canSearchSavedLayers || saved.length > 0\n\n  useEffect(() => {\n    const q = query.trim()\n    if (!q) {\n      setResults(null)\n      setSearching(false)\n      return\n    }\n    setSearching(true)\n    let cancelled = false\n    const t = setTimeout(() => {\n      engine\n        .searchSavedLayers(q)\n        // A slow response for an old query must not overwrite a newer one.\n        .then((r) => !cancelled && setResults(r))\n        .catch(() => !cancelled && setResults([]))\n        .finally(() => !cancelled && setSearching(false))\n    }, SEARCH_DEBOUNCE_MS)\n    return () => {\n      cancelled = true\n      clearTimeout(t)\n    }\n  }, [query, engine])\n\n  if (!searchable) return null\n\n  const rows = results ?? saved\n  const isSearchResults = results !== null\n\n  return (\n    <div className=\"mt-4 border-t border-neutral-1 pt-3.5\">\n      <span className=\"mb-2 flex items-center gap-1.5 text-xs font-medium text-light-2\">\n        <Bookmark className=\"h-3.5 w-3.5\" />\n        Saved layers\n      </span>\n\n      <div className=\"relative mb-2\">\n        <Input\n          value={query}\n          onChange={(e) => setQuery(e.target.value)}\n          placeholder=\"Search saved layers\"\n          className=\"pl-2 bg-light-1\"\n          prefix={<SearchIcon className='h-5 w-5 text-light-4'/>}\n          aria-label=\"Search saved layers\"\n        />\n        {searching && (\n          <Loader2 className=\"absolute right-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 animate-spin text-light-4\" />\n        )}\n      </div>\n\n      {rows.length === 0 ? (\n        <p className=\"px-0.5 py-2 text-xs text-light-4\">\n          {isSearchResults ? 'No layers match that.' : 'Nothing saved yet.'}\n        </p>\n      ) : (\n        <ul className=\"flex flex-col gap-1\">\n          {rows.map((item) => (\n            <li key={item.id} className=\"flex items-center gap-1\">\n              <button\n                type=\"button\"\n                onClick={() =>\n                  isSearchResults\n                    ? engine.insertSavedLayerEntry(\n                        item as ImageEditorSavedLayer\n                      )\n                    : engine.insertSavedLayer(item.id)\n                }\n                disabled={!ui.hasImage}\n                title={`Add \"${item.name}\"`}\n                className=\"flex min-h-9 flex-1 items-center gap-2 overflow-hidden rounded-lg border border-neutral-2 bg-rest-s1 px-2.5 text-left text-xs hover:bg-hover-s1 disabled:pointer-events-none disabled:opacity-50\"\n              >\n                <Plus className=\"h-4 w-4 shrink-0 text-light-4\" />\n                <span className=\"truncate text-light-2\">{item.name}</span>\n                <span className=\"ml-auto shrink-0 text-[10px] uppercase tracking-wide text-light-4\">\n                  {TYPE_LABEL[\n                    ('type' in item\n                      ? (item.type as string)\n                      : ((item as ImageEditorSavedLayer).layer\n                          ?.type as string)) ?? ''\n                  ] ?? ''}\n                </span>\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => engine.deleteSavedLayer(item.id)}\n                aria-label={`Delete saved layer ${item.name}`}\n                className=\"flex min-h-9 w-9 shrink-0 items-center justify-center rounded-lg text-light-4 hover:bg-hover-s1 hover:text-danger-1\"\n              >\n                <Trash2 className=\"h-3.5 w-3.5\" />\n              </button>\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  )\n}\n"],"names":["TYPE_LABEL","SEARCH_DEBOUNCE_MS","SavedLayersList","ui","engine","query","setQuery","useState","results","setResults","searching","setSearching","saved","searchable","useEffect","q","cancelled","t","r","rows","isSearchResults","React","Bookmark","Input","e","SearchIcon","Loader2","item","Plus","Trash2"],"mappings":"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"}

package/dist/{index.es174.js → index178.es.js}

@@ -1,8 +1,8 @@
 import * as r from "react";
 import { Clock4 as m } from "lucide-react";
-import { convertEpochTime as i } from "./index.es185.js";
-import { AvatarDemo as c } from "./index.es6.js";
-import { Typography as a } from "./index.es19.js";
+import { convertEpochTime as i } from "./index189.es.js";
+import { AvatarDemo as c } from "./index6.es.js";
+import { Typography as a } from "./index19.es.js";
 const u = (e) => {
   const l = (t) => t ? t.split(" ").map((s) => s[0]).join("").toUpperCase() : "", o = () => {
     typeof window < "u" && e?.action?.redirect_url && (window.location.href = e?.action?.redirect_url);
@@ -35,4 +35,4 @@ const u = (e) => {
 export {
   u as default
 };
-//# sourceMappingURL=index.es174.js.map
+//# sourceMappingURL=index178.es.js.map

package/dist/{index.es174.js.map → index178.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index.es174.js","sources":["../src/components/organisms/navbar/components/notification-panel/components/notification-card/notification-card.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { NotificationCardProps } from './notification-card.types'\nimport * as React from 'react'\nimport { Clock4 } from 'lucide-react'\nimport { convertEpochTime } from './notification.utils'\nimport { Avatar } from '@/components/atoms/avatar'\nimport { Typography } from '@/components/atoms/typography'\n\nconst NotificationCard: FC<NotificationCardProps> = (notification) => {\n  const getInitials = (name: string): string => {\n    if (!name) {\n      return ''\n    }\n    return name\n      .split(' ')\n      .map((word) => word[0])\n      .join('')\n      .toUpperCase()\n  }\n\n  const onCardClick = () => {\n    if (typeof window !== 'undefined' && notification?.action?.redirect_url)\n      window.location.href = notification?.action?.redirect_url\n  }\n\n  return (\n    <div\n      className=\"flex flex-row items-start justify-start gap-2 p-3 border-b border-neutral-1 bg-light-1 hover:cursor-pointer\"\n      onClick={() => {\n        onCardClick()\n      }}\n      role=\"button\"\n      onKeyDown={(event: React.KeyboardEvent) => {\n        if (event.key === 'Enter') {\n          onCardClick()\n        }\n      }}\n      tabIndex={0}\n    >\n      <Avatar\n        fallback={getInitials(notification.user.first_name)}\n        imageSrc={notification.user.profile_url}\n        alt={getInitials(notification.user.first_name)}\n        size=\"md\"\n      />\n      <div className=\"flex flex-col gap-1\">\n        <Typography variant=\"body3\" className=\"text-light-2 hover:underline\">\n          {notification.title}\n        </Typography>\n        <Typography variant=\"body4\" className=\"text-light-3\">\n          {notification.description}\n        </Typography>\n\n        <div className=\"flex flex-row gap-[6px]\">\n          <Clock4 size={16} className=\"stroke-light-2\" />\n          <Typography variant=\"body6\" className=\"text-light-3\">\n            {convertEpochTime(Number(notification.timestamp))}\n          </Typography>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default NotificationCard\n"],"names":["NotificationCard","notification","getInitials","name","word","onCardClick","React","event","Avatar","Typography","Clock4","convertEpochTime"],"mappings":";;;;;AAQA,MAAMA,IAA8C,CAACC,MAAiB;AACpE,QAAMC,IAAc,CAACC,MACdA,IAGEA,EACJ,MAAM,GAAG,EACT,IAAI,CAACC,MAASA,EAAK,CAAC,CAAC,EACrB,KAAK,EAAE,EACP,YAAA,IANM,IASLC,IAAc,MAAM;AACxB,IAAI,OAAO,SAAW,OAAeJ,GAAc,QAAQ,iBACzD,OAAO,SAAS,OAAOA,GAAc,QAAQ;AAAA,EACjD;AAEA,SACE,gBAAAK,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,SAAS,MAAM;AACb,QAAAD,EAAA;AAAA,MACF;AAAA,MACA,MAAK;AAAA,MACL,WAAW,CAACE,MAA+B;AACzC,QAAIA,EAAM,QAAQ,WAChBF,EAAA;AAAA,MAEJ;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,IAEV,gBAAAC,EAAA;AAAA,MAACE;AAAAA,MAAA;AAAA,QACC,UAAUN,EAAYD,EAAa,KAAK,UAAU;AAAA,QAClD,UAAUA,EAAa,KAAK;AAAA,QAC5B,KAAKC,EAAYD,EAAa,KAAK,UAAU;AAAA,QAC7C,MAAK;AAAA,MAAA;AAAA,IAAA;AAAA,IAEP,gBAAAK,EAAA,cAAC,SAAI,WAAU,sBAAA,mCACZG,GAAA,EAAW,SAAQ,SAAQ,WAAU,kCACnCR,EAAa,KAChB,mCACCQ,GAAA,EAAW,SAAQ,SAAQ,WAAU,kBACnCR,EAAa,WAChB,GAEA,gBAAAK,EAAA,cAAC,SAAI,WAAU,0BAAA,mCACZI,GAAA,EAAO,MAAM,IAAI,WAAU,iBAAA,CAAiB,GAC7C,gBAAAJ,EAAA,cAACG,GAAA,EAAW,SAAQ,SAAQ,WAAU,kBACnCE,EAAiB,OAAOV,EAAa,SAAS,CAAC,CAClD,CACF,CACF;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"index178.es.js","sources":["../src/components/organisms/navbar/components/notification-panel/components/notification-card/notification-card.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { NotificationCardProps } from './notification-card.types'\nimport * as React from 'react'\nimport { Clock4 } from 'lucide-react'\nimport { convertEpochTime } from './notification.utils'\nimport { Avatar } from '@/components/atoms/avatar'\nimport { Typography } from '@/components/atoms/typography'\n\nconst NotificationCard: FC<NotificationCardProps> = (notification) => {\n  const getInitials = (name: string): string => {\n    if (!name) {\n      return ''\n    }\n    return name\n      .split(' ')\n      .map((word) => word[0])\n      .join('')\n      .toUpperCase()\n  }\n\n  const onCardClick = () => {\n    if (typeof window !== 'undefined' && notification?.action?.redirect_url)\n      window.location.href = notification?.action?.redirect_url\n  }\n\n  return (\n    <div\n      className=\"flex flex-row items-start justify-start gap-2 p-3 border-b border-neutral-1 bg-light-1 hover:cursor-pointer\"\n      onClick={() => {\n        onCardClick()\n      }}\n      role=\"button\"\n      onKeyDown={(event: React.KeyboardEvent) => {\n        if (event.key === 'Enter') {\n          onCardClick()\n        }\n      }}\n      tabIndex={0}\n    >\n      <Avatar\n        fallback={getInitials(notification.user.first_name)}\n        imageSrc={notification.user.profile_url}\n        alt={getInitials(notification.user.first_name)}\n        size=\"md\"\n      />\n      <div className=\"flex flex-col gap-1\">\n        <Typography variant=\"body3\" className=\"text-light-2 hover:underline\">\n          {notification.title}\n        </Typography>\n        <Typography variant=\"body4\" className=\"text-light-3\">\n          {notification.description}\n        </Typography>\n\n        <div className=\"flex flex-row gap-[6px]\">\n          <Clock4 size={16} className=\"stroke-light-2\" />\n          <Typography variant=\"body6\" className=\"text-light-3\">\n            {convertEpochTime(Number(notification.timestamp))}\n          </Typography>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default NotificationCard\n"],"names":["NotificationCard","notification","getInitials","name","word","onCardClick","React","event","Avatar","Typography","Clock4","convertEpochTime"],"mappings":";;;;;AAQA,MAAMA,IAA8C,CAACC,MAAiB;AACpE,QAAMC,IAAc,CAACC,MACdA,IAGEA,EACJ,MAAM,GAAG,EACT,IAAI,CAACC,MAASA,EAAK,CAAC,CAAC,EACrB,KAAK,EAAE,EACP,YAAA,IANM,IASLC,IAAc,MAAM;AACxB,IAAI,OAAO,SAAW,OAAeJ,GAAc,QAAQ,iBACzD,OAAO,SAAS,OAAOA,GAAc,QAAQ;AAAA,EACjD;AAEA,SACE,gBAAAK,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,SAAS,MAAM;AACb,QAAAD,EAAA;AAAA,MACF;AAAA,MACA,MAAK;AAAA,MACL,WAAW,CAACE,MAA+B;AACzC,QAAIA,EAAM,QAAQ,WAChBF,EAAA;AAAA,MAEJ;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,IAEV,gBAAAC,EAAA;AAAA,MAACE;AAAAA,MAAA;AAAA,QACC,UAAUN,EAAYD,EAAa,KAAK,UAAU;AAAA,QAClD,UAAUA,EAAa,KAAK;AAAA,QAC5B,KAAKC,EAAYD,EAAa,KAAK,UAAU;AAAA,QAC7C,MAAK;AAAA,MAAA;AAAA,IAAA;AAAA,IAEP,gBAAAK,EAAA,cAAC,SAAI,WAAU,sBAAA,mCACZG,GAAA,EAAW,SAAQ,SAAQ,WAAU,kCACnCR,EAAa,KAChB,mCACCQ,GAAA,EAAW,SAAQ,SAAQ,WAAU,kBACnCR,EAAa,WAChB,GAEA,gBAAAK,EAAA,cAAC,SAAI,WAAU,0BAAA,mCACZI,GAAA,EAAO,MAAM,IAAI,WAAU,iBAAA,CAAiB,GAC7C,gBAAAJ,EAAA,cAACG,GAAA,EAAW,SAAQ,SAAQ,WAAU,kBACnCE,EAAiB,OAAOV,EAAa,SAAS,CAAC,CAClD,CACF,CACF;AAAA,EAAA;AAGN;"}

package/dist/{index.es175.js → index179.es.js}

@@ -1,4 +1,4 @@
-import { Typography as t } from "./index.es19.js";
+import { Typography as t } from "./index19.es.js";
 import * as e from "react";
 const i = () => /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center justify-center h-full max-w-80" }, /* @__PURE__ */ e.createElement(
   "img",
@@ -11,4 +11,4 @@ const i = () => /* @__PURE__ */ e.createElement("div", { className: "flex flex-c
 export {
   i as default
 };
-//# sourceMappingURL=index.es175.js.map
+//# sourceMappingURL=index179.es.js.map

package/dist/{index.es175.js.map → index179.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index.es175.js","sources":["../src/components/organisms/navbar/components/notification-panel/components/empty-state/empty-state.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { FC } from 'react'\nimport * as React from 'react'\n\nconst EmptyNotificationState: FC = () => {\n  return (\n    <div className=\"flex flex-col items-center justify-center h-full max-w-80\">\n      <img\n        src=\"https://frontend-static-files.geoiq.io/strapi/notification_empty_state_d1614ba3d3/notification_empty_state_d1614ba3d3.svg\"\n        alt=\"empty-state\"\n        className=\"h-[150px] w-[150px]\"\n      />\n      <div className=\"flex flex-col items-center justify-center gap-1\">\n        <Typography variant=\"body1\" className=\"text-light-1\">\n          No new notifications for now!\n        </Typography>\n        <Typography variant=\"body4\" className=\"text-center text-light-4\">\n          Stay tuned for updates, and we&apos;ll keep you posted when something\n          comes up!\n        </Typography>\n      </div>\n    </div>\n  )\n}\n\nexport default EmptyNotificationState\n"],"names":["EmptyNotificationState","React","Typography"],"mappings":";;AAIA,MAAMA,IAA6B,MAE/B,gBAAAC,EAAA,cAAC,OAAA,EAAI,WAAU,4DAAA,GACb,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAI;AAAA,IACJ,KAAI;AAAA,IACJ,WAAU;AAAA,EAAA;AAAA,mCAEX,OAAA,EAAI,WAAU,qDACb,gBAAAA,EAAA,cAACC,GAAA,EAAW,SAAQ,SAAQ,WAAU,kBAAe,+BAErD,mCACCA,GAAA,EAAW,SAAQ,SAAQ,WAAU,8BAA2B,4EAGjE,CACF,CACF;"}
+{"version":3,"file":"index179.es.js","sources":["../src/components/organisms/navbar/components/notification-panel/components/empty-state/empty-state.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { FC } from 'react'\nimport * as React from 'react'\n\nconst EmptyNotificationState: FC = () => {\n  return (\n    <div className=\"flex flex-col items-center justify-center h-full max-w-80\">\n      <img\n        src=\"https://frontend-static-files.geoiq.io/strapi/notification_empty_state_d1614ba3d3/notification_empty_state_d1614ba3d3.svg\"\n        alt=\"empty-state\"\n        className=\"h-[150px] w-[150px]\"\n      />\n      <div className=\"flex flex-col items-center justify-center gap-1\">\n        <Typography variant=\"body1\" className=\"text-light-1\">\n          No new notifications for now!\n        </Typography>\n        <Typography variant=\"body4\" className=\"text-center text-light-4\">\n          Stay tuned for updates, and we&apos;ll keep you posted when something\n          comes up!\n        </Typography>\n      </div>\n    </div>\n  )\n}\n\nexport default EmptyNotificationState\n"],"names":["EmptyNotificationState","React","Typography"],"mappings":";;AAIA,MAAMA,IAA6B,MAE/B,gBAAAC,EAAA,cAAC,OAAA,EAAI,WAAU,4DAAA,GACb,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAI;AAAA,IACJ,KAAI;AAAA,IACJ,WAAU;AAAA,EAAA;AAAA,mCAEX,OAAA,EAAI,WAAU,qDACb,gBAAAA,EAAA,cAACC,GAAA,EAAW,SAAQ,SAAQ,WAAU,kBAAe,+BAErD,mCACCA,GAAA,EAAW,SAAQ,SAAQ,WAAU,8BAA2B,4EAGjE,CACF,CACF;"}

package/dist/{index.es18.js → index18.es.js}

@@ -1,4 +1,4 @@
-import { TooltipProvider as i, TooltipWrapper as n, TooltipTrigger as a, TooltipContent as m } from "./index.es17.js";
+import { TooltipProvider as i, TooltipWrapper as n, TooltipTrigger as a, TooltipContent as m } from "./index17.es.js";
 import * as t from "react";
 function c({
   headerText: o,
@@ -24,4 +24,4 @@ function c({
 export {
   c as default
 };
-//# sourceMappingURL=index.es18.js.map
+//# sourceMappingURL=index18.es.js.map

package/dist/{index.es18.js.map → index18.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index.es18.js","sources":["../src/components/atoms/tooltip/tooltip.tsx"],"sourcesContent":["import {\n  TooltipWrapper,\n  TooltipContent,\n  TooltipTrigger,\n  TooltipProvider,\n} from './tooltip-components'\nimport * as React from 'react'\nimport { TooltipProps } from './tooltip.types'\n\nexport default function Tooltip({\n  headerText,\n  content,\n  className,\n  // id,\n  ...props\n}: TooltipProps) {\n  return (\n    // <div id={id}>\n    <TooltipProvider>\n      <TooltipWrapper {...props}>\n        <TooltipTrigger>{props?.triggerElement}</TooltipTrigger>\n        <TooltipContent\n          side={props?.side ?? 'top'}\n          headerText={headerText ?? ''}\n          content={content ?? ''}\n          className={className}\n          {...props}\n        />\n      </TooltipWrapper>\n    </TooltipProvider>\n    // </div>\n  )\n}\n"],"names":["Tooltip","headerText","content","className","props","React","TooltipProvider","TooltipWrapper","TooltipTrigger","TooltipContent"],"mappings":";;AASA,SAAwBA,EAAQ;AAAA,EAC9B,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA;AAAA,EAEA,GAAGC;AACL,GAAiB;AACf;AAAA;AAAA,IAEE,gBAAAC,EAAA,cAACC,GAAA,MACC,gBAAAD,EAAA,cAACE,GAAA,EAAgB,GAAGH,KAClB,gBAAAC,EAAA,cAACG,GAAA,MAAgBJ,GAAO,cAAe,GACvC,gBAAAC,EAAA;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,MAAML,GAAO,QAAQ;AAAA,QACrB,YAAYH,KAAc;AAAA,QAC1B,SAASC,KAAW;AAAA,QACpB,WAAAC;AAAA,QACC,GAAGC;AAAA,MAAA;AAAA,IAAA,CAER,CACF;AAAA;AAGJ;"}
+{"version":3,"file":"index18.es.js","sources":["../src/components/atoms/tooltip/tooltip.tsx"],"sourcesContent":["import {\n  TooltipWrapper,\n  TooltipContent,\n  TooltipTrigger,\n  TooltipProvider,\n} from './tooltip-components'\nimport * as React from 'react'\nimport { TooltipProps } from './tooltip.types'\n\nexport default function Tooltip({\n  headerText,\n  content,\n  className,\n  // id,\n  ...props\n}: TooltipProps) {\n  return (\n    // <div id={id}>\n    <TooltipProvider>\n      <TooltipWrapper {...props}>\n        <TooltipTrigger>{props?.triggerElement}</TooltipTrigger>\n        <TooltipContent\n          side={props?.side ?? 'top'}\n          headerText={headerText ?? ''}\n          content={content ?? ''}\n          className={className}\n          {...props}\n        />\n      </TooltipWrapper>\n    </TooltipProvider>\n    // </div>\n  )\n}\n"],"names":["Tooltip","headerText","content","className","props","React","TooltipProvider","TooltipWrapper","TooltipTrigger","TooltipContent"],"mappings":";;AASA,SAAwBA,EAAQ;AAAA,EAC9B,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA;AAAA,EAEA,GAAGC;AACL,GAAiB;AACf;AAAA;AAAA,IAEE,gBAAAC,EAAA,cAACC,GAAA,MACC,gBAAAD,EAAA,cAACE,GAAA,EAAgB,GAAGH,KAClB,gBAAAC,EAAA,cAACG,GAAA,MAAgBJ,GAAO,cAAe,GACvC,gBAAAC,EAAA;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,MAAML,GAAO,QAAQ;AAAA,QACrB,YAAYH,KAAc;AAAA,QAC1B,SAASC,KAAW;AAAA,QACpB,WAAAC;AAAA,QACC,GAAGC;AAAA,MAAA;AAAA,IAAA,CAER,CACF;AAAA;AAGJ;"}

package/dist/{index.es178.js → index180.es.js}

@@ -1,10 +1,10 @@
-import { Typography as u } from "./index.es19.js";
+import { Typography as u } from "./index19.es.js";
 import e, { useState as v, useRef as N } from "react";
-import "./index.es35.js";
-import { useToast as h } from "./index.es87.js";
-import { Spinner as x } from "./index.es64.js";
+import "./index37.es.js";
+import { useToast as h } from "./index89.es.js";
+import { Spinner as x } from "./index66.es.js";
 import { Upload as _, X as w, Pen as k } from "lucide-react";
-import { useFormValues as I } from "./index.es161.js";
+import { useFormValues as I } from "./index144.es.js";
 const j = ({
   id: g,
   onChange: l,
@@ -84,4 +84,4 @@ const j = ({
 export {
   j as SingleImagePicker
 };
-//# sourceMappingURL=index.es178.js.map
+//# sourceMappingURL=index180.es.js.map

package/dist/{index.es178.js.map → index180.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index.es178.js","sources":["../src/components/ui/form-renderer/components/form-fields/components/single-image-picker/index.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { useToast } from '@/components/molecules/toast'\nimport { Spinner } from '@/components/unstyled/spinner'\nimport { Upload, X, Pen } from 'lucide-react'\nimport React, { useRef, useState } from 'react'\nimport { useFormValues } from '../../../../context/form-values'\nimport { AssetValue } from '../../../../form.types'\n\ninterface ImagePickerProps {\n  id: string\n  onChange: (data?: AssetValue) => void\n  value?: AssetValue\n  accept?: string\n  error?: string\n}\n\nconst SingleImagePicker: React.FC<ImagePickerProps> = ({\n  id,\n  onChange,\n  value,\n  accept = 'image/*',\n  error,\n}) => {\n  const { onAssetUpload, onToggleImageEditor } = useFormValues()\n  const { toast } = useToast()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement>(null)\n\n  const handleImageSelect = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const file = e.target.files?.[0]\n    if (!file || isLoading) return\n    if (onAssetUpload) {\n      setIsLoading(true)\n      onAssetUpload(file)\n        .then((data: AssetValue) => {\n          onChange({ ...data, original_private_url: data.private_url })\n\n          toast({\n            title: 'Alert!',\n            description: `File uploaded successfully.`,\n            icon: 'success',\n          })\n        })\n        .catch(() => {\n          onChange(undefined)\n          toast({\n            title: 'Alert!',\n            description: `Error uploading file`,\n            icon: 'warning',\n          })\n        })\n        .finally(() => {\n          setIsLoading(false)\n          // Reset the file input so the same file can be selected again\n          if (fileInputRef.current) {\n            fileInputRef.current.value = ''\n          }\n        })\n    }\n  }\n\n  const onReplaceImage = (data: AssetValue) => {\n    onChange({\n      ...data,\n      original_private_url: value?.original_private_url ?? value?.private_url,\n    })\n  }\n\n  const handleClick = () => {\n    if (!isLoading) {\n      fileInputRef.current?.click()\n    }\n  }\n\n  return (\n    <div className=\"relative\">\n      {isLoading && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70\">\n          <Spinner className=\"w-8 h-8 text-primary-1\" />\n        </div>\n      )}\n      <div className=\"relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1\">\n        <button className=\"w-full\" onClick={handleClick}>\n          <div className=\"flex flex-col items-center gap-3 text-center\">\n            <div className=\"bg-gray-100 rounded-full\">\n              <Upload className=\"w-6 h-6 text-gray-500\" />\n            </div>\n            <Typography variant=\"body1\" className=\"text-gray-600\">\n              {isLoading\n                ? 'Uploading...'\n                : value\n                  ? 'Replace Image'\n                  : 'Attach Image'}\n            </Typography>\n          </div>\n        </button>\n        <input\n          ref={fileInputRef}\n          id={`${id}-gallery`}\n          type=\"file\"\n          accept={accept}\n          disabled={isLoading}\n          onChange={handleImageSelect}\n          className=\"hidden\"\n        />\n\n        {error && (\n          <Typography variant=\"body1\" className=\"mt-1 text-danger-1\">\n            {error}\n          </Typography>\n        )}\n      </div>\n      {value && (\n        <div className=\"grid grid-cols-2 gap-4 mt-4 sm:grid-cols-3 md:grid-cols-4\">\n          <div className=\"relative flex rounded\">\n            <img\n              src={value.public_url}\n              alt=\"Preview\"\n              className=\"object-cover w-full h-24 rounded\"\n            />\n            <button\n              type=\"button\"\n              onClick={() => {\n                if (!isLoading) {\n                  onChange(undefined)\n                }\n              }}\n              className=\"absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100\"\n            >\n              <X size={16} className=\"stroke-danger\" />\n            </button>\n            {onToggleImageEditor && (\n              <button\n                type=\"button\"\n                onClick={(e) => {\n                  e.currentTarget.blur()\n                  onToggleImageEditor({\n                    imageUrl: value.public_url,\n                    index: -1,\n                    onReplaceImage,\n                  })\n                }}\n                className=\"absolute p-1 text-white bg-white rounded-full left-2 top-2 opacity-70 hover:opacity-100\"\n              >\n                <Pen size={16} className=\"stroke-danger\" />\n              </button>\n            )}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { SingleImagePicker }\n"],"names":["SingleImagePicker","id","onChange","value","accept","error","onAssetUpload","onToggleImageEditor","useFormValues","toast","useToast","isLoading","setIsLoading","useState","fileInputRef","useRef","handleImageSelect","e","file","data","onReplaceImage","handleClick","React","Spinner","Upload","Typography","X","Pen"],"mappings":"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"}
+{"version":3,"file":"index180.es.js","sources":["../src/components/ui/form-renderer/components/form-fields/components/single-image-picker/index.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { useToast } from '@/components/molecules/toast'\nimport { Spinner } from '@/components/unstyled/spinner'\nimport { Upload, X, Pen } from 'lucide-react'\nimport React, { useRef, useState } from 'react'\nimport { useFormValues } from '../../../../context/form-values'\nimport { AssetValue } from '../../../../form.types'\n\ninterface ImagePickerProps {\n  id: string\n  onChange: (data?: AssetValue) => void\n  value?: AssetValue\n  accept?: string\n  error?: string\n}\n\nconst SingleImagePicker: React.FC<ImagePickerProps> = ({\n  id,\n  onChange,\n  value,\n  accept = 'image/*',\n  error,\n}) => {\n  const { onAssetUpload, onToggleImageEditor } = useFormValues()\n  const { toast } = useToast()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement>(null)\n\n  const handleImageSelect = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const file = e.target.files?.[0]\n    if (!file || isLoading) return\n    if (onAssetUpload) {\n      setIsLoading(true)\n      onAssetUpload(file)\n        .then((data: AssetValue) => {\n          onChange({ ...data, original_private_url: data.private_url })\n\n          toast({\n            title: 'Alert!',\n            description: `File uploaded successfully.`,\n            icon: 'success',\n          })\n        })\n        .catch(() => {\n          onChange(undefined)\n          toast({\n            title: 'Alert!',\n            description: `Error uploading file`,\n            icon: 'warning',\n          })\n        })\n        .finally(() => {\n          setIsLoading(false)\n          // Reset the file input so the same file can be selected again\n          if (fileInputRef.current) {\n            fileInputRef.current.value = ''\n          }\n        })\n    }\n  }\n\n  const onReplaceImage = (data: AssetValue) => {\n    onChange({\n      ...data,\n      original_private_url: value?.original_private_url ?? value?.private_url,\n    })\n  }\n\n  const handleClick = () => {\n    if (!isLoading) {\n      fileInputRef.current?.click()\n    }\n  }\n\n  return (\n    <div className=\"relative\">\n      {isLoading && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70\">\n          <Spinner className=\"w-8 h-8 text-primary-1\" />\n        </div>\n      )}\n      <div className=\"relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1\">\n        <button className=\"w-full\" onClick={handleClick}>\n          <div className=\"flex flex-col items-center gap-3 text-center\">\n            <div className=\"bg-gray-100 rounded-full\">\n              <Upload className=\"w-6 h-6 text-gray-500\" />\n            </div>\n            <Typography variant=\"body1\" className=\"text-gray-600\">\n              {isLoading\n                ? 'Uploading...'\n                : value\n                  ? 'Replace Image'\n                  : 'Attach Image'}\n            </Typography>\n          </div>\n        </button>\n        <input\n          ref={fileInputRef}\n          id={`${id}-gallery`}\n          type=\"file\"\n          accept={accept}\n          disabled={isLoading}\n          onChange={handleImageSelect}\n          className=\"hidden\"\n        />\n\n        {error && (\n          <Typography variant=\"body1\" className=\"mt-1 text-danger-1\">\n            {error}\n          </Typography>\n        )}\n      </div>\n      {value && (\n        <div className=\"grid grid-cols-2 gap-4 mt-4 sm:grid-cols-3 md:grid-cols-4\">\n          <div className=\"relative flex rounded\">\n            <img\n              src={value.public_url}\n              alt=\"Preview\"\n              className=\"object-cover w-full h-24 rounded\"\n            />\n            <button\n              type=\"button\"\n              onClick={() => {\n                if (!isLoading) {\n                  onChange(undefined)\n                }\n              }}\n              className=\"absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100\"\n            >\n              <X size={16} className=\"stroke-danger\" />\n            </button>\n            {onToggleImageEditor && (\n              <button\n                type=\"button\"\n                onClick={(e) => {\n                  e.currentTarget.blur()\n                  onToggleImageEditor({\n                    imageUrl: value.public_url,\n                    index: -1,\n                    onReplaceImage,\n                  })\n                }}\n                className=\"absolute p-1 text-white bg-white rounded-full left-2 top-2 opacity-70 hover:opacity-100\"\n              >\n                <Pen size={16} className=\"stroke-danger\" />\n              </button>\n            )}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { SingleImagePicker }\n"],"names":["SingleImagePicker","id","onChange","value","accept","error","onAssetUpload","onToggleImageEditor","useFormValues","toast","useToast","isLoading","setIsLoading","useState","fileInputRef","useRef","handleImageSelect","e","file","data","onReplaceImage","handleClick","React","Spinner","Upload","Typography","X","Pen"],"mappings":"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"}

package/dist/{index.es179.js → index181.es.js}

@@ -1,37 +1,38 @@
-import { Typography as d } from "./index.es19.js";
-import { Spinner as y } from "./index.es64.js";
-import { Video as h, X as N } from "lucide-react";
-import e, { useState as x, useRef as m } from "react";
-import { useFormValues as k } from "./index.es161.js";
-import { useToast as w } from "./index.es87.js";
-const j = ({
+import { Typography as d } from "./index19.es.js";
+import e, { useState as y, useRef as m } from "react";
+import "./index37.es.js";
+import { useToast as h } from "./index89.es.js";
+import { Spinner as N } from "./index66.es.js";
+import { Video as x, X as k } from "lucide-react";
+import { useFormValues as w } from "./index144.es.js";
+const z = ({
   id: u,
   onChange: r,
   value: l,
   accept: p = "video/*",
   error: i
 }) => {
-  const { onAssetUpload: c } = k(), { toast: s } = w(), [t, o] = x(!1), a = m(null), f = m(null), g = (v) => {
+  const { onAssetUpload: c } = w(), { toast: o } = h(), [t, s] = y(!1), a = m(null), f = m(null), g = (v) => {
     const n = v.target.files?.[0];
-    !n || t || c && (o(!0), c(n).then((b) => {
-      r(b), s({
+    !n || t || c && (s(!0), c(n).then((b) => {
+      r(b), o({
         title: "Alert!",
         description: "Video uploaded successfully.",
         icon: "success"
       });
     }).catch(() => {
-      r(void 0), s({
+      r(void 0), o({
         title: "Alert!",
         description: "Error uploading video",
         icon: "warning"
       });
     }).finally(() => {
-      o(!1), a.current && (a.current.value = "");
+      s(!1), a.current && (a.current.value = "");
     }));
   }, E = () => {
     t || a.current?.click();
   };
-  return /* @__PURE__ */ e.createElement("div", { className: "relative" }, t && /* @__PURE__ */ e.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70" }, /* @__PURE__ */ e.createElement(y, { className: "w-8 h-8 text-primary-1" })), /* @__PURE__ */ e.createElement("div", { className: "relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1" }, /* @__PURE__ */ e.createElement("button", { className: "w-full", onClick: E }, /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-3 text-center" }, /* @__PURE__ */ e.createElement("div", { className: "bg-gray-100 rounded-full" }, /* @__PURE__ */ e.createElement(h, { className: "w-6 h-6 text-gray-500" })), /* @__PURE__ */ e.createElement(d, { variant: "body1", className: "text-gray-600" }, t ? "Uploading..." : l ? "Replace Video" : "Attach Video"))), /* @__PURE__ */ e.createElement(
+  return /* @__PURE__ */ e.createElement("div", { className: "relative" }, t && /* @__PURE__ */ e.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70" }, /* @__PURE__ */ e.createElement(N, { className: "w-8 h-8 text-primary-1" })), /* @__PURE__ */ e.createElement("div", { className: "relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1" }, /* @__PURE__ */ e.createElement("button", { className: "w-full", onClick: E }, /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-3 text-center" }, /* @__PURE__ */ e.createElement("div", { className: "bg-gray-100 rounded-full" }, /* @__PURE__ */ e.createElement(x, { className: "w-6 h-6 text-gray-500" })), /* @__PURE__ */ e.createElement(d, { variant: "body1", className: "text-gray-600" }, t ? "Uploading..." : l ? "Replace Video" : "Attach Video"))), /* @__PURE__ */ e.createElement(
     "input",
     {
       ref: a,
@@ -70,10 +71,10 @@ const j = ({
       },
       className: "absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100"
     },
-    /* @__PURE__ */ e.createElement(N, { size: 16, className: "stroke-danger" })
+    /* @__PURE__ */ e.createElement(k, { size: 16, className: "stroke-danger" })
   ))));
 };
 export {
-  j as SingleVideoPicker
+  z as SingleVideoPicker
 };
-//# sourceMappingURL=index.es179.js.map
+//# sourceMappingURL=index181.es.js.map

package/dist/{index.es179.js.map → index181.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index.es179.js","sources":["../src/components/ui/form-renderer/components/form-fields/components/single-video-picker/index.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { useToast } from '@/components/molecules/toast'\nimport { Spinner } from '@/components/unstyled/spinner'\nimport { X, Video } from 'lucide-react'\nimport React, { useRef, useState } from 'react'\nimport { useFormValues } from '../../../../context/form-values'\nimport { AssetValue } from '../../../../form.types'\n\ninterface VideoPickerProps {\n  id: string\n  onChange: (data?: AssetValue) => void\n  value?: AssetValue\n  accept?: string\n  error?: string\n}\n\nconst SingleVideoPicker: React.FC<VideoPickerProps> = ({\n  id,\n  onChange,\n  value,\n  accept = 'video/*',\n  error,\n}) => {\n  const { onAssetUpload } = useFormValues()\n  const { toast } = useToast()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement>(null)\n  const videoElRef = useRef<HTMLVideoElement>(null)\n\n  const handleVideoSelect = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const file = e.target.files?.[0]\n    if (!file || isLoading) return\n    if (onAssetUpload) {\n      setIsLoading(true)\n      onAssetUpload(file)\n        .then((data: AssetValue) => {\n          onChange(data)\n\n          toast({\n            title: 'Alert!',\n            description: `Video uploaded successfully.`,\n            icon: 'success',\n          })\n        })\n        .catch(() => {\n          onChange(undefined)\n          toast({\n            title: 'Alert!',\n            description: `Error uploading video`,\n            icon: 'warning',\n          })\n        })\n        .finally(() => {\n          setIsLoading(false)\n          // Reset the file input so the same video can be selected again\n          if (fileInputRef.current) {\n            fileInputRef.current.value = ''\n          }\n        })\n    }\n  }\n\n  const handleClick = () => {\n    if (!isLoading) {\n      fileInputRef.current?.click()\n    }\n  }\n\n  return (\n    <div className=\"relative\">\n      {isLoading && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70\">\n          <Spinner className=\"w-8 h-8 text-primary-1\" />\n        </div>\n      )}\n      <div className=\"relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1\">\n        <button className=\"w-full\" onClick={handleClick}>\n          <div className=\"flex flex-col items-center gap-3 text-center\">\n            <div className=\"bg-gray-100 rounded-full\">\n              <Video className=\"w-6 h-6 text-gray-500\" />\n            </div>\n            <Typography variant=\"body1\" className=\"text-gray-600\">\n              {isLoading\n                ? 'Uploading...'\n                : value\n                  ? 'Replace Video'\n                  : 'Attach Video'}\n            </Typography>\n          </div>\n        </button>\n        <input\n          ref={fileInputRef}\n          id={`${id}-gallery`}\n          type=\"file\"\n          accept={accept}\n          disabled={isLoading}\n          onChange={handleVideoSelect}\n          className=\"hidden\"\n        />\n\n        {error && (\n          <Typography variant=\"body1\" className=\"mt-1 text-danger-1\">\n            {error}\n          </Typography>\n        )}\n      </div>\n      {value && (\n        <div className=\"grid grid-cols-2 gap-4 mt-4 sm:grid-cols-2 md:grid-cols-2\">\n          <div className=\"relative flex  rounded\">\n            <video\n              ref={videoElRef}\n              src={value.public_url}\n              className=\"object-cover h-32 rounded\"\n              controls={true}\n              controlsList=\"nodownload\"\n              preload=\"metadata\"\n            >\n              {/* Add caption track for accessibility */}\n              <track\n                kind=\"captions\"\n                label=\"English captions\"\n                srcLang=\"en\"\n                src=\"\"\n                default\n              />\n            </video>\n            <button\n              onClick={() => {\n                if (!isLoading) {\n                  onChange(undefined)\n                }\n              }}\n              className=\"absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100\"\n            >\n              <X size={16} className=\"stroke-danger\" />\n            </button>\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { SingleVideoPicker }\n"],"names":["SingleVideoPicker","id","onChange","value","accept","error","onAssetUpload","useFormValues","toast","useToast","isLoading","setIsLoading","useState","fileInputRef","useRef","videoElRef","handleVideoSelect","e","file","data","handleClick","React","Spinner","Video","Typography","X"],"mappings":"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"}
+{"version":3,"file":"index181.es.js","sources":["../src/components/ui/form-renderer/components/form-fields/components/single-video-picker/index.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { useToast } from '@/components/molecules/toast'\nimport { Spinner } from '@/components/unstyled/spinner'\nimport { X, Video } from 'lucide-react'\nimport React, { useRef, useState } from 'react'\nimport { useFormValues } from '../../../../context/form-values'\nimport { AssetValue } from '../../../../form.types'\n\ninterface VideoPickerProps {\n  id: string\n  onChange: (data?: AssetValue) => void\n  value?: AssetValue\n  accept?: string\n  error?: string\n}\n\nconst SingleVideoPicker: React.FC<VideoPickerProps> = ({\n  id,\n  onChange,\n  value,\n  accept = 'video/*',\n  error,\n}) => {\n  const { onAssetUpload } = useFormValues()\n  const { toast } = useToast()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement>(null)\n  const videoElRef = useRef<HTMLVideoElement>(null)\n\n  const handleVideoSelect = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const file = e.target.files?.[0]\n    if (!file || isLoading) return\n    if (onAssetUpload) {\n      setIsLoading(true)\n      onAssetUpload(file)\n        .then((data: AssetValue) => {\n          onChange(data)\n\n          toast({\n            title: 'Alert!',\n            description: `Video uploaded successfully.`,\n            icon: 'success',\n          })\n        })\n        .catch(() => {\n          onChange(undefined)\n          toast({\n            title: 'Alert!',\n            description: `Error uploading video`,\n            icon: 'warning',\n          })\n        })\n        .finally(() => {\n          setIsLoading(false)\n          // Reset the file input so the same video can be selected again\n          if (fileInputRef.current) {\n            fileInputRef.current.value = ''\n          }\n        })\n    }\n  }\n\n  const handleClick = () => {\n    if (!isLoading) {\n      fileInputRef.current?.click()\n    }\n  }\n\n  return (\n    <div className=\"relative\">\n      {isLoading && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70\">\n          <Spinner className=\"w-8 h-8 text-primary-1\" />\n        </div>\n      )}\n      <div className=\"relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1\">\n        <button className=\"w-full\" onClick={handleClick}>\n          <div className=\"flex flex-col items-center gap-3 text-center\">\n            <div className=\"bg-gray-100 rounded-full\">\n              <Video className=\"w-6 h-6 text-gray-500\" />\n            </div>\n            <Typography variant=\"body1\" className=\"text-gray-600\">\n              {isLoading\n                ? 'Uploading...'\n                : value\n                  ? 'Replace Video'\n                  : 'Attach Video'}\n            </Typography>\n          </div>\n        </button>\n        <input\n          ref={fileInputRef}\n          id={`${id}-gallery`}\n          type=\"file\"\n          accept={accept}\n          disabled={isLoading}\n          onChange={handleVideoSelect}\n          className=\"hidden\"\n        />\n\n        {error && (\n          <Typography variant=\"body1\" className=\"mt-1 text-danger-1\">\n            {error}\n          </Typography>\n        )}\n      </div>\n      {value && (\n        <div className=\"grid grid-cols-2 gap-4 mt-4 sm:grid-cols-2 md:grid-cols-2\">\n          <div className=\"relative flex  rounded\">\n            <video\n              ref={videoElRef}\n              src={value.public_url}\n              className=\"object-cover h-32 rounded\"\n              controls={true}\n              controlsList=\"nodownload\"\n              preload=\"metadata\"\n            >\n              {/* Add caption track for accessibility */}\n              <track\n                kind=\"captions\"\n                label=\"English captions\"\n                srcLang=\"en\"\n                src=\"\"\n                default\n              />\n            </video>\n            <button\n              onClick={() => {\n                if (!isLoading) {\n                  onChange(undefined)\n                }\n              }}\n              className=\"absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100\"\n            >\n              <X size={16} className=\"stroke-danger\" />\n            </button>\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { SingleVideoPicker }\n"],"names":["SingleVideoPicker","id","onChange","value","accept","error","onAssetUpload","useFormValues","toast","useToast","isLoading","setIsLoading","useState","fileInputRef","useRef","videoElRef","handleVideoSelect","e","file","data","handleClick","React","Spinner","Video","Typography","X"],"mappings":";;;;;;;AAgBA,MAAMA,IAAgD,CAAC;AAAA,EACrD,IAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,OAAAC;AACF,MAAM;AACJ,QAAM,EAAE,eAAAC,EAAA,IAAkBC,EAAA,GACpB,EAAE,OAAAC,EAAA,IAAUC,EAAA,GAEZ,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1CC,IAAeC,EAAyB,IAAI,GAC5CC,IAAaD,EAAyB,IAAI,GAE1CE,IAAoB,CAACC,MAA2C;AACpE,UAAMC,IAAOD,EAAE,OAAO,QAAQ,CAAC;AAC/B,IAAI,CAACC,KAAQR,KACTJ,MACFK,EAAa,EAAI,GACjBL,EAAcY,CAAI,EACf,KAAK,CAACC,MAAqB;AAC1B,MAAAjB,EAASiB,CAAI,GAEbX,EAAM;AAAA,QACJ,OAAO;AAAA,QACP,aAAa;AAAA,QACb,MAAM;AAAA,MAAA,CACP;AAAA,IACH,CAAC,EACA,MAAM,MAAM;AACX,MAAAN,EAAS,MAAS,GAClBM,EAAM;AAAA,QACJ,OAAO;AAAA,QACP,aAAa;AAAA,QACb,MAAM;AAAA,MAAA,CACP;AAAA,IACH,CAAC,EACA,QAAQ,MAAM;AACb,MAAAG,EAAa,EAAK,GAEdE,EAAa,YACfA,EAAa,QAAQ,QAAQ;AAAA,IAEjC,CAAC;AAAA,EAEP,GAEMO,IAAc,MAAM;AACxB,IAAKV,KACHG,EAAa,SAAS,MAAA;AAAA,EAE1B;AAEA,SACEQ,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,WAAA,GACZX,qCACE,OAAA,EAAI,WAAU,gFAAA,GACbW,gBAAAA,EAAA,cAACC,GAAA,EAAQ,WAAU,0BAAyB,CAC9C,GAEFD,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,+EAAA,mCACZ,UAAA,EAAO,WAAU,UAAS,SAASD,EAAA,GAClCC,gBAAAA,EAAA,cAAC,SAAI,WAAU,+CAAA,GACbA,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,2BAAA,mCACZE,GAAA,EAAM,WAAU,wBAAA,CAAwB,CAC3C,GACAF,gBAAAA,EAAA,cAACG,KAAW,SAAQ,SAAQ,WAAU,gBAAA,GACnCd,IACG,iBACAP,IACE,kBACA,cACR,CACF,CACF,GACAkB,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAKR;AAAA,MACL,IAAI,GAAGZ,CAAE;AAAA,MACT,MAAK;AAAA,MACL,QAAAG;AAAA,MACA,UAAUM;AAAA,MACV,UAAUM;AAAA,MACV,WAAU;AAAA,IAAA;AAAA,EAAA,GAGXX,KACCgB,gBAAAA,EAAA,cAACG,KAAW,SAAQ,SAAQ,WAAU,qBAAA,GACnCnB,CACH,CAEJ,GACCF,qCACE,OAAA,EAAI,WAAU,+DACbkB,gBAAAA,EAAA,cAAC,OAAA,EAAI,WAAU,yBAAA,GACbA,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAKN;AAAA,MACL,KAAKZ,EAAM;AAAA,MACX,WAAU;AAAA,MACV,UAAU;AAAA,MACV,cAAa;AAAA,MACb,SAAQ;AAAA,IAAA;AAAA,IAGRkB,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAM;AAAA,QACN,SAAQ;AAAA,QACR,KAAI;AAAA,QACJ,SAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EACT,GAEFA,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAS,MAAM;AACb,QAAKX,KACHR,EAAS,MAAS;AAAA,MAEtB;AAAA,MACA,WAAU;AAAA,IAAA;AAAA,IAEVmB,gBAAAA,EAAA,cAACI,GAAA,EAAE,MAAM,IAAI,WAAU,gBAAA,CAAgB;AAAA,EAAA,CAE3C,CACF,CAEJ;AAEJ;"}

package/dist/{index.es180.js → index182.es.js}

@@ -1,24 +1,25 @@
-import { Typography as m } from "./index.es19.js";
-import { Spinner as v } from "./index.es64.js";
-import { Upload as A, X as $, Pen as x } from "lucide-react";
-import e, { useState as M, useRef as P } from "react";
-import { useFormValues as R } from "./index.es161.js";
-import { useToast as T } from "./index.es87.js";
-const L = ({
+import { Typography as m } from "./index19.es.js";
+import e, { useState as v, useRef as A } from "react";
+import "./index37.es.js";
+import { useToast as $ } from "./index89.es.js";
+import { Spinner as x } from "./index66.es.js";
+import { Upload as M, X as P, Pen as R } from "lucide-react";
+import { useFormValues as T } from "./index144.es.js";
+const V = ({
   id: f,
   onChange: o,
-  value: l = [],
+  value: r = [],
   accept: h = "image/*",
   error: d,
-  maxImages: r = 20
+  maxImages: l = 20
 }) => {
-  const { onAssetUpload: g, onToggleImageEditor: p } = R(), { toast: s } = T(), [a, u] = M(!1), c = P(null), y = async (i) => {
+  const { onAssetUpload: g, onToggleImageEditor: p } = T(), { toast: s } = $(), [a, u] = v(!1), c = A(null), y = async (i) => {
     const t = i.target.files;
     if (!(!t?.length || a)) {
-      if (l.length + t.length > r) {
+      if (r.length + t.length > l) {
         s({
           title: "Alert!",
-          description: `Maximum ${r} images allowed.`,
+          description: `Maximum ${l} images allowed.`,
           icon: "warning"
         });
         return;
@@ -27,7 +28,7 @@ const L = ({
         u(!0);
         try {
           const n = Array.from(t).map((k) => g(k)), w = await Promise.all(n);
-          o([...l, ...w]), s({
+          o([...r, ...w]), s({
             title: "Alert!",
             description: `${t.length} ${t.length === 1 ? "image" : "images"} uploaded successfully.`,
             icon: "success"
@@ -44,30 +45,30 @@ const L = ({
       }
     }
   }, b = () => {
-    !a && l.length < r ? c.current?.click() : l.length >= r && s({
+    !a && r.length < l ? c.current?.click() : r.length >= l && s({
       title: "Alert!",
-      description: `Maximum ${r} images allowed.`,
+      description: `Maximum ${l} images allowed.`,
       icon: "warning"
     });
   }, E = (i) => {
     if (!a) {
-      const t = [...l];
+      const t = [...r];
       t.splice(i, 1), o(t);
     }
   };
   function N(i, t) {
-    const n = [...l];
+    const n = [...r];
     n.splice(t, 1, i), o(n);
   }
-  return /* @__PURE__ */ e.createElement("div", { className: "relative" }, a && /* @__PURE__ */ e.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70" }, /* @__PURE__ */ e.createElement(v, { className: "w-8 h-8 text-primary-1" })), /* @__PURE__ */ e.createElement("div", { className: "relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1" }, /* @__PURE__ */ e.createElement(
+  return /* @__PURE__ */ e.createElement("div", { className: "relative" }, a && /* @__PURE__ */ e.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70" }, /* @__PURE__ */ e.createElement(x, { className: "w-8 h-8 text-primary-1" })), /* @__PURE__ */ e.createElement("div", { className: "relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1" }, /* @__PURE__ */ e.createElement(
     "button",
     {
       className: "w-full",
       onClick: b,
       type: "button",
-      disabled: a || l.length >= r
+      disabled: a || r.length >= l
     },
-    /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-3 text-center" }, /* @__PURE__ */ e.createElement("div", { className: "bg-gray-100 rounded-full" }, /* @__PURE__ */ e.createElement(A, { className: "w-6 h-6 text-gray-500" })), /* @__PURE__ */ e.createElement(m, { variant: "body1", className: "text-gray-600" }, a ? "Uploading..." : l.length >= r ? `Maximum ${r} images reached` : "Add Images"), l.length > 0 && /* @__PURE__ */ e.createElement(m, { variant: "body1", className: "text-gray-500" }, l.length, " of ", r, " images"))
+    /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-3 text-center" }, /* @__PURE__ */ e.createElement("div", { className: "bg-gray-100 rounded-full" }, /* @__PURE__ */ e.createElement(M, { className: "w-6 h-6 text-gray-500" })), /* @__PURE__ */ e.createElement(m, { variant: "body1", className: "text-gray-600" }, a ? "Uploading..." : r.length >= l ? `Maximum ${l} images reached` : "Add Images"), r.length > 0 && /* @__PURE__ */ e.createElement(m, { variant: "body1", className: "text-gray-500" }, r.length, " of ", l, " images"))
   ), /* @__PURE__ */ e.createElement(
     "input",
     {
@@ -75,12 +76,12 @@ const L = ({
       id: `${f}-gallery`,
       type: "file",
       accept: h,
-      disabled: a || l.length >= r,
+      disabled: a || r.length >= l,
       onChange: y,
       className: "hidden",
       multiple: !0
     }
-  ), d && /* @__PURE__ */ e.createElement(m, { variant: "body1", className: "mt-1 text-danger-1" }, d)), l.length > 0 && /* @__PURE__ */ e.createElement("div", { className: "grid grid-cols-2 gap-4 mt-4 sm:grid-cols-3 md:grid-cols-4" }, l.map((i, t) => /* @__PURE__ */ e.createElement("div", { key: t, className: "relative flex rounded" }, /* @__PURE__ */ e.createElement(
+  ), d && /* @__PURE__ */ e.createElement(m, { variant: "body1", className: "mt-1 text-danger-1" }, d)), r.length > 0 && /* @__PURE__ */ e.createElement("div", { className: "grid grid-cols-2 gap-4 mt-4 sm:grid-cols-3 md:grid-cols-4" }, r.map((i, t) => /* @__PURE__ */ e.createElement("div", { key: t, className: "relative flex rounded" }, /* @__PURE__ */ e.createElement(
     "img",
     {
       src: i.public_url,
@@ -95,7 +96,7 @@ const L = ({
       type: "button",
       disabled: a
     },
-    /* @__PURE__ */ e.createElement($, { size: 16, className: "stroke-danger" })
+    /* @__PURE__ */ e.createElement(P, { size: 16, className: "stroke-danger" })
   ), p && /* @__PURE__ */ e.createElement(
     "button",
     {
@@ -109,10 +110,10 @@ const L = ({
       },
       className: "absolute p-1 text-white bg-white rounded-full left-2 top-2 opacity-70 hover:opacity-100"
     },
-    /* @__PURE__ */ e.createElement(x, { size: 16, className: "stroke-danger" })
+    /* @__PURE__ */ e.createElement(R, { size: 16, className: "stroke-danger" })
   )))));
 };
 export {
-  L as MultiImagePicker
+  V as MultiImagePicker
 };
-//# sourceMappingURL=index.es180.js.map
+//# sourceMappingURL=index182.es.js.map