pixedi 1.10.0 → 1.10.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (83) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/lib/Pixedi.d.ts +10 -0
  3. package/dist/lib/assets/icons.d.ts +27 -0
  4. package/dist/lib/constants.d.ts +6 -0
  5. package/dist/lib/crop/CropButtonGroup.d.ts +6 -0
  6. package/dist/lib/crop/CropInfo.d.ts +1 -0
  7. package/dist/lib/crop/CropInteractBox.d.ts +1 -0
  8. package/dist/lib/crop/CropLines.d.ts +1 -0
  9. package/dist/lib/crop/CropPointer.d.ts +7 -0
  10. package/dist/lib/crop/CropPointers.d.ts +6 -0
  11. package/dist/lib/crop/CropTools.d.ts +1 -0
  12. package/dist/lib/crop/index.d.ts +7 -0
  13. package/dist/lib/crop/useCrop.d.ts +7 -0
  14. package/dist/lib/crop/useCropInteraction.d.ts +9 -0
  15. package/dist/lib/eventBus.d.ts +6 -0
  16. package/dist/lib/filters/DefaultFilterValues.d.ts +2 -0
  17. package/dist/lib/filters/FilterInteractBox.d.ts +1 -0
  18. package/dist/lib/filters/FilterTools.d.ts +1 -0
  19. package/dist/lib/filters/UrlFilters.d.ts +1 -0
  20. package/dist/lib/filters/index.d.ts +3 -0
  21. package/dist/lib/filters/useFilterInteraction.d.ts +7 -0
  22. package/dist/lib/filters/useFilters.d.ts +20 -0
  23. package/dist/lib/flip/FlipTools.d.ts +1 -0
  24. package/dist/lib/flip/index.d.ts +1 -0
  25. package/dist/lib/flip/useFlip.d.ts +9 -0
  26. package/dist/lib/frame/Frame.d.ts +1 -0
  27. package/dist/lib/frame/index.d.ts +1 -0
  28. package/dist/lib/header/Header.d.ts +5 -0
  29. package/dist/lib/header/index.d.ts +1 -0
  30. package/dist/lib/hooks/index.d.ts +6 -0
  31. package/dist/lib/hooks/useAbove.d.ts +2 -0
  32. package/dist/lib/hooks/useBellow.d.ts +2 -0
  33. package/dist/lib/hooks/useImageLoader.d.ts +16 -0
  34. package/dist/lib/hooks/useImageSaving.d.ts +6 -0
  35. package/dist/lib/hooks/useMobile.d.ts +3 -0
  36. package/dist/lib/hooks/useToolCommit.d.ts +7 -0
  37. package/dist/lib/index.d.ts +1 -0
  38. package/dist/lib/index.js +715 -892
  39. package/dist/lib/index.umd.cjs +33 -0
  40. package/dist/lib/infobar/Infobar.d.ts +1 -0
  41. package/dist/lib/infobar/index.d.ts +1 -0
  42. package/dist/lib/preset/PresetTools.d.ts +1 -0
  43. package/dist/lib/preset/index.d.ts +1 -0
  44. package/dist/lib/preset/usePreset.d.ts +8 -0
  45. package/dist/lib/preview/Preview.d.ts +8 -0
  46. package/dist/lib/preview/index.d.ts +1 -0
  47. package/dist/lib/preview/usePreview.d.ts +28 -0
  48. package/dist/lib/provider/PixediProvider.d.ts +15 -0
  49. package/dist/lib/provider/StoreContext.d.ts +20 -0
  50. package/dist/lib/provider/initialState.d.ts +16 -0
  51. package/dist/lib/provider/usePixediContext.d.ts +16 -0
  52. package/dist/lib/resize/ResizeTools.d.ts +1 -0
  53. package/dist/lib/resize/index.d.ts +1 -0
  54. package/dist/lib/resize/useResize.d.ts +15 -0
  55. package/dist/lib/rotate/RotateTools.d.ts +1 -0
  56. package/dist/lib/rotate/index.d.ts +1 -0
  57. package/dist/lib/rotate/useRotate.d.ts +6 -0
  58. package/dist/lib/sidebar/Sidebar.d.ts +5 -0
  59. package/dist/lib/sidebar/index.d.ts +1 -0
  60. package/dist/lib/sidebar/useSidebar.d.ts +11 -0
  61. package/dist/lib/types.d.ts +129 -0
  62. package/dist/lib/ui/button/Button.d.ts +7 -0
  63. package/dist/lib/ui/index.d.ts +10 -0
  64. package/dist/lib/ui/input/Input.d.ts +4 -0
  65. package/dist/lib/ui/input-pixel/InputPixel.d.ts +6 -0
  66. package/dist/lib/ui/save-close-group/SaveCloseGroup.d.ts +8 -0
  67. package/dist/lib/ui/select/Select.d.ts +11 -0
  68. package/dist/lib/ui/select/useSelect.d.ts +22 -0
  69. package/dist/lib/ui/separator/Separator.d.ts +4 -0
  70. package/dist/lib/ui/slider/Slider.d.ts +19 -0
  71. package/dist/lib/ui/surface-tool/SurfaceTool.d.ts +8 -0
  72. package/dist/lib/ui/surface-tool/SurfaceToolContext.d.ts +6 -0
  73. package/dist/lib/ui/surface-tool/SurfaceToolOffsetProvider.d.ts +5 -0
  74. package/dist/lib/ui/surface-tool/useSurfaceTool.d.ts +7 -0
  75. package/dist/lib/ui/tooltip/Tooltip.d.ts +11 -0
  76. package/dist/lib/ui/tooltip/useTooltip.d.ts +14 -0
  77. package/dist/lib/utils/canvas.d.ts +7 -0
  78. package/dist/lib/utils/crop.d.ts +10 -0
  79. package/dist/lib/utils/imageProcessor.d.ts +10 -0
  80. package/dist/lib/utils/preview.d.ts +42 -0
  81. package/dist/lib/workers/imageLoad.d.ts +1 -0
  82. package/package.json +12 -9
  83. package/dist/lib/index.umd.js +0 -38
@@ -0,0 +1,33 @@
1
+ (function(){try{if(typeof document<`u`){var e=document.createElement(`style`);e.appendChild(document.createTextNode(`._button_1vpzl_1{cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;background-color:#0000;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;gap:8px;height:32px;padding:0 8px;font-family:inherit;font-size:14px;font-weight:500;transition:background-color .2s,border-color .2s,opacity .2s;display:inline-flex}._button_1vpzl_1:disabled{pointer-events:none;opacity:.5}._button_1vpzl_1 svg{flex-shrink:0;width:16px;height:16px}._default_1vpzl_35{background-color:var(--primary);color:var(--primary-foreground)}._default_1vpzl_35:hover{opacity:.9}._outline_1vpzl_44{border-color:var(--border);background-color:var(--background);color:var(--foreground)}._outline_1vpzl_44:hover{background-color:var(--secondary)}._ghost_1vpzl_54{color:var(--foreground);padding:0 8px}._ghost_1vpzl_54:hover{background-color:var(--secondary)}._rect_1vpzl_63{width:32px;height:32px}._separator_gp8ff_1{background-color:var(--border);box-sizing:border-box;border:none;flex-shrink:0;display:block}._separator_gp8ff_1[data-orientation=horizontal]{width:100%;height:1px}._separator_gp8ff_1[data-orientation=vertical]{align-self:stretch;width:1px;height:100%;margin:0}._wrapper_1aw0m_1{box-sizing:border-box;width:100%;position:relative}._trigger_1aw0m_6{width:100%;height:32px;color:var(--foreground);background-color:var(--background);border:1px solid var(--border);cursor:pointer;box-sizing:border-box;-webkit-user-select:none;user-select:none;border-radius:4px;outline:none;justify-content:space-between;align-items:center;padding:0 8px 0 10px;font-family:inherit;font-size:14px;transition:border-color .2s;display:flex}._trigger_1aw0m_6:hover,._trigger_1aw0m_6:focus{border-color:var(--muted-foreground)}._triggerArrow_1aw0m_31{width:16px;height:16px;color:var(--muted-foreground);transition:transform .2s}._wrapper_1aw0m_1[data-state=open] ._triggerArrow_1aw0m_31{transform:rotate(180deg)}._content_1aw0m_40{background-color:var(--background);border:1px solid var(--border);z-index:50;box-sizing:border-box;border-radius:4px;width:100%;max-height:282px;padding:4px;position:absolute;top:calc(100% + 4px);left:0;overflow-y:auto;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}._content_1aw0m_40::-webkit-scrollbar{width:4px}._content_1aw0m_40::-webkit-scrollbar-track{background:0 0}._content_1aw0m_40::-webkit-scrollbar-thumb{background-color:var(--border);border-radius:10px}._wrapper_1aw0m_1[data-state=closed] ._content_1aw0m_40{display:none}._groupLabel_1aw0m_74{color:var(--muted-foreground);-webkit-user-select:none;user-select:none;padding:8px 10px;font-size:12px;font-weight:500}._item_1aw0m_81{width:100%;color:var(--foreground);cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;background:0 0;border-radius:4px;justify-content:space-between;align-items:center;padding:4px 10px;display:flex}._item_1aw0m_81:hover{background-color:var(--secondary)}._itemLeft_1aw0m_98{font-size:14px;font-weight:400}._itemAddon_1aw0m_102{align-items:center;gap:8px;display:flex}._itemAddon_1aw0m_102 span{color:var(--muted-foreground);font-size:12px}._itemAddon_1aw0m_102 svg{font-size:14px}._itemAddon_1aw0m_102 b{flex-shrink:0;width:16px;height:16px}._itemRightContainer_1aw0m_122{align-items:center;gap:8px;display:flex}._itemRight_1aw0m_122{color:var(--muted-foreground);font-size:14px}._itemCheck_1aw0m_131{width:16px;height:16px;color:var(--foreground);flex-shrink:0}:host{height:100%;display:block}:host *{box-sizing:border-box}._root_c6inw_8{width:100%;height:100%;font-size:16px;font-family:var(--font-sans);--font-sans:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Tahoma, Helvetica, Arial, sans-serif;--font-mono:"Courier New", Courier, monospace;--color-white:#fff;--color-white-fade:color-mix(in srgb, var(--color-white) 65%, transparent);--color-black:#000;--color-red:oklch(63.7% .237 25.331);--color-green:oklch(76.8% .188 151.716);--background:oklch(100% 0 0);--background-fade:color-mix(in srgb, var(--background) 65%, transparent);--foreground:oklch(14.5% 0 0);--primary:oklch(20.5% 0 0);--primary-foreground:oklch(98.5% 0 0);--secondary:oklch(97% 0 0);--secondary-foreground:oklch(20.5% 0 0);--muted:oklch(95% 0 0);--muted-foreground:oklch(75.6% 0 0);--accent:oklch(97% 0 0);--accent-foreground:oklch(20.5% 0 0);--accent-blue:oklch(60.9% .221 251.687);--accent-blue-light:oklch(96% .02 250);--accent-blue-fade:color-mix(in srgb, var(--accent-blue) 60%, transparent);--border:oklch(92.2% 0 0);--input:oklch(92.2% 0 0);--ring:oklch(70.8% 0 0);--overlay-bg:color-mix(in srgb, var(--color-black) 50%, transparent);--overlay-bg-white:color-mix(in srgb, var(--color-white) 80%, transparent);--surface-border:solid 1px transparent;position:relative}._root_c6inw_8[data-theme=dark]{--color-white-fade:color-mix(in srgb, var(--color-white) 45%, transparent);--background:oklch(24.5% 0 0);--background-fade:color-mix(in srgb, var(--background) 70%, transparent);--foreground:oklch(78.5% 0 0);--primary:oklch(92.2% 0 0);--primary-foreground:oklch(20.5% 0 0);--secondary:oklch(26.9% 0 0);--secondary-foreground:oklch(98.5% 0 0);--muted:oklch(29.5% 0 0);--muted-foreground:oklch(50% 0 0);--accent:oklch(26.9% 0 0);--accent-foreground:oklch(98.5% 0 0);--accent-blue-light:oklch(25% .06 250);--border:oklch(100% 0 0/.1);--input:oklch(100% 0 0/.15);--ring:oklch(55.6% 0 0);--overlay-bg:color-mix(in srgb, var(--color-black) 75%, transparent);--surface-border:solid 1px var(--border)}._root_c6inw_8 h1,._root_c6inw_8 h2,._root_c6inw_8 h3,._root_c6inw_8 h4,._root_c6inw_8 h5,._root_c6inw_8 h6{color:var(--foreground);margin:0;font-weight:600}._textRed_c6inw_78{color:var(--color-red)}._bgRed_c6inw_81{background-color:var(--color-red)}._bgGreen_c6inw_84{background-color:var(--color-green)}._textGreen_c6inw_87{color:var(--color-green)}._mask_c6inw_90{background-color:var(--overlay-bg)}._semibold_c6inw_93{letter-spacing:.4px;font-weight:600}._bold_c6inw_97{letter-spacing:.4px;font-weight:700}._system_c6inw_101{color:var(--muted-foreground);background-color:var(--background);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._wrapper_c6inw_111{width:100%;height:100%;min-height:480px;position:relative;overflow:hidden}._grid_c6inw_118{background:var(--background);grid-template:"header header"48px"sidebar frame"1fr"sidebar infobar"32px/48px 1fr;height:100%;display:grid;position:relative}._grid_c6inw_118._mobile_c6inw_130{grid-template-columns:0 1fr}._gridNoInfobar_c6inw_134{grid-template:"header header"48px"sidebar frame"1fr/48px 1fr;height:100%;display:grid;position:relative}._gridNoInfobar_c6inw_134._mobile_c6inw_130{grid-template-columns:0 1fr}._gridSingleTool_c6inw_149{grid-template:"frame"1fr/1fr;height:100%;display:grid;position:relative}._input_kyavx_1{width:100%;height:32px;color:var(--foreground);background-color:var(--background);border:1px solid var(--input);box-sizing:border-box;border-radius:4px;outline:none;padding:0 8px;font-family:inherit;font-size:14px;line-height:normal;transition:border-color .2s,box-shadow .2s;display:block}._input_kyavx_1:hover:not(:disabled):not(:focus){border-color:var(--muted-foreground)}._input_kyavx_1:focus{box-shadow:0 0 0 1px var(--ring)}._input_kyavx_1:disabled{cursor:not-allowed;opacity:.5;background-color:var(--secondary)}._input_kyavx_1::placeholder{color:var(--muted-foreground);opacity:1}._numberClean_kyavx_39::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}._numberClean_kyavx_39::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}._numberClean_kyavx_39[type=number]{-moz-appearance:textfield}._container_14vsv_1{position:relative}._legend_14vsv_4{color:var(--muted-foreground);background:var(--background);margin-left:8px;padding:0 4px;font-size:12px;position:absolute;top:-9px}._suffix_14vsv_13{color:var(--muted-foreground);pointer-events:none;-webkit-user-select:none;user-select:none;font-size:14px;position:absolute;bottom:2px;right:8px}._group_1e7jm_1{margin-left:4px;display:flex}._save_1e7jm_6{width:36px;color:var(--color-green);border-top-right-radius:0;border-bottom-right-radius:0}._close_1e7jm_13{width:36px;color:var(--color-red);border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}._sliderContainer_1unyb_1{cursor:pointer;touch-action:none;--slider-progress:0%;align-items:center;width:100%;height:24px;display:flex;position:relative}._sliderContainer_1unyb_1._disabled_1unyb_11{pointer-events:none;cursor:not-allowed;opacity:.5}._sliderContainer_1unyb_1:not(._disabled_1unyb_11):hover ._sliderThumb_1unyb_17{transform:translate(-50%,-50%)scale(1.1)}._sliderTrack_1unyb_22{background-color:color-mix(in oklch, var(--muted-foreground) 65%, transparent);border-radius:2px;width:100%;height:2px;position:relative}._sliderRange_1unyb_34{background-color:var(--primary);height:100%;width:var(--slider-progress);border-radius:2px;position:absolute}._sliderThumb_1unyb_17{top:50%;left:var(--slider-progress);background-color:var(--background);border:2px solid var(--primary);pointer-events:none;border-radius:50%;width:12px;height:13px;transition:transform .1s,box-shadow .1s;position:absolute;transform:translate(-50%,-50%)}._sliderTooltip_1unyb_58{top:-40px;left:var(--slider-progress);background-color:var(--foreground);color:var(--background,#000);white-space:nowrap;pointer-events:none;z-index:2;border-radius:4px;padding:7px 10px 8px;font-size:12px;line-height:1;position:absolute;transform:translate(-50%);box-shadow:0 2px 8px #0000001a}._sliderTooltip_1unyb_58:after{content:"";background-color:var(--foreground);width:6px;height:6px;position:absolute;bottom:-2px;left:50%;transform:translate(-50%)rotate(45deg)}._hiddenInput_1unyb_86{opacity:0;cursor:pointer;z-index:1;width:100%;height:100%;margin:0;position:absolute;top:0;left:0}._tooltip_1rdl9_1{position:relative}._container_1rdl9_5{gap:0;display:flex}._container_1rdl9_5[data-position=left],._container_1rdl9_5[data-position=right]{flex-direction:column}._container_1rdl9_5 [data-tooltip]{pointer-events:auto}._popup_1rdl9_19{top:var(--tooltip-y,0px);left:var(--tooltip-x,0px);background-color:var(--foreground);color:var(--background);z-index:999;pointer-events:none;opacity:var(--tooltip-opacity,0);width:var(--tooltip-w,auto);height:var(--tooltip-h,auto);transition:opacity var(--tooltip-fade,.2s);border-radius:4px;font-size:14px;position:absolute;transform:translate(-50%,-100%);box-shadow:0 2px 8px #0000001a}._popup_1rdl9_19:before{content:"";background-color:inherit;width:10px;height:10px;position:absolute;bottom:-3px;left:50%;transform:translate(-50%)rotate(45deg)}._popup_1rdl9_19[data-position=top]{transform:translate(-50%,-100%)}._popup_1rdl9_19[data-position=top]:before{top:auto;bottom:-3px;left:50%;transform:translate(-50%)rotate(45deg)}._popup_1rdl9_19[data-position=bottom]{transform:translate(-50%)}._popup_1rdl9_19[data-position=bottom]:before{top:-3px;bottom:auto;left:50%;transform:translate(-50%)rotate(45deg)}._popup_1rdl9_19[data-position=left]{transform:translate(-100%,-50%)}._popup_1rdl9_19[data-position=left]:before{top:50%;left:auto;right:-3px;transform:translateY(-50%)rotate(45deg)}._popup_1rdl9_19[data-position=right]{transform:translateY(-50%)}._popup_1rdl9_19[data-position=right]:before{top:50%;left:-3px;right:auto;transform:translateY(-50%)rotate(45deg)}._popup_1rdl9_19._animated_1rdl9_92{transition:left var(--tooltip-slide,.4s), top var(--tooltip-slide,.4s), width var(--tooltip-slide,.4s), height var(--tooltip-slide,.4s), opacity var(--tooltip-fade,.2s)}._mask_1rdl9_101{border-radius:inherit;width:100%;height:100%;overflow:hidden}._track_1rdl9_108{width:max-content;height:max-content;transform:translateX(calc(-1 * var(--tooltip-offset,0px)));display:flex}._track_1rdl9_108[data-position=left],._track_1rdl9_108[data-position=right]{transform:translateY(calc(-1 * var(--tooltip-offset,0px)));flex-direction:column}._animated_1rdl9_92 ._track_1rdl9_108{transition:transform var(--tooltip-slide,.4s)}._title_1rdl9_125{min-width:var(--tooltip-item-w,auto);max-width:var(--tooltip-item-w,none);min-height:var(--tooltip-item-h,32px);max-height:var(--tooltip-item-h,none);white-space:nowrap;box-sizing:border-box;flex:none;justify-content:center;align-items:center;padding:0 10px;display:flex}._surfaceTool_1skmt_1{background-color:var(--background);border:var(--surface-border);color:var(--foreground);z-index:9;border-radius:4px;align-items:center;gap:4px;padding:4px;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000001a}._content_1skmt_18{display:flex}._drag_1skmt_22{cursor:move;touch-action:none;-webkit-user-select:none;user-select:none;width:16px;height:16px;padding:0 2px}._tools_4u8qe_1{flex-direction:column}._row1_4u8qe_5{flex-direction:row;align-items:center;gap:4px;padding:4px;display:flex}._min_4u8qe_13{text-align:left;width:30px;font-size:14px}._slider_4u8qe_19{flex:1}._max_4u8qe_23{text-align:right;width:45px;font-size:14px}._row2_4u8qe_29{flex-direction:row;gap:4px;display:flex}._select_4u8qe_35{width:160px}._option_4u8qe_39{width:120px;height:32px}._option_4u8qe_39 img{object-fit:cover;width:100%;height:100%}._active_4u8qe_50{color:var(--accent-blue);background:var(--muted)}._filterInteract_4u8qe_55{max-width:calc(100% - 32px);max-height:calc(100% - 32px);margin:auto;position:absolute;inset:0}._filterInteract_4u8qe_55>div:first-child{width:100%;max-width:100%;height:100%;max-height:100%}._compare_4u8qe_70{width:0;height:100%;position:absolute;top:0;transform:translate(-50%)}._compare_4u8qe_70:before{content:"";background:var(--accent-blue);width:1px;height:100%;position:absolute;top:0;left:-.5px}._compareThumb_4u8qe_88{background:var(--color-white);border:solid 1px var(--accent-blue);width:32px;height:32px;color:var(--accent-blue);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}._compareThumb_4u8qe_88 svg{width:20px;height:20px}._preview_t77n1_1{box-sizing:border-box;max-width:calc(100% - 32px);max-height:calc(100% - 32px);margin:auto;transition:all .2s linear,clip-path;position:absolute;inset:0;overflow:hidden}._preview_t77n1_1._faded_t77n1_13{opacity:.5;filter:blur(2px)}._rotate_t77n1_19{box-sizing:border-box;width:100%;height:100%;transition:all .2s linear;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}._flip_t77n1_31{box-sizing:border-box;transition:all .2s linear;position:absolute;inset:0;overflow:hidden}._image_t77n1_39{max-width:none;max-height:none;transition:all .2s linear,filter;display:block;position:absolute}._label_t77n1_49{background:var(--color-white-fade);box-sizing:border-box;text-transform:uppercase;letter-spacing:1px;width:80px;height:28px;color:var(--color-black);z-index:3;justify-content:center;align-items:center;font-size:12px;font-weight:600;display:flex;position:absolute;top:8px}._before_t77n1_67{left:8px}._after_t77n1_71{right:8px}._header_m05h6_1{box-sizing:border-box;background-color:var(--background);border-bottom:1px solid var(--border);grid-area:header;justify-content:space-between;align-items:center;height:48px;padding:0 8px;display:flex}._left_m05h6_12{align-items:center;gap:0;display:flex}._sidebarToggle_m05h6_17{border-right:solid 1px var(--border);width:48px;height:48px;color:var(--foreground);cursor:pointer;justify-content:center;align-items:center;transition:all .2s;display:none;position:relative;left:-8px}._sidebarToggle_m05h6_17._mobile_m05h6_30{display:flex}._sidebarIcon_m05h6_34{stroke-width:1.6px;width:18px;height:18px}._tools_m05h6_39{gap:8px;display:flex}._history_m05h6_43{align-items:center;gap:6px;display:flex}._historyText_m05h6_48{color:var(--muted-foreground);font-size:14px;font-family:var(--font-mono)}._sidebar_1lx29_1{background:var(--background-fade);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-right:1px solid var(--border);z-index:10;grid-area:sidebar;width:48px;position:relative}._sidebar_1lx29_1._mobile_1lx29_10{transition:transform .2s ease-out;transform:translate(-110%);box-shadow:0 2px 8px #0000001a}._sidebar_1lx29_1._mobile_1lx29_10._open_1lx29_15{transform:translate(0%)}._wrapper_1lx29_20{flex-direction:column;display:flex}._item_1lx29_24{cursor:pointer;height:48px;color:var(--foreground);justify-content:center;align-items:center;transition:all .2s;display:flex;position:relative}._item_1lx29_24 svg{width:16px;height:16px}._item_1lx29_24:hover{background-color:var(--accent)}._item_1lx29_24._selected_1lx29_43{color:var(--accent-blue);background-color:var(--accent)}._item_1lx29_24._selected_1lx29_43:before{content:"";background-color:var(--accent-blue);width:2px;position:absolute;top:0;bottom:0;left:0}._infobar_1kq0f_1{background:var(--muted);border-top:solid 1px var(--border);font-family:var(--font-mono);color:var(--foreground);grid-area:infobar;justify-content:space-between;align-items:center;padding:0 16px;font-size:14px;display:flex}._resize_1sbig_1{align-items:center;padding-top:16px}._toolsLock_1sbig_5{width:12px;height:12px;color:var(--muted-foreground)}._indicatorWrapper_1sbig_10{justify-content:center;width:100%;height:2px;display:flex;position:absolute;top:0;left:0}._indicator_1sbig_10{background:var(--accent-blue);opacity:.6;border-radius:2px;width:30%;height:100%;transition:width .2s}._wrapper_1co2u_1{box-sizing:border-box;max-width:calc(100% - 32px);max-height:calc(100% - 32px);margin:auto;position:absolute;inset:0}._box_1co2u_9{cursor:move;box-sizing:border-box;-webkit-user-select:none;user-select:none;touch-action:none;border:1px solid var(--color-white-fade);position:absolute}._toolsInfo_1co2u_18{-webkit-user-select:none;user-select:none;min-width:54px;margin-top:-2px;display:inline-block}._toolsInfoLabel_1co2u_25{color:var(--muted-foreground);font-size:12px;line-height:12px}._toolsInfoValue_1co2u_30{color:var(--foreground);font-size:14px;line-height:14px}._linesBox_1co2u_35{pointer-events:none;position:absolute;inset:1px}._line_1co2u_35{border:1px dashed var(--color-white);opacity:.5;position:absolute}._lineV_1co2u_45{border-top:0;border-bottom:0;width:33%;height:100%;top:0;left:33%}._lineH_1co2u_53{border-left:0;border-right:0;width:100%;height:33%;top:33%;left:0}._pointer_1co2u_61{box-sizing:border-box;width:14px;height:14px;position:absolute}._pointerTopLeft_1co2u_67{border-top:3px solid var(--accent-blue);border-left:3px solid var(--accent-blue);cursor:nwse-resize;top:-6px;left:-6px}._pointerTopRight_1co2u_74{border-top:3px solid var(--accent-blue);border-right:3px solid var(--accent-blue);cursor:nesw-resize;top:-6px;right:-6px}._pointerBottomRight_1co2u_81{border-bottom:3px solid var(--accent-blue);border-right:3px solid var(--accent-blue);cursor:nwse-resize;bottom:-6px;right:-6px}._pointerBottomLeft_1co2u_88{border-bottom:3px solid var(--accent-blue);border-left:3px solid var(--accent-blue);cursor:nesw-resize;bottom:-6px;left:-6px}._mobileBorder_1co2u_95{box-sizing:border-box;border:2px solid var(--accent-blue);position:absolute;inset:0}._mobilePointer_1co2u_101{background-color:var(--overlay-bg-white);border:3px solid var(--accent-blue);box-sizing:border-box;border-radius:50%;width:32px;height:32px;position:absolute;bottom:-16px;right:-16px}._info_1co2u_112{height:16px;font-family:var(--font-mono);color:#000;background-color:var(--color-white-fade);box-sizing:border-box;align-items:center;padding:0 6px;font-size:12px;display:flex;position:absolute}._info_1co2u_112 b{font-weight:600;transform:translateY(1px)}._infoX_1co2u_129{border-left:solid 2px var(--accent-blue);top:-12px;left:16px}._infoY_1co2u_134{transform-origin:100%;border-right:solid 2px var(--accent-blue);top:8px;right:calc(100% + 4px);transform:rotate(-90deg)}._infoW_1co2u_141{border-right:solid 2px var(--accent-blue);bottom:-12px;right:16px}._infoH_1co2u_146{transform-origin:0%;border-left:solid 2px var(--accent-blue);bottom:8px;left:calc(100% + 4px);transform:rotate(-90deg)}._group_1co2u_153{flex-shrink:0;width:max-content;display:flex}._group_1co2u_153 button{color:var(--foreground);border-radius:0}._group_1co2u_153 button._active_1co2u_162{color:var(--accent-blue);background:var(--muted)}._group_1co2u_153 button:not(:first-child){margin-left:-1px}._group_1co2u_153 button:first-child{border-top-left-radius:4px;border-bottom-left-radius:4px}._group_1co2u_153 button:last-child{border-top-right-radius:4px;border-bottom-right-radius:4px}._select_1ieak_1{width:220px}._btnH_15adi_1{border-top-right-radius:0;border-bottom-right-radius:0;width:36px}._btnV_15adi_7{border-top-left-radius:0;border-bottom-left-radius:0;width:36px;margin-left:-1px}._frame_17rae_1{box-sizing:border-box;background:var(--background);grid-area:frame;width:100%;height:100%;margin:0 auto;position:relative;overflow:hidden}._bg-circled_17rae_12{background:radial-gradient(50% 50% at 100% 0, var(--background) 0% 5%, var(--muted) 6% 15%, var(--background) 16% 25%, var(--muted) 26% 35%, var(--background) 36% 45%, var(--muted) 46% 55%, var(--background) 56% 65%, var(--muted) 66% 75%, var(--background) 76% 85%, var(--muted) 86% 95%, #0000 96%), radial-gradient(50% 50% at 0 100%, var(--background) 0% 5%, var(--muted) 6% 15%, var(--background) 16% 25%, var(--muted) 26% 35%, var(--background) 36% 45%, var(--muted) 46% 55%, var(--background) 56% 65%, var(--muted) 66% 75%, var(--background) 76% 85%, var(--muted) 86% 95%, #0000 96%), radial-gradient(50% 50%, var(--background) 0% 5%, var(--muted) 6% 15%, var(--background) 16% 25%, var(--muted) 26% 35%, var(--background) 36% 45%, var(--muted) 46% 55%, var(--background) 56% 65%, var(--muted) 66% 75%, var(--background) 76% 85%, var(--muted) 86% 95%, #0000 96%), radial-gradient(50% 50%, var(--background) 0% 5%, var(--muted) 6% 15%, var(--background) 16% 25%, var(--muted) 26% 35%, var(--background) 36% 45%, var(--muted) 46% 55%, var(--background) 56% 65%, var(--muted) 66% 75%, var(--background) 76% 85%, var(--muted) 86% 95%, #0000 96%) calc(48px / 2) calc(48px / 2) var(--background);background-size:48px 48px}._bg-diagonals_17rae_74{background:linear-gradient(45deg, var(--muted) 12.5%, var(--background) 0 25%, #0000 0 75%, var(--background) 0 87.5%, var(--muted) 0) calc(55px / 2) calc(55px / 2), linear-gradient(45deg, var(--background) 12.5%, var(--muted) 0 25%, #0000 0 75%, var(--muted) 0 87.5%, var(--background) 0), repeating-linear-gradient(-45deg, var(--muted) 0 12.5%, var(--background) 0 25%, var(--muted) 0 37.5%, var(--background) 0 62.5%);background-size:55px 55px}._bg-rhombus_17rae_103{background:repeating-linear-gradient(45deg, #0000 calc(-650% / 13) calc(50% / 13), var(--muted) 0 calc(100% / 13), #0000 0 calc(150% / 13), var(--muted) 0 calc(200% / 13), #0000 0 calc(250% / 13), var(--muted) 0 calc(300% / 13)), repeating-linear-gradient(45deg, #0000 calc(-650% / 13) calc(50% / 13), var(--muted) 0 calc(100% / 13), #0000 0 calc(150% / 13), var(--muted) 0 calc(200% / 13), #0000 0 calc(250% / 13), var(--muted) 0 calc(300% / 13)) 36px 36px, repeating-linear-gradient(-45deg, #0000 calc(-650% / 13) calc(50% / 13), var(--muted) 0 calc(100% / 13), #0000 0 calc(150% / 13), var(--muted) 0 calc(200% / 13), #0000 0 calc(250% / 13), var(--muted) 0 calc(300% / 13)), repeating-linear-gradient(-45deg, #0000 calc(-650% / 13) calc(50% / 13), var(--muted) 0 calc(100% / 13), #0000 0 calc(150% / 13), var(--muted) 0 calc(200% / 13), #0000 0 calc(250% / 13), var(--muted) 0 calc(300% / 13)) 36px 36px var(--background);background-size:72px 72px}/*$vite$:1*/`)),document.head.appendChild(e)}}catch(e){console.error(`vite-plugin-css-injected-by-js`,e)}})();
2
+ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("react/jsx-runtime")):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.Pixedi={},e.React,e.ReactJSXRuntime))})(this,function(e,t,n){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var r=Object.create,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,s=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,l=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var s=o(t),l=0,u=s.length,d;l<u;l++)d=s[l],!c.call(e,d)&&d!==n&&i(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=a(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:r(s(e)),l(t||!e||!e.__esModule?i(n,`default`,{value:e,enumerable:!0}):n,e)))(t,1);var u=1920,d=.85,f=[{label:`Facebook`,value:`facebook`,options:[{value:`facebook-post`,label:`Post`,w:1200,h:630,rightLabel:`1200 x 630`},{value:`facebook-cover`,label:`Cover`,w:851,h:315,rightLabel:`851 x 315`},{value:`facebook-profile`,label:`Profile`,w:170,h:170,rightLabel:`170 x 170`},{value:`facebook-story`,label:`Story`,w:1080,h:1920,rightLabel:`1080 x 1920`}]},{label:`Instagram`,value:`instagram`,options:[{value:`instagram-landscape`,label:`Landscape`,w:1080,h:566,rightLabel:`1080 x 566`},{value:`instagram-portait`,label:`Portait`,w:1080,h:1350,rightLabel:`1080 x 1350`},{value:`instagram-square`,label:`Square`,w:1080,h:1080,rightLabel:`1080 x 1080`},{value:`instagram-story`,label:`Story`,w:1080,h:1920,rightLabel:`1080 x 1920`},{value:`instagram-thumbnail`,label:`Thumbnail`,w:161,h:161,rightLabel:`161 x 161`}]},{label:`LinkedIn`,value:`linkedin`,options:[{value:`linkedin-blog-post`,label:`Blog Post`,w:1200,h:627,rightLabel:`1200 x 627`},{value:`linkedin-cover`,label:`Cover`,w:1128,h:191,rightLabel:`1128 x 191`},{value:`linkedin-profile`,label:`Profile`,w:400,h:400,rightLabel:`400 x 400`}]}],p=[{value:`saturate`,label:`Saturate`,min:0,max:200,step:1,unit:`%`,sliderValue:100,rightLabel:`100%`},{value:`grayscale`,label:`Grayscale`,min:0,max:100,step:1,unit:`%`,sliderValue:0,rightLabel:`0%`},{value:`sepia`,label:`Sepia`,min:0,max:100,step:1,unit:`%`,sliderValue:0,rightLabel:`0%`},{value:`invert`,label:`Invert`,min:0,max:100,step:1,unit:`%`,sliderValue:0,rightLabel:`0%`},{value:`hueRotate`,label:`Hue Rotate`,min:0,max:360,step:1,unit:`°`,sliderValue:0,rightLabel:`0°`},{value:`brightness`,label:`Brightness`,min:0,max:200,step:1,unit:`%`,sliderValue:100,rightLabel:`100%`},{value:`contrast`,label:`Contrast`,min:0,max:200,step:1,unit:`%`,sliderValue:100,rightLabel:`100%`}],m=[{value:`vintage`,label:`Vintage`},{value:`olive-army`,label:`Olive Army`},{value:`warm-sunset`,label:`Warm Sunset`},{value:`sin-city-red`,label:`Sin City Red`},{value:`plastic-wrap`,label:`Plastic Wrap`},{value:`cross-process`,label:`Cross-Processing`},{value:`crt-lines`,label:`CRT Monitor`},{value:`grain`,label:`Grain / Noise`},{value:`emboss`,label:`Emboss Effect`},{value:`x-ray`,label:`X-Ray`}],h={xmlns:`http://w3.org`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`},g=e=>(0,n.jsx)(`svg`,{...h,...e,children:(0,n.jsx)(`path`,{d:`M20 6 9 17l-5-5`})}),_=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M18 6 6 18`}),(0,n.jsx)(`path`,{d:`m6 6 12 12`})]}),v=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`rect`,{width:`18`,height:`11`,x:`3`,y:`11`,rx:`2`,ry:`2`}),(0,n.jsx)(`path`,{d:`M7 11V7a5 5 0 0 1 10 0v4`})]}),y=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`m12 19-7-7 7-7`}),(0,n.jsx)(`path`,{d:`M19 12H5`})]}),b=e=>(0,n.jsx)(`svg`,{...h,...e,children:(0,n.jsx)(`path`,{d:`m6 9 6 6 6-6`})}),x=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M3 7v6h6`}),(0,n.jsx)(`path`,{d:`M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13`})]}),S=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M21 7v6h-6`}),(0,n.jsx)(`path`,{d:`M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7`})]}),C=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M6 2v14a2 2 0 0 0 2 2h14`}),(0,n.jsx)(`path`,{d:`M18 22V8a2 2 0 0 0-2-2H2`})]}),w=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`}),(0,n.jsx)(`circle`,{cx:`9`,cy:`9`,r:`2`}),(0,n.jsx)(`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`})]}),T=e=>(0,n.jsx)(`svg`,{...h,...e,children:(0,n.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`})}),E=e=>(0,n.jsx)(`svg`,{...h,...e,children:(0,n.jsx)(`rect`,{width:`20`,height:`12`,x:`2`,y:`6`,rx:`2`})}),ee=e=>(0,n.jsx)(`svg`,{...h,...e,children:(0,n.jsx)(`rect`,{width:`20`,height:`15`,x:`2`,y:`4.5`,rx:`2`})}),D=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M3 7V5a2 2 0 0 1 2-2h2`}),(0,n.jsx)(`path`,{d:`M17 3h2a2 2 0 0 1 2 2v2`}),(0,n.jsx)(`path`,{d:`M21 17v2a2 2 0 0 1-2 2h-2`}),(0,n.jsx)(`path`,{d:`M7 21H5a2 2 0 0 1-2-2v-2`}),(0,n.jsx)(`rect`,{width:`10`,height:`8`,x:`7`,y:`8`,rx:`1`})]}),te=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M8 3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h3`}),(0,n.jsx)(`path`,{d:`M16 3h3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-3`}),(0,n.jsx)(`path`,{d:`M12 20v2`}),(0,n.jsx)(`path`,{d:`M12 14v2`}),(0,n.jsx)(`path`,{d:`M12 8v2`}),(0,n.jsx)(`path`,{d:`M12 2v2`})]}),ne=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M21 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3`}),(0,n.jsx)(`path`,{d:`M21 16v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3`}),(0,n.jsx)(`path`,{d:`M4 12H2`}),(0,n.jsx)(`path`,{d:`M10 12H8`}),(0,n.jsx)(`path`,{d:`M16 12h-2`}),(0,n.jsx)(`path`,{d:`M22 12h-2`})]}),re=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8`}),(0,n.jsx)(`path`,{d:`M21 3v5h-5`})]}),ie=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}),(0,n.jsx)(`path`,{d:`M3 3v5h5`})]}),ae=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`rect`,{width:`7`,height:`7`,x:`3`,y:`3`,rx:`1`}),(0,n.jsx)(`rect`,{width:`7`,height:`7`,x:`3`,y:`14`,rx:`1`}),(0,n.jsx)(`path`,{d:`M14 4h7`}),(0,n.jsx)(`path`,{d:`M14 9h7`}),(0,n.jsx)(`path`,{d:`M14 15h7`}),(0,n.jsx)(`path`,{d:`M14 20h7`})]}),oe=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M10 5H3`}),(0,n.jsx)(`path`,{d:`M12 19H3`}),(0,n.jsx)(`path`,{d:`M14 3v4`}),(0,n.jsx)(`path`,{d:`M16 17v4`}),(0,n.jsx)(`path`,{d:`M21 12h-9`}),(0,n.jsx)(`path`,{d:`M21 19h-5`}),(0,n.jsx)(`path`,{d:`M21 5h-7`}),(0,n.jsx)(`path`,{d:`M8 10v4`}),(0,n.jsx)(`path`,{d:`M8 12H3`})]}),se=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}),(0,n.jsx)(`path`,{d:`M9 3v18`}),(0,n.jsx)(`path`,{d:`m14 9 3 3-3 3`})]}),ce=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}),(0,n.jsx)(`path`,{d:`M9 3v18`}),(0,n.jsx)(`path`,{d:`m16 15-3-3 3-3`})]}),le=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M15 4V2`}),(0,n.jsx)(`path`,{d:`M15 16v-2`}),(0,n.jsx)(`path`,{d:`M8 9h2`}),(0,n.jsx)(`path`,{d:`M20 9h2`}),(0,n.jsx)(`path`,{d:`M17.8 11.8 19 13`}),(0,n.jsx)(`path`,{d:`M15 9h.01`}),(0,n.jsx)(`path`,{d:`M17.8 6.2 19 5`}),(0,n.jsx)(`path`,{d:`m3 21 9-9`}),(0,n.jsx)(`path`,{d:`M12.2 6.2 11 5`})]}),ue=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`path`,{d:`M12 3v18`}),(0,n.jsx)(`path`,{d:`m16 16 4-4-4-4`}),(0,n.jsx)(`path`,{d:`m8 8-4 4 4 4`})]}),de=e=>(0,n.jsxs)(`svg`,{...h,...e,children:[(0,n.jsx)(`circle`,{cx:`9`,cy:`12`,r:`1`}),(0,n.jsx)(`circle`,{cx:`9`,cy:`5`,r:`1`}),(0,n.jsx)(`circle`,{cx:`9`,cy:`19`,r:`1`}),(0,n.jsx)(`circle`,{cx:`15`,cy:`12`,r:`1`}),(0,n.jsx)(`circle`,{cx:`15`,cy:`5`,r:`1`}),(0,n.jsx)(`circle`,{cx:`15`,cy:`19`,r:`1`})]}),fe=e=>(0,n.jsx)(`svg`,{...h,...e,children:(0,n.jsx)(`path`,{d:`M21 12a9 9 0 1 1-6.219-8.56`,children:(0,n.jsx)(`animateTransform`,{attributeType:`xml`,attributeName:`transform`,type:`rotate`,from:`0 12 12`,to:`360 12 12`,dur:`0.8s`,repeatCount:`indefinite`})})}),O={button:`_button_1vpzl_1`,default:`_default_1vpzl_35`,outline:`_outline_1vpzl_44`,ghost:`_ghost_1vpzl_54`,rect:`_rect_1vpzl_63`},k=({className:e=``,variant:t=`default`,children:r,ref:i,...a})=>(0,n.jsx)(`button`,{ref:i,className:`${O.button} ${O[t]} ${e}`.trim(),...a,children:r}),pe={separator:`_separator_gp8ff_1`},me=(0,t.forwardRef)(({className:e=``,orientation:t=`horizontal`,...r},i)=>(0,n.jsx)(`hr`,{ref:i,role:`separator`,"aria-orientation":t,"data-orientation":t,className:`${pe.separator} ${e}`.trim(),...r}));me.displayName=`Separator`;var A={wrapper:`_wrapper_1aw0m_1`,trigger:`_trigger_1aw0m_6`,triggerArrow:`_triggerArrow_1aw0m_31`,content:`_content_1aw0m_40`,groupLabel:`_groupLabel_1aw0m_74`,item:`_item_1aw0m_81`,itemLeft:`_itemLeft_1aw0m_98`,itemAddon:`_itemAddon_1aw0m_102`,itemRightContainer:`_itemRightContainer_1aw0m_122`,itemRight:`_itemRight_1aw0m_122`,itemCheck:`_itemCheck_1aw0m_131`},j={root:`_root_c6inw_8`,textRed:`_textRed_c6inw_78`,bgRed:`_bgRed_c6inw_81`,bgGreen:`_bgGreen_c6inw_84`,textGreen:`_textGreen_c6inw_87`,mask:`_mask_c6inw_90`,semibold:`_semibold_c6inw_93`,bold:`_bold_c6inw_97`,system:`_system_c6inw_101`,wrapper:`_wrapper_c6inw_111`,grid:`_grid_c6inw_118`,mobile:`_mobile_c6inw_130`,gridNoInfobar:`_gridNoInfobar_c6inw_134`,gridSingleTool:`_gridSingleTool_c6inw_149`},he=e=>{let t=0,n=window.innerHeight;for(let r=e.parentElement;r;r=r.parentElement){let{overflow:e,overflowY:i}=getComputedStyle(r);if(e===`visible`&&i===`visible`)continue;let a=r.getBoundingClientRect();t=Math.max(t,a.top),n=Math.min(n,a.bottom)}return{top:t,bottom:n}},ge=({items:e,value:n,onChange:r})=>{let[i,a]=(0,t.useState)(!1),o=(0,t.useRef)(null),s=(0,t.useRef)(null),c=(0,t.useRef)(null),l=(0,t.useMemo)(()=>{let t=e=>e.reduce((e,n)=>n.options?[...e,...t(n.options.map(e=>({...e,fullName:`${n.label} ${e.label}`})))]:[...e,n],[]);return t(e)},[e]).find(e=>e.value===n),u=l?.fullName??l?.label;return(0,t.useEffect)(()=>{let e=e=>{o.current&&!e.composedPath().includes(o.current)&&a(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]),(0,t.useLayoutEffect)(()=>{let e=o.current,t=s.current,n=c.current;if(!i||!e||!t||!n)return;n.style.removeProperty(`top`),n.style.removeProperty(`max-height`);let{top:r,bottom:a}=he(e),l=e.getBoundingClientRect().top,u=t.getBoundingClientRect(),d=n.offsetHeight,f=a-8-u.bottom-4,p=u.top-4-r-8,m=u.bottom+4,h=0;d>f&&(d<=p?m=u.top-4-d:p>f?(h=Math.max(p,0),m=u.top-4-h):h=Math.max(f,0)),h&&(n.style.maxHeight=`${h}px`),n.style.top=`${m-l}px`},[i,e]),{isOpen:i,selectedLabel:u,containerRef:o,triggerRef:s,contentRef:c,handleSelectItem:e=>{r(e),a(!1)},toggleOpen:()=>a(e=>!e)}},_e=({items:e,value:t,onChange:r,placeholder:i=`Select an option`,className:a=``,renderOption:o})=>{let{isOpen:s,selectedLabel:c,containerRef:l,triggerRef:u,contentRef:d,handleSelectItem:f,toggleOpen:p}=ge({items:e,value:t,onChange:r});return(0,n.jsxs)(`div`,{ref:l,className:`${A.wrapper} ${a}`.trim(),"data-state":s?`open`:`closed`,children:[(0,n.jsxs)(`button`,{ref:u,type:`button`,className:A.trigger,onClick:p,children:[(0,n.jsx)(`span`,{children:c??i}),(0,n.jsx)(b,{className:A.triggerArrow})]}),(0,n.jsx)(`div`,{ref:d,className:A.content,children:e.map((e,r)=>e.options?(0,n.jsxs)(`div`,{children:[(0,n.jsx)(`div`,{className:`${A.groupLabel} ${j.semibold}`,children:e.label}),e.options.map(e=>(0,n.jsxs)(`div`,{className:A.item,onClick:()=>f(e.value),children:[o?o(e):(0,n.jsx)(`span`,{className:A.itemLeft,children:e.label}),(0,n.jsxs)(`div`,{className:A.itemAddon,children:[e.rightLabel&&(0,n.jsx)(`span`,{children:e.rightLabel}),t===e.value&&(0,n.jsx)(g,{className:A.itemCheck}),t!==e.value&&(0,n.jsx)(`b`,{})]})]},e.value))]},`group-${r}`):(0,n.jsxs)(`div`,{className:A.item,onClick:()=>f(e.value),children:[o?o(e):(0,n.jsx)(`span`,{className:A.itemLeft,children:e.label}),(0,n.jsxs)(`div`,{className:A.itemAddon,children:[e.rightLabel&&(0,n.jsx)(`span`,{children:e.rightLabel}),t===e.value&&(0,n.jsx)(g,{className:A.itemCheck}),t!==e.value&&(0,n.jsx)(`b`,{})]})]},e.value))})]})},ve={input:`_input_kyavx_1`,numberClean:`_numberClean_kyavx_39`},ye=({className:e=``,type:t=`text`,hideArrows:r=!0,ref:i,...a})=>{let o=t===`number`&&r?ve.numberClean:``;return(0,n.jsx)(`input`,{ref:i,type:t,className:`${ve.input} ${o} ${e}`.trim(),...a})},be={container:`_container_14vsv_1`,legend:`_legend_14vsv_4`,suffix:`_suffix_14vsv_13`},xe=({label:e,className:t=``,style:r,ref:i,...a})=>(0,n.jsxs)(`div`,{className:`${be.container} ${t}`.trim(),style:r,children:[(0,n.jsx)(`span`,{className:be.legend,children:e}),(0,n.jsx)(ye,{ref:i,type:`number`,...a}),(0,n.jsx)(`span`,{className:be.suffix,children:`px`})]}),Se={group:`_group_1e7jm_1`,save:`_save_1e7jm_6`,close:`_close_1e7jm_13`},M=({onSave:e,onClose:t,saving:r=!1,disabled:i=!1})=>(0,n.jsxs)(`div`,{className:Se.group,children:[(0,n.jsx)(k,{variant:`outline`,className:Se.save,"aria-label":`Save`,disabled:i||r,onClick:e,children:r?(0,n.jsx)(fe,{}):(0,n.jsx)(g,{})}),(0,n.jsx)(k,{variant:`outline`,className:Se.close,"aria-label":`Close`,disabled:r,onClick:t,children:(0,n.jsx)(_,{})})]}),N={sliderContainer:`_sliderContainer_1unyb_1`,disabled:`_disabled_1unyb_11`,sliderThumb:`_sliderThumb_1unyb_17`,sliderTrack:`_sliderTrack_1unyb_22`,sliderRange:`_sliderRange_1unyb_34`,sliderTooltip:`_sliderTooltip_1unyb_58`,hiddenInput:`_hiddenInput_1unyb_86`},Ce=(e,t,n)=>{let r=n-t;return r<=0?0:(e-t)/r*100},we=new Set([`ArrowDown`,`ArrowLeft`,`ArrowRight`,`ArrowUp`,`End`,`Home`,`PageDown`,`PageUp`]),Te=({min:e,max:r,value:i,step:a=1,disabled:o=!1,isTooltip:s=!1,unit:c=``,className:l,onChange:u,onInput:d,ref:f})=>{let p=(0,t.useRef)(null),m=(0,t.useRef)(null),h=i??e,[g,_]=(0,t.useState)(h);(0,t.useImperativeHandle)(f,()=>({getValue:()=>g}),[g]);let v=t=>{_(t);let n=Ce(t,e,r);p.current?.style.setProperty(`--slider-progress`,`${n}%`)},y=()=>{!o&&m.current&&u?.(Number(m.current.value))};return(0,t.useLayoutEffect)(()=>{if(!m.current)return;i!==void 0&&(m.current.value=String(i));let t=Number(m.current.value);_(t);let n=Ce(t,e,r);p.current?.style.setProperty(`--slider-progress`,`${n}%`)},[i,e,r]),(0,n.jsxs)(`div`,{ref:p,className:`${N.sliderContainer} ${o?N.disabled:``} ${l||``}`,style:{"--slider-progress":`${Ce(h,e,r)}%`},children:[(0,n.jsxs)(`div`,{className:N.sliderTrack,children:[(0,n.jsx)(`div`,{className:N.sliderRange}),(0,n.jsx)(`div`,{className:N.sliderThumb}),s&&(0,n.jsx)(`div`,{className:N.sliderTooltip,children:`${g}${c}`})]}),(0,n.jsx)(`input`,{ref:m,type:`range`,min:e,max:r,step:a,defaultValue:h,disabled:o,onInput:e=>{let t=Number(e.currentTarget.value);v(t),d?.(t)},onPointerUp:()=>{y()},onKeyUp:e=>{we.has(e.key)&&y()},className:N.hiddenInput})]})},P={tooltip:`_tooltip_1rdl9_1`,container:`_container_1rdl9_5`,popup:`_popup_1rdl9_19`,animated:`_animated_1rdl9_92`,mask:`_mask_1rdl9_101`,track:`_track_1rdl9_108`,title:`_title_1rdl9_125`},Ee=(e,n=`top`)=>{let[r,i]=(0,t.useState)(null),[a,o]=(0,t.useState)(null),[s,c]=(0,t.useState)(!1),[l,u]=(0,t.useState)(!1),[d,f]=(0,t.useState)([]),p=(0,t.useRef)(null),m=(0,t.useRef)(null),h=(0,t.useRef)([]),g=n===`left`||n===`right`,_=(0,t.useMemo)(()=>{let n=[];return t.Children.forEach(e,e=>{if((0,t.isValidElement)(e)){let{"data-tooltip":t}=e.props;t&&n.push(t)}}),n},[e]),v=_.join(`\0`),y=_.length;(0,t.useLayoutEffect)(()=>{let e=()=>{let e=h.current.slice(0,y).map(e=>({w:e?.offsetWidth??0,h:e?.offsetHeight??0}));f(t=>t.length===e.length&&t.every((t,n)=>t.w===e[n].w&&t.h===e[n].h)?t:e)};e();let t=m.current;if(!t||typeof ResizeObserver>`u`)return;let n=new ResizeObserver(e);return n.observe(t),()=>n.disconnect()},[v,y]),(0,t.useEffect)(()=>{if(!s||l)return;let e=0,t=requestAnimationFrame(()=>{e=requestAnimationFrame(()=>u(!0))});return()=>{cancelAnimationFrame(t),cancelAnimationFrame(e)}},[s,l]);let b=e=>{let t=e.target.closest(`[data-tooltip]`);if(!t){c(!1);return}let a=t.parentElement;if(!a)return;let l=Array.from(a.children).indexOf(t);if(l===-1||s&&l===r)return;let d=p.current?.getBoundingClientRect();if(!d)return;let f=t.getBoundingClientRect(),m=g?{x:n===`left`?f.left-d.left-4:f.right-d.left+4,y:f.top-d.top+f.height/2}:{x:f.left-d.left+f.width/2,y:n===`top`?f.top-d.top-8:f.bottom-d.top+8};s||u(!1),o(m),i(l),c(!0)},x=()=>c(!1),S=r??0,C=d[S],w=d.slice(0,S).reduce((e,t)=>e+(g?t.h:t.w),0);return{containerRef:p,trackRef:m,titleRefs:h,titles:_,position:n,isVisible:s,isAnimated:l,cssVars:{"--tooltip-x":a?`${a.x}px`:`0px`,"--tooltip-y":a?`${a.y}px`:`0px`,"--tooltip-opacity":s?`1`:`0`,"--tooltip-w":C?.w?`${C.w}px`:`auto`,"--tooltip-h":C?.h?`${C.h}px`:`auto`,"--tooltip-offset":`${w}px`},handleMouseMove:b,handleMouseLeave:x}},F=({children:e,position:t=`top`,className:r=``,classNameTitle:i=``,style:a})=>{let{containerRef:o,trackRef:s,titleRefs:c,titles:l,isAnimated:u,cssVars:d,handleMouseMove:f,handleMouseLeave:p}=Ee(e,t);return(0,n.jsxs)(`div`,{ref:o,onMouseMove:f,onMouseLeave:p,onBlur:p,className:P.tooltip,style:{...d,...a},children:[(0,n.jsx)(`div`,{"data-position":t,className:`${P.container} ${r}`,children:e}),(0,n.jsx)(`div`,{"aria-hidden":`true`,"data-position":t,className:`${P.popup} ${u?P.animated:``}`,children:(0,n.jsx)(`div`,{className:P.mask,children:(0,n.jsx)(`div`,{ref:s,"data-position":t,className:P.track,children:l.map((e,t)=>(0,n.jsx)(`div`,{ref:e=>{c.current[t]=e},className:`${P.title} ${i}`,children:e},t))})})})]})},De="(function(){let e=async e=>{let{width:t,height:n}=e,r=Math.min(1,1920/Math.max(t,n)),i=Math.round(t*r),a=Math.round(n*r),o=new OffscreenCanvas(i,a),s=o.getContext(`2d`);if(!s)throw Error(`Failed to get 2D context for preview canvas`);return s.drawImage(e,0,0,i,a),o.convertToBlob({type:`image/webp`,quality:.85})};function t(e){let t=new OffscreenCanvas(e.width,e.height),n=t.getContext(`2d`);if(!n)throw Error(`Failed to create 2D context for canvas.`);n.drawImage(e,0,0);try{let e=n.getImageData(0,0,t.width,t.height).data;for(let t=3;t<e.length;t+=4)if(e[t]<255)return!0;return!1}catch(e){throw Error(`Error reading pixels: ${e}`,{cause:e})}}self.onmessage=async n=>{let r=``;try{let i;if(n.data instanceof Blob)i=n.data;else{let e=n.data.trim();!e.startsWith(`http://`)&&!e.startsWith(`https://`)&&!e.startsWith(`blob:`)&&!e.startsWith(`data:`)&&(r=`image/png`,e=`data:${r};base64,${e}`);let t=await fetch(e);if(!t.ok)throw Error(`HTTP error! Status: ${t.status}`);i=await t.blob()}let a=i.type||r||`image/unknown`,o=await createImageBitmap(i),{width:s,height:c}=o,l=await e(o),u=t(o);o.close(),self.postMessage({success:!0,originalBlob:i,previewBlob:l,mimeType:a,width:s,height:c,isAlpha:u})}catch(e){self.postMessage({success:!1,error:e instanceof Error?e.message:`An error occurred during image loader worker execution.`})}}})();",Oe=typeof self<`u`&&self.Blob&&new Blob([`(self.URL || self.webkitURL).revokeObjectURL(self.location.href);`,De],{type:`text/javascript;charset=utf-8`});function ke(e){let t;try{if(t=Oe&&(self.URL||self.webkitURL).createObjectURL(Oe),!t)throw``;let n=new Worker(t,{name:e?.name});return n.addEventListener(`error`,()=>{(self.URL||self.webkitURL).revokeObjectURL(t)}),n}catch{return new Worker(`data:text/javascript;charset=utf-8,`+encodeURIComponent(De),{name:e?.name})}}var Ae=({src:e,skip:n=!1})=>{let[r,i]=(0,t.useState)({loading:!n,error:``,width:0,height:0,mimeType:``,originalBlob:null,previewUrl:``,isAlpha:!1}),a=(0,t.useRef)(null);return(0,t.useEffect)(()=>{if(!e||n)return;let t=new ke;return t.postMessage(e),t.onmessage=e=>{let t=e.data;t.success?(a.current&&URL.revokeObjectURL(a.current),a.current=URL.createObjectURL(t.previewBlob),i({loading:!1,error:``,mimeType:t.mimeType,width:t.width,height:t.height,originalBlob:t.originalBlob,previewUrl:a.current,isAlpha:t.isAlpha})):i(e=>({...e,loading:!1,error:t.error||`Error processing image.`}))},()=>{t.terminate(),a.current&&=(URL.revokeObjectURL(a.current),null)}},[n,e]),r},je=()=>{if(typeof window>`u`||!window.navigator)return null;let e=window.navigator.userAgent.toLowerCase();return/android/.test(e)?`android`:/iphone|ipad|ipod/.test(e)?`ios`:/windows phone/.test(e)?`windows-phone`:/blackberry|bb10/.test(e)?`blackberry`:/opera mini/.test(e)?`opera-mini`:/mobile/.test(e)?`mobile`:null},I=()=>{let[e]=(0,t.useState)(()=>je());return e},Me={sm:480,md:768,lg:1024,xl:1280},L={INITIAL:`initial`,RESIZE:`resize`,CROP:`crop`,PRESET_CROP:`presetCrop`,FLIP:`flip`,ROTATE:`rotate`,FILTERS:`filters`};function Ne(e,n){let[r,i]=(0,t.useState)(!0);return(0,t.useEffect)(()=>{if(!n)return;let t=new ResizeObserver(([t])=>{t&&i(t.contentRect.width<Me[e])});return t.observe(n),()=>t.disconnect()},[e,n]),r}var Pe=(0,t.createContext)(void 0),R=()=>{let e=(0,t.useContext)(Pe);if(!e)throw Error(`usePixediContext must be used within an PixediProvider`);return e},z=32,Fe=(e,t,n,r,i,a,o,s,c,l)=>{let{x:u,y:d,w:f,h:p}=c;if(e){let e=o-c.w-c.x;u+=i-n,u<0&&(u=0),f=o-u-e,f<z&&(f=z,u=o-e-z);let t=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-t,p<z&&(p=z,d=s-t-z)}else{if(t>=1){let e=i-n,r=Math.round(e/t);f-=e,p-=r,u+=e,d+=r}else{let e=a-r,n=Math.round(e*t);f-=n,p-=e,u+=n,d+=e}if(u<0||d<0||f<z||p<z)return l}return{x:u,y:d,w:f,h:p}},Ie=(e,t,n,r,i,a,o,s,c,l)=>{let{x:u}=c,{y:d,w:f,h:p}=c;if(e){f+=i-n,f+u>o&&(f=o-u),f<z&&(f=z);let e=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-e,p<z&&(p=z,d=s-e-z)}else{if(t>1){let e=i-n,r=Math.round(e/t);f+=e,p+=r,d-=r}else{let e=a-r,n=Math.round(e*t);f-=n,p-=e,d+=e}if(f+u>o||d<0||f<z||p<z)return l}return{x:u,y:d,w:f,h:p}},Le=(e,t,n,r,i,a,o,s,c,l)=>{let{y:u}=c,{x:d,w:f,h:p}=c;if(e){p+=a-r,p+u>s&&(p=s-u),p<z&&(p=z);let e=o-c.w-c.x;d+=i-n,d<0&&(d=0),f=o-d-e,f<z&&(f=z,d=o-e-z)}else{if(t>=1){let e=i-n,r=Math.round(e/t);f-=e,p-=r,d+=e}else{let e=a-r,n=Math.round(e*t);f+=n,p+=e,d-=n}if(p+u>s||d<0||f<z||p<z)return l}return{x:d,y:u,w:f,h:p}},Re=(e,t,n,r,i,a,o,s,c,l)=>{let{x:u,y:d}=c,{w:f,h:p}=c;if(e)f+=i-n,f+u>o&&(f=o-u),f<z&&(f=z),p+=a-r,p+d>s&&(p=s-d),p<z&&(p=z);else{if(t>=1){let e=i-n,r=Math.round(e/t);f+=e,p+=r}else{let e=a-r,n=Math.round(e*t);f+=n,p+=e}if(p+d>s||f+u>o||f<z||p<z)return l}return{x:u,y:d,w:f,h:p}},ze=(e,t,n,r,i,a,o,s,c)=>{let l=e===`tl`||e===`bl`,u=e===`tl`||e===`tr`,d=c.x+c.w,f=c.y+c.h,p=i-n,m=a-r,h=t>=1?c.w+(l?-p:p):(c.h+(u?-m:m))*t,g=l?d:o-c.x,_=u?f:s-c.y,v=Math.min(g,_*t),y=Math.max(z,z*t),b=Math.min(Math.max(h,y),v),x=b/t;return{x:l?d-b:c.x,y:u?f-x:c.y,w:b,h:x}},Be=(e,t,n,r,i,a,o,s,c,l,u)=>t?e===`tl`?Fe(t,n,r,i,a,o,s,c,l,u):e===`tr`?Ie(t,n,r,i,a,o,s,c,l,u):e===`bl`?Le(t,n,r,i,a,o,s,c,l,u):e===`br`?Re(t,n,r,i,a,o,s,c,l,u):{x:0,y:0,w:0,h:0}:ze(e,n,r,i,a,o,s,c,l),B=(e,t,n)=>{let r=.12,i=t/n,a=0,o=0;e===1&&(a=(i>1?n:t)*(1-r*2),o=a),e>1&&(i>e?(o=n*(1-r*2),a=o*e):(a=t*(1-r*2),o=a/e)),e<1&&(i>e?(o=n*(1-r*2),a=o*e):(a=t*(1-r*2),o=a/e));let s=a/t*100,c=o/n*100,l=(t-a)/2/t*100,u=(n-o)/2/n*100;return{x:l,y:u,w:s,h:c,xP:Math.round(l/100*t),yP:Math.round(u/100*n),wP:Math.round(s/100*t),hP:Math.round(c/100*n)}},Ve=(e,t,n,r)=>{let i=e.w/100*n,a=e.h/100*r;t>=1?a=i/t:i=a*t;let o=i/n*100,s=a/r*100,c=Math.max(o/(100-e.x),s/(100-e.y),1);return o/=c,s/=c,{...e,w:o,h:s}},V=e=>Math.abs(Math.round(e/90))%2==1,He=(e,t,n,r)=>V(n)===V(r)?{width:e,height:t}:{width:t,height:e},Ue=async e=>{let{width:t,height:n}=e,r=Math.min(1,u/Math.max(t,n)),i=Math.round(t*r),a=Math.round(n*r),o=new OffscreenCanvas(i,a),s=o.getContext(`2d`);if(!s)throw Error(`Failed to get 2D context for preview canvas`);return s.drawImage(e,0,0,i,a),o.convertToBlob({type:`image/webp`,quality:d})};function We(e){let t=new OffscreenCanvas(e.width,e.height),n=t.getContext(`2d`);if(!n)throw Error(`Failed to create 2D context for canvas.`);n.drawImage(e,0,0);try{let e=n.getImageData(0,0,t.width,t.height).data;for(let t=3;t<e.length;t+=4)if(e[t]<255)return!0;return!1}catch(e){throw Error(`Error reading pixels: ${e}`,{cause:e})}}var Ge=e=>new Promise((t,n)=>{let r=new FileReader;r.onloadend=()=>{let e=r.result;typeof e==`string`?t(e):n(Error(`Failed to read blob as base64`))},r.onerror=()=>n(r.error??Error(`FileReader error`)),r.readAsDataURL(e)});async function Ke(e){let t=await createImageBitmap(e),n=e.type||`image/png`,r=n===`image/gif`?`image/png`:n,i=document.createElement(`canvas`),a=i.getContext(`2d`,{alpha:!0});i.width=t.width,i.height=t.height,a?.drawImage(t,0,0),t.close();let o=()=>{let e=document.createElement(`canvas`);return e.width=i.width,e.height=i.height,e.getContext(`2d`,{alpha:!0})?.drawImage(i,0,0),e};return{crop:(e,t,n,r)=>{if(!a)return;let s=o();i.width=n,i.height=r,a.clearRect(0,0,n,r),a.drawImage(s,e,t,n,r,0,0,n,r)},flip:(e,t)=>{if(!a)return;let n=o();a.clearRect(0,0,i.width,i.height),a.save(),a.translate(e?i.width:0,t?i.height:0),a.scale(e?-1:1,t?-1:1),a.drawImage(n,0,0),a.restore()},rotate:e=>{if(!a)return;let t=o(),n=e*Math.PI/180,r=Math.abs(Math.sin(n)),s=Math.abs(Math.cos(n));i.width=Math.round(t.width*s+t.height*r),i.height=Math.round(t.width*r+t.height*s),a.clearRect(0,0,i.width,i.height),a.save(),a.translate(i.width/2,i.height/2),a.rotate(n),a.drawImage(t,-t.width/2,-t.height/2),a.restore()},resize:(e,t)=>{if(!a)return;let n=o();i.width=e,i.height=t,a.clearRect(0,0,e,t),a.drawImage(n,0,0,e,t)},filters:e=>{if(!a)return;let t=o(),n=`url`in e?`url(#${e.url})`:Object.entries(e).map(([e,t])=>e===`hueRotate`?`hue-rotate(${t}deg)`:`${e}(${t}%)`).join(` `);a.clearRect(0,0,i.width,i.height),a.filter=n,a.drawImage(t,0,0),a.filter=`none`},get:async e=>{let{quality:t=.85,saveAsWEBP:n=!1}=e,a=n?`image/webp`:r,o=await new Promise((e,o)=>{r===`image/jpeg`||r===`image/webp`||n?i.toBlob(t=>{t?e(t):o(Error(`Failed to encode image as ${a}`))},a,t):i.toBlob(t=>{t?e(t):o(Error(`Failed to encode image as image/png`))},`image/png`)}),s=await createImageBitmap(o),c=await Ue(s),{width:l,height:u}=s,d=We(s);return s.close(),{newBlob:o,previewBlob:c,mimeType:a,width:l,height:u,isAlpha:d}}}}var H=(e,t,n)=>Math.max(t,Math.min(n,e)),qe=(e,t)=>[[e[0][0]*t[0][0]+e[0][1]*t[1][0],e[0][0]*t[0][1]+e[0][1]*t[1][1]],[e[1][0]*t[0][0]+e[1][1]*t[1][0],e[1][0]*t[0][1]+e[1][1]*t[1][1]]],Je=e=>(Math.round(e/90)%4+4)%4*90,Ye=e=>{switch(Je(e)){case 90:return[[0,-1],[1,0]];case 180:return[[-1,0],[0,-1]];case 270:return[[0,1],[-1,0]];default:return[[1,0],[0,1]]}},Xe=(e,t)=>[[e?-1:1,0],[0,t?-1:1]],Ze=(e,t,n)=>qe(Xe(t,n),Ye(-e)),Qe=e=>[+(e[0][0]<0||e[0][1]<0),+(e[1][0]<0||e[1][1]<0)],U=(e,t,n)=>{let r=Qe(e);return[e[0][0]*t+e[0][1]*n+r[0],e[1][0]*t+e[1][1]*n+r[1]]},$e=e=>{let t=1,n=1,r={x:0,y:0,w:1,h:1},i=0,a=!1,o=!1;for(let s=0;s<e.length;s++){let c=e[s];if(c.action.name===L.INITIAL)t=c.width,n=c.height,r={x:0,y:0,w:1,h:1},i=0,a=!1,o=!1;else if(c.action.name===L.CROP){let e=(c.action.args.x??0)/100,t=(c.action.args.y??0)/100,n=(c.action.args.w??100)/100,s=(c.action.args.h??100)/100,l=Ze(i,a,o),u=[U(l,e,t),U(l,e+n,t),U(l,e,t+s),U(l,e+n,t+s)],d=Math.min(...u.map(e=>e[0])),f=Math.max(...u.map(e=>e[0])),p=Math.min(...u.map(e=>e[1])),m=Math.max(...u.map(e=>e[1]));r={x:r.x+d*r.w,y:r.y+p*r.h,w:r.w*(f-d),h:r.h*(m-p)}}else if(c.action.name===L.FLIP){let e=V(i),t=e?c.action.args.vertical:c.action.args.horizontal,n=e?c.action.args.horizontal:c.action.args.vertical;t&&(a=!a),n&&(o=!o)}else c.action.name===L.ROTATE&&(i=c.action.args.degrees)}let s=r.w*t,c=r.h*n,l=V(i),u=l?c:s,d=l?s:c,f=e.at(-1)?.width||0,p=e.at(-1)?.height||0,m=e.filter(e=>e.action.name===L.FILTERS).at(-1),h=Object.entries(m?.action.args||{}).map(([e,t])=>e===`url`?`url(#${t})`:e===`hueRotate`?`hue-rotate(${t}deg)`:`${e}(${t}%)`);return{box:r,boxWidth:s,boxHeight:c,newWidth:f,newHeight:p,initWidth:t,initHeight:n,viewWidth:u,viewHeight:d,rotation:i,flipH:a,flipV:o,filters:h}},et=e=>{let{box:t,flipH:n,flipV:r,rotation:i,newWidth:a,newHeight:o,initWidth:s,initHeight:c,viewWidth:l,viewHeight:u}=$e(e),d=e.filter(e=>e.action.name===L.FILTERS).at(-1)?.action.args,f=H(t.x,0,1),p=H(t.y,0,1),m={x:f,y:p,w:H(t.w,0,1-f),h:H(t.h,0,1-p)},h=Je(i);return{...m.x===0&&m.y===0&&m.w===1&&m.h===1?{}:{crop:{x:Math.round(s*t.x),y:Math.round(c*t.y),w:Math.round(s*t.w),h:Math.round(c*t.h)}},...h===0?{}:{rotate:{degrees:h}},...n||r?{flip:{horizontal:n,vertical:r}}:{},...Math.round(l)!==a||Math.round(u)!==o?{resize:{width:a,height:o}}:{},...d?{filters:d}:{}}},tt=()=>{let[e,n]=(0,t.useState)(!1),{setImage:r,settings:i,history:a,originalBlob:o,setCurrentAction:s,resetHistory:c,onSave:l}=R();return{save:async t=>{if(!o||e)return;n(!0);let s=et([...a.items.slice(0,a.pointer+1),...t?[t]:[]]);try{let e=await Ke(o);s.crop&&e.crop(s.crop.x,s.crop.y,s.crop.w,s.crop.h),s.flip&&e.flip(s.flip.horizontal,s.flip.vertical),s.rotate&&e.rotate(s.rotate.degrees),s.resize&&e.resize(s.resize.width,s.resize.height),s.filters&&e.filters(s.filters);let{newBlob:t,previewBlob:n,mimeType:a,width:c,height:u,isAlpha:d}=await e.get(i),f=``;i.exportAs===`base64`&&(f=await Ge(t)),await l(f||t),r({newBlob:t,previewBlob:n,mimeType:a,width:c,height:u,isAlpha:d})}catch(e){throw Error(`Error saving image: ${e}`,{cause:e})}finally{n(!1)}},reset:()=>{s(null),c()},isSaving:e}},W=()=>{let{singleToolUI:e,addToHistory:t,setCurrentAction:n,setSidebar:r,onBack:i}=R(),{save:a,isSaving:o}=tt();return{commit:n=>{if(e)return a(n);t(n),r(!0)},close:()=>{if(e){i();return}n(null),r(!0)},isSaving:o,singleToolUI:e}},nt=(0,t.createContext)(void 0),rt=()=>{let e=(0,t.useContext)(nt),n=(0,t.useRef)({dx:0,dy:0});return e??n};function G(e,t,n){return Math.min(Math.max(e,t),n)}function it(e,{dx:t,dy:n}){e.style.transform=`translate(calc(-50% + ${t}px), ${n}px)`}function at(e,t){let n=e.parentElement;if(!n)return null;let r=e.getBoundingClientRect(),i=n.getBoundingClientRect(),a=r.left-i.left-t.dx,o=r.top-i.top-t.dy;return{minDx:-a,maxDx:Math.max(-a,i.width-r.width-a),minDy:-o,maxDy:Math.max(-o,i.height-r.height-o)}}var ot=({surfaceRef:e})=>{let n=I(),r=rt(),i=(0,t.useRef)(null),a=(0,t.useRef)({dx:0,dy:0}),o=(0,t.useRef)(null);return(0,t.useEffect)(()=>{let t=e.current;if(!t)return;let s=e=>{r.current=e,it(t,e)},c=()=>{let e=at(t,r.current);if(!e)return;let{dx:n,dy:i}=r.current;s({dx:G(n,e.minDx,e.maxDx),dy:G(i,e.minDy,e.maxDy)})},l=e=>{let t=i.current,n=o.current;if(!t||!n)return;e.preventDefault();let r=`clientX`in e?e.clientX:e.touches[0].clientX,c=`clientY`in e?e.clientY:e.touches[0].clientY;s({dx:G(a.current.dx+(r-t.x),n.minDx,n.maxDx),dy:G(a.current.dy+(c-t.y),n.minDy,n.maxDy)})},u=()=>{i.current&&(i.current=null,o.current=null,n||(document.body.style.cursor=``))};c();let d=new AbortController,{signal:f}=d;if(document.addEventListener(`mousemove`,l,{signal:f}),document.addEventListener(`touchmove`,l,{signal:f,passive:!1}),document.addEventListener(`mouseup`,u,{signal:f}),document.addEventListener(`touchend`,u,{signal:f}),typeof ResizeObserver<`u`&&t.parentElement){let e=new ResizeObserver(c);e.observe(t.parentElement),f.addEventListener(`abort`,()=>e.disconnect())}return()=>d.abort()},[e,r,n]),{handleDragStart:t=>{let s=e.current;if(!s)return;t.stopPropagation();let c=at(s,r.current);if(!c)return;let l=`clientX`in t?t.clientX:t.touches[0].clientX,u=`clientY`in t?t.clientY:t.touches[0].clientY;i.current={x:l,y:u},a.current={...r.current},o.current=c,n||(document.body.style.cursor=`move`)}}},st={surfaceTool:`_surfaceTool_1skmt_1`,content:`_content_1skmt_18`,drag:`_drag_1skmt_22`},K=({children:e,className:r=``,ref:i})=>{let a=(0,t.useRef)(null),{handleDragStart:o}=ot({surfaceRef:a});return(0,n.jsxs)(`div`,{ref:e=>{a.current=e,i&&(i.current=e)},className:st.surfaceTool,children:[(0,n.jsx)(de,{className:st.drag,onMouseDown:o,onTouchStart:o}),(0,n.jsx)(`div`,{className:`${st.content} ${r}`,children:e})]})},ct=(e,t)=>{let n=new CustomEvent(`crop-update`,{detail:t});e.dispatchEvent(n)},lt=(e,t)=>{let n=new CustomEvent(`clip-path-update`,{detail:t});e.dispatchEvent(n)},ut=(e,t)=>{let n=new CustomEvent(`resize-update`,{detail:t});e.dispatchEvent(n)},q=(e,t)=>{let n=new CustomEvent(`filter-update`,{detail:t});e.dispatchEvent(n)},dt=(e,t)=>{let n=new CustomEvent(`compare-update`,{detail:t});e.dispatchEvent(n)},ft=()=>{let{showCompare:e,previewUrl:n,getLastFilter:r,getLastHistoryItem:i,toggleCompare:a,eventBus:o}=R(),{commit:s,close:c,isSaving:l}=W(),{width:u,height:d}=i(),{action:f}=r()||{},m=f?.args||{},h=m?.url,g=p.map(e=>({...e,sliderValue:m[e.value]??e.sliderValue,rightLabel:`${m[e.value]??e.sliderValue}${e.unit}`})),_=g.find(e=>e.value===`saturate`)?.sliderValue,[v,y]=(0,t.useState)(`saturate`),[b,x]=(0,t.useState)(h??`vintage`),[S,C]=(0,t.useState)(g),[w,T]=(0,t.useState)(_??0),[E,ee]=(0,t.useState)(!!h),D=(0,t.useMemo)(()=>Object.fromEntries(S.map(e=>[e.value,e.sliderValue])),[S]),te=()=>{a(),dt(o,50)},ne=e=>{q(o,{...D,[v]:e})},re=S.find(e=>e.value===v);return(0,t.useEffect)(()=>{E?q(o,{url:b}):q(o,{...D,[v]:w})},[E,b,w,D,v,o]),{showCompare:e,previewUrl:n,isUrl:E,toggleIsUrl:()=>ee(!E),filters:S,selectedFilter:v,selectedFilterItem:re,selectedUrl:b,sliderValue:w,handleToggleCompare:te,handleSliderInput:ne,handleSliderChange:e=>{T(e),C(t=>t.map(t=>t.value===v?{...t,sliderValue:e,rightLabel:`${e}${t.unit}`}:t))},handleChange:e=>{y(e),T(S.find(t=>t.value===e)?.sliderValue||0)},handleChangeWhenUrl:e=>{x(e),q(o,{url:e})},handleSave:()=>{e&&a(),s({width:u,height:d,action:{name:L.FILTERS,args:{...E?{url:b}:Object.fromEntries(S.map(e=>[e.value,e.sliderValue]))}}})},handleClose:()=>{e&&a(),c()},isSaving:l}},J={tools:`_tools_4u8qe_1`,row1:`_row1_4u8qe_5`,min:`_min_4u8qe_13`,slider:`_slider_4u8qe_19`,max:`_max_4u8qe_23`,row2:`_row2_4u8qe_29`,select:`_select_4u8qe_35`,option:`_option_4u8qe_39`,active:`_active_4u8qe_50`,filterInteract:`_filterInteract_4u8qe_55`,compare:`_compare_4u8qe_70`,compareThumb:`_compareThumb_4u8qe_88`},pt=()=>{let{showCompare:e,previewUrl:t,isUrl:r,toggleIsUrl:i,filters:a,selectedFilter:o,selectedFilterItem:s,selectedUrl:c,sliderValue:l,handleToggleCompare:u,handleSliderInput:d,handleSliderChange:f,handleChange:p,handleChangeWhenUrl:h,handleSave:g,handleClose:_,isSaving:v}=ft();return(0,n.jsxs)(K,{className:J.tools,children:[!r&&s&&(0,n.jsxs)(`div`,{className:J.row1,children:[(0,n.jsxs)(`div`,{className:J.min,children:[s.min,s.unit]}),(0,n.jsx)(Te,{className:J.slider,min:s.min,max:s.max,step:s.step,value:l,isTooltip:!0,unit:s.unit,onInput:d,onChange:f}),(0,n.jsxs)(`div`,{className:J.max,children:[s.max,s.unit]})]}),(0,n.jsxs)(`div`,{className:J.row2,children:[(0,n.jsx)(F,{position:`top`,children:(0,n.jsx)(k,{variant:`outline`,"aria-label":`Compare`,"data-tooltip":`Compare`,onClick:u,className:e?J.active:``,children:(0,n.jsx)(ue,{})})}),(0,n.jsx)(F,{position:`top`,children:(0,n.jsx)(k,{variant:`outline`,"aria-label":r?`Filters`:`Predefined Filters`,"data-tooltip":r?`Filters`:`Predefined Filters`,onClick:i,children:r?(0,n.jsx)(oe,{}):(0,n.jsx)(le,{})})}),(0,n.jsx)(_e,{items:r?m:a,value:r?c:o,placeholder:`Select filter`,className:J.select,renderOption:r?e=>(0,n.jsx)(`div`,{className:J.option,children:(0,n.jsx)(`img`,{src:t,alt:e.label,style:{filter:`url(#${e.value})`}})}):void 0,onChange:r?h:p}),(0,n.jsx)(M,{onSave:g,onClose:_,saving:v})]})]})},mt=({isClipped:e,isFilter:n})=>{let{history:r,previewUrl:i,currentAction:a,getLastRotation:o,eventBus:s}=R(),c=(0,t.useRef)(null),l=(0,t.useRef)(null),u=(0,t.useRef)(a?.name),d=(0,t.useRef)(i);(0,t.useLayoutEffect)(()=>{let e=u.current,t=a?.name,n=d.current!==i;if(u.current=t,d.current=i,!(e&&t&&e!==t)&&!n)return;let r=c.current;if(!r)return;let o=[r,...r.querySelectorAll(`*`)];o.forEach(e=>{e.style.transition=`none`}),r.getBoundingClientRect();let s=()=>{o.forEach(e=>{e.style.removeProperty(`transition`)})},l=requestAnimationFrame(s);return()=>{cancelAnimationFrame(l),s()}},[a?.name,i]);let f=r.items.slice(0,r.pointer+1);if(a){let{width:e,height:t}=r.items.at(r.pointer);f.push({...a.name===L.ROTATE?He(e,t,o(),a.args.degrees):{width:e,height:t},action:a})}let p=$e(f);return(0,t.useEffect)(()=>{e&&c.current&&(c.current.style.transition=`none`),a?.name!==L.RESIZE&&c.current&&(c.current.style.transform=`scale(1)`);let t=e=>{let t=e.detail;c.current&&(c.current.style.transform=`scale(${t/100})`)},r=t=>{if(!e)return;let{x:n,y:r,w:i,h:a}=t.detail;c.current&&(c.current.style.clipPath=`xywh(${n}% ${r}% ${i}% ${a}%)`)},i=e=>{if(!n)return;let t=e.detail;if(l.current)if(t.url)l.current.style.filter=`url(#${t.url})`;else{let e=Object.entries(t).map(([e,t])=>e===`hueRotate`?`hue-rotate(${t}deg)`:`${e}(${t}%)`).join(` `);l.current.style.filter=e}},o=e=>{if(!n)return;let t=e.detail;c.current&&(c.current.style.clipPath=`xywh(${t}% 0% ${100-t}% 100%)`)},u=new AbortController,{signal:d}=u;return s.addEventListener(`resize-update`,t,{signal:d}),s.addEventListener(`clip-path-update`,r,{signal:d}),s.addEventListener(`filter-update`,i,{signal:d}),s.addEventListener(`compare-update`,o,{signal:d}),()=>u.abort()},[e,n,a?.name,s]),{previewRef:c,imageRef:l,previewUrl:i,...p}},Y={preview:`_preview_t77n1_1`,faded:`_faded_t77n1_13`,rotate:`_rotate_t77n1_19`,flip:`_flip_t77n1_31`,image:`_image_t77n1_39`,label:`_label_t77n1_49`,before:`_before_t77n1_67`,after:`_after_t77n1_71`},ht=({isClipped:e,isFilter:t,faded:r,style:i={}})=>{let{showCompare:a}=R(),{previewRef:o,imageRef:s,previewUrl:c,box:l,boxWidth:u,boxHeight:d,viewWidth:f,viewHeight:p,rotation:m,flipH:h,flipV:g,filters:_}=mt({isClipped:e,isFilter:t});return(0,n.jsxs)(`div`,{ref:o,className:`${Y.preview} ${r?Y.faded:``}`,style:{aspectRatio:`${f} / ${p}`,...i},children:[a&&!t&&(0,n.jsx)(`div`,{className:`${Y.label} ${Y.before}`,children:`Before`}),a&&t&&(0,n.jsx)(`div`,{className:`${Y.label} ${Y.after}`,children:`After`}),(0,n.jsx)(`div`,{className:Y.rotate,style:{width:`${u/f*100}%`,height:`${d/p*100}%`,transform:`translate(-50%, -50%) rotate(${m}deg)`},children:(0,n.jsx)(`div`,{className:Y.flip,style:{transform:`scale(${h?-1:1}, ${g?-1:1})`},children:(0,n.jsx)(`img`,{ref:s,className:Y.image,src:c,alt:`Preview Image`,style:{width:`${1/l.w*100}%`,height:`${1/l.h*100}%`,left:`${-(l.x/l.w)*100}%`,top:`${-(l.y/l.h)*100}%`,filter:_.join(` `)}})})})]})},gt=({compareRef:e})=>{let{eventBus:n}=R(),r=I(),i=(0,t.useRef)(null),a=(0,t.useRef)(null);return(0,t.useEffect)(()=>{a.current=0,dt(n,0)},[n]),(0,t.useEffect)(()=>{let t=t=>{if(!e.current||!i.current)return;t.preventDefault();let r=e.current.parentElement;if(!r)return;let o=`clientX`in t?t.clientX:t.touches[0].clientX,{width:s,left:c}=r.getBoundingClientRect(),l=Math.min(Math.max(o-c,0),s)/s*100;a.current=l,e.current.style.left=`${l}%`,dt(n,l)},r=()=>{e.current&&(i.current=null,document.body.style.cursor=`auto`)},o=new AbortController,{signal:s}=o;return document.addEventListener(`mousemove`,t,{signal:s}),document.addEventListener(`touchmove`,t,{signal:s,passive:!1}),document.addEventListener(`mouseup`,r,{signal:s}),document.addEventListener(`touchend`,r,{signal:s}),()=>o.abort()},[e,n]),{handleDragStart:t=>{if(!e.current)return;t.stopPropagation(),t.preventDefault(),i.current=a.current;let n=`clientX`in t?t.clientX:t.touches[0].clientX;i.current=n,r||(document.body.style.cursor=`pointer`)}}},_t=()=>{let{showCompare:e,getLastHistoryItem:r}=R(),{width:i,height:a}=r(),o=(0,t.useRef)(null),{handleDragStart:s}=gt({compareRef:o});return(0,n.jsxs)(`div`,{className:J.filterInteract,style:{aspectRatio:`${i} / ${a}`},children:[(0,n.jsx)(ht,{isFilter:!0}),e&&(0,n.jsx)(n.Fragment,{children:(0,n.jsx)(`div`,{ref:o,className:J.compare,style:{left:`50%`},children:(0,n.jsx)(`div`,{className:J.compareThumb,onMouseDown:s,onTouchStart:s,children:(0,n.jsx)(ue,{})})})})]})},vt=()=>({saturate:100,grayscale:0,sepia:0,invert:0,hueRotate:0,brightness:100,contrast:100}),yt=(e,t,n)=>{if(e.length===1)switch(e[0]){case`resize`:return{name:L.RESIZE,args:{width:t,height:n}};case`crop`:return{name:L.CROP,args:{id:`freeform`,ratio:t/n,isFree:!0}};case`presetCrop`:return{name:L.PRESET_CROP,args:{id:`facebook-post`,ratio:1200/630,isFree:!1,preset:{width:1200,height:630}}};case`flip`:return{name:L.FLIP,args:{horizontal:!1,vertical:!1}};case`rotate`:return{name:L.ROTATE,args:{degrees:0}};case`filters`:return{name:L.FILTERS,args:vt()};default:return null}return null},bt={tools:[`resize`,`crop`,`presetCrop`,`flip`,`rotate`,`filters`],infobar:!0,quality:.85,saveAsWEBP:!1,exportAs:`blob`},xt=(e,t,n,r,i,a,o)=>({history:{pointer:0,items:[{width:t,height:n,action:{name:L.INITIAL,args:null}}]},currentAction:yt(o?.tools||[],t,n),previewUrl:i,originalBlob:r,mimeType:e,sidebar:!1,settings:o,isAlpha:a,showCompare:!1,singleToolUI:o?.tools?.length===1}),St=()=>{},Ct=({children:e,mimeType:r,width:i,height:a,originalBlob:o,previewUrl:s,isAlpha:c,settings:l,onSave:u=St,onBack:d=St})=>{let[f,p]=(0,t.useState)(xt(r,i,a,o,s,c,l)),m=(0,t.useRef)(null);(0,t.useEffect)(()=>()=>{m.current&&=(URL.revokeObjectURL(m.current),null)},[]);let h=e=>p(t=>({...t,currentAction:e})),g=e=>p(t=>{let n=t.history.pointer+1,r=[...t.history.items.slice(0,n),e];return{...t,currentAction:null,history:{items:r,pointer:n}}}),_=()=>p(e=>({...e,showCompare:!e.showCompare})),v=()=>{let{items:e,pointer:t}=f.history;return e.at(t)??e.at(0)??{width:0,height:0,action:{name:L.INITIAL,args:null}}},y=()=>{let{items:e,pointer:t}=f.history;return e.filter((e,n)=>n<=t&&e.action.name===L.FILTERS).at(-1)??null},b=()=>{let{items:e,pointer:t}=f.history;if(e.length===0||t<0)return 0;let n=e.slice(0,t+1).findLast(e=>e.action.name===L.ROTATE);return n?.action.name===L.ROTATE?n.action.args.degrees:0},x=()=>p(e=>({...e,history:{items:[e.history.items[0]],pointer:0}})),S=()=>p(e=>e.history.pointer<=0?e:{...e,history:{...e.history,pointer:e.history.pointer-1}}),C=()=>p(e=>e.history.pointer>=e.history.items.length-1?e:{...e,history:{...e.history,pointer:e.history.pointer+1}}),w=e=>p(t=>({...t,sidebar:e})),T=(0,t.useMemo)(()=>new EventTarget,[]),E=e=>{m.current&&URL.revokeObjectURL(m.current),m.current=URL.createObjectURL(e.previewBlob),p(xt(e.mimeType,e.width,e.height,e.newBlob,m.current,e.isAlpha,l))};return(0,n.jsx)(Pe,{value:{...f,setImage:E,setCurrentAction:h,toggleCompare:_,getLastHistoryItem:v,getLastRotation:b,getLastFilter:y,addToHistory:g,resetHistory:x,undo:S,redo:C,setSidebar:w,eventBus:T,onSave:u,onBack:d},children:e})},X={header:`_header_m05h6_1`,left:`_left_m05h6_12`,sidebarToggle:`_sidebarToggle_m05h6_17`,mobile:`_mobile_m05h6_30`,sidebarIcon:`_sidebarIcon_m05h6_34`,tools:`_tools_m05h6_39`,history:`_history_m05h6_43`,historyText:`_historyText_m05h6_48`},wt=({isMobile:e})=>{let{save:t,reset:r,isSaving:i}=tt(),{sidebar:a,history:o,undo:s,redo:c,setSidebar:l,setCurrentAction:u,onBack:d}=R(),f=o.items.length>1&&!i,p=o.pointer===0,m=o.pointer===o.items.length-1,h=o.items.length<2||i,_=h||o.pointer===0;return(0,n.jsxs)(`div`,{className:X.header,children:[(0,n.jsxs)(`div`,{className:X.left,children:[(0,n.jsx)(`div`,{className:`${X.sidebarToggle} ${e?X.mobile:``}`,onClick:()=>{l(!a)},children:a?(0,n.jsx)(ce,{className:X.sidebarIcon}):(0,n.jsx)(se,{className:X.sidebarIcon})}),(0,n.jsx)(k,{variant:`ghost`,className:O.rect,onClick:()=>d(),children:(0,n.jsx)(y,{})})]}),(0,n.jsxs)(`div`,{className:X.tools,children:[f&&(0,n.jsxs)(`div`,{className:X.history,children:[(0,n.jsx)(k,{variant:`outline`,disabled:p,className:O.rect,onClick:()=>{s(),u(null)},children:(0,n.jsx)(x,{})}),(0,n.jsxs)(`div`,{className:X.historyText,children:[o.pointer+1,`/`,o.items.length]}),(0,n.jsx)(k,{variant:`outline`,disabled:m,className:O.rect,onClick:()=>{c(),u(null)},children:(0,n.jsx)(S,{})})]}),(0,n.jsx)(k,{variant:`outline`,disabled:h,onClick:r,children:`Reset`}),(0,n.jsxs)(k,{disabled:_,onClick:()=>t(),children:[i?(0,n.jsx)(fe,{}):(0,n.jsx)(g,{}),`Save`]})]})]})},Tt={[L.RESIZE]:{icon:(0,n.jsx)(D,{}),label:`Resize`},[L.CROP]:{icon:(0,n.jsx)(C,{}),label:`Crop`},[L.PRESET_CROP]:{icon:(0,n.jsx)(ae,{}),label:`Presets`},[L.FLIP]:{icon:(0,n.jsx)(te,{}),label:`Flip`},[L.ROTATE]:{icon:(0,n.jsx)(re,{}),label:`Rotate`},[L.FILTERS]:{icon:(0,n.jsx)(oe,{}),label:`Filters`}},Et=e=>Tt[e]??null,Dt=()=>{let{settings:e,currentAction:t,showCompare:n,toggleCompare:r,getLastRotation:i,getLastHistoryItem:a,setCurrentAction:o,setSidebar:s}=R(),c=e?.tools||[],l=t?.name,{width:u,height:d}=a();return{click:e=>{if(c.includes(e)&&l===e){o(null);return}switch(e){case L.RESIZE:o({name:L.RESIZE,args:{width:u,height:d}});break;case L.CROP:o({name:L.CROP,args:{id:`freeform`,ratio:u/d,isFree:!0}});break;case L.PRESET_CROP:o({name:L.PRESET_CROP,args:{id:`facebook-post`,ratio:1200/630,isFree:!1,preset:{width:1200,height:630}}});break;case L.FLIP:o({name:L.FLIP,args:{horizontal:!1,vertical:!1}});break;case L.ROTATE:o({name:L.ROTATE,args:{degrees:i()}});break;case L.FILTERS:o({name:L.FILTERS,args:vt()});break}n&&r(),s(!1)}}},Z={sidebar:`_sidebar_1lx29_1`,mobile:`_mobile_1lx29_10`,open:`_open_1lx29_15`,wrapper:`_wrapper_1lx29_20`,item:`_item_1lx29_24`,selected:`_selected_1lx29_43`},Ot=({isMobile:e})=>{let{settings:t,sidebar:r,currentAction:i}=R(),a=t?.tools||[],o=i?.name,{click:s}=Dt();return(0,n.jsx)(`nav`,{className:`${Z.sidebar} ${e?Z.mobile:``} ${e&&r?Z.open:``}`,children:(0,n.jsx)(F,{position:`right`,className:Z.tooltip,children:a.map(e=>{let t=Et(e);if(!t)return null;let{icon:r,label:i}=t;return(0,n.jsx)(`div`,{className:`${Z.item} ${o===e?Z.selected:``}`,onClick:()=>s(e),"data-tooltip":i,"aria-label":i,children:r},e)})})})},kt={infobar:`_infobar_1kq0f_1`},At=e=>e<1024?`${e} B`:e<1024*1024?`${(e/1024).toFixed(2)} KB`:`${(e/1024/1024).toFixed(2)} MB`,jt=()=>{let{originalBlob:e,getLastHistoryItem:t}=R(),{width:r,height:i}=t();return(0,n.jsxs)(`div`,{className:kt.infobar,children:[(0,n.jsx)(`div`,{className:kt.filesize,children:e?At(e.size):`0 B`}),(0,n.jsxs)(`div`,{className:kt.sizes,children:[r,` / `,i]})]})},Mt=15,Nt=200,Pt=2,Ft=(e,t,n)=>{let r=Math.min(Nt,Math.max(Mt,e));return{scale:r,width:Math.round(r/100*t),height:Math.round(r/100*n)}},It=()=>{let{getLastHistoryItem:e,eventBus:n}=R(),{commit:r,close:i,isSaving:a}=W(),{width:o,height:s}=e(),[c,l]=(0,t.useState)(o),[u,d]=(0,t.useState)(s),[f,p]=(0,t.useState)(100),m=(0,t.useRef)(f),h=(0,t.useRef)(0),g=(0,t.useRef)(null),_=(0,t.useCallback)(e=>{let t=Ft(e,o,s);l(t.width),d(t.height),p(t.scale),m.current=t.scale,ut(n,t.scale)},[s,o,n]),v=(e,t)=>{let n=Number.parseInt(e,10);if(!Number.isFinite(n)){_(100);return}_(n/t*100)};return(0,t.useEffect)(()=>{let e=e=>{let t=g.current?.parentElement,n=e.composedPath?.()[0]??e.target;return n instanceof Node&&!!t?.contains(n)},t=t=>{e(t)&&_(m.current-Math.sign(t.deltaY)*Pt)},n=t=>{e(t)&&(h.current=t.touches[0].clientY)},r=t=>{if(!e(t))return;let n=t.touches[0].clientY,r=h.current-n;Math.abs(r)<10||(_(m.current+Math.sign(r)*Pt),h.current=n)},i=new AbortController,{signal:a}=i;return window.addEventListener(`wheel`,t,{signal:a}),window.addEventListener(`touchstart`,n,{signal:a}),window.addEventListener(`touchmove`,r,{signal:a}),()=>i.abort()},[_]),{resizeRef:g,width:c,height:u,scale:f,currentWidth:o,currentHeight:s,setWidth:l,setHeight:d,handleWidthBlur:e=>{v(e.target.value,o)},handleHeightBlur:e=>{v(e.target.value,s)},save:()=>{r({width:c,height:u,action:{name:L.RESIZE,args:{width:c,height:u}}}),ut(n,100)},close:()=>{ut(n,100),i()},isSaving:a}},Q={resize:`_resize_1sbig_1`,toolsLock:`_toolsLock_1sbig_5`,indicatorWrapper:`_indicatorWrapper_1sbig_10`,indicator:`_indicator_1sbig_10`},Lt=()=>{let{resizeRef:e,width:t,height:r,scale:i,currentWidth:a,currentHeight:o,setWidth:s,setHeight:c,handleWidthBlur:l,handleHeightBlur:u,save:d,close:f,isSaving:p}=It();return(0,n.jsxs)(K,{ref:e,className:Q.resize,children:[(0,n.jsx)(`div`,{className:Q.indicatorWrapper,children:(0,n.jsx)(`div`,{className:Q.indicator,style:{width:`${i/2}%`}})}),(0,n.jsx)(xe,{value:t,name:`width`,label:`Width`,style:{width:`88px`},onChange:e=>s(Number(e.target.value)),onBlur:l}),(0,n.jsx)(v,{className:Q.toolsLock}),(0,n.jsx)(xe,{value:r,name:`height`,label:`Height`,style:{width:`88px`},onChange:e=>c(Number(e.target.value)),onBlur:u}),(0,n.jsx)(M,{onSave:d,onClose:f,saving:p,disabled:t===a&&r===o})]})},$={wrapper:`_wrapper_1co2u_1`,box:`_box_1co2u_9`,toolsInfo:`_toolsInfo_1co2u_18`,toolsInfoLabel:`_toolsInfoLabel_1co2u_25`,toolsInfoValue:`_toolsInfoValue_1co2u_30`,linesBox:`_linesBox_1co2u_35`,line:`_line_1co2u_35`,lineV:`_lineV_1co2u_45`,lineH:`_lineH_1co2u_53`,pointer:`_pointer_1co2u_61`,pointerTopLeft:`_pointerTopLeft_1co2u_67`,pointerTopRight:`_pointerTopRight_1co2u_74`,pointerBottomRight:`_pointerBottomRight_1co2u_81`,pointerBottomLeft:`_pointerBottomLeft_1co2u_88`,mobileBorder:`_mobileBorder_1co2u_95`,mobilePointer:`_mobilePointer_1co2u_101`,info:`_info_1co2u_112`,infoX:`_infoX_1co2u_129`,infoY:`_infoY_1co2u_134`,infoW:`_infoW_1co2u_141`,infoH:`_infoH_1co2u_146`,group:`_group_1co2u_153`,active:`_active_1co2u_162`},Rt=()=>{let{getLastHistoryItem:e}=R(),r=I(),i=(0,t.useRef)(null),{handleCropStart:a,initialCrop:o}=Xt({boxRef:i}),{width:s,height:c}=e(),{x:l,y:u,w:d,h:f}=o;return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(ht,{isClipped:!0,style:{clipPath:`xywh(${l}% ${u}% ${d}% ${f}%)`}}),(0,n.jsx)(`div`,{className:$.wrapper,style:{aspectRatio:`${s} / ${c}`},children:(0,n.jsxs)(`div`,{ref:i,className:$.box,style:{width:`${d}%`,height:`${f}%`,top:`${u}%`,left:`${l}%`},children:[(0,n.jsx)(Ut,{}),r?(0,n.jsx)(Zt,{onMouseDown:a}):(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(Wt,{onMouseDown:a}),(0,n.jsx)(Qt,{})]})]})})]})},zt=[{id:`freeform`,icon:(0,n.jsx)(C,{}),label:`Freeform`},{id:`origin`,icon:(0,n.jsx)(w,{}),label:`Original`},{id:`1:1`,icon:(0,n.jsx)(T,{}),label:`1 : 1`},{id:`4:3`,icon:(0,n.jsx)(ee,{}),label:`4 : 3`},{id:`16:9`,icon:(0,n.jsx)(E,{}),label:`16 : 9`}],Bt=({value:e,onChange:t})=>(0,n.jsx)(`div`,{className:$.group,children:(0,n.jsx)(F,{position:`top`,children:zt.map(r=>(0,n.jsx)(k,{variant:`outline`,className:`${$.groupBtn} ${e===r.id?$.active:``}`,onClick:()=>t(r.id),"aria-label":r.label,"data-tooltip":r.label,children:r.icon},r.id))})}),Vt=()=>{let{setCurrentAction:e,currentAction:n,getLastHistoryItem:r,eventBus:i}=R(),{commit:a,close:o,isSaving:s}=W(),{width:c,height:l}=r(),{name:u,args:d}=n||{},f=u===L.CROP?d?.id:``,p=c/l,m=(0,t.useRef)({x:0,y:0,w:0,h:0});return(0,t.useEffect)(()=>{if(n?.name!==L.CROP)return;let e=B(n.args.ratio,c,l);m.current=e;let t=e=>{m.current=e.detail};return i.addEventListener(`clip-path-update`,t),()=>{i.removeEventListener(`clip-path-update`,t)}},[n,c,l,i]),{currentValue:f,handleChange:t=>{t!==f&&e({name:L.CROP,args:{id:t,ratio:/^\d+:\d+$/.test(t)?t.split(`:`).map(Number).reduce((e,t)=>e/t):p,isFree:t===`freeform`}})},handleSave:()=>{if(!n||n.name!==L.CROP)return;let e=n.args?.preset?.width||Math.round(c*m.current.w/100),t=n.args?.preset?.height||Math.round(l*m.current.h/100);a({width:e,height:t,action:{name:L.CROP,args:{...n.args,...m.current}}})},handleClose:o,isSaving:s}},Ht=()=>{let{currentValue:e,handleChange:t,handleSave:r,handleClose:i,isSaving:a}=Vt();return(0,n.jsxs)(K,{children:[(0,n.jsx)(Bt,{value:e,onChange:t}),(0,n.jsx)(M,{onSave:r,onClose:i,saving:a})]})},Ut=()=>(0,n.jsxs)(`div`,{className:$.linesBox,children:[(0,n.jsx)(`span`,{className:`${$.line} ${$.lineV}`}),(0,n.jsx)(`span`,{className:`${$.line} ${$.lineH}`})]}),Wt=({onMouseDown:e})=>(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(`div`,{className:`${$.pointer} ${$.pointerTopLeft}`,onMouseDown:t=>e(t,`tl`,`nwse`)}),(0,n.jsx)(`div`,{className:`${$.pointer} ${$.pointerTopRight}`,onMouseDown:t=>e(t,`tr`,`nesw`)}),(0,n.jsx)(`div`,{className:`${$.pointer} ${$.pointerBottomRight}`,onMouseDown:t=>e(t,`br`,`nwse`)}),(0,n.jsx)(`div`,{className:`${$.pointer} ${$.pointerBottomLeft}`,onMouseDown:t=>e(t,`bl`,`nesw`)})]});function Gt(e,t,n){return Math.min(Math.max(e,t),n)}function Kt(e,{x:t,y:n,w:r,h:i}){e.style.left=`${t}%`,e.style.top=`${n}%`,e.style.width=`${r}%`,e.style.height=`${i}%`}function qt(e){let{width:t,height:n}=e.getBoundingClientRect();return{frameW:t,frameH:n}}function Jt({x:e,y:t,w:n,h:r},i,a){return{x:e/100*i,y:t/100*a,w:n/100*i,h:r/100*a}}function Yt({x:e,y:t,w:n,h:r},i,a){return{x:e/i*100,y:t/a*100,w:n/i*100,h:r/a*100}}var Xt=({boxRef:e})=>{let{currentAction:n,getLastHistoryItem:r,eventBus:i}=R(),a=I(),{width:o,height:s}=r(),c=n?.name===L.CROP||n?.name===L.PRESET_CROP,l=c?n.args.ratio:1,u=!c||n.args.isFree,d=(0,t.useMemo)(()=>B(l,o,s),[l,o,s]),f=(0,t.useRef)(null),p=(0,t.useRef)(``),m=(0,t.useRef)(d),h=(0,t.useRef)(d);return(0,t.useEffect)(()=>{m.current=d,lt(i,d)},[d,i]),(0,t.useEffect)(()=>{let t=(e,t)=>{m.current=t,Kt(e,t),ct(i,{x:Math.round(t.x/100*o),y:Math.round(t.y/100*s),w:Math.round(t.w/100*o),h:Math.round(t.h/100*s)}),lt(i,t)},n=e=>{e.preventDefault(),h.current=m.current;let t=`clientX`in e?e.clientX:e.touches[0].clientX,n=`clientY`in e?e.clientY:e.touches[0].clientY;f.current={x:t,y:n},document.body.style.cursor=`move`},r=t=>{if(!e.current||!f.current)return;t.preventDefault();let n=e.current,r=n.parentElement;if(!r)return;let{frameW:i,frameH:o}=qt(r);if(p.current){a(t,n,i,o);return}c(t,n,i,o)},a=(e,n,r,i)=>{if(!f.current)return;let a=`clientX`in e?e.clientX:e.touches[0].clientX,c=`clientY`in e?e.clientY:e.touches[0].clientY,d=Yt(Be(p.current,u,l,f.current.x,f.current.y,a,c,r,i,Jt(h.current,r,i),Jt(m.current,r,i)),r,i);t(n,u?d:Ve(d,l,o,s))},c=(e,n,r,i)=>{if(!f.current)return;let{x:a,y:o,w:s,h:c}=h.current,l=`clientX`in e?e.clientX:e.touches[0].clientX,u=`clientY`in e?e.clientY:e.touches[0].clientY,d=(l-f.current.x)/r*100,p=(u-f.current.y)/i*100;t(n,{x:Gt(a+d,0,Math.max(0,100-s)),y:Gt(o+p,0,Math.max(0,100-c)),w:s,h:c})},d=()=>{e.current&&(f.current=null,p.current=``,e.current.style.cursor=`move`,document.body.style.cursor=`auto`)};if(!e.current)return;let g=new AbortController,{signal:_}=g;return e.current.addEventListener(`mousedown`,n,{signal:_}),e.current.addEventListener(`touchstart`,n,{signal:_,passive:!1}),document.addEventListener(`mousemove`,r,{signal:_}),document.addEventListener(`touchmove`,r,{signal:_,passive:!1}),document.addEventListener(`mouseup`,d,{signal:_}),document.addEventListener(`touchend`,d,{signal:_}),()=>g.abort()},[u,l,o,s,e,i]),{handleCropStart:(t,n,r)=>{if(!e.current)return;t.stopPropagation(),t.preventDefault(),h.current=m.current;let i=`clientX`in t?t.clientX:t.touches[0].clientX,o=`clientY`in t?t.clientY:t.touches[0].clientY;f.current={x:i,y:o},p.current=n,a||(e.current.style.cursor=`${r}-resize`,document.body.style.cursor=`${r}-resize`)},initialCrop:d}},Zt=({onMouseDown:e})=>(0,n.jsx)(`div`,{className:$.mobileBorder,children:(0,n.jsx)(`div`,{className:$.mobilePointer,onTouchStart:t=>e(t,`br`,`nwse`)})}),Qt=()=>{let e=(0,t.useRef)(null),r=(0,t.useRef)(null),i=(0,t.useRef)(null),a=(0,t.useRef)(null),{currentAction:o,getLastHistoryItem:s,eventBus:c}=R(),{width:l,height:u}=s();return(0,t.useEffect)(()=>{if(!(o?.name===L.CROP||o?.name===L.PRESET_CROP))return;let{xP:t,yP:n,wP:s,hP:d}=B(o.args.ratio,l,u);e.current&&(e.current.textContent=t.toString()),r.current&&(r.current.textContent=n.toString()),i.current&&(i.current.textContent=s.toString()),a.current&&(a.current.textContent=d.toString());let f=t=>{let{x:n,y:o,w:s,h:c}=t.detail;e.current&&(e.current.textContent=n.toString()),r.current&&(r.current.textContent=o.toString()),i.current&&(i.current.textContent=s.toString()),a.current&&(a.current.textContent=c.toString())};return c.addEventListener(`crop-update`,f),()=>{c.removeEventListener(`crop-update`,f)}},[o,u,l,c]),(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(`div`,{className:`${$.info} ${$.infoX}`,children:(0,n.jsx)(`b`,{ref:e})}),(0,n.jsx)(`div`,{className:`${$.info} ${$.infoY}`,children:(0,n.jsx)(`b`,{ref:r})}),(0,n.jsx)(`div`,{className:`${$.info} ${$.infoW}`,children:(0,n.jsx)(`b`,{ref:i})}),(0,n.jsx)(`div`,{className:`${$.info} ${$.infoH}`,children:(0,n.jsx)(`b`,{ref:a})})]})},$t=f.map(e=>e.options).flat(),en=()=>$t,tn=()=>{let{currentAction:e,getLastHistoryItem:n,setCurrentAction:r,eventBus:i}=R(),{commit:a,close:o,isSaving:s}=W(),{width:c,height:l}=n(),u=e?.name===L.PRESET_CROP&&$t.some(t=>t.value===e.args.id)?e.args.id:``,d=(0,t.useRef)({x:0,y:0,w:0,h:0});return(0,t.useEffect)(()=>{if(e?.name!==L.PRESET_CROP)return;let t=B(e.args.ratio,c,l);d.current=t;let n=e=>{d.current=e.detail};return i.addEventListener(`clip-path-update`,n),()=>{i.removeEventListener(`clip-path-update`,n)}},[e,c,l,i]),{currentValue:u,presetsData:f,handleChange:e=>{if(!e)return;let t=en().find(t=>t.value===e);if(!t)return;let n={id:e,ratio:t.w/t.h,isFree:!1,preset:{width:t.w,height:t.h}};r({name:L.PRESET_CROP,args:n})},handleSave:()=>{!e||e.name!==L.PRESET_CROP||a({width:e.args?.preset?.width||0,height:e.args?.preset?.height||0,action:{name:L.CROP,args:{...e.args,...d.current}}})},handleClose:o,isSaving:s}},nn={select:`_select_1ieak_1`},rn=()=>{let{currentValue:e,presetsData:t,handleChange:r,handleSave:i,handleClose:a,isSaving:o}=tn();return(0,n.jsxs)(K,{children:[(0,n.jsx)(_e,{value:e,placeholder:`Select preset`,onChange:r,items:t,className:nn.select}),(0,n.jsx)(M,{onSave:i,onClose:a,saving:o})]})},an=()=>{let{getLastHistoryItem:e,setCurrentAction:n}=R(),{commit:r,close:i,isSaving:a}=W(),{width:o,height:s}=e(),[c,l]=(0,t.useState)(!1),[u,d]=(0,t.useState)(!1),f=(e,t)=>{n({name:L.FLIP,args:{horizontal:e,vertical:t}})};return{flipHorizontal:c,flipVertical:u,handleFlipHorizontal:()=>{let e=!c;l(e),f(e,u)},handleFlipVertical:()=>{let e=!u;d(e),f(c,e)},handleSave:()=>{r({width:o,height:s,action:{name:L.FLIP,args:{horizontal:c,vertical:u}}})},handleClose:i,isSaving:a}},on={btnH:`_btnH_15adi_1`,btnV:`_btnV_15adi_7`},sn=()=>{let{flipHorizontal:e,flipVertical:t,handleFlipHorizontal:r,handleFlipVertical:i,handleSave:a,handleClose:o,isSaving:s}=an();return(0,n.jsxs)(K,{children:[(0,n.jsx)(`div`,{className:on.scGroup,children:(0,n.jsxs)(F,{position:`top`,children:[(0,n.jsx)(k,{variant:`outline`,className:on.btnH,onClick:r,"aria-label":`Horizontal`,"data-tooltip":`Horizontal`,children:(0,n.jsx)(te,{style:{color:e?`var(--accent-blue)`:`var(--foreground)`}})}),(0,n.jsx)(k,{variant:`outline`,className:on.btnV,onClick:i,"aria-label":`Vertical`,"data-tooltip":`Vertical`,children:(0,n.jsx)(ne,{style:{color:t?`var(--accent-blue)`:`var(--foreground)`}})})]})}),(0,n.jsx)(M,{disabled:!e&&!t,saving:s,onSave:a,onClose:o})]})},cn=()=>{let{getLastRotation:e,getLastHistoryItem:n,setCurrentAction:r}=R(),{commit:i,close:a,isSaving:o}=W(),{width:s,height:c}=n(),l=e(),u=(0,t.useRef)(l),d=(0,t.useRef)(l);return{handleRotate:e=>{d.current+=e,r({name:L.ROTATE,args:{degrees:d.current}})},handleSave:()=>{i({...He(s,c,u.current,d.current),action:{name:L.ROTATE,args:{degrees:d.current}}})},handleClose:a,isSaving:o}},ln={btnH:`_btnH_15adi_1`,btnV:`_btnV_15adi_7`},un=()=>{let{handleRotate:e,handleSave:t,handleClose:r,isSaving:i}=cn();return(0,n.jsxs)(K,{children:[(0,n.jsx)(`div`,{className:ln.scGroup,children:(0,n.jsxs)(F,{position:`top`,children:[(0,n.jsx)(k,{variant:`outline`,className:ln.btnH,onClick:()=>e(90),"aria-label":`+90°`,"data-tooltip":`+90°`,children:(0,n.jsx)(re,{})}),(0,n.jsx)(k,{variant:`outline`,className:ln.btnV,onClick:()=>e(-90),"aria-label":`-90°`,"data-tooltip":`-90°`,children:(0,n.jsx)(ie,{})})]})}),(0,n.jsx)(M,{onSave:t,onClose:r,saving:i})]})},dn={frame:`_frame_17rae_1`,"bg-circled":`_bg-circled_17rae_12`,"bg-diagonals":`_bg-diagonals_17rae_74`,"bg-rhombus":`_bg-rhombus_17rae_103`},fn=()=>{let{settings:e,currentAction:t}=R(),r=t?.name===L.RESIZE,i=t?.name===L.CROP,a=t?.name===L.PRESET_CROP,o=t?.name===L.FLIP,s=t?.name===L.ROTATE,c=t?.name===L.FILTERS,l=i||a;return(0,n.jsxs)(`div`,{className:`
3
+ ${dn.frame}
4
+ ${e?.background?dn[`bg-${e.background}`]:``}
5
+ `,children:[(0,n.jsx)(ht,{faded:l}),r&&(0,n.jsx)(Lt,{}),i&&(0,n.jsx)(Ht,{}),a&&(0,n.jsx)(rn,{}),o&&(0,n.jsx)(sn,{}),s&&(0,n.jsx)(un,{}),c&&(0,n.jsx)(pt,{}),(i||a)&&(0,n.jsx)(Rt,{},t?.args?.id),c&&(0,n.jsx)(_t,{})]})},pn=()=>(0,n.jsx)(`svg`,{style:{position:`absolute`,width:0,height:0,overflow:`hidden`},xmlns:`http://www.w3.org/2000/svg`,children:(0,n.jsxs)(`defs`,{children:[(0,n.jsx)(`filter`,{id:`vintage`,children:(0,n.jsx)(`feColorMatrix`,{type:`matrix`,values:`
6
+ 1.2 0 0 0 0.1
7
+ 0 1.0 0 0 0.0
8
+ 0 0 0.8 0 0.1
9
+ 0 0 0 1 0`})}),(0,n.jsx)(`filter`,{id:`olive-army`,children:(0,n.jsx)(`feColorMatrix`,{type:`matrix`,values:`
10
+ 0.35 0.35 0.35 0 0
11
+ 0.45 0.45 0.45 0 0
12
+ 0.20 0.20 0.20 0 0
13
+ 0 0 0 1 0`})}),(0,n.jsx)(`filter`,{id:`warm-sunset`,children:(0,n.jsx)(`feColorMatrix`,{type:`matrix`,values:`
14
+ 1.3 0 0 0 0.1
15
+ 0 1.1 0 0 0.05
16
+ 0 0 0.7 0 -0.05
17
+ 0 0 0 1 0`})}),(0,n.jsx)(`filter`,{id:`sin-city-red`,children:(0,n.jsx)(`feColorMatrix`,{type:`matrix`,values:`
18
+ 1.5 0 0 0 0
19
+ 0.3 0.3 0.3 0 0
20
+ 0.3 0.3 0.3 0 0
21
+ 0 0 0 1 0`})}),(0,n.jsxs)(`filter`,{id:`emboss`,children:[(0,n.jsx)(`feConvolveMatrix`,{order:`3`,kernelMatrix:`-2 -1 0 -1 1 1 0 1 2`}),(0,n.jsx)(`feColorMatrix`,{type:`matrix`,values:`
22
+ 0.33 0.33 0.33 0 0.5
23
+ 0.33 0.33 0.33 0 0.5
24
+ 0.33 0.33 0.33 0 0.5
25
+ 0 0 0 1 0`})]}),(0,n.jsxs)(`filter`,{id:`crt-lines`,children:[(0,n.jsx)(`feTurbulence`,{type:`fractalNoise`,baseFrequency:`0 0.9`,numOctaves:`1`,result:`lines`}),(0,n.jsx)(`feColorMatrix`,{type:`matrix`,values:`
26
+ 1 0 0 0 0
27
+ 0 1 0 0 0
28
+ 0 0 1 0 0
29
+ 0 0 0 15 -7`,result:`sharpLines`}),(0,n.jsx)(`feComposite`,{operator:`in`,in:`SourceGraphic`,in2:`sharpLines`,result:`pattern`}),(0,n.jsx)(`feBlend`,{mode:`overlay`,in:`SourceGraphic`,in2:`pattern`})]}),(0,n.jsxs)(`filter`,{id:`grain`,x:`0%`,y:`0%`,width:`100%`,height:`100%`,children:[(0,n.jsx)(`feTurbulence`,{type:`fractalNoise`,baseFrequency:`0.8`,numOctaves:`3`,result:`noise`}),(0,n.jsx)(`feBlend`,{mode:`multiply`,in:`SourceGraphic`,in2:`noise`})]}),(0,n.jsxs)(`filter`,{id:`cross-process`,children:[(0,n.jsxs)(`feComponentTransfer`,{children:[(0,n.jsx)(`feFuncR`,{type:`table`,tableValues:`0 0.05 0.2 0.5 0.8 0.95 1`}),(0,n.jsx)(`feFuncG`,{type:`table`,tableValues:`0 0.1 0.3 0.6 0.85 1 1`}),(0,n.jsx)(`feFuncB`,{type:`table`,tableValues:`0.05 0.15 0.4 0.5 0.7 0.8 0.9`})]}),(0,n.jsxs)(`feComponentTransfer`,{children:[(0,n.jsx)(`feFuncR`,{type:`linear`,slope:`1.2`,intercept:`-0.1`}),(0,n.jsx)(`feFuncG`,{type:`linear`,slope:`1.1`,intercept:`-0.05`})]})]}),(0,n.jsx)(`filter`,{id:`x-ray`,children:(0,n.jsx)(`feColorMatrix`,{type:`matrix`,values:`
30
+ -0.33 -0.33 -0.33 0 1
31
+ -0.2 -0.2 -0.2 0 0.6
32
+ -0.1 -0.1 -0.1 0 0.9
33
+ 0 0 0 1 0`})}),(0,n.jsxs)(`filter`,{id:`plastic-wrap`,children:[(0,n.jsx)(`feSpecularLighting`,{surfaceScale:`5`,specularConstant:`1`,specularExponent:`20`,lightingColor:`#fff`,result:`light`,children:(0,n.jsx)(`feDistantLight`,{azimuth:`225`,elevation:`45`})}),(0,n.jsx)(`feBlend`,{mode:`overlay`,in:`SourceGraphic`,in2:`light`})]})]})});e.Pixedi=({image:e,onSave:r,onBack:i,theme:a=`light`,settings:o=bt})=>{let[s,c]=(0,t.useState)(null),l=Ne(`sm`,s),u={...bt,...o},{loading:d,error:f,mimeType:p,width:m,height:h,originalBlob:g,previewUrl:_,isAlpha:v}=Ae({src:e,skip:u?.tools?.length===0});return u?.tools?.length===0?(0,n.jsx)(`div`,{className:`${j.root} ${j.wrapper}`,"data-theme":a,children:(0,n.jsx)(`div`,{className:j.system,children:(0,n.jsx)(`div`,{className:j.textRed,children:`No tools selected.`})})}):d||f||!g||!p?(0,n.jsx)(`div`,{className:`${j.root} ${j.wrapper}`,"data-theme":a,children:(0,n.jsxs)(`div`,{className:j.system,children:[d&&(0,n.jsx)(fe,{style:{width:48,height:48}}),f&&(0,n.jsx)(`div`,{className:j.textRed,children:f}),!d&&!f&&(!g||!p)&&(0,n.jsx)(`div`,{className:j.textRed,children:`Failed to load image.`})]})}):(0,n.jsx)(Ct,{mimeType:p,width:m,height:h,originalBlob:g,previewUrl:_,isAlpha:v,settings:u,onSave:r,onBack:i,children:(0,n.jsxs)(`div`,{ref:c,className:`${j.root} ${j.wrapper}`,"data-theme":a,children:[u?.tools?.includes(L.FILTERS)&&(0,n.jsx)(pn,{}),u?.tools?.length===1?(0,n.jsx)(`div`,{className:j.gridSingleTool,children:(0,n.jsx)(fn,{})}):(0,n.jsxs)(`div`,{className:`${u?.infobar?j.grid:j.gridNoInfobar} ${l?j.mobile:``}`,children:[(0,n.jsx)(wt,{isMobile:l}),(0,n.jsx)(Ot,{isMobile:l}),(0,n.jsx)(fn,{}),u?.infobar&&(0,n.jsx)(jt,{})]})]})})}});
@@ -0,0 +1 @@
1
+ export declare const Infobar: () => import("react").JSX.Element;
@@ -0,0 +1 @@
1
+ export { Infobar } from "./Infobar";
@@ -0,0 +1 @@
1
+ export declare const PresetTools: () => import("react").JSX.Element;
@@ -0,0 +1 @@
1
+ export { PresetTools } from "./PresetTools";
@@ -0,0 +1,8 @@
1
+ export declare const usePreset: () => {
2
+ currentValue: string;
3
+ presetsData: import("../types").Preset[];
4
+ handleChange: (value: string | null) => void;
5
+ handleSave: () => void;
6
+ handleClose: () => void;
7
+ isSaving: boolean;
8
+ };
@@ -0,0 +1,8 @@
1
+ type PreviewType = {
2
+ isClipped?: boolean;
3
+ isFilter?: boolean;
4
+ faded?: boolean;
5
+ style?: React.CSSProperties;
6
+ };
7
+ export declare const Preview: ({ isClipped, isFilter, faded, style, }: PreviewType) => import("react").JSX.Element;
8
+ export {};
@@ -0,0 +1 @@
1
+ export { Preview } from "./Preview";
@@ -0,0 +1,28 @@
1
+ type UsePreviewProps = {
2
+ isClipped?: boolean;
3
+ isFilter?: boolean;
4
+ };
5
+ export declare const usePreview: ({ isClipped, isFilter }: UsePreviewProps) => {
6
+ box: {
7
+ x: number;
8
+ y: number;
9
+ w: number;
10
+ h: number;
11
+ };
12
+ boxWidth: number;
13
+ boxHeight: number;
14
+ newWidth: number;
15
+ newHeight: number;
16
+ initWidth: number;
17
+ initHeight: number;
18
+ viewWidth: number;
19
+ viewHeight: number;
20
+ rotation: number;
21
+ flipH: boolean;
22
+ flipV: boolean;
23
+ filters: string[];
24
+ previewRef: import("react").RefObject<HTMLDivElement | null>;
25
+ imageRef: import("react").RefObject<HTMLImageElement | null>;
26
+ previewUrl: string;
27
+ };
28
+ export {};
@@ -0,0 +1,15 @@
1
+ import { type FuncSaveArgs, type Settings } from "../types";
2
+ type PixediProviderProps = {
3
+ children: React.ReactNode;
4
+ mimeType: string;
5
+ width: number;
6
+ height: number;
7
+ originalBlob: Blob | null;
8
+ previewUrl: string;
9
+ isAlpha: boolean;
10
+ settings: Settings;
11
+ onSave?: FuncSaveArgs;
12
+ onBack?: () => void;
13
+ };
14
+ export declare const PixediProvider: ({ children, mimeType, width, height, originalBlob, previewUrl, isAlpha, settings, onSave, onBack, }: PixediProviderProps) => import("react").JSX.Element;
15
+ export {};
@@ -0,0 +1,20 @@
1
+ import { type PixediContextType } from "./initialState";
2
+ import type { Action, FuncSaveArgs, HistoryItem, ProcessedImage } from "../types";
3
+ type StoreContextType = PixediContextType & {
4
+ onSave: FuncSaveArgs;
5
+ onBack: () => void;
6
+ setImage: (payload: ProcessedImage) => void;
7
+ setCurrentAction: (payload: Action | null) => void;
8
+ toggleCompare: () => void;
9
+ getLastHistoryItem: () => HistoryItem;
10
+ getLastRotation: () => number;
11
+ getLastFilter: () => HistoryItem | null;
12
+ addToHistory: (payload: HistoryItem) => void;
13
+ resetHistory: () => void;
14
+ undo: () => void;
15
+ redo: () => void;
16
+ setSidebar: (payload: boolean) => void;
17
+ eventBus: EventTarget;
18
+ };
19
+ export declare const StoreContext: import("react").Context<StoreContextType | undefined>;
20
+ export {};
@@ -0,0 +1,16 @@
1
+ import { type History, type Action } from "../types";
2
+ import type { Settings } from "../types";
3
+ export type PixediContextType = {
4
+ history: History;
5
+ currentAction: Action | null;
6
+ previewUrl: string;
7
+ originalBlob: Blob | null;
8
+ mimeType: string | null;
9
+ sidebar: boolean;
10
+ settings: Settings;
11
+ isAlpha: boolean;
12
+ showCompare: boolean;
13
+ singleToolUI: boolean;
14
+ };
15
+ export declare const initialSettings: Settings;
16
+ export declare const getInitialState: (mimeType: string, width: number, height: number, originalBlob: Blob | null, previewUrl: string, isAlpha: boolean, settings: Settings) => PixediContextType;
@@ -0,0 +1,16 @@
1
+ export declare const usePixediContext: () => import("./initialState").PixediContextType & {
2
+ onSave: import("../types").FuncSaveArgs;
3
+ onBack: () => void;
4
+ setImage: (payload: import("../types").ProcessedImage) => void;
5
+ setCurrentAction: (payload: import("../types").Action | null) => void;
6
+ toggleCompare: () => void;
7
+ getLastHistoryItem: () => import("../types").HistoryItem;
8
+ getLastRotation: () => number;
9
+ getLastFilter: () => import("../types").HistoryItem | null;
10
+ addToHistory: (payload: import("../types").HistoryItem) => void;
11
+ resetHistory: () => void;
12
+ undo: () => void;
13
+ redo: () => void;
14
+ setSidebar: (payload: boolean) => void;
15
+ eventBus: EventTarget;
16
+ };
@@ -0,0 +1 @@
1
+ export declare const ResizeTools: () => import("react").JSX.Element;
@@ -0,0 +1 @@
1
+ export { ResizeTools } from "./ResizeTools";
@@ -0,0 +1,15 @@
1
+ export declare const useResize: () => {
2
+ resizeRef: import("react").RefObject<HTMLDivElement | null>;
3
+ width: number;
4
+ height: number;
5
+ scale: number;
6
+ currentWidth: number;
7
+ currentHeight: number;
8
+ setWidth: import("react").Dispatch<import("react").SetStateAction<number>>;
9
+ setHeight: import("react").Dispatch<import("react").SetStateAction<number>>;
10
+ handleWidthBlur: (event: React.FocusEvent<HTMLInputElement>) => void;
11
+ handleHeightBlur: (event: React.FocusEvent<HTMLInputElement>) => void;
12
+ save: () => void;
13
+ close: () => void;
14
+ isSaving: boolean;
15
+ };
@@ -0,0 +1 @@
1
+ export declare const RotateTools: () => import("react").JSX.Element;
@@ -0,0 +1 @@
1
+ export { RotateTools } from "./RotateTools";
@@ -0,0 +1,6 @@
1
+ export declare const useRotate: () => {
2
+ handleRotate: (value: number) => void;
3
+ handleSave: () => void;
4
+ handleClose: () => void;
5
+ isSaving: boolean;
6
+ };
@@ -0,0 +1,5 @@
1
+ type SidebarProps = {
2
+ isMobile: boolean;
3
+ };
4
+ export declare const Sidebar: ({ isMobile }: SidebarProps) => import("react").JSX.Element;
5
+ export {};
@@ -0,0 +1 @@
1
+ export { Sidebar } from "./Sidebar";
@@ -0,0 +1,11 @@
1
+ import type { ReactNode } from "react";
2
+ import { type Tools } from "../types";
3
+ type MappedTool = {
4
+ icon: ReactNode;
5
+ label: string;
6
+ };
7
+ export declare const getToolData: (tool: Tools) => MappedTool | null;
8
+ export declare const useSidebar: () => {
9
+ click: (tool: Tools) => void;
10
+ };
11
+ export {};
@@ -0,0 +1,129 @@
1
+ export declare const breakpoints: {
2
+ readonly sm: 480;
3
+ readonly md: 768;
4
+ readonly lg: 1024;
5
+ readonly xl: 1280;
6
+ };
7
+ export type Breakpoint = keyof typeof breakpoints;
8
+ export type Direction = "tl" | "tr" | "bl" | "br";
9
+ export type ActionWithVal = {
10
+ val: boolean;
11
+ };
12
+ export declare const ActionName: {
13
+ readonly INITIAL: "initial";
14
+ readonly RESIZE: "resize";
15
+ readonly CROP: "crop";
16
+ readonly PRESET_CROP: "presetCrop";
17
+ readonly FLIP: "flip";
18
+ readonly ROTATE: "rotate";
19
+ readonly FILTERS: "filters";
20
+ };
21
+ export type Tools = Exclude<(typeof ActionName)[keyof typeof ActionName], "initial">;
22
+ export type Sizes = {
23
+ width: number;
24
+ height: number;
25
+ };
26
+ export type ActionFlip = {
27
+ horizontal: boolean;
28
+ vertical: boolean;
29
+ };
30
+ export type ActionCrop = {
31
+ id: string;
32
+ ratio: number;
33
+ isFree: boolean;
34
+ preset?: Sizes;
35
+ } & Partial<CropRect>;
36
+ export type CropRect = {
37
+ x: number;
38
+ y: number;
39
+ w: number;
40
+ h: number;
41
+ };
42
+ export type CropRectExtended = CropRect & {
43
+ xP: number;
44
+ yP: number;
45
+ wP: number;
46
+ hP: number;
47
+ };
48
+ export type ActionRotate = {
49
+ degrees: number;
50
+ };
51
+ export type CssFilters = {
52
+ brightness: number;
53
+ contrast: number;
54
+ grayscale: number;
55
+ hueRotate: number;
56
+ invert: number;
57
+ saturate: number;
58
+ sepia: number;
59
+ };
60
+ export type UrlFilter = {
61
+ url: string;
62
+ };
63
+ export type ActionFilter = UrlFilter | CssFilters;
64
+ export type Action = {
65
+ name: typeof ActionName.INITIAL;
66
+ args: null;
67
+ } | {
68
+ name: typeof ActionName.RESIZE;
69
+ args: Sizes;
70
+ } | {
71
+ name: typeof ActionName.CROP;
72
+ args: ActionCrop;
73
+ } | {
74
+ name: typeof ActionName.PRESET_CROP;
75
+ args: ActionCrop;
76
+ } | {
77
+ name: typeof ActionName.FLIP;
78
+ args: ActionFlip;
79
+ } | {
80
+ name: typeof ActionName.ROTATE;
81
+ args: ActionRotate;
82
+ } | {
83
+ name: typeof ActionName.FILTERS;
84
+ args: ActionFilter;
85
+ };
86
+ export type HistoryItem = Sizes & {
87
+ action: Action;
88
+ };
89
+ export type History = {
90
+ pointer: number;
91
+ items: Array<HistoryItem>;
92
+ };
93
+ export type FuncSaveArgs = (payload: Blob | string) => Promise<void> | void;
94
+ export type Theme = "light" | "dark";
95
+ export type Option<T = string> = {
96
+ value: T;
97
+ label: string;
98
+ rightLabel?: string;
99
+ };
100
+ export type PresetOption = Option & {
101
+ w: number;
102
+ h: number;
103
+ };
104
+ export type Preset = Option & {
105
+ options: Array<PresetOption>;
106
+ };
107
+ export type FilterData = Option & {
108
+ min: number;
109
+ max: number;
110
+ step: number;
111
+ unit: string;
112
+ sliderValue: number;
113
+ };
114
+ export type ProcessedImage = {
115
+ newBlob: Blob;
116
+ previewBlob: Blob;
117
+ mimeType: string;
118
+ width: number;
119
+ height: number;
120
+ isAlpha: boolean;
121
+ };
122
+ export type Settings = {
123
+ tools?: Tools[];
124
+ infobar?: boolean;
125
+ quality?: number;
126
+ saveAsWEBP?: boolean;
127
+ exportAs?: "blob" | "base64";
128
+ background?: "circled" | "diagonals" | "rhombus";
129
+ };
@@ -0,0 +1,7 @@
1
+ type ButtonProps = React.ComponentPropsWithRef<"button"> & {
2
+ variant?: "default" | "outline" | "ghost";
3
+ className?: string;
4
+ children?: React.ReactNode;
5
+ };
6
+ export declare const Button: ({ className, variant, children, ref, ...props }: ButtonProps) => import("react").JSX.Element;
7
+ export {};
@@ -0,0 +1,10 @@
1
+ export { Button } from "./button/Button";
2
+ export { Separator } from "./separator/Separator";
3
+ export { Select } from "./select/Select";
4
+ export { Input } from "./input/Input";
5
+ export { InputPixel } from "./input-pixel/InputPixel";
6
+ export { SaveCloseGroup } from "./save-close-group/SaveCloseGroup";
7
+ export { Slider } from "./slider/Slider";
8
+ export { Tooltip } from "./tooltip/Tooltip";
9
+ export { SurfaceTool } from "./surface-tool/SurfaceTool";
10
+ export { SurfaceToolOffsetProvider } from "./surface-tool/SurfaceToolOffsetProvider";
@@ -0,0 +1,4 @@
1
+ export type InputProps = React.ComponentPropsWithRef<"input"> & {
2
+ hideArrows?: boolean;
3
+ };
4
+ export declare const Input: ({ className, type, hideArrows, ref, ...props }: InputProps) => import("react").JSX.Element;
@@ -0,0 +1,6 @@
1
+ type InputPixelProps = React.ComponentPropsWithRef<"input"> & {
2
+ label: string;
3
+ className?: string;
4
+ };
5
+ export declare const InputPixel: ({ label, className, style, ref, ...props }: InputPixelProps) => import("react").JSX.Element;
6
+ export {};
@@ -0,0 +1,8 @@
1
+ type SaveCloseGroupProps = {
2
+ onSave: () => void;
3
+ onClose: () => void;
4
+ saving?: boolean;
5
+ disabled?: boolean;
6
+ };
7
+ export declare const SaveCloseGroup: ({ onSave, onClose, saving, disabled, }: SaveCloseGroupProps) => import("react").JSX.Element;
8
+ export {};
@@ -0,0 +1,11 @@
1
+ import type { SelectOption } from "./useSelect";
2
+ export type { SelectOption } from "./useSelect";
3
+ type SelectProps = {
4
+ items: SelectOption[];
5
+ value: string;
6
+ onChange: (value: string) => void;
7
+ placeholder?: string;
8
+ className?: string;
9
+ renderOption?: (option: SelectOption) => React.ReactNode;
10
+ };
11
+ export declare const Select: ({ items, value, onChange, placeholder, className, renderOption, }: SelectProps) => import("react").JSX.Element;