pixedi 1.8.0 → 1.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/README.md +28 -7
- package/README.npm.md +28 -7
- package/README.widget.md +32 -11
- package/dist/lib/index.js +1260 -1193
- package/dist/lib/index.umd.js +4 -4
- package/dist/widget/pixedi-widget.js +13 -13
- package/package.json +1 -1
package/dist/lib/index.umd.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
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_1qifp_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(97% 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_1qifp_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_1qifp_8 h1,._root_1qifp_8 h2,._root_1qifp_8 h3,._root_1qifp_8 h4,._root_1qifp_8 h5,._root_1qifp_8 h6{color:var(--foreground);margin:0;font-weight:600}._textRed_1qifp_78{color:var(--color-red)}._bgRed_1qifp_81{background-color:var(--color-red)}._bgGreen_1qifp_84{background-color:var(--color-green)}._textGreen_1qifp_87{color:var(--color-green)}._mask_1qifp_90{background-color:var(--overlay-bg)}._semibold_1qifp_93{letter-spacing:.4px;font-weight:600}._bold_1qifp_97{letter-spacing:.4px;font-weight:700}._system_1qifp_101{color:var(--muted-foreground);background-color:var(--background);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._wrapper_1qifp_111{width:100%;height:100%;min-height:480px;position:relative;overflow:hidden}._grid_1qifp_118{background:var(--background);grid-template:"header header"48px"sidebar frame"1fr"sidebar infobar"32px/48px 1fr;height:100%;display:grid;position:relative}._grid_1qifp_118._mobile_1qifp_130{grid-template-columns:0 1fr}._gridNoInfobar_1qifp_134{grid-template:"header header"48px"sidebar frame"1fr/48px 1fr;height:100%;display:grid;position:relative}._gridNoInfobar_1qifp_134._mobile_1qifp_130{grid-template-columns:0 1fr}._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}._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)}._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}._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_895qe_1{background:var(--muted);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_1p6kh_1{box-sizing:border-box;background:var(--background);grid-area:frame;width:100%;height:100%;margin:0 auto;position:relative;overflow:hidden}/*$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")):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.Pixedi={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t),e=null),t.exports),l=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),l(t||!e||!e.__esModule?r(i,`default`,{value:e,enumerable:!0}):i,e)))(t,1);var u={
|
|
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_187c5_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(97% 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_187c5_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_187c5_8 h1,._root_187c5_8 h2,._root_187c5_8 h3,._root_187c5_8 h4,._root_187c5_8 h5,._root_187c5_8 h6{color:var(--foreground);margin:0;font-weight:600}._textRed_187c5_78{color:var(--color-red)}._bgRed_187c5_81{background-color:var(--color-red)}._bgGreen_187c5_84{background-color:var(--color-green)}._textGreen_187c5_87{color:var(--color-green)}._mask_187c5_90{background-color:var(--overlay-bg)}._semibold_187c5_93{letter-spacing:.4px;font-weight:600}._bold_187c5_97{letter-spacing:.4px;font-weight:700}._system_187c5_101{color:var(--muted-foreground);background-color:var(--background);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._wrapper_187c5_111{width:100%;height:100%;min-height:480px;position:relative;overflow:hidden}._grid_187c5_118{background:var(--background);grid-template:"header header"48px"sidebar frame"1fr"sidebar infobar"32px/48px 1fr;height:100%;display:grid;position:relative}._grid_187c5_118._mobile_187c5_130{grid-template-columns:0 1fr}._gridNoInfobar_187c5_134{grid-template:"header header"48px"sidebar frame"1fr/48px 1fr;height:100%;display:grid;position:relative}._gridNoInfobar_187c5_134._mobile_187c5_130{grid-template-columns:0 1fr}._gridSingleTool_187c5_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_895qe_1{background:var(--muted);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_1p6kh_1{box-sizing:border-box;background:var(--background);grid-area:frame;width:100%;height:100%;margin:0 auto;position:relative;overflow:hidden}/*$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")):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.Pixedi={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t),e=null),t.exports),l=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),l(t||!e||!e.__esModule?r(i,`default`,{value:e,enumerable:!0}):i,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=c((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),g=c((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e){if(e==null)return null;if(typeof e==`function`)return e.$$typeof===D?null:e.displayName||e.name||null;if(typeof e==`string`)return e;switch(e){case _:return`Fragment`;case y:return`Profiler`;case v:return`StrictMode`;case C:return`Suspense`;case w:return`SuspenseList`;case ee:return`Activity`}if(typeof e==`object`)switch(typeof e.tag==`number`&&console.error(`Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue.`),e.$$typeof){case g:return`Portal`;case x:return e.displayName||`Context`;case b:return(e._context.displayName||`Context`)+`.Consumer`;case S:var n=e.render;return e=e.displayName,e||=(e=n.displayName||n.name||``,e===``?`ForwardRef`:`ForwardRef(`+e+`)`),e;case T:return n=e.displayName||null,n===null?t(e.type)||`Memo`:n;case E:n=e._payload,e=e._init;try{return t(e(n))}catch{}}return null}function n(e){return``+e}function r(e){try{n(e);var t=!1}catch{t=!0}if(t){t=console;var r=t.error,i=typeof Symbol==`function`&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||`Object`;return r.call(t,`The provided key is an unsupported type %s. This value must be coerced to a string before using it here.`,i),n(e)}}function i(e){if(e===_)return`<>`;if(typeof e==`object`&&e&&e.$$typeof===E)return`<...>`;try{var n=t(e);return n?`<`+n+`>`:`<...>`}catch{return`<...>`}}function a(){var e=O.A;return e===null?null:e.getOwner()}function o(){return Error(`react-stack-top-frame`)}function s(e){if(te.call(e,`key`)){var t=Object.getOwnPropertyDescriptor(e,`key`).get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function c(e,t){function n(){re||(re=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",t))}n.isReactWarning=!0,Object.defineProperty(e,"key",{get:n,configurable:!0})}function l(){var e=t(this.type);return A[e]||(A[e]=!0,console.error(`Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.`)),e=this.props.ref,e===void 0?null:e}function u(e,t,n,r,i,a){var o=n.ref;return e={$$typeof:h,type:e,key:t,props:n,_owner:r},(o===void 0?null:o)===null?Object.defineProperty(e,"ref",{enumerable:!1,value:null}):Object.defineProperty(e,"ref",{enumerable:!1,get:l}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:i}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:a}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function d(e,n,i,o,l,d){var p=n.children;if(p!==void 0)if(o)if(ne(p)){for(o=0;o<p.length;o++)f(p[o]);Object.freeze&&Object.freeze(p)}else console.error(`React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.`);else f(p);if(te.call(n,`key`)){p=t(e);var m=Object.keys(n).filter(function(e){return e!==`key`});o=0<m.length?`{key: someKey, `+m.join(`: ..., `)+`: ...}`:`{key: someKey}`,oe[p+o]||(m=0<m.length?`{`+m.join(`: ..., `)+`: ...}`:`{}`,console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
3
3
|
let props = %s;
|
|
4
4
|
<%s {...props} />
|
|
5
5
|
React keys must be passed directly to JSX without using spread:
|
|
6
6
|
let props = %s;
|
|
7
|
-
<%s key={someKey} {...props} />`,o,p,m,p),ae[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),D=Symbol.for(`react.activity`),O=Symbol.for(`react.client.reference`),k=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,A=Object.prototype.hasOwnProperty,ee=Array.isArray,j=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var te,ne={},re=m.react_stack_bottom_frame.bind(m,o)(),ie=j(i(o)),ae={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!1,r?Error(`react-stack-top-frame`):re,r?j(i(e)):ie)},e.jsxs=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!0,r?Error(`react-stack-top-frame`):re,r?j(i(e)):ie)}})()})),_=c(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=h():t.exports=g()}))(),v=({children:e,mimeType:n,width:r,height:i,originalBlob:a,previewUrl:o,isAlpha:s,settings:c})=>{let[l,u]=(0,t.useState)(p(n,r,i,a,o,s,c)),f=(0,t.useRef)(null);(0,t.useEffect)(()=>()=>{f.current&&=(URL.revokeObjectURL(f.current),null)},[]);let h=e=>u(t=>({...t,currentAction:e})),g=e=>u(t=>{let n=t.history.pointer+1,r=[...t.history.items.slice(0,n),e];return{...t,currentAction:null,history:{items:r,pointer:n}}}),v=()=>u(e=>({...e,showCompare:!e.showCompare})),y=()=>{let{items:e,pointer:t}=l.history;return e.at(t)??e.at(0)??{width:0,height:0,action:{name:d.INITIAL,args:null}}},b=()=>{let{items:e,pointer:t}=l.history;return e.filter((e,n)=>n<=t&&e.action.name===d.FILTERS).at(-1)??null},x=()=>{let{items:e,pointer:t}=l.history;if(e.length===0||t<0)return 0;let n=e.slice(0,t+1).findLast(e=>e.action.name===d.ROTATE);return n?.action.name===d.ROTATE?n.action.args.degrees:0},S=()=>u(e=>({...e,history:{items:[e.history.items[0]],pointer:0}})),C=()=>u(e=>e.history.pointer<=0?e:{...e,history:{...e.history,pointer:e.history.pointer-1}}),w=()=>u(e=>e.history.pointer>=e.history.items.length-1?e:{...e,history:{...e.history,pointer:e.history.pointer+1}}),T=e=>u(t=>({...t,sidebar:e})),E=(0,t.useMemo)(()=>new EventTarget,[]),D=e=>{f.current&&URL.revokeObjectURL(f.current),f.current=URL.createObjectURL(e.previewBlob),u(p(e.mimeType,e.width,e.height,e.newBlob,f.current,e.isAlpha,c))};return(0,_.jsx)(m,{value:{...l,setImage:D,setCurrentAction:h,toggleCompare:v,getLastHistoryItem:y,getLastRotation:x,getLastFilter:b,addToHistory:g,resetHistory:S,undo:C,redo:w,setSidebar:T,eventBus:E},children:e})},y="(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.`})}}})();",b=typeof self<`u`&&self.Blob&&new Blob([`(self.URL || self.webkitURL).revokeObjectURL(self.location.href);`,y],{type:`text/javascript;charset=utf-8`});function x(e){let t;try{if(t=b&&(self.URL||self.webkitURL).createObjectURL(b),!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(y),{name:e?.name})}}var S=({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 x;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},C=()=>{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},w=()=>{let[e]=(0,t.useState)(()=>C());return e};function T(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<u[e])});return t.observe(n),()=>t.disconnect()},[e,n]),r}var E={xmlns:`http://w3.org`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`},D=e=>(0,_.jsx)(`svg`,{...E,...e,children:(0,_.jsx)(`path`,{d:`M20 6 9 17l-5-5`})}),O=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M18 6 6 18`}),(0,_.jsx)(`path`,{d:`m6 6 12 12`})]}),k=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`11`,x:`3`,y:`11`,rx:`2`,ry:`2`}),(0,_.jsx)(`path`,{d:`M7 11V7a5 5 0 0 1 10 0v4`})]}),A=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`m12 19-7-7 7-7`}),(0,_.jsx)(`path`,{d:`M19 12H5`})]}),ee=e=>(0,_.jsx)(`svg`,{...E,...e,children:(0,_.jsx)(`path`,{d:`m6 9 6 6 6-6`})}),j=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M3 7v6h6`}),(0,_.jsx)(`path`,{d:`M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13`})]}),te=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M21 7v6h-6`}),(0,_.jsx)(`path`,{d:`M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7`})]}),ne=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M6 2v14a2 2 0 0 0 2 2h14`}),(0,_.jsx)(`path`,{d:`M18 22V8a2 2 0 0 0-2-2H2`})]}),re=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`}),(0,_.jsx)(`circle`,{cx:`9`,cy:`9`,r:`2`}),(0,_.jsx)(`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`})]}),ie=e=>(0,_.jsx)(`svg`,{...E,...e,children:(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`})}),ae=e=>(0,_.jsx)(`svg`,{...E,...e,children:(0,_.jsx)(`rect`,{width:`20`,height:`12`,x:`2`,y:`6`,rx:`2`})}),oe=e=>(0,_.jsx)(`svg`,{...E,...e,children:(0,_.jsx)(`rect`,{width:`20`,height:`15`,x:`2`,y:`4.5`,rx:`2`})}),se=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M3 7V5a2 2 0 0 1 2-2h2`}),(0,_.jsx)(`path`,{d:`M17 3h2a2 2 0 0 1 2 2v2`}),(0,_.jsx)(`path`,{d:`M21 17v2a2 2 0 0 1-2 2h-2`}),(0,_.jsx)(`path`,{d:`M7 21H5a2 2 0 0 1-2-2v-2`}),(0,_.jsx)(`rect`,{width:`10`,height:`8`,x:`7`,y:`8`,rx:`1`})]}),ce=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M8 3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h3`}),(0,_.jsx)(`path`,{d:`M16 3h3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-3`}),(0,_.jsx)(`path`,{d:`M12 20v2`}),(0,_.jsx)(`path`,{d:`M12 14v2`}),(0,_.jsx)(`path`,{d:`M12 8v2`}),(0,_.jsx)(`path`,{d:`M12 2v2`})]}),le=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M21 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3`}),(0,_.jsx)(`path`,{d:`M21 16v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3`}),(0,_.jsx)(`path`,{d:`M4 12H2`}),(0,_.jsx)(`path`,{d:`M10 12H8`}),(0,_.jsx)(`path`,{d:`M16 12h-2`}),(0,_.jsx)(`path`,{d:`M22 12h-2`})]}),ue=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8`}),(0,_.jsx)(`path`,{d:`M21 3v5h-5`})]}),de=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}),(0,_.jsx)(`path`,{d:`M3 3v5h5`})]}),fe=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`rect`,{width:`7`,height:`7`,x:`3`,y:`3`,rx:`1`}),(0,_.jsx)(`rect`,{width:`7`,height:`7`,x:`3`,y:`14`,rx:`1`}),(0,_.jsx)(`path`,{d:`M14 4h7`}),(0,_.jsx)(`path`,{d:`M14 9h7`}),(0,_.jsx)(`path`,{d:`M14 15h7`}),(0,_.jsx)(`path`,{d:`M14 20h7`})]}),pe=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M10 5H3`}),(0,_.jsx)(`path`,{d:`M12 19H3`}),(0,_.jsx)(`path`,{d:`M14 3v4`}),(0,_.jsx)(`path`,{d:`M16 17v4`}),(0,_.jsx)(`path`,{d:`M21 12h-9`}),(0,_.jsx)(`path`,{d:`M21 19h-5`}),(0,_.jsx)(`path`,{d:`M21 5h-7`}),(0,_.jsx)(`path`,{d:`M8 10v4`}),(0,_.jsx)(`path`,{d:`M8 12H3`})]}),me=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}),(0,_.jsx)(`path`,{d:`M9 3v18`}),(0,_.jsx)(`path`,{d:`m14 9 3 3-3 3`})]}),he=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}),(0,_.jsx)(`path`,{d:`M9 3v18`}),(0,_.jsx)(`path`,{d:`m16 15-3-3 3-3`})]}),ge=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M15 4V2`}),(0,_.jsx)(`path`,{d:`M15 16v-2`}),(0,_.jsx)(`path`,{d:`M8 9h2`}),(0,_.jsx)(`path`,{d:`M20 9h2`}),(0,_.jsx)(`path`,{d:`M17.8 11.8 19 13`}),(0,_.jsx)(`path`,{d:`M15 9h.01`}),(0,_.jsx)(`path`,{d:`M17.8 6.2 19 5`}),(0,_.jsx)(`path`,{d:`m3 21 9-9`}),(0,_.jsx)(`path`,{d:`M12.2 6.2 11 5`})]}),_e=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`path`,{d:`M12 3v18`}),(0,_.jsx)(`path`,{d:`m16 16 4-4-4-4`}),(0,_.jsx)(`path`,{d:`m8 8-4 4 4 4`})]}),ve=e=>(0,_.jsxs)(`svg`,{...E,...e,children:[(0,_.jsx)(`circle`,{cx:`9`,cy:`12`,r:`1`}),(0,_.jsx)(`circle`,{cx:`9`,cy:`5`,r:`1`}),(0,_.jsx)(`circle`,{cx:`9`,cy:`19`,r:`1`}),(0,_.jsx)(`circle`,{cx:`15`,cy:`12`,r:`1`}),(0,_.jsx)(`circle`,{cx:`15`,cy:`5`,r:`1`}),(0,_.jsx)(`circle`,{cx:`15`,cy:`19`,r:`1`})]}),ye=e=>(0,_.jsx)(`svg`,{...E,...e,children:(0,_.jsx)(`path`,{d:`M21 12a9 9 0 1 1-6.219-8.56`,children:(0,_.jsx)(`animateTransform`,{attributeType:`xml`,attributeName:`transform`,type:`rotate`,from:`0 12 12`,to:`360 12 12`,dur:`0.8s`,repeatCount:`indefinite`})})}),M=()=>{let e=(0,t.useContext)(m);if(!e)throw Error(`usePixediContext must be used within an PixediProvider`);return e},N={button:`_button_1vpzl_1`,default:`_default_1vpzl_35`,outline:`_outline_1vpzl_44`,ghost:`_ghost_1vpzl_54`,rect:`_rect_1vpzl_63`},P=({className:e=``,variant:t=`default`,children:n,ref:r,...i})=>(0,_.jsx)(`button`,{ref:r,className:`${N.button} ${N[t]} ${e}`.trim(),...i,children:n}),be={separator:`_separator_gp8ff_1`},xe=(0,t.forwardRef)(({className:e=``,orientation:t=`horizontal`,...n},r)=>(0,_.jsx)(`hr`,{ref:r,role:`separator`,"aria-orientation":t,"data-orientation":t,className:`${be.separator} ${e}`.trim(),...n}));xe.displayName=`Separator`;var F={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`},I={root:`_root_1qifp_8`,textRed:`_textRed_1qifp_78`,bgRed:`_bgRed_1qifp_81`,bgGreen:`_bgGreen_1qifp_84`,textGreen:`_textGreen_1qifp_87`,mask:`_mask_1qifp_90`,semibold:`_semibold_1qifp_93`,bold:`_bold_1qifp_97`,system:`_system_1qifp_101`,wrapper:`_wrapper_1qifp_111`,grid:`_grid_1qifp_118`,mobile:`_mobile_1qifp_130`,gridNoInfobar:`_gridNoInfobar_1qifp_134`},Se=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}},Ce=({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}=Se(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)}},we=({items:e,value:t,onChange:n,placeholder:r=`Select an option`,className:i=``,renderOption:a})=>{let{isOpen:o,selectedLabel:s,containerRef:c,triggerRef:l,contentRef:u,handleSelectItem:d,toggleOpen:f}=Ce({items:e,value:t,onChange:n});return(0,_.jsxs)(`div`,{ref:c,className:`${F.wrapper} ${i}`.trim(),"data-state":o?`open`:`closed`,children:[(0,_.jsxs)(`button`,{ref:l,type:`button`,className:F.trigger,onClick:f,children:[(0,_.jsx)(`span`,{children:s??r}),(0,_.jsx)(ee,{className:F.triggerArrow})]}),(0,_.jsx)(`div`,{ref:u,className:F.content,children:e.map((e,n)=>e.options?(0,_.jsxs)(`div`,{children:[(0,_.jsx)(`div`,{className:`${F.groupLabel} ${I.semibold}`,children:e.label}),e.options.map(e=>(0,_.jsxs)(`div`,{className:F.item,onClick:()=>d(e.value),children:[a?a(e):(0,_.jsx)(`span`,{className:F.itemLeft,children:e.label}),(0,_.jsxs)(`div`,{className:F.itemAddon,children:[e.rightLabel&&(0,_.jsx)(`span`,{children:e.rightLabel}),t===e.value&&(0,_.jsx)(D,{className:F.itemCheck}),t!==e.value&&(0,_.jsx)(`b`,{})]})]},e.value))]},`group-${n}`):(0,_.jsxs)(`div`,{className:F.item,onClick:()=>d(e.value),children:[a?a(e):(0,_.jsx)(`span`,{className:F.itemLeft,children:e.label}),(0,_.jsxs)(`div`,{className:F.itemAddon,children:[e.rightLabel&&(0,_.jsx)(`span`,{children:e.rightLabel}),t===e.value&&(0,_.jsx)(D,{className:F.itemCheck}),t!==e.value&&(0,_.jsx)(`b`,{})]})]},e.value))})]})},Te={input:`_input_kyavx_1`,numberClean:`_numberClean_kyavx_39`},Ee=({className:e=``,type:t=`text`,hideArrows:n=!0,ref:r,...i})=>{let a=t===`number`&&n?Te.numberClean:``;return(0,_.jsx)(`input`,{ref:r,type:t,className:`${Te.input} ${a} ${e}`.trim(),...i})},De={container:`_container_14vsv_1`,legend:`_legend_14vsv_4`,suffix:`_suffix_14vsv_13`},Oe=({label:e,className:t=``,style:n,ref:r,...i})=>(0,_.jsxs)(`div`,{className:`${De.container} ${t}`.trim(),style:n,children:[(0,_.jsx)(`span`,{className:De.legend,children:e}),(0,_.jsx)(Ee,{ref:r,type:`number`,...i}),(0,_.jsx)(`span`,{className:De.suffix,children:`px`})]}),ke={group:`_group_1e7jm_1`,save:`_save_1e7jm_6`,close:`_close_1e7jm_13`},L=({onSave:e,onClose:t,saving:n=!1,disabled:r=!1})=>(0,_.jsxs)(`div`,{className:ke.group,children:[(0,_.jsx)(P,{variant:`outline`,className:ke.save,"aria-label":`Save`,disabled:r||n,onClick:e,children:n?(0,_.jsx)(ye,{}):(0,_.jsx)(D,{})}),(0,_.jsx)(P,{variant:`outline`,className:ke.close,"aria-label":`Close`,disabled:n,onClick:t,children:(0,_.jsx)(O,{})})]}),R={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`},Ae=(e,t,n)=>{let r=n-t;return r<=0?0:(e-t)/r*100},je=new Set([`ArrowDown`,`ArrowLeft`,`ArrowRight`,`ArrowUp`,`End`,`Home`,`PageDown`,`PageUp`]),Me=({min:e,max:n,value:r,step:i=1,disabled:a=!1,isTooltip:o=!1,unit:s=``,className:c,onChange:l,onInput:u,ref:d})=>{let f=(0,t.useRef)(null),p=(0,t.useRef)(null),m=r??e,[h,g]=(0,t.useState)(m);(0,t.useImperativeHandle)(d,()=>({getValue:()=>h}),[h]);let v=t=>{g(t);let r=Ae(t,e,n);f.current?.style.setProperty(`--slider-progress`,`${r}%`)},y=()=>{!a&&p.current&&l?.(Number(p.current.value))};return(0,t.useLayoutEffect)(()=>{if(!p.current)return;r!==void 0&&(p.current.value=String(r));let t=Number(p.current.value);g(t);let i=Ae(t,e,n);f.current?.style.setProperty(`--slider-progress`,`${i}%`)},[r,e,n]),(0,_.jsxs)(`div`,{ref:f,className:`${R.sliderContainer} ${a?R.disabled:``} ${c||``}`,style:{"--slider-progress":`${Ae(m,e,n)}%`},children:[(0,_.jsxs)(`div`,{className:R.sliderTrack,children:[(0,_.jsx)(`div`,{className:R.sliderRange}),(0,_.jsx)(`div`,{className:R.sliderThumb}),o&&(0,_.jsx)(`div`,{className:R.sliderTooltip,children:`${h}${s}`})]}),(0,_.jsx)(`input`,{ref:p,type:`range`,min:e,max:n,step:i,defaultValue:m,disabled:a,onInput:e=>{let t=Number(e.currentTarget.value);v(t),u?.(t)},onPointerUp:()=>{y()},onKeyUp:e=>{je.has(e.key)&&y()},className:R.hiddenInput})]})},z={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`},Ne=(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}},B=({children:e,position:t=`top`,className:n=``,classNameTitle:r=``,style:i})=>{let{containerRef:a,trackRef:o,titleRefs:s,titles:c,isAnimated:l,cssVars:u,handleMouseMove:d,handleMouseLeave:f}=Ne(e,t);return(0,_.jsxs)(`div`,{ref:a,onMouseMove:d,onMouseLeave:f,onBlur:f,className:z.tooltip,style:{...u,...i},children:[(0,_.jsx)(`div`,{"data-position":t,className:`${z.container} ${n}`,children:e}),(0,_.jsx)(`div`,{"aria-hidden":`true`,"data-position":t,className:`${z.popup} ${l?z.animated:``}`,children:(0,_.jsx)(`div`,{className:z.mask,children:(0,_.jsx)(`div`,{ref:o,"data-position":t,className:z.track,children:c.map((e,t)=>(0,_.jsx)(`div`,{ref:e=>{s.current[t]=e},className:`${z.title} ${r}`,children:e},t))})})})]})},Pe=(0,t.createContext)(void 0),Fe=()=>{let e=(0,t.useContext)(Pe),n=(0,t.useRef)({dx:0,dy:0});return e??n};function V(e,t,n){return Math.min(Math.max(e,t),n)}function Ie(e,{dx:t,dy:n}){e.style.transform=`translate(calc(-50% + ${t}px), ${n}px)`}function Le(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 Re=({surfaceRef:e})=>{let n=w(),r=Fe(),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,Ie(t,e)},c=()=>{let e=Le(t,r.current);if(!e)return;let{dx:n,dy:i}=r.current;s({dx:V(n,e.minDx,e.maxDx),dy:V(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:V(a.current.dx+(r-t.x),n.minDx,n.maxDx),dy:V(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=Le(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`)}}},ze={surfaceTool:`_surfaceTool_1skmt_1`,content:`_content_1skmt_18`,drag:`_drag_1skmt_22`},H=({children:e,className:n=``,ref:r})=>{let i=(0,t.useRef)(null),{handleDragStart:a}=Re({surfaceRef:i});return(0,_.jsxs)(`div`,{ref:e=>{i.current=e,r&&(r.current=e)},className:ze.surfaceTool,children:[(0,_.jsx)(ve,{className:ze.drag,onMouseDown:a,onTouchStart:a}),(0,_.jsx)(`div`,{className:`${ze.content} ${n}`,children:e})]})},Be=({children:e})=>(0,_.jsx)(Pe,{value:(0,t.useRef)({dx:0,dy:0}),children:e}),Ve=1920,He=.85,Ue=[{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`}]}],We=[{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%`}],Ge=[{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`}],U=32,Ke=(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<U&&(f=U,u=o-e-U);let t=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-t,p<U&&(p=U,d=s-t-U)}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<U||p<U)return l}return{x:u,y:d,w:f,h:p}},qe=(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<U&&(f=U);let e=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-e,p<U&&(p=U,d=s-e-U)}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<U||p<U)return l}return{x:u,y:d,w:f,h:p}},Je=(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<U&&(p=U);let e=o-c.w-c.x;d+=i-n,d<0&&(d=0),f=o-d-e,f<U&&(f=U,d=o-e-U)}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<U||p<U)return l}return{x:d,y:u,w:f,h:p}},Ye=(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<U&&(f=U),p+=a-r,p+d>s&&(p=s-d),p<U&&(p=U);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<U||p<U)return l}return{x:u,y:d,w:f,h:p}},Xe=(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(U,U*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}},Ze=(e,t,n,r,i,a,o,s,c,l,u)=>t?e===`tl`?Ke(t,n,r,i,a,o,s,c,l,u):e===`tr`?qe(t,n,r,i,a,o,s,c,l,u):e===`bl`?Je(t,n,r,i,a,o,s,c,l,u):e===`br`?Ye(t,n,r,i,a,o,s,c,l,u):{x:0,y:0,w:0,h:0}:Xe(e,n,r,i,a,o,s,c,l),W=(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)}},Qe=(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}},G=e=>Math.abs(Math.round(e/90))%2==1,$e=(e,t,n,r)=>G(n)===G(r)?{width:e,height:t}:{width:t,height:e},et=async e=>{let{width:t,height:n}=e,r=Math.min(1,Ve/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:He})};function tt(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 nt=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 rt(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 et(s),{width:l,height:u}=s,d=tt(s);return s.close(),{newBlob:o,previewBlob:c,mimeType:a,width:l,height:u,isAlpha:d}}}}var K=(e,t,n)=>Math.max(t,Math.min(n,e)),it=(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]]],at=e=>(Math.round(e/90)%4+4)%4*90,ot=e=>{switch(at(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]]}},st=(e,t)=>[[e?-1:1,0],[0,t?-1:1]],ct=(e,t,n)=>it(st(t,n),ot(-e)),lt=e=>[+(e[0][0]<0||e[0][1]<0),+(e[1][0]<0||e[1][1]<0)],q=(e,t,n)=>{let r=lt(e);return[e[0][0]*t+e[0][1]*n+r[0],e[1][0]*t+e[1][1]*n+r[1]]},ut=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===d.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===d.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=ct(i,a,o),u=[q(l,e,t),q(l,e+n,t),q(l,e,t+s),q(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===d.FLIP){let e=G(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===d.ROTATE&&(i=c.action.args.degrees)}let s=r.w*t,c=r.h*n,l=G(i),u=l?c:s,f=l?s:c,p=e.at(-1)?.width||0,m=e.at(-1)?.height||0,h=e.filter(e=>e.action.name===d.FILTERS).at(-1),g=Object.entries(h?.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:p,newHeight:m,initWidth:t,initHeight:n,viewWidth:u,viewHeight:f,rotation:i,flipH:a,flipV:o,filters:g}},dt=e=>{let{box:t,flipH:n,flipV:r,rotation:i,newWidth:a,newHeight:o,initWidth:s,initHeight:c,viewWidth:l,viewHeight:u}=ut(e),f=e.filter(e=>e.action.name===d.FILTERS).at(-1)?.action.args,p=K(t.x,0,1),m=K(t.y,0,1),h={x:p,y:m,w:K(t.w,0,1-p),h:K(t.h,0,1-m)},g=at(i);return{...h.x===0&&h.y===0&&h.w===1&&h.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)}},...g===0?{}:{rotate:{degrees:g}},...n||r?{flip:{horizontal:n,vertical:r}}:{},...Math.round(l)!==a||Math.round(u)!==o?{resize:{width:a,height:o}}:{},...f?{filters:f}:{}}},ft=e=>{let[n,r]=(0,t.useState)(!1),{setImage:i,settings:a,history:o,originalBlob:s,setCurrentAction:c,resetHistory:l}=M();return{save:async()=>{if(!s)return;r(!0);let t=dt(o.items.slice(0,o.pointer+1));try{let n=await rt(s);t.crop&&n.crop(t.crop.x,t.crop.y,t.crop.w,t.crop.h),t.flip&&n.flip(t.flip.horizontal,t.flip.vertical),t.rotate&&n.rotate(t.rotate.degrees),t.resize&&n.resize(t.resize.width,t.resize.height),t.filters&&n.filters(t.filters);let{newBlob:r,previewBlob:o,mimeType:c,width:l,height:u,isAlpha:d}=await n.get(a),f=``;a.exportAs===`base64`&&(f=await nt(r)),await e(f||r),i({newBlob:r,previewBlob:o,mimeType:c,width:l,height:u,isAlpha:d})}catch(e){throw Error(`Error saving image: ${e}`,{cause:e})}finally{r(!1)}},reset:()=>{c(null),l()},isSaving:n}},J={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`},pt=({onBack:e,onSave:t,isMobile:n})=>{let{save:r,reset:i,isSaving:a}=ft(t),{sidebar:o,history:s,undo:c,redo:l,setSidebar:u,setCurrentAction:d}=M(),f=s.items.length>1&&!a,p=s.pointer===0,m=s.pointer===s.items.length-1,h=s.items.length<2||a,g=h||s.pointer===0;return(0,_.jsxs)(`div`,{className:J.header,children:[(0,_.jsxs)(`div`,{className:J.left,children:[(0,_.jsx)(`div`,{className:`${J.sidebarToggle} ${n?J.mobile:``}`,onClick:()=>{u(!o)},children:o?(0,_.jsx)(he,{className:J.sidebarIcon}):(0,_.jsx)(me,{className:J.sidebarIcon})}),(0,_.jsx)(P,{variant:`ghost`,className:N.rect,onClick:e,children:(0,_.jsx)(A,{})})]}),(0,_.jsxs)(`div`,{className:J.tools,children:[f&&(0,_.jsxs)(`div`,{className:J.history,children:[(0,_.jsx)(P,{variant:`outline`,disabled:p,className:N.rect,onClick:()=>{c(),d(null)},children:(0,_.jsx)(j,{})}),(0,_.jsxs)(`div`,{className:J.historyText,children:[s.pointer+1,`/`,s.items.length]}),(0,_.jsx)(P,{variant:`outline`,disabled:m,className:N.rect,onClick:()=>{l(),d(null)},children:(0,_.jsx)(te,{})})]}),(0,_.jsx)(P,{variant:`outline`,disabled:h,onClick:i,children:`Reset`}),(0,_.jsxs)(P,{disabled:g,onClick:r,children:[a?(0,_.jsx)(ye,{}):(0,_.jsx)(D,{}),`Save`]})]})]})},mt=(e,t)=>{let n=new CustomEvent(`crop-update`,{detail:t});e.dispatchEvent(n)},ht=(e,t)=>{let n=new CustomEvent(`clip-path-update`,{detail:t});e.dispatchEvent(n)},gt=(e,t)=>{let n=new CustomEvent(`resize-update`,{detail:t});e.dispatchEvent(n)},_t=(e,t)=>{let n=new CustomEvent(`filter-update`,{detail:t});e.dispatchEvent(n)},vt=(e,t)=>{let n=new CustomEvent(`compare-update`,{detail:t});e.dispatchEvent(n)},yt=()=>{let{showCompare:e,previewUrl:n,getLastFilter:r,getLastHistoryItem:i,setCurrentAction:a,setSidebar:o,toggleCompare:s,addToHistory:c,eventBus:l}=M(),{width:u,height:f}=i(),{action:p}=r()||{},m=p?.args||{},h=m?.url,g=We.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,D]=(0,t.useState)(!!h),O=(0,t.useMemo)(()=>Object.fromEntries(S.map(e=>[e.value,e.sliderValue])),[S]),k=()=>{s(),vt(l,50)},A=e=>{_t(l,{...O,[v]:e})},ee=S.find(e=>e.value===v);return(0,t.useEffect)(()=>{E?_t(l,{url:b}):_t(l,{...O,[v]:w})},[E,b,w,O,v,l]),{showCompare:e,previewUrl:n,isUrl:E,toggleIsUrl:()=>D(!E),filters:S,selectedFilter:v,selectedFilterItem:ee,selectedUrl:b,sliderValue:w,handleToggleCompare:k,handleSliderInput:A,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),_t(l,{url:e})},handleSave:()=>{c({width:u,height:f,action:{name:d.FILTERS,args:{...E?{url:b}:Object.fromEntries(S.map(e=>[e.value,e.sliderValue]))}}}),e&&s(),o(!0)},handleClose:()=>{e&&s(),a(null),o(!0)}}},Y={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`},bt=()=>{let{showCompare:e,previewUrl:t,isUrl:n,toggleIsUrl:r,filters:i,selectedFilter:a,selectedFilterItem:o,selectedUrl:s,sliderValue:c,handleToggleCompare:l,handleSliderInput:u,handleSliderChange:d,handleChange:f,handleChangeWhenUrl:p,handleSave:m,handleClose:h}=yt();return(0,_.jsxs)(H,{className:Y.tools,children:[!n&&o&&(0,_.jsxs)(`div`,{className:Y.row1,children:[(0,_.jsxs)(`div`,{className:Y.min,children:[o.min,o.unit]}),(0,_.jsx)(Me,{className:Y.slider,min:o.min,max:o.max,step:o.step,value:c,isTooltip:!0,unit:o.unit,onInput:u,onChange:d}),(0,_.jsxs)(`div`,{className:Y.max,children:[o.max,o.unit]})]}),(0,_.jsxs)(`div`,{className:Y.row2,children:[(0,_.jsx)(B,{position:`top`,children:(0,_.jsx)(P,{variant:`outline`,"aria-label":`Compare`,"data-tooltip":`Compare`,onClick:l,className:e?Y.active:``,children:(0,_.jsx)(_e,{})})}),(0,_.jsx)(B,{position:`top`,children:(0,_.jsx)(P,{variant:`outline`,"aria-label":n?`Filters`:`Predefined Filters`,"data-tooltip":n?`Filters`:`Predefined Filters`,onClick:r,children:n?(0,_.jsx)(pe,{}):(0,_.jsx)(ge,{})})}),(0,_.jsx)(we,{items:n?Ge:i,value:n?s:a,placeholder:`Select filter`,className:Y.select,renderOption:n?e=>(0,_.jsx)(`div`,{className:Y.option,children:(0,_.jsx)(`img`,{src:t,alt:e.label,style:{filter:`url(#${e.value})`}})}):void 0,onChange:n?p:f}),(0,_.jsx)(L,{onSave:m,onClose:h})]})]})},xt=({isClipped:e,isFilter:n})=>{let{history:r,previewUrl:i,currentAction:a,getLastRotation:o,eventBus:s}=M(),c=(0,t.useRef)(null),l=(0,t.useRef)(null),u=(0,t.useRef)(a?.name),f=(0,t.useRef)(i);(0,t.useLayoutEffect)(()=>{let e=u.current,t=a?.name,n=f.current!==i;if(u.current=t,f.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 p=r.items.slice(0,r.pointer+1);if(a){let{width:e,height:t}=r.items.at(r.pointer);p.push({...a.name===d.ROTATE?$e(e,t,o(),a.args.degrees):{width:e,height:t},action:a})}let m=ut(p);return(0,t.useEffect)(()=>{e&&c.current&&(c.current.style.transition=`none`),a?.name!==d.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:f}=u;return s.addEventListener(`resize-update`,t,{signal:f}),s.addEventListener(`clip-path-update`,r,{signal:f}),s.addEventListener(`filter-update`,i,{signal:f}),s.addEventListener(`compare-update`,o,{signal:f}),()=>u.abort()},[e,n,a?.name,s]),{previewRef:c,imageRef:l,previewUrl:i,...m}},X={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`},St=({isClipped:e,isFilter:t,faded:n,style:r={}})=>{let{showCompare:i}=M(),{previewRef:a,imageRef:o,previewUrl:s,box:c,boxWidth:l,boxHeight:u,viewWidth:d,viewHeight:f,rotation:p,flipH:m,flipV:h,filters:g}=xt({isClipped:e,isFilter:t});return(0,_.jsxs)(`div`,{ref:a,className:`${X.preview} ${n?X.faded:``}`,style:{aspectRatio:`${d} / ${f}`,...r},children:[i&&!t&&(0,_.jsx)(`div`,{className:`${X.label} ${X.before}`,children:`Before`}),i&&t&&(0,_.jsx)(`div`,{className:`${X.label} ${X.after}`,children:`After`}),(0,_.jsx)(`div`,{className:X.rotate,style:{width:`${l/d*100}%`,height:`${u/f*100}%`,transform:`translate(-50%, -50%) rotate(${p}deg)`},children:(0,_.jsx)(`div`,{className:X.flip,style:{transform:`scale(${m?-1:1}, ${h?-1:1})`},children:(0,_.jsx)(`img`,{ref:o,className:X.image,src:s,alt:`Preview Image`,style:{width:`${1/c.w*100}%`,height:`${1/c.h*100}%`,left:`${-(c.x/c.w)*100}%`,top:`${-(c.y/c.h)*100}%`,filter:g.join(` `)}})})})]})},Ct=({compareRef:e})=>{let{eventBus:n}=M(),r=w(),i=(0,t.useRef)(null),a=(0,t.useRef)(null);return(0,t.useEffect)(()=>{a.current=0,vt(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}%`,vt(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`)}}},wt=()=>{let{showCompare:e,getLastHistoryItem:n}=M(),{width:r,height:i}=n(),a=(0,t.useRef)(null),{handleDragStart:o}=Ct({compareRef:a});return(0,_.jsxs)(`div`,{className:Y.filterInteract,style:{aspectRatio:`${r} / ${i}`},children:[(0,_.jsx)(St,{isFilter:!0}),e&&(0,_.jsx)(_.Fragment,{children:(0,_.jsx)(`div`,{ref:a,className:Y.compare,style:{left:`50%`},children:(0,_.jsx)(`div`,{className:Y.compareThumb,onMouseDown:o,onTouchStart:o,children:(0,_.jsx)(_e,{})})})})]})},Tt=()=>({saturate:100,grayscale:0,sepia:0,invert:0,hueRotate:0,brightness:100,contrast:100}),Et={[d.RESIZE]:{icon:(0,_.jsx)(se,{}),label:`Resize`},[d.CROP]:{icon:(0,_.jsx)(ne,{}),label:`Crop`},[d.PRESET_CROP]:{icon:(0,_.jsx)(fe,{}),label:`Presets`},[d.FLIP]:{icon:(0,_.jsx)(ce,{}),label:`Flip`},[d.ROTATE]:{icon:(0,_.jsx)(ue,{}),label:`Rotate`},[d.FILTERS]:{icon:(0,_.jsx)(pe,{}),label:`Filters`}},Dt=e=>Et[e]??null,Ot=()=>{let{settings:e,currentAction:t,showCompare:n,toggleCompare:r,getLastRotation:i,getLastHistoryItem:a,setCurrentAction:o,setSidebar:s}=M(),c=e?.tools||[],l=t?.name,{width:u,height:f}=a();return{click:e=>{if(c.includes(e)&&l===e){o(null);return}switch(e){case d.RESIZE:o({name:d.RESIZE,args:{width:u,height:f}});break;case d.CROP:o({name:d.CROP,args:{id:`freeform`,ratio:u/f,isFree:!0}});break;case d.PRESET_CROP:o({name:d.PRESET_CROP,args:{id:`facebook-post`,ratio:1200/630,isFree:!1,preset:{width:1200,height:630}}});break;case d.FLIP:o({name:d.FLIP,args:{horizontal:!1,vertical:!1}});break;case d.ROTATE:o({name:d.ROTATE,args:{degrees:i()}});break;case d.FILTERS:o({name:d.FILTERS,args:Tt()});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`},kt=({isMobile:e})=>{let{settings:t,sidebar:n,currentAction:r}=M(),i=t?.tools||[],a=r?.name,{click:o}=Ot();return(0,_.jsx)(`nav`,{className:`${Z.sidebar} ${e?Z.mobile:``} ${e&&n?Z.open:``}`,children:(0,_.jsx)(B,{position:`right`,className:Z.tooltip,children:i.map(e=>{let t=Dt(e);if(!t)return null;let{icon:n,label:r}=t;return(0,_.jsx)(`div`,{className:`${Z.item} ${a===e?Z.selected:``}`,onClick:()=>o(e),"data-tooltip":r,"aria-label":r,children:n},e)})})})},At={infobar:`_infobar_895qe_1`},jt=e=>e<1024?`${e} B`:e<1024*1024?`${(e/1024).toFixed(2)} KB`:`${(e/1024/1024).toFixed(2)} MB`,Mt=()=>{let{originalBlob:e,getLastHistoryItem:t}=M(),{width:n,height:r}=t();return(0,_.jsxs)(`div`,{className:At.infobar,children:[(0,_.jsx)(`div`,{className:At.filesize,children:e?jt(e.size):`0 B`}),(0,_.jsxs)(`div`,{className:At.sizes,children:[n,` / `,r]})]})},Nt=15,Pt=200,Ft=2,It=(e,t,n)=>{let r=Math.min(Pt,Math.max(Nt,e));return{scale:r,width:Math.round(r/100*t),height:Math.round(r/100*n)}},Lt=()=>{let{getLastHistoryItem:e,setCurrentAction:n,addToHistory:r,setSidebar:i,eventBus:a}=M(),{width:o,height:s}=e(),[c,l]=(0,t.useState)(o),[u,f]=(0,t.useState)(s),[p,m]=(0,t.useState)(100),h=(0,t.useRef)(p),g=(0,t.useRef)(0),_=(0,t.useRef)(null),v=(0,t.useCallback)(e=>{let t=It(e,o,s);l(t.width),f(t.height),m(t.scale),h.current=t.scale,gt(a,t.scale)},[s,o,a]),y=(e,t)=>{let n=Number.parseInt(e,10);if(!Number.isFinite(n)){v(100);return}v(n/t*100)};return(0,t.useEffect)(()=>{let e=e=>{let t=_.current?.parentElement,n=e.composedPath?.()[0]??e.target;return n instanceof Node&&!!t?.contains(n)},t=t=>{e(t)&&v(h.current-Math.sign(t.deltaY)*Ft)},n=t=>{e(t)&&(g.current=t.touches[0].clientY)},r=t=>{if(!e(t))return;let n=t.touches[0].clientY,r=g.current-n;Math.abs(r)<10||(v(h.current+Math.sign(r)*Ft),g.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()},[v]),{resizeRef:_,width:c,height:u,scale:p,currentWidth:o,currentHeight:s,setWidth:l,setHeight:f,handleWidthBlur:e=>{y(e.target.value,o)},handleHeightBlur:e=>{y(e.target.value,s)},save:()=>{r({width:c,height:u,action:{name:d.RESIZE,args:{width:c,height:u}}}),gt(a,100),i(!0)},close:()=>{gt(a,100),n(null),i(!0)}}},Q={resize:`_resize_1sbig_1`,toolsLock:`_toolsLock_1sbig_5`,indicatorWrapper:`_indicatorWrapper_1sbig_10`,indicator:`_indicator_1sbig_10`},Rt=()=>{let{resizeRef:e,width:t,height:n,scale:r,currentWidth:i,currentHeight:a,setWidth:o,setHeight:s,handleWidthBlur:c,handleHeightBlur:l,save:u,close:d}=Lt();return(0,_.jsxs)(H,{ref:e,className:Q.resize,children:[(0,_.jsx)(`div`,{className:Q.indicatorWrapper,children:(0,_.jsx)(`div`,{className:Q.indicator,style:{width:`${r/2}%`}})}),(0,_.jsx)(Oe,{value:t,name:`width`,label:`Width`,style:{width:`88px`},onChange:e=>o(Number(e.target.value)),onBlur:c}),(0,_.jsx)(k,{className:Q.toolsLock}),(0,_.jsx)(Oe,{value:n,name:`height`,label:`Height`,style:{width:`88px`},onChange:e=>s(Number(e.target.value)),onBlur:l}),(0,_.jsx)(L,{onSave:u,onClose:d,disabled:t===i&&n===a})]})},$={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`},zt=()=>{let{getLastHistoryItem:e}=M(),n=w(),r=(0,t.useRef)(null),{handleCropStart:i,initialCrop:a}=Zt({boxRef:r}),{width:o,height:s}=e(),{x:c,y:l,w:u,h:d}=a;return(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(St,{isClipped:!0,style:{clipPath:`xywh(${c}% ${l}% ${u}% ${d}%)`}}),(0,_.jsx)(`div`,{className:$.wrapper,style:{aspectRatio:`${o} / ${s}`},children:(0,_.jsxs)(`div`,{ref:r,className:$.box,style:{width:`${u}%`,height:`${d}%`,top:`${l}%`,left:`${c}%`},children:[(0,_.jsx)(Wt,{}),n?(0,_.jsx)(Qt,{onMouseDown:i}):(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(Gt,{onMouseDown:i}),(0,_.jsx)($t,{})]})]})})]})},Bt=[{id:`freeform`,icon:(0,_.jsx)(ne,{}),label:`Freeform`},{id:`origin`,icon:(0,_.jsx)(re,{}),label:`Original`},{id:`1:1`,icon:(0,_.jsx)(ie,{}),label:`1 : 1`},{id:`4:3`,icon:(0,_.jsx)(oe,{}),label:`4 : 3`},{id:`16:9`,icon:(0,_.jsx)(ae,{}),label:`16 : 9`}],Vt=({value:e,onChange:t})=>(0,_.jsx)(`div`,{className:$.group,children:(0,_.jsx)(B,{position:`top`,children:Bt.map(n=>(0,_.jsx)(P,{variant:`outline`,className:`${$.groupBtn} ${e===n.id?$.active:``}`,onClick:()=>t(n.id),"aria-label":n.label,"data-tooltip":n.label,children:n.icon},n.id))})}),Ht=()=>{let{setCurrentAction:e,currentAction:n,getLastHistoryItem:r,addToHistory:i,setSidebar:a,eventBus:o}=M(),{width:s,height:c}=r(),{name:l,args:u}=n||{},f=l===d.CROP?u?.id:``,p=s/c,m=(0,t.useRef)({x:0,y:0,w:0,h:0});return(0,t.useEffect)(()=>{if(n?.name!==d.CROP)return;let e=W(n.args.ratio,s,c);m.current=e;let t=e=>{m.current=e.detail};return o.addEventListener(`clip-path-update`,t),()=>{o.removeEventListener(`clip-path-update`,t)}},[n,s,c,o]),{currentValue:f,handleChange:t=>{t!==f&&e({name:d.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!==d.CROP)return;let e=n.args?.preset?.width||Math.round(s*m.current.w/100),t=n.args?.preset?.height||Math.round(c*m.current.h/100);i({width:e,height:t,action:{name:d.CROP,args:{...n.args,...m.current}}}),a(!0)},handleClose:()=>{e(null),a(!0)}}},Ut=()=>{let{currentValue:e,handleChange:t,handleSave:n,handleClose:r}=Ht();return(0,_.jsxs)(H,{children:[(0,_.jsx)(Vt,{value:e,onChange:t}),(0,_.jsx)(L,{onSave:n,onClose:r})]})},Wt=()=>(0,_.jsxs)(`div`,{className:$.linesBox,children:[(0,_.jsx)(`span`,{className:`${$.line} ${$.lineV}`}),(0,_.jsx)(`span`,{className:`${$.line} ${$.lineH}`})]}),Gt=({onMouseDown:e})=>(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerTopLeft}`,onMouseDown:t=>e(t,`tl`,`nwse`)}),(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerTopRight}`,onMouseDown:t=>e(t,`tr`,`nesw`)}),(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerBottomRight}`,onMouseDown:t=>e(t,`br`,`nwse`)}),(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerBottomLeft}`,onMouseDown:t=>e(t,`bl`,`nesw`)})]});function Kt(e,t,n){return Math.min(Math.max(e,t),n)}function qt(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 Jt(e){let{width:t,height:n}=e.getBoundingClientRect();return{frameW:t,frameH:n}}function Yt({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 Xt({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 Zt=({boxRef:e})=>{let{currentAction:n,getLastHistoryItem:r,eventBus:i}=M(),a=w(),{width:o,height:s}=r(),c=n?.name===d.CROP||n?.name===d.PRESET_CROP,l=c?n.args.ratio:1,u=!c||n.args.isFree,f=(0,t.useMemo)(()=>W(l,o,s),[l,o,s]),p=(0,t.useRef)(null),m=(0,t.useRef)(``),h=(0,t.useRef)(f),g=(0,t.useRef)(f);return(0,t.useEffect)(()=>{h.current=f,ht(i,f)},[f,i]),(0,t.useEffect)(()=>{let t=(e,t)=>{h.current=t,qt(e,t),mt(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)}),ht(i,t)},n=e=>{e.preventDefault(),g.current=h.current;let t=`clientX`in e?e.clientX:e.touches[0].clientX,n=`clientY`in e?e.clientY:e.touches[0].clientY;p.current={x:t,y:n},document.body.style.cursor=`move`},r=t=>{if(!e.current||!p.current)return;t.preventDefault();let n=e.current,r=n.parentElement;if(!r)return;let{frameW:i,frameH:o}=Jt(r);if(m.current){a(t,n,i,o);return}c(t,n,i,o)},a=(e,n,r,i)=>{if(!p.current)return;let a=`clientX`in e?e.clientX:e.touches[0].clientX,c=`clientY`in e?e.clientY:e.touches[0].clientY,d=Xt(Ze(m.current,u,l,p.current.x,p.current.y,a,c,r,i,Yt(g.current,r,i),Yt(h.current,r,i)),r,i);t(n,u?d:Qe(d,l,o,s))},c=(e,n,r,i)=>{if(!p.current)return;let{x:a,y:o,w:s,h:c}=g.current,l=`clientX`in e?e.clientX:e.touches[0].clientX,u=`clientY`in e?e.clientY:e.touches[0].clientY,d=(l-p.current.x)/r*100,f=(u-p.current.y)/i*100;t(n,{x:Kt(a+d,0,Math.max(0,100-s)),y:Kt(o+f,0,Math.max(0,100-c)),w:s,h:c})},d=()=>{e.current&&(p.current=null,m.current=``,e.current.style.cursor=`move`,document.body.style.cursor=`auto`)};if(!e.current)return;let f=new AbortController,{signal:_}=f;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:_}),()=>f.abort()},[u,l,o,s,e,i]),{handleCropStart:(t,n,r)=>{if(!e.current)return;t.stopPropagation(),t.preventDefault(),g.current=h.current;let i=`clientX`in t?t.clientX:t.touches[0].clientX,o=`clientY`in t?t.clientY:t.touches[0].clientY;p.current={x:i,y:o},m.current=n,a||(e.current.style.cursor=`${r}-resize`,document.body.style.cursor=`${r}-resize`)},initialCrop:f}},Qt=({onMouseDown:e})=>(0,_.jsx)(`div`,{className:$.mobileBorder,children:(0,_.jsx)(`div`,{className:$.mobilePointer,onTouchStart:t=>e(t,`br`,`nwse`)})}),$t=()=>{let e=(0,t.useRef)(null),n=(0,t.useRef)(null),r=(0,t.useRef)(null),i=(0,t.useRef)(null),{currentAction:a,getLastHistoryItem:o,eventBus:s}=M(),{width:c,height:l}=o();return(0,t.useEffect)(()=>{if(!(a?.name===d.CROP||a?.name===d.PRESET_CROP))return;let{xP:t,yP:o,wP:u,hP:f}=W(a.args.ratio,c,l);e.current&&(e.current.textContent=t.toString()),n.current&&(n.current.textContent=o.toString()),r.current&&(r.current.textContent=u.toString()),i.current&&(i.current.textContent=f.toString());let p=t=>{let{x:a,y:o,w:s,h:c}=t.detail;e.current&&(e.current.textContent=a.toString()),n.current&&(n.current.textContent=o.toString()),r.current&&(r.current.textContent=s.toString()),i.current&&(i.current.textContent=c.toString())};return s.addEventListener(`crop-update`,p),()=>{s.removeEventListener(`crop-update`,p)}},[a,l,c,s]),(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(`div`,{className:`${$.info} ${$.infoX}`,children:(0,_.jsx)(`b`,{ref:e})}),(0,_.jsx)(`div`,{className:`${$.info} ${$.infoY}`,children:(0,_.jsx)(`b`,{ref:n})}),(0,_.jsx)(`div`,{className:`${$.info} ${$.infoW}`,children:(0,_.jsx)(`b`,{ref:r})}),(0,_.jsx)(`div`,{className:`${$.info} ${$.infoH}`,children:(0,_.jsx)(`b`,{ref:i})})]})},en=Ue.map(e=>e.options).flat(),tn=()=>en,nn=()=>{let{currentAction:e,getLastHistoryItem:n,addToHistory:r,setSidebar:i,setCurrentAction:a,eventBus:o}=M(),{width:s,height:c}=n(),l=e?.name===d.PRESET_CROP&&en.some(t=>t.value===e.args.id)?e.args.id:``,u=(0,t.useRef)({x:0,y:0,w:0,h:0});return(0,t.useEffect)(()=>{if(e?.name!==d.PRESET_CROP)return;let t=W(e.args.ratio,s,c);u.current=t;let n=e=>{u.current=e.detail};return o.addEventListener(`clip-path-update`,n),()=>{o.removeEventListener(`clip-path-update`,n)}},[e,s,c,o]),{currentValue:l,presetsData:Ue,handleChange:e=>{if(!e)return;let t=tn().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}};a({name:d.PRESET_CROP,args:n})},handleSave:()=>{!e||e.name!==d.PRESET_CROP||(r({width:e.args?.preset?.width||0,height:e.args?.preset?.height||0,action:{name:d.CROP,args:{...e.args,...u.current}}}),i(!0))},handleClose:()=>{a(null),i(!0)}}},rn={select:`_select_1ieak_1`},an=()=>{let{currentValue:e,presetsData:t,handleChange:n,handleSave:r,handleClose:i}=nn();return(0,_.jsxs)(H,{children:[(0,_.jsx)(we,{value:e,placeholder:`Select preset`,onChange:n,items:t,className:rn.select}),(0,_.jsx)(L,{onSave:r,onClose:i})]})},on=()=>{let{getLastHistoryItem:e,setCurrentAction:n,addToHistory:r,setSidebar:i}=M(),{width:a,height:o}=e(),[s,c]=(0,t.useState)(!1),[l,u]=(0,t.useState)(!1),f=(e,t)=>{n({name:d.FLIP,args:{horizontal:e,vertical:t}})};return{flipHorizontal:s,flipVertical:l,handleFlipHorizontal:()=>{let e=!s;c(e),f(e,l)},handleFlipVertical:()=>{let e=!l;u(e),f(s,e)},handleSave:()=>{r({width:a,height:o,action:{name:d.FLIP,args:{horizontal:s,vertical:l}}}),i(!0)},handleClose:()=>{n(null),i(!0)}}},sn={btnH:`_btnH_15adi_1`,btnV:`_btnV_15adi_7`},cn=()=>{let{flipHorizontal:e,flipVertical:t,handleFlipHorizontal:n,handleFlipVertical:r,handleSave:i,handleClose:a}=on();return(0,_.jsxs)(H,{children:[(0,_.jsx)(`div`,{className:sn.scGroup,children:(0,_.jsxs)(B,{position:`top`,children:[(0,_.jsx)(P,{variant:`outline`,className:sn.btnH,onClick:n,"aria-label":`Horizontal`,"data-tooltip":`Horizontal`,children:(0,_.jsx)(ce,{style:{color:e?`var(--accent-blue)`:`var(--foreground)`}})}),(0,_.jsx)(P,{variant:`outline`,className:sn.btnV,onClick:r,"aria-label":`Vertical`,"data-tooltip":`Vertical`,children:(0,_.jsx)(le,{style:{color:t?`var(--accent-blue)`:`var(--foreground)`}})})]})}),(0,_.jsx)(L,{disabled:!e&&!t,onSave:i,onClose:a})]})},ln=()=>{let{getLastRotation:e,getLastHistoryItem:n,addToHistory:r,setSidebar:i,setCurrentAction:a}=M(),{width:o,height:s}=n(),c=e(),l=(0,t.useRef)(c),u=(0,t.useRef)(c);return{handleRotate:e=>{u.current+=e,a({name:d.ROTATE,args:{degrees:u.current}})},handleSave:()=>{r({...$e(o,s,l.current,u.current),action:{name:d.ROTATE,args:{degrees:u.current}}}),i(!0)},handleClose:()=>{a(null),i(!0)}}},un={btnH:`_btnH_15adi_1`,btnV:`_btnV_15adi_7`},dn=()=>{let{handleRotate:e,handleSave:t,handleClose:n}=ln();return(0,_.jsxs)(H,{children:[(0,_.jsx)(`div`,{className:un.scGroup,children:(0,_.jsxs)(B,{position:`top`,children:[(0,_.jsx)(P,{variant:`outline`,className:un.btnH,onClick:()=>e(90),"aria-label":`+90°`,"data-tooltip":`+90°`,children:(0,_.jsx)(ue,{})}),(0,_.jsx)(P,{variant:`outline`,className:un.btnV,onClick:()=>e(-90),"aria-label":`-90°`,"data-tooltip":`-90°`,children:(0,_.jsx)(de,{})})]})}),(0,_.jsx)(L,{onSave:t,onClose:n})]})},fn={frame:`_frame_1p6kh_1`},pn=()=>{let{currentAction:e}=M(),t=e?.name===d.RESIZE,n=e?.name===d.CROP,r=e?.name===d.PRESET_CROP,i=e?.name===d.FLIP,a=e?.name===d.ROTATE,o=e?.name===d.FILTERS,s=n||r;return(0,_.jsx)(`div`,{className:`${fn.frame} ${s?I.mask:``}`,children:(0,_.jsxs)(Be,{children:[(0,_.jsx)(St,{faded:s}),t&&(0,_.jsx)(Rt,{}),n&&(0,_.jsx)(Ut,{}),r&&(0,_.jsx)(an,{}),i&&(0,_.jsx)(cn,{}),a&&(0,_.jsx)(dn,{}),o&&(0,_.jsx)(bt,{}),(n||r)&&(0,_.jsx)(zt,{},e?.args?.id),o&&(0,_.jsx)(wt,{})]})})},mn=()=>(0,_.jsx)(`svg`,{style:{position:`absolute`,width:0,height:0,overflow:`hidden`},xmlns:`http://www.w3.org/2000/svg`,children:(0,_.jsxs)(`defs`,{children:[(0,_.jsx)(`filter`,{id:`vintage`,children:(0,_.jsx)(`feColorMatrix`,{type:`matrix`,values:`
|
|
7
|
+
<%s key={someKey} {...props} />`,o,p,m,p),oe[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),ee=Symbol.for(`react.activity`),D=Symbol.for(`react.client.reference`),O=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,te=Object.prototype.hasOwnProperty,ne=Array.isArray,k=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var re,A={},ie=m.react_stack_bottom_frame.bind(m,o)(),ae=k(i(o)),oe={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>O.recentlyCreatedOwnerStacks++;return d(e,t,n,!1,r?Error(`react-stack-top-frame`):ie,r?k(i(e)):ae)},e.jsxs=function(e,t,n){var r=1e4>O.recentlyCreatedOwnerStacks++;return d(e,t,n,!0,r?Error(`react-stack-top-frame`):ie,r?k(i(e)):ae)}})()})),_=c(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=h():t.exports=g()}))(),v={xmlns:`http://w3.org`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`},y=e=>(0,_.jsx)(`svg`,{...v,...e,children:(0,_.jsx)(`path`,{d:`M20 6 9 17l-5-5`})}),b=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M18 6 6 18`}),(0,_.jsx)(`path`,{d:`m6 6 12 12`})]}),x=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`11`,x:`3`,y:`11`,rx:`2`,ry:`2`}),(0,_.jsx)(`path`,{d:`M7 11V7a5 5 0 0 1 10 0v4`})]}),S=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`m12 19-7-7 7-7`}),(0,_.jsx)(`path`,{d:`M19 12H5`})]}),C=e=>(0,_.jsx)(`svg`,{...v,...e,children:(0,_.jsx)(`path`,{d:`m6 9 6 6 6-6`})}),w=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M3 7v6h6`}),(0,_.jsx)(`path`,{d:`M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13`})]}),T=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M21 7v6h-6`}),(0,_.jsx)(`path`,{d:`M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7`})]}),E=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M6 2v14a2 2 0 0 0 2 2h14`}),(0,_.jsx)(`path`,{d:`M18 22V8a2 2 0 0 0-2-2H2`})]}),ee=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`}),(0,_.jsx)(`circle`,{cx:`9`,cy:`9`,r:`2`}),(0,_.jsx)(`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`})]}),D=e=>(0,_.jsx)(`svg`,{...v,...e,children:(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`})}),O=e=>(0,_.jsx)(`svg`,{...v,...e,children:(0,_.jsx)(`rect`,{width:`20`,height:`12`,x:`2`,y:`6`,rx:`2`})}),te=e=>(0,_.jsx)(`svg`,{...v,...e,children:(0,_.jsx)(`rect`,{width:`20`,height:`15`,x:`2`,y:`4.5`,rx:`2`})}),ne=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M3 7V5a2 2 0 0 1 2-2h2`}),(0,_.jsx)(`path`,{d:`M17 3h2a2 2 0 0 1 2 2v2`}),(0,_.jsx)(`path`,{d:`M21 17v2a2 2 0 0 1-2 2h-2`}),(0,_.jsx)(`path`,{d:`M7 21H5a2 2 0 0 1-2-2v-2`}),(0,_.jsx)(`rect`,{width:`10`,height:`8`,x:`7`,y:`8`,rx:`1`})]}),k=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M8 3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h3`}),(0,_.jsx)(`path`,{d:`M16 3h3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-3`}),(0,_.jsx)(`path`,{d:`M12 20v2`}),(0,_.jsx)(`path`,{d:`M12 14v2`}),(0,_.jsx)(`path`,{d:`M12 8v2`}),(0,_.jsx)(`path`,{d:`M12 2v2`})]}),re=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M21 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3`}),(0,_.jsx)(`path`,{d:`M21 16v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3`}),(0,_.jsx)(`path`,{d:`M4 12H2`}),(0,_.jsx)(`path`,{d:`M10 12H8`}),(0,_.jsx)(`path`,{d:`M16 12h-2`}),(0,_.jsx)(`path`,{d:`M22 12h-2`})]}),A=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8`}),(0,_.jsx)(`path`,{d:`M21 3v5h-5`})]}),ie=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}),(0,_.jsx)(`path`,{d:`M3 3v5h5`})]}),ae=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`rect`,{width:`7`,height:`7`,x:`3`,y:`3`,rx:`1`}),(0,_.jsx)(`rect`,{width:`7`,height:`7`,x:`3`,y:`14`,rx:`1`}),(0,_.jsx)(`path`,{d:`M14 4h7`}),(0,_.jsx)(`path`,{d:`M14 9h7`}),(0,_.jsx)(`path`,{d:`M14 15h7`}),(0,_.jsx)(`path`,{d:`M14 20h7`})]}),oe=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M10 5H3`}),(0,_.jsx)(`path`,{d:`M12 19H3`}),(0,_.jsx)(`path`,{d:`M14 3v4`}),(0,_.jsx)(`path`,{d:`M16 17v4`}),(0,_.jsx)(`path`,{d:`M21 12h-9`}),(0,_.jsx)(`path`,{d:`M21 19h-5`}),(0,_.jsx)(`path`,{d:`M21 5h-7`}),(0,_.jsx)(`path`,{d:`M8 10v4`}),(0,_.jsx)(`path`,{d:`M8 12H3`})]}),se=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}),(0,_.jsx)(`path`,{d:`M9 3v18`}),(0,_.jsx)(`path`,{d:`m14 9 3 3-3 3`})]}),ce=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`}),(0,_.jsx)(`path`,{d:`M9 3v18`}),(0,_.jsx)(`path`,{d:`m16 15-3-3 3-3`})]}),le=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M15 4V2`}),(0,_.jsx)(`path`,{d:`M15 16v-2`}),(0,_.jsx)(`path`,{d:`M8 9h2`}),(0,_.jsx)(`path`,{d:`M20 9h2`}),(0,_.jsx)(`path`,{d:`M17.8 11.8 19 13`}),(0,_.jsx)(`path`,{d:`M15 9h.01`}),(0,_.jsx)(`path`,{d:`M17.8 6.2 19 5`}),(0,_.jsx)(`path`,{d:`m3 21 9-9`}),(0,_.jsx)(`path`,{d:`M12.2 6.2 11 5`})]}),ue=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`path`,{d:`M12 3v18`}),(0,_.jsx)(`path`,{d:`m16 16 4-4-4-4`}),(0,_.jsx)(`path`,{d:`m8 8-4 4 4 4`})]}),de=e=>(0,_.jsxs)(`svg`,{...v,...e,children:[(0,_.jsx)(`circle`,{cx:`9`,cy:`12`,r:`1`}),(0,_.jsx)(`circle`,{cx:`9`,cy:`5`,r:`1`}),(0,_.jsx)(`circle`,{cx:`9`,cy:`19`,r:`1`}),(0,_.jsx)(`circle`,{cx:`15`,cy:`12`,r:`1`}),(0,_.jsx)(`circle`,{cx:`15`,cy:`5`,r:`1`}),(0,_.jsx)(`circle`,{cx:`15`,cy:`19`,r:`1`})]}),fe=e=>(0,_.jsx)(`svg`,{...v,...e,children:(0,_.jsx)(`path`,{d:`M21 12a9 9 0 1 1-6.219-8.56`,children:(0,_.jsx)(`animateTransform`,{attributeType:`xml`,attributeName:`transform`,type:`rotate`,from:`0 12 12`,to:`360 12 12`,dur:`0.8s`,repeatCount:`indefinite`})})}),j={button:`_button_1vpzl_1`,default:`_default_1vpzl_35`,outline:`_outline_1vpzl_44`,ghost:`_ghost_1vpzl_54`,rect:`_rect_1vpzl_63`},M=({className:e=``,variant:t=`default`,children:n,ref:r,...i})=>(0,_.jsx)(`button`,{ref:r,className:`${j.button} ${j[t]} ${e}`.trim(),...i,children:n}),pe={separator:`_separator_gp8ff_1`},me=(0,t.forwardRef)(({className:e=``,orientation:t=`horizontal`,...n},r)=>(0,_.jsx)(`hr`,{ref:r,role:`separator`,"aria-orientation":t,"data-orientation":t,className:`${pe.separator} ${e}`.trim(),...n}));me.displayName=`Separator`;var N={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`},P={root:`_root_187c5_8`,textRed:`_textRed_187c5_78`,bgRed:`_bgRed_187c5_81`,bgGreen:`_bgGreen_187c5_84`,textGreen:`_textGreen_187c5_87`,mask:`_mask_187c5_90`,semibold:`_semibold_187c5_93`,bold:`_bold_187c5_97`,system:`_system_187c5_101`,wrapper:`_wrapper_187c5_111`,grid:`_grid_187c5_118`,mobile:`_mobile_187c5_130`,gridNoInfobar:`_gridNoInfobar_187c5_134`,gridSingleTool:`_gridSingleTool_187c5_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:n,placeholder:r=`Select an option`,className:i=``,renderOption:a})=>{let{isOpen:o,selectedLabel:s,containerRef:c,triggerRef:l,contentRef:u,handleSelectItem:d,toggleOpen:f}=ge({items:e,value:t,onChange:n});return(0,_.jsxs)(`div`,{ref:c,className:`${N.wrapper} ${i}`.trim(),"data-state":o?`open`:`closed`,children:[(0,_.jsxs)(`button`,{ref:l,type:`button`,className:N.trigger,onClick:f,children:[(0,_.jsx)(`span`,{children:s??r}),(0,_.jsx)(C,{className:N.triggerArrow})]}),(0,_.jsx)(`div`,{ref:u,className:N.content,children:e.map((e,n)=>e.options?(0,_.jsxs)(`div`,{children:[(0,_.jsx)(`div`,{className:`${N.groupLabel} ${P.semibold}`,children:e.label}),e.options.map(e=>(0,_.jsxs)(`div`,{className:N.item,onClick:()=>d(e.value),children:[a?a(e):(0,_.jsx)(`span`,{className:N.itemLeft,children:e.label}),(0,_.jsxs)(`div`,{className:N.itemAddon,children:[e.rightLabel&&(0,_.jsx)(`span`,{children:e.rightLabel}),t===e.value&&(0,_.jsx)(y,{className:N.itemCheck}),t!==e.value&&(0,_.jsx)(`b`,{})]})]},e.value))]},`group-${n}`):(0,_.jsxs)(`div`,{className:N.item,onClick:()=>d(e.value),children:[a?a(e):(0,_.jsx)(`span`,{className:N.itemLeft,children:e.label}),(0,_.jsxs)(`div`,{className:N.itemAddon,children:[e.rightLabel&&(0,_.jsx)(`span`,{children:e.rightLabel}),t===e.value&&(0,_.jsx)(y,{className:N.itemCheck}),t!==e.value&&(0,_.jsx)(`b`,{})]})]},e.value))})]})},ve={input:`_input_kyavx_1`,numberClean:`_numberClean_kyavx_39`},ye=({className:e=``,type:t=`text`,hideArrows:n=!0,ref:r,...i})=>{let a=t===`number`&&n?ve.numberClean:``;return(0,_.jsx)(`input`,{ref:r,type:t,className:`${ve.input} ${a} ${e}`.trim(),...i})},be={container:`_container_14vsv_1`,legend:`_legend_14vsv_4`,suffix:`_suffix_14vsv_13`},xe=({label:e,className:t=``,style:n,ref:r,...i})=>(0,_.jsxs)(`div`,{className:`${be.container} ${t}`.trim(),style:n,children:[(0,_.jsx)(`span`,{className:be.legend,children:e}),(0,_.jsx)(ye,{ref:r,type:`number`,...i}),(0,_.jsx)(`span`,{className:be.suffix,children:`px`})]}),Se={group:`_group_1e7jm_1`,save:`_save_1e7jm_6`,close:`_close_1e7jm_13`},F=({onSave:e,onClose:t,saving:n=!1,disabled:r=!1})=>(0,_.jsxs)(`div`,{className:Se.group,children:[(0,_.jsx)(M,{variant:`outline`,className:Se.save,"aria-label":`Save`,disabled:r||n,onClick:e,children:n?(0,_.jsx)(fe,{}):(0,_.jsx)(y,{})}),(0,_.jsx)(M,{variant:`outline`,className:Se.close,"aria-label":`Close`,disabled:n,onClick:t,children:(0,_.jsx)(b,{})})]}),I={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:n,value:r,step:i=1,disabled:a=!1,isTooltip:o=!1,unit:s=``,className:c,onChange:l,onInput:u,ref:d})=>{let f=(0,t.useRef)(null),p=(0,t.useRef)(null),m=r??e,[h,g]=(0,t.useState)(m);(0,t.useImperativeHandle)(d,()=>({getValue:()=>h}),[h]);let v=t=>{g(t);let r=Ce(t,e,n);f.current?.style.setProperty(`--slider-progress`,`${r}%`)},y=()=>{!a&&p.current&&l?.(Number(p.current.value))};return(0,t.useLayoutEffect)(()=>{if(!p.current)return;r!==void 0&&(p.current.value=String(r));let t=Number(p.current.value);g(t);let i=Ce(t,e,n);f.current?.style.setProperty(`--slider-progress`,`${i}%`)},[r,e,n]),(0,_.jsxs)(`div`,{ref:f,className:`${I.sliderContainer} ${a?I.disabled:``} ${c||``}`,style:{"--slider-progress":`${Ce(m,e,n)}%`},children:[(0,_.jsxs)(`div`,{className:I.sliderTrack,children:[(0,_.jsx)(`div`,{className:I.sliderRange}),(0,_.jsx)(`div`,{className:I.sliderThumb}),o&&(0,_.jsx)(`div`,{className:I.sliderTooltip,children:`${h}${s}`})]}),(0,_.jsx)(`input`,{ref:p,type:`range`,min:e,max:n,step:i,defaultValue:m,disabled:a,onInput:e=>{let t=Number(e.currentTarget.value);v(t),u?.(t)},onPointerUp:()=>{y()},onKeyUp:e=>{we.has(e.key)&&y()},className:I.hiddenInput})]})},L={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}},R=({children:e,position:t=`top`,className:n=``,classNameTitle:r=``,style:i})=>{let{containerRef:a,trackRef:o,titleRefs:s,titles:c,isAnimated:l,cssVars:u,handleMouseMove:d,handleMouseLeave:f}=Ee(e,t);return(0,_.jsxs)(`div`,{ref:a,onMouseMove:d,onMouseLeave:f,onBlur:f,className:L.tooltip,style:{...u,...i},children:[(0,_.jsx)(`div`,{"data-position":t,className:`${L.container} ${n}`,children:e}),(0,_.jsx)(`div`,{"aria-hidden":`true`,"data-position":t,className:`${L.popup} ${l?L.animated:``}`,children:(0,_.jsx)(`div`,{className:L.mask,children:(0,_.jsx)(`div`,{ref:o,"data-position":t,className:L.track,children:c.map((e,t)=>(0,_.jsx)(`div`,{ref:e=>{s.current[t]=e},className:`${L.title} ${r}`,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},z=()=>{let[e]=(0,t.useState)(()=>je());return e},Me={sm:480,md:768,lg:1024,xl:1280},B={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),V=()=>{let e=(0,t.useContext)(Pe);if(!e)throw Error(`usePixediContext must be used within an PixediProvider`);return e},H=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<H&&(f=H,u=o-e-H);let t=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-t,p<H&&(p=H,d=s-t-H)}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<H||p<H)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<H&&(f=H);let e=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-e,p<H&&(p=H,d=s-e-H)}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<H||p<H)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<H&&(p=H);let e=o-c.w-c.x;d+=i-n,d<0&&(d=0),f=o-d-e,f<H&&(f=H,d=o-e-H)}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<H||p<H)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<H&&(f=H),p+=a-r,p+d>s&&(p=s-d),p<H&&(p=H);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<H||p<H)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(H,H*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),U=(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}},W=e=>Math.abs(Math.round(e/90))%2==1,He=(e,t,n,r)=>W(n)===W(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 G=(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)],$e=(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]]},et=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===B.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===B.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=[$e(l,e,t),$e(l,e+n,t),$e(l,e,t+s),$e(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===B.FLIP){let e=W(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===B.ROTATE&&(i=c.action.args.degrees)}let s=r.w*t,c=r.h*n,l=W(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===B.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}},tt=e=>{let{box:t,flipH:n,flipV:r,rotation:i,newWidth:a,newHeight:o,initWidth:s,initHeight:c,viewWidth:l,viewHeight:u}=et(e),d=e.filter(e=>e.action.name===B.FILTERS).at(-1)?.action.args,f=G(t.x,0,1),p=G(t.y,0,1),m={x:f,y:p,w:G(t.w,0,1-f),h:G(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}:{}}},nt=()=>{let[e,n]=(0,t.useState)(!1),{setImage:r,settings:i,history:a,originalBlob:o,setCurrentAction:s,resetHistory:c,onSave:l}=V();return{save:async t=>{if(!o||e)return;n(!0);let s=tt([...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}},K=()=>{let{singleToolUI:e,addToHistory:t,setCurrentAction:n,setSidebar:r,onBack:i}=V(),{save:a,isSaving:o}=nt();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}},rt=(0,t.createContext)(void 0),it=()=>{let e=(0,t.useContext)(rt),n=(0,t.useRef)({dx:0,dy:0});return e??n};function at(e,t,n){return Math.min(Math.max(e,t),n)}function ot(e,{dx:t,dy:n}){e.style.transform=`translate(calc(-50% + ${t}px), ${n}px)`}function st(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 ct=({surfaceRef:e})=>{let n=z(),r=it(),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,ot(t,e)},c=()=>{let e=st(t,r.current);if(!e)return;let{dx:n,dy:i}=r.current;s({dx:at(n,e.minDx,e.maxDx),dy:at(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:at(a.current.dx+(r-t.x),n.minDx,n.maxDx),dy:at(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=st(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`)}}},lt={surfaceTool:`_surfaceTool_1skmt_1`,content:`_content_1skmt_18`,drag:`_drag_1skmt_22`},q=({children:e,className:n=``,ref:r})=>{let i=(0,t.useRef)(null),{handleDragStart:a}=ct({surfaceRef:i});return(0,_.jsxs)(`div`,{ref:e=>{i.current=e,r&&(r.current=e)},className:lt.surfaceTool,children:[(0,_.jsx)(de,{className:lt.drag,onMouseDown:a,onTouchStart:a}),(0,_.jsx)(`div`,{className:`${lt.content} ${n}`,children:e})]})},ut=(e,t)=>{let n=new CustomEvent(`crop-update`,{detail:t});e.dispatchEvent(n)},dt=(e,t)=>{let n=new CustomEvent(`clip-path-update`,{detail:t});e.dispatchEvent(n)},ft=(e,t)=>{let n=new CustomEvent(`resize-update`,{detail:t});e.dispatchEvent(n)},pt=(e,t)=>{let n=new CustomEvent(`filter-update`,{detail:t});e.dispatchEvent(n)},mt=(e,t)=>{let n=new CustomEvent(`compare-update`,{detail:t});e.dispatchEvent(n)},ht=()=>{let{showCompare:e,previewUrl:n,getLastFilter:r,getLastHistoryItem:i,toggleCompare:a,eventBus:o}=V(),{commit:s,close:c,isSaving:l}=K(),{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]),O=()=>{a(),mt(o,50)},te=e=>{pt(o,{...D,[v]:e})},ne=S.find(e=>e.value===v);return(0,t.useEffect)(()=>{E?pt(o,{url:b}):pt(o,{...D,[v]:w})},[E,b,w,D,v,o]),{showCompare:e,previewUrl:n,isUrl:E,toggleIsUrl:()=>ee(!E),filters:S,selectedFilter:v,selectedFilterItem:ne,selectedUrl:b,sliderValue:w,handleToggleCompare:O,handleSliderInput:te,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),pt(o,{url:e})},handleSave:()=>{e&&a(),s({width:u,height:d,action:{name:B.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`},gt=()=>{let{showCompare:e,previewUrl:t,isUrl:n,toggleIsUrl:r,filters:i,selectedFilter:a,selectedFilterItem:o,selectedUrl:s,sliderValue:c,handleToggleCompare:l,handleSliderInput:u,handleSliderChange:d,handleChange:f,handleChangeWhenUrl:p,handleSave:h,handleClose:g,isSaving:v}=ht();return(0,_.jsxs)(q,{className:J.tools,children:[!n&&o&&(0,_.jsxs)(`div`,{className:J.row1,children:[(0,_.jsxs)(`div`,{className:J.min,children:[o.min,o.unit]}),(0,_.jsx)(Te,{className:J.slider,min:o.min,max:o.max,step:o.step,value:c,isTooltip:!0,unit:o.unit,onInput:u,onChange:d}),(0,_.jsxs)(`div`,{className:J.max,children:[o.max,o.unit]})]}),(0,_.jsxs)(`div`,{className:J.row2,children:[(0,_.jsx)(R,{position:`top`,children:(0,_.jsx)(M,{variant:`outline`,"aria-label":`Compare`,"data-tooltip":`Compare`,onClick:l,className:e?J.active:``,children:(0,_.jsx)(ue,{})})}),(0,_.jsx)(R,{position:`top`,children:(0,_.jsx)(M,{variant:`outline`,"aria-label":n?`Filters`:`Predefined Filters`,"data-tooltip":n?`Filters`:`Predefined Filters`,onClick:r,children:n?(0,_.jsx)(oe,{}):(0,_.jsx)(le,{})})}),(0,_.jsx)(_e,{items:n?m:i,value:n?s:a,placeholder:`Select filter`,className:J.select,renderOption:n?e=>(0,_.jsx)(`div`,{className:J.option,children:(0,_.jsx)(`img`,{src:t,alt:e.label,style:{filter:`url(#${e.value})`}})}):void 0,onChange:n?p:f}),(0,_.jsx)(F,{onSave:h,onClose:g,saving:v})]})]})},_t=({isClipped:e,isFilter:n})=>{let{history:r,previewUrl:i,currentAction:a,getLastRotation:o,eventBus:s}=V(),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===B.ROTATE?He(e,t,o(),a.args.degrees):{width:e,height:t},action:a})}let p=et(f);return(0,t.useEffect)(()=>{e&&c.current&&(c.current.style.transition=`none`),a?.name!==B.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`},vt=({isClipped:e,isFilter:t,faded:n,style:r={}})=>{let{showCompare:i}=V(),{previewRef:a,imageRef:o,previewUrl:s,box:c,boxWidth:l,boxHeight:u,viewWidth:d,viewHeight:f,rotation:p,flipH:m,flipV:h,filters:g}=_t({isClipped:e,isFilter:t});return(0,_.jsxs)(`div`,{ref:a,className:`${Y.preview} ${n?Y.faded:``}`,style:{aspectRatio:`${d} / ${f}`,...r},children:[i&&!t&&(0,_.jsx)(`div`,{className:`${Y.label} ${Y.before}`,children:`Before`}),i&&t&&(0,_.jsx)(`div`,{className:`${Y.label} ${Y.after}`,children:`After`}),(0,_.jsx)(`div`,{className:Y.rotate,style:{width:`${l/d*100}%`,height:`${u/f*100}%`,transform:`translate(-50%, -50%) rotate(${p}deg)`},children:(0,_.jsx)(`div`,{className:Y.flip,style:{transform:`scale(${m?-1:1}, ${h?-1:1})`},children:(0,_.jsx)(`img`,{ref:o,className:Y.image,src:s,alt:`Preview Image`,style:{width:`${1/c.w*100}%`,height:`${1/c.h*100}%`,left:`${-(c.x/c.w)*100}%`,top:`${-(c.y/c.h)*100}%`,filter:g.join(` `)}})})})]})},yt=({compareRef:e})=>{let{eventBus:n}=V(),r=z(),i=(0,t.useRef)(null),a=(0,t.useRef)(null);return(0,t.useEffect)(()=>{a.current=0,mt(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}%`,mt(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`)}}},bt=()=>{let{showCompare:e,getLastHistoryItem:n}=V(),{width:r,height:i}=n(),a=(0,t.useRef)(null),{handleDragStart:o}=yt({compareRef:a});return(0,_.jsxs)(`div`,{className:J.filterInteract,style:{aspectRatio:`${r} / ${i}`},children:[(0,_.jsx)(vt,{isFilter:!0}),e&&(0,_.jsx)(_.Fragment,{children:(0,_.jsx)(`div`,{ref:a,className:J.compare,style:{left:`50%`},children:(0,_.jsx)(`div`,{className:J.compareThumb,onMouseDown:o,onTouchStart:o,children:(0,_.jsx)(ue,{})})})})]})},xt=()=>({saturate:100,grayscale:0,sepia:0,invert:0,hueRotate:0,brightness:100,contrast:100}),St=(e,t,n)=>{if(e.length===1)switch(e[0]){case`resize`:return{name:B.RESIZE,args:{width:t,height:n}};case`crop`:return{name:B.CROP,args:{id:`freeform`,ratio:t/n,isFree:!0}};case`presetCrop`:return{name:B.PRESET_CROP,args:{id:`facebook-post`,ratio:1200/630,isFree:!1,preset:{width:1200,height:630}}};case`flip`:return{name:B.FLIP,args:{horizontal:!1,vertical:!1}};case`rotate`:return{name:B.ROTATE,args:{degrees:0}};case`filters`:return{name:B.FILTERS,args:xt()};default:return null}return null},Ct={tools:[`resize`,`crop`,`presetCrop`,`flip`,`rotate`,`filters`],infobar:!0,quality:.85,saveAsWEBP:!1,exportAs:`blob`},wt=(e,t,n,r,i,a,o)=>({history:{pointer:0,items:[{width:t,height:n,action:{name:B.INITIAL,args:null}}]},currentAction:St(o?.tools||[],t,n),previewUrl:i,originalBlob:r,mimeType:e,sidebar:!1,settings:o,isAlpha:a,showCompare:!1,singleToolUI:o?.tools?.length===1}),Tt=()=>{},Et=({children:e,mimeType:n,width:r,height:i,originalBlob:a,previewUrl:o,isAlpha:s,settings:c,onSave:l=Tt,onBack:u=Tt})=>{let[d,f]=(0,t.useState)(wt(n,r,i,a,o,s,c)),p=(0,t.useRef)(null);(0,t.useEffect)(()=>()=>{p.current&&=(URL.revokeObjectURL(p.current),null)},[]);let m=e=>f(t=>({...t,currentAction:e})),h=e=>f(t=>{let n=t.history.pointer+1,r=[...t.history.items.slice(0,n),e];return{...t,currentAction:null,history:{items:r,pointer:n}}}),g=()=>f(e=>({...e,showCompare:!e.showCompare})),v=()=>{let{items:e,pointer:t}=d.history;return e.at(t)??e.at(0)??{width:0,height:0,action:{name:B.INITIAL,args:null}}},y=()=>{let{items:e,pointer:t}=d.history;return e.filter((e,n)=>n<=t&&e.action.name===B.FILTERS).at(-1)??null},b=()=>{let{items:e,pointer:t}=d.history;if(e.length===0||t<0)return 0;let n=e.slice(0,t+1).findLast(e=>e.action.name===B.ROTATE);return n?.action.name===B.ROTATE?n.action.args.degrees:0},x=()=>f(e=>({...e,history:{items:[e.history.items[0]],pointer:0}})),S=()=>f(e=>e.history.pointer<=0?e:{...e,history:{...e.history,pointer:e.history.pointer-1}}),C=()=>f(e=>e.history.pointer>=e.history.items.length-1?e:{...e,history:{...e.history,pointer:e.history.pointer+1}}),w=e=>f(t=>({...t,sidebar:e})),T=(0,t.useMemo)(()=>new EventTarget,[]),E=e=>{p.current&&URL.revokeObjectURL(p.current),p.current=URL.createObjectURL(e.previewBlob),f(wt(e.mimeType,e.width,e.height,e.newBlob,p.current,e.isAlpha,c))};return(0,_.jsx)(Pe,{value:{...d,setImage:E,setCurrentAction:m,toggleCompare:g,getLastHistoryItem:v,getLastRotation:b,getLastFilter:y,addToHistory:h,resetHistory:x,undo:S,redo:C,setSidebar:w,eventBus:T,onSave:l,onBack:u},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`},Dt=({isMobile:e})=>{let{save:t,reset:n,isSaving:r}=nt(),{sidebar:i,history:a,undo:o,redo:s,setSidebar:c,setCurrentAction:l,onBack:u}=V(),d=a.items.length>1&&!r,f=a.pointer===0,p=a.pointer===a.items.length-1,m=a.items.length<2||r,h=m||a.pointer===0;return(0,_.jsxs)(`div`,{className:X.header,children:[(0,_.jsxs)(`div`,{className:X.left,children:[(0,_.jsx)(`div`,{className:`${X.sidebarToggle} ${e?X.mobile:``}`,onClick:()=>{c(!i)},children:i?(0,_.jsx)(ce,{className:X.sidebarIcon}):(0,_.jsx)(se,{className:X.sidebarIcon})}),(0,_.jsx)(M,{variant:`ghost`,className:j.rect,onClick:()=>u(),children:(0,_.jsx)(S,{})})]}),(0,_.jsxs)(`div`,{className:X.tools,children:[d&&(0,_.jsxs)(`div`,{className:X.history,children:[(0,_.jsx)(M,{variant:`outline`,disabled:f,className:j.rect,onClick:()=>{o(),l(null)},children:(0,_.jsx)(w,{})}),(0,_.jsxs)(`div`,{className:X.historyText,children:[a.pointer+1,`/`,a.items.length]}),(0,_.jsx)(M,{variant:`outline`,disabled:p,className:j.rect,onClick:()=>{s(),l(null)},children:(0,_.jsx)(T,{})})]}),(0,_.jsx)(M,{variant:`outline`,disabled:m,onClick:n,children:`Reset`}),(0,_.jsxs)(M,{disabled:h,onClick:()=>t(),children:[r?(0,_.jsx)(fe,{}):(0,_.jsx)(y,{}),`Save`]})]})]})},Ot={[B.RESIZE]:{icon:(0,_.jsx)(ne,{}),label:`Resize`},[B.CROP]:{icon:(0,_.jsx)(E,{}),label:`Crop`},[B.PRESET_CROP]:{icon:(0,_.jsx)(ae,{}),label:`Presets`},[B.FLIP]:{icon:(0,_.jsx)(k,{}),label:`Flip`},[B.ROTATE]:{icon:(0,_.jsx)(A,{}),label:`Rotate`},[B.FILTERS]:{icon:(0,_.jsx)(oe,{}),label:`Filters`}},kt=e=>Ot[e]??null,At=()=>{let{settings:e,currentAction:t,showCompare:n,toggleCompare:r,getLastRotation:i,getLastHistoryItem:a,setCurrentAction:o,setSidebar:s}=V(),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 B.RESIZE:o({name:B.RESIZE,args:{width:u,height:d}});break;case B.CROP:o({name:B.CROP,args:{id:`freeform`,ratio:u/d,isFree:!0}});break;case B.PRESET_CROP:o({name:B.PRESET_CROP,args:{id:`facebook-post`,ratio:1200/630,isFree:!1,preset:{width:1200,height:630}}});break;case B.FLIP:o({name:B.FLIP,args:{horizontal:!1,vertical:!1}});break;case B.ROTATE:o({name:B.ROTATE,args:{degrees:i()}});break;case B.FILTERS:o({name:B.FILTERS,args:xt()});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`},jt=({isMobile:e})=>{let{settings:t,sidebar:n,currentAction:r}=V(),i=t?.tools||[],a=r?.name,{click:o}=At();return(0,_.jsx)(`nav`,{className:`${Z.sidebar} ${e?Z.mobile:``} ${e&&n?Z.open:``}`,children:(0,_.jsx)(R,{position:`right`,className:Z.tooltip,children:i.map(e=>{let t=kt(e);if(!t)return null;let{icon:n,label:r}=t;return(0,_.jsx)(`div`,{className:`${Z.item} ${a===e?Z.selected:``}`,onClick:()=>o(e),"data-tooltip":r,"aria-label":r,children:n},e)})})})},Mt={infobar:`_infobar_895qe_1`},Nt=e=>e<1024?`${e} B`:e<1024*1024?`${(e/1024).toFixed(2)} KB`:`${(e/1024/1024).toFixed(2)} MB`,Pt=()=>{let{originalBlob:e,getLastHistoryItem:t}=V(),{width:n,height:r}=t();return(0,_.jsxs)(`div`,{className:Mt.infobar,children:[(0,_.jsx)(`div`,{className:Mt.filesize,children:e?Nt(e.size):`0 B`}),(0,_.jsxs)(`div`,{className:Mt.sizes,children:[n,` / `,r]})]})},Ft=15,It=200,Lt=2,Rt=(e,t,n)=>{let r=Math.min(It,Math.max(Ft,e));return{scale:r,width:Math.round(r/100*t),height:Math.round(r/100*n)}},zt=()=>{let{getLastHistoryItem:e,eventBus:n}=V(),{commit:r,close:i,isSaving:a}=K(),{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=Rt(e,o,s);l(t.width),d(t.height),p(t.scale),m.current=t.scale,ft(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)*Lt)},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)*Lt),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:B.RESIZE,args:{width:c,height:u}}}),ft(n,100)},close:()=>{ft(n,100),i()},isSaving:a}},Q={resize:`_resize_1sbig_1`,toolsLock:`_toolsLock_1sbig_5`,indicatorWrapper:`_indicatorWrapper_1sbig_10`,indicator:`_indicator_1sbig_10`},Bt=()=>{let{resizeRef:e,width:t,height:n,scale:r,currentWidth:i,currentHeight:a,setWidth:o,setHeight:s,handleWidthBlur:c,handleHeightBlur:l,save:u,close:d,isSaving:f}=zt();return(0,_.jsxs)(q,{ref:e,className:Q.resize,children:[(0,_.jsx)(`div`,{className:Q.indicatorWrapper,children:(0,_.jsx)(`div`,{className:Q.indicator,style:{width:`${r/2}%`}})}),(0,_.jsx)(xe,{value:t,name:`width`,label:`Width`,style:{width:`88px`},onChange:e=>o(Number(e.target.value)),onBlur:c}),(0,_.jsx)(x,{className:Q.toolsLock}),(0,_.jsx)(xe,{value:n,name:`height`,label:`Height`,style:{width:`88px`},onChange:e=>s(Number(e.target.value)),onBlur:l}),(0,_.jsx)(F,{onSave:u,onClose:d,saving:f,disabled:t===i&&n===a})]})},$={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`},Vt=()=>{let{getLastHistoryItem:e}=V(),n=z(),r=(0,t.useRef)(null),{handleCropStart:i,initialCrop:a}=$t({boxRef:r}),{width:o,height:s}=e(),{x:c,y:l,w:u,h:d}=a;return(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(vt,{isClipped:!0,style:{clipPath:`xywh(${c}% ${l}% ${u}% ${d}%)`}}),(0,_.jsx)(`div`,{className:$.wrapper,style:{aspectRatio:`${o} / ${s}`},children:(0,_.jsxs)(`div`,{ref:r,className:$.box,style:{width:`${u}%`,height:`${d}%`,top:`${l}%`,left:`${c}%`},children:[(0,_.jsx)(Kt,{}),n?(0,_.jsx)(en,{onMouseDown:i}):(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(qt,{onMouseDown:i}),(0,_.jsx)(tn,{})]})]})})]})},Ht=[{id:`freeform`,icon:(0,_.jsx)(E,{}),label:`Freeform`},{id:`origin`,icon:(0,_.jsx)(ee,{}),label:`Original`},{id:`1:1`,icon:(0,_.jsx)(D,{}),label:`1 : 1`},{id:`4:3`,icon:(0,_.jsx)(te,{}),label:`4 : 3`},{id:`16:9`,icon:(0,_.jsx)(O,{}),label:`16 : 9`}],Ut=({value:e,onChange:t})=>(0,_.jsx)(`div`,{className:$.group,children:(0,_.jsx)(R,{position:`top`,children:Ht.map(n=>(0,_.jsx)(M,{variant:`outline`,className:`${$.groupBtn} ${e===n.id?$.active:``}`,onClick:()=>t(n.id),"aria-label":n.label,"data-tooltip":n.label,children:n.icon},n.id))})}),Wt=()=>{let{setCurrentAction:e,currentAction:n,getLastHistoryItem:r,eventBus:i}=V(),{commit:a,close:o,isSaving:s}=K(),{width:c,height:l}=r(),{name:u,args:d}=n||{},f=u===B.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!==B.CROP)return;let e=U(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:B.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!==B.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:B.CROP,args:{...n.args,...m.current}}})},handleClose:o,isSaving:s}},Gt=()=>{let{currentValue:e,handleChange:t,handleSave:n,handleClose:r,isSaving:i}=Wt();return(0,_.jsxs)(q,{children:[(0,_.jsx)(Ut,{value:e,onChange:t}),(0,_.jsx)(F,{onSave:n,onClose:r,saving:i})]})},Kt=()=>(0,_.jsxs)(`div`,{className:$.linesBox,children:[(0,_.jsx)(`span`,{className:`${$.line} ${$.lineV}`}),(0,_.jsx)(`span`,{className:`${$.line} ${$.lineH}`})]}),qt=({onMouseDown:e})=>(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerTopLeft}`,onMouseDown:t=>e(t,`tl`,`nwse`)}),(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerTopRight}`,onMouseDown:t=>e(t,`tr`,`nesw`)}),(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerBottomRight}`,onMouseDown:t=>e(t,`br`,`nwse`)}),(0,_.jsx)(`div`,{className:`${$.pointer} ${$.pointerBottomLeft}`,onMouseDown:t=>e(t,`bl`,`nesw`)})]});function Jt(e,t,n){return Math.min(Math.max(e,t),n)}function Yt(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 Xt(e){let{width:t,height:n}=e.getBoundingClientRect();return{frameW:t,frameH:n}}function Zt({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 Qt({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 $t=({boxRef:e})=>{let{currentAction:n,getLastHistoryItem:r,eventBus:i}=V(),a=z(),{width:o,height:s}=r(),c=n?.name===B.CROP||n?.name===B.PRESET_CROP,l=c?n.args.ratio:1,u=!c||n.args.isFree,d=(0,t.useMemo)(()=>U(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,dt(i,d)},[d,i]),(0,t.useEffect)(()=>{let t=(e,t)=>{m.current=t,Yt(e,t),ut(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)}),dt(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}=Xt(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=Qt(Be(p.current,u,l,f.current.x,f.current.y,a,c,r,i,Zt(h.current,r,i),Zt(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:Jt(a+d,0,Math.max(0,100-s)),y:Jt(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}},en=({onMouseDown:e})=>(0,_.jsx)(`div`,{className:$.mobileBorder,children:(0,_.jsx)(`div`,{className:$.mobilePointer,onTouchStart:t=>e(t,`br`,`nwse`)})}),tn=()=>{let e=(0,t.useRef)(null),n=(0,t.useRef)(null),r=(0,t.useRef)(null),i=(0,t.useRef)(null),{currentAction:a,getLastHistoryItem:o,eventBus:s}=V(),{width:c,height:l}=o();return(0,t.useEffect)(()=>{if(!(a?.name===B.CROP||a?.name===B.PRESET_CROP))return;let{xP:t,yP:o,wP:u,hP:d}=U(a.args.ratio,c,l);e.current&&(e.current.textContent=t.toString()),n.current&&(n.current.textContent=o.toString()),r.current&&(r.current.textContent=u.toString()),i.current&&(i.current.textContent=d.toString());let f=t=>{let{x:a,y:o,w:s,h:c}=t.detail;e.current&&(e.current.textContent=a.toString()),n.current&&(n.current.textContent=o.toString()),r.current&&(r.current.textContent=s.toString()),i.current&&(i.current.textContent=c.toString())};return s.addEventListener(`crop-update`,f),()=>{s.removeEventListener(`crop-update`,f)}},[a,l,c,s]),(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(`div`,{className:`${$.info} ${$.infoX}`,children:(0,_.jsx)(`b`,{ref:e})}),(0,_.jsx)(`div`,{className:`${$.info} ${$.infoY}`,children:(0,_.jsx)(`b`,{ref:n})}),(0,_.jsx)(`div`,{className:`${$.info} ${$.infoW}`,children:(0,_.jsx)(`b`,{ref:r})}),(0,_.jsx)(`div`,{className:`${$.info} ${$.infoH}`,children:(0,_.jsx)(`b`,{ref:i})})]})},nn=f.map(e=>e.options).flat(),rn=()=>nn,an=()=>{let{currentAction:e,getLastHistoryItem:n,setCurrentAction:r,eventBus:i}=V(),{commit:a,close:o,isSaving:s}=K(),{width:c,height:l}=n(),u=e?.name===B.PRESET_CROP&&nn.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!==B.PRESET_CROP)return;let t=U(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=rn().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:B.PRESET_CROP,args:n})},handleSave:()=>{!e||e.name!==B.PRESET_CROP||a({width:e.args?.preset?.width||0,height:e.args?.preset?.height||0,action:{name:B.CROP,args:{...e.args,...d.current}}})},handleClose:o,isSaving:s}},on={select:`_select_1ieak_1`},sn=()=>{let{currentValue:e,presetsData:t,handleChange:n,handleSave:r,handleClose:i,isSaving:a}=an();return(0,_.jsxs)(q,{children:[(0,_.jsx)(_e,{value:e,placeholder:`Select preset`,onChange:n,items:t,className:on.select}),(0,_.jsx)(F,{onSave:r,onClose:i,saving:a})]})},cn=()=>{let{getLastHistoryItem:e,setCurrentAction:n}=V(),{commit:r,close:i,isSaving:a}=K(),{width:o,height:s}=e(),[c,l]=(0,t.useState)(!1),[u,d]=(0,t.useState)(!1),f=(e,t)=>{n({name:B.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:B.FLIP,args:{horizontal:c,vertical:u}}})},handleClose:i,isSaving:a}},ln={btnH:`_btnH_15adi_1`,btnV:`_btnV_15adi_7`},un=()=>{let{flipHorizontal:e,flipVertical:t,handleFlipHorizontal:n,handleFlipVertical:r,handleSave:i,handleClose:a,isSaving:o}=cn();return(0,_.jsxs)(q,{children:[(0,_.jsx)(`div`,{className:ln.scGroup,children:(0,_.jsxs)(R,{position:`top`,children:[(0,_.jsx)(M,{variant:`outline`,className:ln.btnH,onClick:n,"aria-label":`Horizontal`,"data-tooltip":`Horizontal`,children:(0,_.jsx)(k,{style:{color:e?`var(--accent-blue)`:`var(--foreground)`}})}),(0,_.jsx)(M,{variant:`outline`,className:ln.btnV,onClick:r,"aria-label":`Vertical`,"data-tooltip":`Vertical`,children:(0,_.jsx)(re,{style:{color:t?`var(--accent-blue)`:`var(--foreground)`}})})]})}),(0,_.jsx)(F,{disabled:!e&&!t,saving:o,onSave:i,onClose:a})]})},dn=()=>{let{getLastRotation:e,getLastHistoryItem:n,setCurrentAction:r}=V(),{commit:i,close:a,isSaving:o}=K(),{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:B.ROTATE,args:{degrees:d.current}})},handleSave:()=>{i({...He(s,c,u.current,d.current),action:{name:B.ROTATE,args:{degrees:d.current}}})},handleClose:a,isSaving:o}},fn={btnH:`_btnH_15adi_1`,btnV:`_btnV_15adi_7`},pn=()=>{let{handleRotate:e,handleSave:t,handleClose:n,isSaving:r}=dn();return(0,_.jsxs)(q,{children:[(0,_.jsx)(`div`,{className:fn.scGroup,children:(0,_.jsxs)(R,{position:`top`,children:[(0,_.jsx)(M,{variant:`outline`,className:fn.btnH,onClick:()=>e(90),"aria-label":`+90°`,"data-tooltip":`+90°`,children:(0,_.jsx)(A,{})}),(0,_.jsx)(M,{variant:`outline`,className:fn.btnV,onClick:()=>e(-90),"aria-label":`-90°`,"data-tooltip":`-90°`,children:(0,_.jsx)(ie,{})})]})}),(0,_.jsx)(F,{onSave:t,onClose:n,saving:r})]})},mn={frame:`_frame_1p6kh_1`},hn=()=>{let{currentAction:e}=V(),t=e?.name===B.RESIZE,n=e?.name===B.CROP,r=e?.name===B.PRESET_CROP,i=e?.name===B.FLIP,a=e?.name===B.ROTATE,o=e?.name===B.FILTERS,s=n||r;return(0,_.jsxs)(`div`,{className:`${mn.frame} ${s?P.mask:``}`,children:[(0,_.jsx)(vt,{faded:s}),t&&(0,_.jsx)(Bt,{}),n&&(0,_.jsx)(Gt,{}),r&&(0,_.jsx)(sn,{}),i&&(0,_.jsx)(un,{}),a&&(0,_.jsx)(pn,{}),o&&(0,_.jsx)(gt,{}),(n||r)&&(0,_.jsx)(Vt,{},e?.args?.id),o&&(0,_.jsx)(bt,{})]})},gn=()=>(0,_.jsx)(`svg`,{style:{position:`absolute`,width:0,height:0,overflow:`hidden`},xmlns:`http://www.w3.org/2000/svg`,children:(0,_.jsxs)(`defs`,{children:[(0,_.jsx)(`filter`,{id:`vintage`,children:(0,_.jsx)(`feColorMatrix`,{type:`matrix`,values:`
|
|
8
8
|
1.2 0 0 0 0.1
|
|
9
9
|
0 1.0 0 0 0.0
|
|
10
10
|
0 0 0.8 0 0.1
|
|
@@ -32,4 +32,4 @@ React keys must be passed directly to JSX without using spread:
|
|
|
32
32
|
-0.33 -0.33 -0.33 0 1
|
|
33
33
|
-0.2 -0.2 -0.2 0 0.6
|
|
34
34
|
-0.1 -0.1 -0.1 0 0.9
|
|
35
|
-
0 0 0 1 0`})}),(0,_.jsxs)(`filter`,{id:`plastic-wrap`,children:[(0,_.jsx)(`feSpecularLighting`,{surfaceScale:`5`,specularConstant:`1`,specularExponent:`20`,lightingColor:`#fff`,result:`light`,children:(0,_.jsx)(`feDistantLight`,{azimuth:`225`,elevation:`45`})}),(0,_.jsx)(`feBlend`,{mode:`overlay`,in:`SourceGraphic`,in2:`light`})]})]})});e.Pixedi=({image:e,onSave:n,onBack:r,theme:i=`light`,settings:a=
|
|
35
|
+
0 0 0 1 0`})}),(0,_.jsxs)(`filter`,{id:`plastic-wrap`,children:[(0,_.jsx)(`feSpecularLighting`,{surfaceScale:`5`,specularConstant:`1`,specularExponent:`20`,lightingColor:`#fff`,result:`light`,children:(0,_.jsx)(`feDistantLight`,{azimuth:`225`,elevation:`45`})}),(0,_.jsx)(`feBlend`,{mode:`overlay`,in:`SourceGraphic`,in2:`light`})]})]})});e.Pixedi=({image:e,onSave:n,onBack:r,theme:i=`light`,settings:a=Ct})=>{let[o,s]=(0,t.useState)(null),c=Ne(`sm`,o),l={...Ct,...a},{loading:u,error:d,mimeType:f,width:p,height:m,originalBlob:h,previewUrl:g,isAlpha:v}=Ae({src:e,skip:l?.tools?.length===0});return l?.tools?.length===0?(0,_.jsx)(`div`,{className:`${P.root} ${P.wrapper}`,"data-theme":i,children:(0,_.jsx)(`div`,{className:P.system,children:(0,_.jsx)(`div`,{className:P.textRed,children:`No tools selected.`})})}):u||d||!h||!f?(0,_.jsx)(`div`,{className:`${P.root} ${P.wrapper}`,"data-theme":i,children:(0,_.jsxs)(`div`,{className:P.system,children:[u&&(0,_.jsx)(fe,{style:{width:48,height:48}}),d&&(0,_.jsx)(`div`,{className:P.textRed,children:d}),!u&&!d&&(!h||!f)&&(0,_.jsx)(`div`,{className:P.textRed,children:`Failed to load image.`})]})}):(0,_.jsx)(Et,{mimeType:f,width:p,height:m,originalBlob:h,previewUrl:g,isAlpha:v,settings:l,onSave:n,onBack:r,children:(0,_.jsxs)(`div`,{ref:s,className:`${P.root} ${P.wrapper}`,"data-theme":i,children:[l?.tools?.includes(B.FILTERS)&&(0,_.jsx)(gn,{}),l?.tools?.length===1?(0,_.jsx)(`div`,{className:P.gridSingleTool,children:(0,_.jsx)(hn,{})}):(0,_.jsxs)(`div`,{className:`${l?.infobar?P.grid:P.gridNoInfobar} ${c?P.mobile:``}`,children:[(0,_.jsx)(Dt,{isMobile:c}),(0,_.jsx)(jt,{isMobile:c}),(0,_.jsx)(hn,{}),l?.infobar&&(0,_.jsx)(Pt,{})]})]})})}});
|