pixedi 1.0.6 → 1.2.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 +12 -0
- package/README.md +40 -10
- package/README.npm.md +40 -10
- package/dist/lib/index.js +1433 -1084
- package/dist/lib/index.umd.js +3 -24
- package/dist/widget/pixedi-widget.js +6 -27
- package/package.json +1 -2
- package/README.widget.md +0 -96
package/dist/lib/index.umd.js
CHANGED
|
@@ -1,28 +1,7 @@
|
|
|
1
|
-
(function(){try{if(typeof document<`u`){var e=document.createElement(`style`);e.appendChild(document.createTextNode(`.btn{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-left:8px;padding-right:8px;font-family:inherit;font-size:14px;font-weight:500;transition:background-color .2s,border-color .2s,opacity .2s;display:inline-flex}.btn:disabled{pointer-events:none;opacity:.5}.btn:active{transform:translateY(1px)}.btn svg{flex-shrink:0;width:16px;height:16px}.btn-default{background-color:var(--primary);color:var(--primary-foreground)}.btn-default:hover{opacity:.9}.btn-outline{border-color:var(--border);background-color:var(--background);color:var(--foreground)}.btn-outline:hover{background-color:var(--secondary)}.btn-ghost{color:var(--foreground);padding-left:8px;padding-right:8px}.btn-ghost:hover{background-color:var(--secondary)}.btn-rect{width:32px;height:32px}.btn-crop{border:1px solid var(--border);background-color:var(--background);color:var(--foreground);cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:12px;font-family:inherit;font-size:12px;transition:all .2s;display:inline-flex}.btn-crop:hover:not([aria-pressed=true]){background-color:var(--secondary)}.btn-crop[aria-pressed=true]{border-color:var(--accent-blue);background-color:var(--accent-blue-light);color:var(--foreground)}.btn-crop svg{flex-shrink:0;width:20px;height:20px}.btn-crop span{white-space:nowrap}.separator{background-color:var(--border);box-sizing:border-box;border:none;flex-shrink:0;display:block}.separator[data-orientation=horizontal]{width:100%;height:1px}.separator[data-orientation=vertical]{align-self:stretch;width:1px;height:100%;margin:0}.select-wrapper{box-sizing:border-box;width:100%;position:relative}.select-trigger{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-left:10px;padding-right:8px;font-family:inherit;font-size:14px;transition:border-color .2s;display:flex}.select-trigger:hover,.select-trigger:focus{border-color:var(--muted-foreground)}.select-trigger-arrow{width:16px;height:16px;color:var(--muted-foreground);transition:transform .2s}.select-wrapper[data-state=open] .select-trigger-arrow{transform:rotate(180deg)}.select-content{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}.select-content::-webkit-scrollbar{width:4px}.select-content::-webkit-scrollbar-track{background:0 0}.select-content::-webkit-scrollbar-thumb{background-color:var(--border);border-radius:10px}.select-wrapper[data-state=closed] .select-content{display:none}.select-group-label{color:var(--muted-foreground);-webkit-user-select:none;user-select:none;padding:8px 10px;font-size:12px;font-weight:500}.select-item{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}.select-item:hover{background-color:var(--secondary)}.select-item-left{font-size:14px;font-weight:400}.select-item-addon{align-items:center;gap:8px;display:flex}.select-item-addon>span{color:var(--muted-foreground);font-size:12px}.select-item-addon>svg{font-size:14px}.select-item-addon>b{flex-shrink:0;width:16px;height:16px}.select-item-right-container{align-items:center;gap:8px;display:flex}.select-item-right{color:var(--muted-foreground);font-size:14px}.select-item-check{width:16px;height:16px;color:var(--foreground);flex-shrink:0}.input{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-left:8px;padding-right:8px;font-family:inherit;font-size:14px;line-height:normal;transition:border-color .2s,box-shadow .2s;display:block}.input:hover:not(:disabled):not(:focus){border-color:var(--muted-foreground)}.input:focus{box-shadow:0 0 0 1px var(--ring)}.input:disabled{cursor:not-allowed;opacity:.5;background-color:var(--secondary)}.input::placeholder{color:var(--muted-foreground);opacity:1}.input-number-clean::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-number-clean::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.input-number-clean[type=number]{-moz-appearance:textfield}.input-pixel-container{position:relative}.input-pixel-legend{color:var(--muted-foreground);background:var(--background);margin-left:8px;padding-left:4px;padding-right:4px;font-size:12px;position:absolute;top:-9px}.input-pixel-suffix{color:var(--muted-foreground);pointer-events:none;-webkit-user-select:none;user-select:none;font-size:14px;position:absolute;bottom:2px;right:8px}.header{box-sizing:border-box;background-color:var(--background);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;height:48px;padding-left:8px;padding-right:8px;display:flex}.header-tools{gap:8px;display:flex}.header-history{align-items:center;gap:8px;display:flex}.header-history-text{color:var(--muted-foreground);font-size:14px}.crop-image{width:100%;height:100%;position:absolute;inset:0}.crop-box{cursor:move;position:absolute}.crop-tools{background-color:var(--background);box-sizing:border-box;border:1px solid var(--border);border-radius:4px;align-items:center;height:36px;padding-left:12px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.crop-tools-info{min-width:54px;margin-top:-2px;display:inline-block}.crop-tools-info-label{color:var(--muted-foreground);font-size:12px;line-height:12px}.crop-tools-info-value{font-size:14px;line-height:14px}.crop-b{background-color:var(--accent-blue);position:absolute}.crop-b-t{cursor:ns-resize;width:100%;height:2px;top:0;left:0}.crop-b-r{cursor:ew-resize;width:2px;height:100%;top:0;right:0}.crop-b-b{cursor:ns-resize;width:100%;height:2px;bottom:0;left:0;transform:translateY(1px)}.crop-b-l{cursor:ew-resize;width:2px;height:100%;top:0;left:-1px;transform:translate(1px)}.crop-l-box{pointer-events:none;position:absolute;inset:2px}.crop-l{border:1px dashed var(--color-white);opacity:.5;position:absolute}.crop-l-v{border-top:0;border-bottom:0;width:33%;height:100%;top:0;left:33%}.crop-l-h{border-left:0;border-right:0;width:100%;height:33%;top:33%;left:0}.crop-ps{box-sizing:border-box;border:1px solid var(--accent-blue);background-color:var(--overlay-bg-white);border-radius:50%;width:12px;height:12px;position:absolute}.crop-ps-tl{cursor:nwse-resize;top:-5px;left:-5px}.crop-ps-t{cursor:ns-resize;top:-5px;left:50%;transform:translate(-50%)}.crop-ps-tr{cursor:nesw-resize;top:-5px;right:-5px}.crop-ps-r{cursor:ew-resize;top:50%;right:-5px;transform:translateY(-50%)}.crop-ps-br{cursor:nwse-resize;bottom:-5px;right:-5px}.crop-ps-b{cursor:ns-resize;bottom:-5px;left:50%;transform:translate(-50%)}.crop-ps-bl{cursor:nesw-resize;bottom:-5px;left:-5px}.crop-ps-l{cursor:ew-resize;top:50%;left:-5px;transform:translateY(-50%)}.crop-p-b{box-sizing:border-box;border:2px solid var(--accent-blue);position:absolute;inset:0}.crop-p-p{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}.frame{box-sizing:border-box;justify-content:center;align-items:center;width:100%;height:100%;min-height:0;padding:16px;display:flex;position:relative;overflow:hidden}.frame--faded{background-color:#00000080}.frame-preview{-webkit-user-select:none;user-select:none;flex-shrink:1;width:auto;min-width:0;max-width:100%;height:auto;min-height:0;max-height:100%;transition:transform .2s;display:block;position:relative}.frame-image{object-fit:contain;width:100%;height:100%}.frame-image--faded{opacity:.4}.resize{background-color:var(--background);border-radius:4px;flex-direction:column;padding:16px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000001a}.resize-text{text-align:center;color:var(--muted-foreground);font-size:14px}.resize-border{border-bottom:1px solid var(--border);width:60px;margin:12px auto 4px;display:inline-block}.resize-tools{align-items:center;gap:6px;margin-top:16px;display:flex}.resize-tools-lock{width:12px;height:12px;color:var(--muted-foreground)}.resize-tools-buttons{margin-left:4px;display:flex}.resize-tools-save{border-top-right-radius:0;border-bottom-right-radius:0;width:36px}.resize-tools-close{border-top-left-radius:0;border-bottom-left-radius:0;width:36px;margin-left:-1px}.sidebar{z-index:10;width:0;transition:transform .15s ease-out;position:relative}@media (width>=768px){.sidebar{width:320px;transition:none}}.sidebar-settings{border-radius:50%;width:40px;height:40px;position:absolute;top:8px;right:8px;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@media (width>=768px){.sidebar-settings{display:none}}.sidebar-container{box-sizing:border-box;border-left:1px solid var(--border);position:absolute;inset:0}.sidebar-content{background-color:var(--background);box-sizing:border-box;flex-direction:column;width:320px;height:100%;padding:16px;display:flex;position:absolute;top:0;left:0;overflow-y:auto}@media (width<=767px){.sidebar-content{padding-top:48px}}.sidebar-close-btn{position:absolute;top:8px;right:8px}.sidebar-separator{margin-top:20px;margin-bottom:12px}.sidebar-resize{justify-content:space-between;align-items:center;display:flex}.sidebar-resize-icon{align-items:center;gap:8px;display:flex}.sidebar-resize-size{color:var(--muted-foreground);font-size:14px}.sidebar-crop{flex-direction:column;gap:8px;display:flex}.sidebar-crop-ratios{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.sidebar-preset{flex-direction:column;gap:8px;display:flex}.picedi{font-size:16px;font-family:var(--font-sans);--font-sans:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Tahoma, Helvetica, Arial, sans-serif;--color-white:#fff;--color-black:#000;--color-transparent:transparent;--color-red:oklch(63.7% .237 25.331);--color-green:oklch(76.8% .188 151.716);--background:oklch(100% 0 0);--foreground:oklch(14.5% 0 0);--card:oklch(100% 0 0);--card-foreground:oklch(14.5% 0 0);--popover:oklch(100% 0 0);--popover-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(55.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);--destructive:oklch(57.7% .245 27.325);--success:oklch(76.8% .188 151.716);--border:oklch(92.2% 0 0);--input:oklch(92.2% 0 0);--ring:oklch(70.8% 0 0);--radius:4px;--sidebar:oklch(98.5% 0 0);--sidebar-foreground:oklch(14.5% 0 0);--sidebar-primary:oklch(20.5% 0 0);--sidebar-primary-foreground:oklch(98.5% 0 0);--sidebar-accent:oklch(97% 0 0);--sidebar-accent-foreground:oklch(20.5% 0 0);--sidebar-border:oklch(92.2% 0 0);--sidebar-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)}:host([data-theme=dark]) .picedi,[data-theme=dark] .picedi,[data-theme=dark].picedi{--background:oklch(14.5% 0 0);--foreground:oklch(98.5% 0 0);--card:oklch(20.5% 0 0);--card-foreground:oklch(98.5% 0 0);--popover:oklch(20.5% 0 0);--popover-foreground:oklch(98.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(26.9% 0 0);--muted-foreground:oklch(70.8% 0 0);--accent:oklch(26.9% 0 0);--accent-foreground:oklch(98.5% 0 0);--accent-blue-light:oklch(25% .06 250);--destructive:oklch(70.4% .191 22.216);--border:oklch(100% 0 0/.1);--input:oklch(100% 0 0/.15);--ring:oklch(55.6% 0 0);--sidebar-foreground:oklch(98.5% 0 0);--sidebar-primary:oklch(48.8% .243 264.376);--sidebar-primary-foreground:oklch(98.5% 0 0);--sidebar-accent:oklch(26.9% 0 0);--sidebar-accent-foreground:oklch(98.5% 0 0);--sidebar-border:oklch(100% 0 0/.1);--sidebar-ring:oklch(55.6% 0 0);--overlay-bg:color-mix(in srgb, var(--color-black) 75%, transparent)}.picedi h1,.picedi h2,.picedi h3,.picedi h4,.picedi h5,.picedi h6{margin:0;font-weight:600}.text-red{color:var(--color-red)}.bg-red{background-color:var(--color-red)}.bg-green{background-color:var(--color-green)}.text-green{color:var(--color-green)}.mask{background-color:var(--overlay-bg)}.semibold{letter-spacing:.4px;font-weight:600}.bold{letter-spacing:.4px;font-weight:700}.sys{width:100%;height:100%;color:var(--muted-foreground);justify-content:center;align-items:center;display:flex;position:relative}.main{background-color:var(--background);grid-template-rows:auto 1fr;height:100%;display:grid;overflow:hidden}.grid{grid-template-columns:1fr auto;min-height:0;display:grid;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=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})),
|
|
1
|
+
(function(){try{if(typeof document<`u`){var e=document.createElement(`style`);e.appendChild(document.createTextNode(`._button_snd36_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_snd36_1:disabled{pointer-events:none;opacity:.5}._button_snd36_1 svg{flex-shrink:0;width:16px;height:16px}._default_snd36_32{background-color:var(--primary);color:var(--primary-foreground)}._default_snd36_32:hover{opacity:.9}._outline_snd36_39{border-color:var(--border);background-color:var(--background);color:var(--foreground)}._outline_snd36_39:hover{background-color:var(--secondary)}._ghost_snd36_47{color:var(--foreground);padding:0 8px}._ghost_snd36_47:hover{background-color:var(--secondary)}._rect_snd36_54{width:32px;height:32px}:host{height:100%;display:block}:host *{box-sizing:border-box}._root_kw2xl_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;--color-white:#fff;--color-white-fade:color-mix(in srgb, var(--color-white) 30%, transparent);--color-black:#000;--color-transparent:transparent;--color-red:oklch(63.7% .237 25.331);--color-green:oklch(76.8% .188 151.716);--background:oklch(100% 0 0);--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);position:relative}._root_kw2xl_8[data-theme=dark]{--background:oklch(24.5% 0 0);--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(24.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)}._root_kw2xl_8 h1,._root_kw2xl_8 h2,._root_kw2xl_8 h3,._root_kw2xl_8 h4,._root_kw2xl_8 h5,._root_kw2xl_8 h6{color:var(--foreground);margin:0;font-weight:600}._textRed_kw2xl_73{color:var(--color-red)}._bgRed_kw2xl_76{background-color:var(--color-red)}._bgGreen_kw2xl_79{background-color:var(--color-green)}._textGreen_kw2xl_82{color:var(--color-green)}._mask_kw2xl_85{background-color:var(--overlay-bg)}._semibold_kw2xl_88{letter-spacing:.4px;font-weight:600}._bold_kw2xl_92{letter-spacing:.4px;font-weight:700}._system_kw2xl_96{color:var(--muted-foreground);background-color:var(--background);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}._wrapper_kw2xl_105{width:100%;height:100%;min-height:480px;position:relative}._main_kw2xl_111{background-color:var(--background);grid-template-rows:auto 1fr;display:grid;position:absolute;inset:0;overflow:hidden}._grid_kw2xl_119{grid-template-columns:1fr auto;min-height:0;display:grid;position:relative;overflow:hidden}._button_gf7m5_1{border:1px solid var(--border);background-color:var(--background);color:var(--foreground);cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:12px;font-family:inherit;font-size:12px;transition:all .2s;display:inline-flex}._button_gf7m5_1:hover:not([aria-pressed=true]){background-color:var(--secondary)}._button_gf7m5_1[aria-pressed=true]{border-color:var(--accent-blue);background-color:var(--accent-blue-light);color:var(--foreground)}._button_gf7m5_1 svg{flex-shrink:0;width:20px;height:20px}._button_gf7m5_1 span{white-space:nowrap}._separator_rqskq_1{background-color:var(--border);box-sizing:border-box;border:none;flex-shrink:0;display:block}._separator_rqskq_1[data-orientation=horizontal]{width:100%;height:1px}._separator_rqskq_1[data-orientation=vertical]{align-self:stretch;width:1px;height:100%;margin:0}._wrapper_12rgt_1{box-sizing:border-box;width:100%;position:relative}._trigger_12rgt_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_12rgt_6:hover,._trigger_12rgt_6:focus{border-color:var(--muted-foreground)}._triggerArrow_12rgt_29{width:16px;height:16px;color:var(--muted-foreground);transition:transform .2s}._wrapper_12rgt_1[data-state=open] ._triggerArrow_12rgt_29{transform:rotate(180deg)}._content_12rgt_38{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_12rgt_38::-webkit-scrollbar{width:4px}._content_12rgt_38::-webkit-scrollbar-track{background:0 0}._content_12rgt_38::-webkit-scrollbar-thumb{background-color:var(--border);border-radius:10px}._wrapper_12rgt_1[data-state=closed] ._content_12rgt_38{display:none}._groupLabel_12rgt_68{color:var(--muted-foreground);-webkit-user-select:none;user-select:none;padding:8px 10px;font-size:12px;font-weight:500}._item_12rgt_75{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_12rgt_75:hover{background-color:var(--secondary)}._itemLeft_12rgt_91{font-size:14px;font-weight:400}._itemAddon_12rgt_95{align-items:center;gap:8px;display:flex}._itemAddon_12rgt_95>span{color:var(--muted-foreground);font-size:12px}._itemAddon_12rgt_95>svg{font-size:14px}._itemAddon_12rgt_95>b{flex-shrink:0;width:16px;height:16px}._itemRightContainer_12rgt_112{align-items:center;gap:8px;display:flex}._itemRight_12rgt_112{color:var(--muted-foreground);font-size:14px}._itemCheck_12rgt_121{width:16px;height:16px;color:var(--foreground);flex-shrink:0}._input_j55nq_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_j55nq_1:hover:not(:disabled):not(:focus){border-color:var(--muted-foreground)}._input_j55nq_1:focus{box-shadow:0 0 0 1px var(--ring)}._input_j55nq_1:disabled{cursor:not-allowed;opacity:.5;background-color:var(--secondary)}._input_j55nq_1::placeholder{color:var(--muted-foreground);opacity:1}._numberClean_j55nq_34::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}._numberClean_j55nq_34::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}._numberClean_j55nq_34[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_qpue1_1{margin-left:4px;display:flex}._group_qpue1_1 ._save_qpue1_6{width:36px;color:var(--color-green);border-top-right-radius:0;border-bottom-right-radius:0}._group_qpue1_1 ._close_qpue1_13{width:36px;color:var(--color-red);border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}._sliderContainer_1ntcm_1{cursor:pointer;touch-action:none;--slider-progress:0%;align-items:center;width:100%;height:24px;display:flex;position:relative}._sliderContainer_1ntcm_1._disabled_1ntcm_12{pointer-events:none;cursor:not-allowed;opacity:.5}._sliderTrack_1ntcm_18{background-color:color-mix(in oklch, var(--muted-foreground) 65%, transparent);border-radius:2px;width:100%;height:2px;position:relative}._sliderRange_1ntcm_30{background-color:var(--primary);height:100%;width:var(--slider-progress);border-radius:2px;position:absolute}._sliderThumb_1ntcm_38{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;top:50%;transform:translate(-50%,-50%)}._hiddenInput_1ntcm_53{opacity:0;cursor:pointer;z-index:1;width:100%;height:100%;margin:0;position:absolute;top:0;left:0}._sliderContainer_1ntcm_1:not(._disabled_1ntcm_12):hover ._sliderThumb_1ntcm_38{transform:translate(-50%,-50%)scale(1.1)}._header_msw8l_1{box-sizing:border-box;background-color:var(--background);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;height:48px;padding:0 8px;display:flex}._tools_msw8l_11{gap:8px;display:flex}._history_msw8l_15{align-items:center;gap:8px;display:flex}._historyText_msw8l_20{color:var(--muted-foreground);font-size:14px}._resize_11cwi_1{background-color:var(--background);border-radius:4px;flex-direction:column;gap:2px;padding:8px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000001a}._slider_11cwi_14{width:80%;margin:0 auto -4px}._border_11cwi_18{border-bottom:1px solid var(--border);width:60px;margin:12px auto 4px;display:inline-block}._tools_11cwi_24{align-items:center;gap:6px;margin-top:16px;display:flex}._toolsLock_11cwi_30{width:12px;height:12px;color:var(--muted-foreground)}._preview_dvanl_1{box-sizing:border-box;max-width:calc(100% - 32px);max-height:calc(100% - 32px);margin:auto;transition:all .2s linear;position:absolute;inset:0;overflow:hidden}._rotate_dvanl_12{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_dvanl_24{box-sizing:border-box;transition:all .2s linear;position:absolute;inset:0;overflow:hidden}._image_dvanl_32{max-width:none;max-height:none;transition:all .2s linear;display:block;position:absolute}._wrapper_13nh3_1{box-sizing:border-box;max-width:calc(100% - 32px);max-height:calc(100% - 32px);margin:auto;position:absolute;inset:0}._box_13nh3_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}._tools_13nh3_18{background-color:var(--background);box-sizing:border-box;border:1px solid var(--border);border-radius:4px;align-items:center;padding:4px 4px 4px 8px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}._toolsInfo_13nh3_34{-webkit-user-select:none;user-select:none;min-width:54px;margin-top:-2px;display:inline-block}._toolsInfoLabel_13nh3_41{color:var(--muted-foreground);font-size:12px;line-height:12px}._toolsInfoValue_13nh3_46{color:var(--foreground);font-size:14px;line-height:14px}._linesBox_13nh3_51{pointer-events:none;position:absolute;inset:2px}._line_13nh3_51{border:1px dashed var(--color-white);opacity:.5;position:absolute}._lineV_13nh3_61{border-top:0;border-bottom:0;width:33%;height:100%;top:0;left:33%}._lineH_13nh3_69{border-left:0;border-right:0;width:100%;height:33%;top:33%;left:0}._pointer_13nh3_77{box-sizing:border-box;width:14px;height:14px;position:absolute}._pointerTopLeft_13nh3_83{border-top:3px solid var(--accent-blue);border-left:3px solid var(--accent-blue);cursor:nwse-resize;top:-6px;left:-6px}._pointerTopRight_13nh3_90{border-top:3px solid var(--accent-blue);border-right:3px solid var(--accent-blue);cursor:nesw-resize;top:-6px;right:-6px}._pointerBottomRight_13nh3_97{border-bottom:3px solid var(--accent-blue);border-right:3px solid var(--accent-blue);cursor:nwse-resize;bottom:-6px;right:-6px}._pointerBottomLeft_13nh3_104{border-bottom:3px solid var(--accent-blue);border-left:3px solid var(--accent-blue);cursor:nesw-resize;bottom:-6px;left:-6px}._mobileBorder_13nh3_111{box-sizing:border-box;border:2px solid var(--accent-blue);position:absolute;inset:0}._mobilePointer_13nh3_117{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}._flip_17ic5_1{background-color:var(--background);border-radius:4px;gap:4px;padding:4px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000001a}._btnH_17ic5_14{border-top-right-radius:0;border-bottom-right-radius:0;width:36px}._btnV_17ic5_20{border-top-left-radius:0;border-bottom-left-radius:0;width:36px;margin-left:-1px}._rotate_gkt07_1{background-color:var(--background);border-radius:4px;gap:4px;padding:4px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000001a}._btnH_gkt07_14{border-top-right-radius:0;border-bottom-right-radius:0;width:36px}._btnV_gkt07_20{border-top-left-radius:0;border-bottom-left-radius:0;width:36px;margin-left:-1px}._frame_xffug_1{box-sizing:border-box;width:100%;height:100%;margin:0 auto;padding:16px;position:relative}._sidebar_8qtha_1{z-index:10;width:0;transition:transform .15s ease-out;position:relative}@media (width>=768px){._sidebar_8qtha_1{width:320px;transition:none}}._settings_8qtha_11{border-radius:50%;width:40px;height:40px;position:absolute;top:8px;right:8px;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}@media (width>=768px){._settings_8qtha_11{display:none}}._container_8qtha_25{box-sizing:border-box;border-left:1px solid var(--border);position:absolute;inset:0}._content_8qtha_31{background-color:var(--background);box-sizing:border-box;flex-direction:column;width:320px;height:100%;padding:16px;display:flex;position:absolute;top:0;left:0;overflow-y:auto}@media (width<=767px){._content_8qtha_31{padding-top:48px}}._closeBtn_8qtha_47{position:absolute;top:8px;right:8px}._separator_8qtha_52{margin-top:20px;margin-bottom:12px}._resize_8qtha_56{justify-content:space-between;align-items:center;display:flex}._resizeIcon_8qtha_61{align-items:center;gap:8px;display:flex}._resizeSize_8qtha_66{color:var(--muted-foreground);font-size:14px}._crop_8qtha_70{flex-direction:column;gap:8px;display:flex}._ratio_8qtha_75{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}._sidebarPreset_8qtha_80{flex-direction:column;gap:8px;display:flex}._flipRotate_8qtha_85{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}/*$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={quality:.85,saveAsWEBP:!1,exportAs:`blob`},d=(e,t,n,r,i,a,o)=>({history:{pointer:0,items:[{width:t,height:n,action:{name:`initial`,args:null}}]},currentAction:null,previewUrl:i,originalBlob:r,mimeType:e,sidebar:!1,settings:o,isAlpha:a}),f=(0,t.createContext)(void 0),p=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})),m=c((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e){if(e==null)return null;if(typeof e==`function`)return e.$$typeof===te?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 E: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 ee:return n=e.displayName||null,n===null?t(e.type)||`Memo`:n;case T: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===T)return`<...>`;try{var n=t(e);return n?`<`+n+`>`:`<...>`}catch{return`<...>`}}function a(){var e=D.A;return e===null?null:e.getOwner()}function o(){return Error(`react-stack-top-frame`)}function s(e){if(ne.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(){ie||(ie=!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 ae[e]||(ae[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(re(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(ne.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}`,k[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),I[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 M,N={},P=m.react_stack_bottom_frame.bind(m,o)(),F=j(i(o)),I={};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`):P,r?j(i(e)):F)},e.jsxs=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!0,r?Error(`react-stack-top-frame`):P,r?j(i(e)):F)}})()})),f=c(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=u():t.exports=d()}))();function p({size:e=36,className:t,style:n,color:r=`currentColor`}){return(0,f.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,x:`0px`,y:`0px`,viewBox:`0 0 80 80`,width:e,height:e,fill:r,className:t,style:n,children:[(0,f.jsx)(`path`,{d:`M10,40c0,0,0-0.4,0-1.1c0-0.3,0-0.8,0-1.3c0-0.3,0-0.5,0-0.8c0-0.3,0.1-0.6,0.1-0.9c0.1-0.6,0.1-1.4,0.2-2.1
|
|
8
|
-
c0.2-0.8,0.3-1.6,0.5-2.5c0.2-0.9,0.6-1.8,0.8-2.8c0.3-1,0.8-1.9,1.2-3c0.5-1,1.1-2,1.7-3.1c0.7-1,1.4-2.1,2.2-3.1
|
|
9
|
-
c1.6-2.1,3.7-3.9,6-5.6c2.3-1.7,5-3,7.9-4.1c0.7-0.2,1.5-0.4,2.2-0.7c0.7-0.3,1.5-0.3,2.3-0.5c0.8-0.2,1.5-0.3,2.3-0.4l1.2-0.1
|
|
10
|
-
l0.6-0.1l0.3,0l0.1,0l0.1,0l0,0c0.1,0-0.1,0,0.1,0c1.5,0,2.9-0.1,4.5,0.2c0.8,0.1,1.6,0.1,2.4,0.3c0.8,0.2,1.5,0.3,2.3,0.5
|
|
11
|
-
c3,0.8,5.9,2,8.5,3.6c2.6,1.6,4.9,3.4,6.8,5.4c1,1,1.8,2.1,2.7,3.1c0.8,1.1,1.5,2.1,2.1,3.2c0.6,1.1,1.2,2.1,1.6,3.1
|
|
12
|
-
c0.4,1,0.9,2,1.2,3c0.3,1,0.6,1.9,0.8,2.7c0.2,0.9,0.3,1.6,0.5,2.4c0.1,0.4,0.1,0.7,0.2,1c0,0.3,0.1,0.6,0.1,0.9
|
|
13
|
-
c0.1,0.6,0.1,1,0.1,1.4C74,39.6,74,40,74,40c0.2,2.2-1.5,4.1-3.7,4.3s-4.1-1.5-4.3-3.7c0-0.1,0-0.2,0-0.3l0-0.4c0,0,0-0.3,0-0.9
|
|
14
|
-
c0-0.3,0-0.7,0-1.1c0-0.2,0-0.5,0-0.7c0-0.2-0.1-0.5-0.1-0.8c-0.1-0.6-0.1-1.2-0.2-1.9c-0.1-0.7-0.3-1.4-0.4-2.2
|
|
15
|
-
c-0.2-0.8-0.5-1.6-0.7-2.4c-0.3-0.8-0.7-1.7-1.1-2.6c-0.5-0.9-0.9-1.8-1.5-2.7c-0.6-0.9-1.2-1.8-1.9-2.7c-1.4-1.8-3.2-3.4-5.2-4.9
|
|
16
|
-
c-2-1.5-4.4-2.7-6.9-3.6c-0.6-0.2-1.3-0.4-1.9-0.6c-0.7-0.2-1.3-0.3-1.9-0.4c-1.2-0.3-2.8-0.4-4.2-0.5l-2,0c-0.7,0-1.4,0.1-2.1,0.1
|
|
17
|
-
c-0.7,0.1-1.4,0.1-2,0.3c-0.7,0.1-1.3,0.3-2,0.4c-2.6,0.7-5.2,1.7-7.5,3.1c-2.2,1.4-4.3,2.9-6,4.7c-0.9,0.8-1.6,1.8-2.4,2.7
|
|
18
|
-
c-0.7,0.9-1.3,1.9-1.9,2.8c-0.5,1-1,1.9-1.4,2.8c-0.4,0.9-0.8,1.8-1,2.6c-0.3,0.9-0.5,1.6-0.7,2.4c-0.2,0.7-0.3,1.4-0.4,2.1
|
|
19
|
-
c-0.1,0.3-0.1,0.6-0.2,0.9c0,0.3-0.1,0.6-0.1,0.8c0,0.5-0.1,0.9-0.1,1.3C10,39.6,10,40,10,40z`,children:(0,f.jsx)(`animateTransform`,{attributeType:`xml`,attributeName:`transform`,type:`rotate`,from:`0 40 40`,to:`360 40 40`,dur:`0.8s`,repeatCount:`indefinite`})}),(0,f.jsx)(`path`,{fill:`currentColor`,d:`M62,40.1c0,0,0,0.2-0.1,0.7c0,0.2,0,0.5-0.1,0.8c0,0.2,0,0.3,0,0.5c0,0.2-0.1,0.4-0.1,0.7
|
|
20
|
-
c-0.1,0.5-0.2,1-0.3,1.6c-0.2,0.5-0.3,1.1-0.5,1.8c-0.2,0.6-0.5,1.3-0.7,1.9c-0.3,0.7-0.7,1.3-1,2.1c-0.4,0.7-0.9,1.4-1.4,2.1
|
|
21
|
-
c-0.5,0.7-1.1,1.4-1.7,2c-1.2,1.3-2.7,2.5-4.4,3.6c-1.7,1-3.6,1.8-5.5,2.4c-2,0.5-4,0.7-6.2,0.7c-1.9-0.1-4.1-0.4-6-1.1
|
|
22
|
-
c-1.9-0.7-3.7-1.5-5.2-2.6c-1.5-1.1-2.9-2.3-4-3.7c-0.6-0.6-1-1.4-1.5-2c-0.4-0.7-0.8-1.4-1.2-2c-0.3-0.7-0.6-1.3-0.8-2
|
|
23
|
-
c-0.2-0.6-0.4-1.2-0.6-1.8c-0.1-0.6-0.3-1.1-0.4-1.6c-0.1-0.5-0.1-1-0.2-1.4c-0.1-0.9-0.1-1.5-0.1-2c0-0.5,0-0.7,0-0.7
|
|
24
|
-
s0,0.2,0.1,0.7c0.1,0.5,0,1.1,0.2,2c0.1,0.4,0.2,0.9,0.3,1.4c0.1,0.5,0.3,1,0.5,1.6c0.2,0.6,0.4,1.1,0.7,1.8
|
|
25
|
-
c0.3,0.6,0.6,1.2,0.9,1.9c0.4,0.6,0.8,1.3,1.2,1.9c0.5,0.6,1,1.3,1.6,1.8c1.1,1.2,2.5,2.3,4,3.2c1.5,0.9,3.2,1.6,5,2.1
|
|
26
|
-
c1.8,0.5,3.6,0.6,5.6,0.6c1.8-0.1,3.7-0.4,5.4-1c1.7-0.6,3.3-1.4,4.7-2.4c1.4-1,2.6-2.1,3.6-3.3c0.5-0.6,0.9-1.2,1.3-1.8
|
|
27
|
-
c0.4-0.6,0.7-1.2,1-1.8c0.3-0.6,0.6-1.2,0.8-1.8c0.2-0.6,0.4-1.1,0.5-1.7c0.1-0.5,0.2-1,0.3-1.5c0.1-0.4,0.1-0.8,0.1-1.2
|
|
28
|
-
c0-0.2,0-0.4,0.1-0.5c0-0.2,0-0.4,0-0.5c0-0.3,0-0.6,0-0.8c0-0.5,0-0.7,0-0.7c0-1.1,0.9-2,2-2s2,0.9,2,2C62,40,62,40.1,62,40.1z`,children:(0,f.jsx)(`animateTransform`,{attributeType:`xml`,attributeName:`transform`,type:`rotate`,from:`0 40 40`,to:`-360 40 40`,dur:`0.6s`,repeatCount:`indefinite`})})]})}var m=(e,t,n,r)=>({history:{pointer:0,items:[{name:`Initial`,base64:r,width:t,height:n}]},currentAction:null,extension:e,sidebar:!1}),h=(0,t.createContext)(void 0),g=({children:e,base64:n,width:r,height:i,ext:a})=>{let[o,s]=(0,t.useState)(m(a,r,i,n)),c=()=>o.currentAction,l=e=>s(t=>({...t,currentAction:e})),u=e=>s(t=>{let n=t.history.pointer+1,r=[...t.history.items.slice(0,n),e];return{...t,currentAction:null,history:{items:r,pointer:n}}}),d=()=>o.history.items.at(o.history.pointer),p=()=>s(e=>({...e,history:m(a,r,i,n).history})),g=()=>s(e=>{let t=e.history.items.at(e.history.pointer);return{...e,history:{items:[t],pointer:0}}}),_=()=>s(e=>e.history.pointer<=0?e:{...e,history:{...e.history,pointer:e.history.pointer-1}}),v=()=>s(e=>e.history.pointer>=e.history.items.length-1?e:{...e,history:{...e.history,pointer:e.history.pointer+1}}),y=()=>o.sidebar,b=e=>s(t=>({...t,sidebar:e}));return(0,f.jsx)(h,{value:{...o,getCurrentAction:c,setCurrentAction:l,addToHistory:u,resetHistory:p,resetHistoryAfterSave:g,undo:_,redo:v,getLastHistoryItem:d,getSidebar:y,setSidebar:b},children:e})},_={"image/jpeg":`jpg`,"image/jpg":`jpg`,"image/png":`png`,"image/gif":`gif`,"image/webp":`webp`},v=e=>{let[n,r]=(0,t.useState)({loading:!0,error:null,width:0,height:0,extension:null,base64:null});return(0,t.useEffect)(()=>{let t=!0;return(async()=>{try{let n=await fetch(e);if(!n.ok)throw Error(`HTTP error! Status: ${n.status}`);let i=(n.headers.get(`content-type`)||``).split(`;`)[0].toLowerCase().trim(),a=i.startsWith(`image/`),o=_[i]||`unknown`;if(!a){t&&r(e=>({...e,loading:!1,error:`The requested resource is not a valid image.`,extension:o}));return}let s=await n.blob(),c=await new Promise((e,t)=>{let n=new FileReader;n.onloadend=()=>e(n.result),n.onerror=()=>t(Error(`Failed to read image data stream`)),n.readAsDataURL(s)}),l=await new Promise((e,t)=>{let n=new Image;n.src=c,n.onload=()=>e({width:n.naturalWidth,height:n.naturalHeight}),n.onerror=()=>t(Error(`Failed to parse image dimensions`))});t&&r({loading:!1,error:null,width:l.width,height:l.height,extension:o,base64:c})}catch(e){t&&r(t=>({...t,loading:!1,error:e instanceof Error?e.message:`An error occurred during extraction.`}))}})(),()=>{t=!1}},[e]),n},y=()=>{let e=(0,t.useRef)(null),n=(0,t.useCallback)(e=>{let t=e.match(/^data:(image\/[a-zA-Z+.-]+);base64,(.+)$/);if(!t)throw Error(`Invalid Base64 image format`);let n=t[1],r=t[2];return n===`image/gif`&&(n=`image/png`),{mimeType:n,rawData:r}},[]),r=(0,t.useCallback)(async e=>{let{mimeType:t,rawData:r}=n(e),i=atob(r),a=new Uint8Array(i.length);for(let e=0;e<i.length;e++)a[e]=i.charCodeAt(e);let o=new Blob([a],{type:t});return{bitmap:await createImageBitmap(o),mimeType:t}},[n]),i=(0,t.useCallback)(t=>{e.current||=document.createElement(`canvas`);let n=e.current,r=t===`image/png`||t===`image/webp`;return{canvas:n,ctx:n.getContext(`2d`,{alpha:r})}},[]),a=(0,t.useCallback)((e,t)=>t===`image/jpeg`||t===`image/webp`?e.toDataURL(t,.85):e.toDataURL(t),[]);return{resize:(0,t.useCallback)(async(e,t,n)=>{let{bitmap:o,mimeType:s}=await r(e),{canvas:c,ctx:l}=i(s);return c.width=t,c.height=n,l&&(l.clearRect(0,0,t,n),l.drawImage(o,0,0,t,n)),o.close(),a(c,s)},[r,i,a]),crop:(0,t.useCallback)(async(e,t,n,o,s)=>{let{bitmap:c,mimeType:l}=await r(e),{canvas:u,ctx:d}=i(l);return u.width=o,u.height=s,d&&(d.clearRect(0,0,o,s),d.drawImage(c,t,n,o,s,0,0,o,s)),c.close(),a(u,l)},[r,i,a]),flip:(0,t.useCallback)(async(e,t,n)=>{let{bitmap:o,mimeType:s}=await r(e),{canvas:c,ctx:l}=i(s);return c.width=o.width,c.height=o.height,l&&(l.clearRect(0,0,c.width,c.height),l.save(),l.translate(t?o.width:0,n?o.height:0),l.scale(t?-1:1,n?-1:1),l.drawImage(o,0,0),l.restore()),o.close(),a(c,s)},[r,i,a]),rotate:(0,t.useCallback)(async(e,t)=>{let{bitmap:n,mimeType:o}=await r(e),{canvas:s,ctx:c}=i(o);return s.width=n.width,s.height=n.height,c&&(c.clearRect(0,0,s.width,s.height),c.save(),c.translate(n.width/2,n.height/2),c.rotate(t*Math.PI/180),c.drawImage(n,-n.width/2,-n.height/2),c.restore()),n.close(),a(s,o)},[r,i,a]),filter:(0,t.useCallback)(async(e,t)=>{let{bitmap:n,mimeType:o}=await r(e),{canvas:s,ctx:c}=i(o);return s.width=n.width,s.height=n.height,c&&(c.filter=Object.entries(t).map(([e,t])=>`${e}(${t}%)`).join(` `),c.drawImage(n,0,0)),n.close(),a(s,o)},[r,i,a])}},b=()=>{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},x=()=>{let[e]=(0,t.useState)(()=>b());return e},S={sm:640,md:768,lg:1024,xl:1280};function C(e){let[n,r]=(0,t.useState)(()=>window.innerWidth<S[e]);return(0,t.useEffect)(()=>{function t(){r(window.innerWidth<S[e])}return window.addEventListener(`resize`,t),()=>window.removeEventListener(`resize`,t)},[e]),n}var w={xmlns:`http://w3.org`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`},T=e=>(0,f.jsx)(`svg`,{...w,...e,children:(0,f.jsx)(`path`,{d:`M20 6 9 17l-5-5`})}),E=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`path`,{d:`M18 6 6 18`}),(0,f.jsx)(`path`,{d:`m6 6 12 12`})]}),D=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`rect`,{width:`18`,height:`11`,x:`3`,y:`11`,rx:`2`,ry:`2`}),(0,f.jsx)(`path`,{d:`M7 11V7a5 5 0 0 1 10 0v4`})]}),O=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`path`,{d:`m12 19-7-7 7-7`}),(0,f.jsx)(`path`,{d:`M19 12H5`})]}),k=e=>(0,f.jsx)(`svg`,{...w,...e,children:(0,f.jsx)(`path`,{d:`m6 9 6 6 6-6`})}),A=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`path`,{d:`M3 7v6h6`}),(0,f.jsx)(`path`,{d:`M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13`})]}),ee=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`path`,{d:`M21 7v6h-6`}),(0,f.jsx)(`path`,{d:`M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7`})]}),j=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`path`,{d:`M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915`}),(0,f.jsx)(`circle`,{cx:`12`,cy:`12`,r:`3`})]}),M=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`path`,{d:`M6 2v14a2 2 0 0 0 2 2h14`}),(0,f.jsx)(`path`,{d:`M18 22V8a2 2 0 0 0-2-2H2`})]}),N=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`}),(0,f.jsx)(`circle`,{cx:`9`,cy:`9`,r:`2`}),(0,f.jsx)(`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`})]}),P=e=>(0,f.jsx)(`svg`,{...w,...e,children:(0,f.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`})}),F=e=>(0,f.jsxs)(`svg`,{...w,...e,children:[(0,f.jsx)(`path`,{d:`M3 7V5a2 2 0 0 1 2-2h2`}),(0,f.jsx)(`path`,{d:`M17 3h2a2 2 0 0 1 2 2v2`}),(0,f.jsx)(`path`,{d:`M21 17v2a2 2 0 0 1-2 2h-2`}),(0,f.jsx)(`path`,{d:`M7 21H5a2 2 0 0 1-2-2v-2`}),(0,f.jsx)(`rect`,{width:`10`,height:`8`,x:`7`,y:`8`,rx:`1`})]}),I=e=>(0,f.jsx)(`svg`,{...w,...e,children:(0,f.jsx)(`path`,{d:`M21 12a9 9 0 1 1-6.219-8.56`,children:(0,f.jsx)(`animateTransform`,{attributeType:`xml`,attributeName:`transform`,type:`rotate`,from:`0 12 12`,to:`360 12 12`,dur:`0.8s`,repeatCount:`indefinite`})})}),L=()=>{let e=(0,t.useContext)(h);if(!e)throw Error(`useImageEditorContext must be used within an ImageEditorProvider`);return e},R=(0,t.forwardRef)(({className:e=``,variant:t=`default`,children:n,...r},i)=>(0,f.jsx)(`button`,{ref:i,className:`btn ${`btn-${t}`} ${e}`.trim(),...r,children:n})),z=(0,t.forwardRef)(({className:e=``,active:t=!1,icon:n,label:r,...i},a)=>(0,f.jsxs)(`button`,{ref:a,type:`button`,"aria-pressed":t,className:`btn-crop ${e}`.trim(),...i,children:[n,(0,f.jsx)(`span`,{className:`semibold`,children:r})]}));z.displayName=`ButtonCrop`;var B=(0,t.forwardRef)(({className:e=``,orientation:t=`horizontal`,...n},r)=>(0,f.jsx)(`hr`,{ref:r,role:`separator`,"aria-orientation":t,"data-orientation":t,className:`separator ${e}`.trim(),...n}));B.displayName=`Separator`;var te=({items:e,value:n,onChange:r,placeholder:i=`Select an option`,className:a=``,renderOption:o})=>{let[s,c]=(0,t.useState)(!1),l=(0,t.useRef)(null),u=(0,t.useRef)(null),d=(0,t.useRef)(null),p=(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);(0,t.useEffect)(()=>{let e=e=>{l.current&&!l.current.contains(e.target)&&c(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]),(0,t.useLayoutEffect)(()=>{if(!s||!u.current||!d.current)return;let e=l.current?.closest(`.picedi.main`)?.getBoundingClientRect(),t=u.current.getBoundingClientRect(),n=d.current.getBoundingClientRect(),r=(e?.bottom??window.innerHeight)-16,i=t.bottom+n.height+4,a=`calc(100% + 4px)`;i>r&&(a=`calc(100% + 4px - ${i-r}px)`),d.current.style.top=a},[s,e]);let m=e=>{r(e),c(!1)};return(0,f.jsxs)(`div`,{ref:l,className:`select-wrapper ${a}`.trim(),"data-state":s?`open`:`closed`,children:[(0,f.jsxs)(`button`,{ref:u,type:`button`,className:`select-trigger`,onClick:()=>c(!s),children:[(0,f.jsx)(`span`,{children:p?p.fullName:i}),(0,f.jsx)(k,{className:`select-trigger-arrow`})]}),(0,f.jsx)(`div`,{ref:d,className:`select-content`,children:e.map((e,t)=>e.options?(0,f.jsxs)(`div`,{children:[(0,f.jsx)(`div`,{className:`select-group-label semibold`,children:e.label}),e.options.map(e=>(0,f.jsxs)(`div`,{className:`select-item`,onClick:()=>m(e.value),children:[o?o(e):(0,f.jsx)(`span`,{className:`select-item-left`,children:e.label}),(0,f.jsxs)(`div`,{className:`select-item-addon`,children:[e.rightLabel&&(0,f.jsx)(`span`,{children:e.rightLabel}),n===e.value&&(0,f.jsx)(T,{className:`select-item-check`}),n!==e.value&&(0,f.jsx)(`b`,{})]})]},e.value))]},`group-${t}`):(0,f.jsxs)(`div`,{className:`select-item`,onClick:()=>m(e.value),children:[o?o(e):(0,f.jsxs)(`span`,{className:`select-item-left`,children:[e.label,`1`]}),n===e.value&&(0,f.jsx)(T,{className:`select-item-check`})]},e.value))})]})},V=(0,t.forwardRef)(({className:e=``,type:t=`text`,hideArrows:n=!0,...r},i)=>(0,f.jsx)(`input`,{ref:i,type:t,className:`input ${t===`number`&&n?`input-number-clean`:``} ${e}`.trim(),...r}));V.displayName=`Input`;var H=(0,t.forwardRef)(({label:e,className:t=``,style:n,...r},i)=>(0,f.jsxs)(`div`,{className:`input-pixel-container ${t}`.trim(),style:n,children:[(0,f.jsx)(`span`,{className:`input-pixel-legend`,children:e}),(0,f.jsx)(V,{ref:i,type:`number`,...r}),(0,f.jsx)(`span`,{className:`input-pixel-suffix`,children:`px`})]})),ne=({onBack:e,onSave:n})=>{let[r,i]=(0,t.useState)(!1),{history:a,undo:o,redo:s,resetHistory:c,resetHistoryAfterSave:l,getLastHistoryItem:u}=L(),{base64:d}=u(),p=a.items.length>1&&!r,m=a.pointer===0,h=a.pointer===a.items.length-1,g=a.items.length<2||r;return(0,f.jsxs)(`div`,{className:`header`,children:[(0,f.jsx)(R,{variant:`ghost`,className:`btn-rect`,onClick:e,children:(0,f.jsx)(O,{})}),(0,f.jsxs)(`div`,{className:`header-tools`,children:[p&&(0,f.jsxs)(`div`,{className:`header-history`,children:[(0,f.jsx)(R,{variant:`outline`,disabled:m,className:`btn-rect`,onClick:o,children:(0,f.jsx)(A,{})}),(0,f.jsxs)(`div`,{className:`header-history-text`,children:[a.pointer+1,`/`,a.items.length]}),(0,f.jsx)(R,{variant:`outline`,disabled:h,className:`btn-rect`,onClick:s,children:(0,f.jsx)(ee,{})})]}),(0,f.jsx)(R,{variant:`outline`,disabled:r,onClick:c,children:`Reset`}),(0,f.jsxs)(R,{disabled:g,onClick:async()=>{if(d){i(!0);try{await n(d),l()}finally{i(!1)}}},children:[r?(0,f.jsx)(I,{}):(0,f.jsx)(T,{}),`Save`]})]})]})},U=32,W=e=>({x:e.offsetLeft,y:e.offsetTop,w:e.offsetWidth,h:e.offsetHeight}),re=(e,t,n,r,i,a,o,s)=>{let{x:c}=o,{y:l,w:u,h:d}=o;if(e)u+=r-n,u+c>i&&(u=i-c),u<U&&(u=U);else{let e=r-n,o=Math.round(e/t);if(u+=e,d+=o,l-=o/2,l<0||d+l>a||u+c>i||u<U||d<U)return W(s)}return{x:c,y:l,w:u,h:d}},ie=(e,t,n,r,i,a,o,s)=>{let{x:c,y:l,w:u,h:d}=o;if(e){let e=i-o.w-o.x;c+=r-n,c<0&&(c=0),u=i-c-e,u<U&&(u=U,c=i-e-U)}else{let e=r-n,i=Math.round(e/t);if(u-=e,d-=i,c+=e,l+=i/2,l<0||c<0||d+l>a||u<U||d<U)return W(s)}return{x:c,y:l,w:u,h:d}},ae=(e,t,n,r,i,a,o,s)=>{let{x:c,y:l,w:u,h:d}=o,f=a-d-l;if(e)l+=r-n,l<0&&(l=0),d=a-l-f,d<U&&(d=U,l=a-f-U);else{let e=r-n,a=Math.round(e*t);if(d-=e,u-=a,c+=a/2,l+=e,l<0||c<0||u+c>i||u<U||d<U)return W(s)}return{x:c,y:l,w:u,h:d}},oe=(e,t,n,r,i,a,o,s)=>{let{y:c}=o,{x:l,w:u,h:d}=o;if(e)d+=r-n,d+c>a&&(d=a-c),d<U&&(d=U);else{let e=r-n,o=Math.round(e*t);if(d+=e,u+=o,l-=o/2,d+c>a||l<0||u+l>i||u<U||d<U)return W(s)}return{x:l,y:c,w:u,h:d}},se=(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 W(l)}return{x:u,y:d,w:f,h:p}},ce=(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 W(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<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 W(l)}return{x:d,y:u,w:f,h:p}},ue=(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 W(l)}return{x:u,y:d,w:f,h:p}},de=(e,t,n,r,i,a,o,s,c,l,u)=>e===`r`?re(t,n,r,a,s,c,l,u):e===`l`?ie(t,n,r,a,s,c,l,u):e===`t`?ae(t,n,i,o,s,c,l,u):e===`b`?oe(t,n,i,o,s,c,l,u):e===`tl`?se(t,n,r,i,a,o,s,c,l,u):e===`tr`?ce(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`?ue(t,n,r,i,a,o,s,c,l,u):{x:0,y:0,w:0,h:0},G=(e,t,n)=>{let r=.1,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;return{x:(t-a)/2/t*100,y:(n-o)/2/n*100,w:s,h:c,xPx:Math.round((t-a)/2),yPx:Math.round((n-o)/2),wPx:a,hPx:o}},fe=()=>{let{getCurrentAction:e,getLastHistoryItem:n}=L(),r=e(),i=x(),a=(0,t.useRef)(null),o=(0,t.useRef)(null),{handleCropStart:s}=ye({imgRef:a,cropRef:o});if(!r||r.name!==`crop`)return null;let{width:c,height:l,base64:u}=n(),{x:d,y:p,w:m,h}=G(r.args.ratio,c,l);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(`img`,{ref:a,src:u,alt:`Image`,className:`crop-image`,style:{clipPath:`xywh(${d}% ${p}% ${m}% ${h}%)`}}),(0,f.jsxs)(`div`,{ref:o,className:`crop-box`,style:{width:`${m}%`,height:`${h}%`,top:`${p}%`,left:`${d}%`},children:[(0,f.jsx)(he,{}),i?(0,f.jsx)(be,{onMouseDown:s}):(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(me,{onMouseDown:s}),(0,f.jsx)(ge,{onMouseDown:s})]})]})]})},K=new EventTarget,q=e=>{let t=new CustomEvent(`crop-update`,{detail:e});K.dispatchEvent(t)},pe=()=>{let{setCurrentAction:e,getCurrentAction:n,getLastHistoryItem:r,addToHistory:i,setSidebar:a}=L(),{crop:o,resize:s}=y(),[c,l]=(0,t.useState)(!1),u=n(),{base64:d,width:p,height:m}=r(),h=(0,t.useRef)(null),g=(0,t.useRef)(null),_=(0,t.useRef)(null),v=(0,t.useRef)(null),b=(0,t.useRef)(null);return(0,t.useEffect)(()=>{if(u?.name!==`crop`)return;let{x:e,y:t,w:n,h:r}=G(u.args.ratio,p,m),i=Math.round(e/100*p),a=Math.round(t/100*m),o=Math.round(n/100*p),s=Math.round(r/100*m);h.current&&(h.current.textContent=i.toString()),g.current&&(g.current.textContent=a.toString()),_.current&&(_.current.textContent=o.toString()),v.current&&(v.current.textContent=s.toString()),b.current={x:i,y:a,w:o,h:s};let c=e=>{let t=e,{x:n,y:r,w:i,h:a}=t.detail;b.current=t.detail,h.current&&(h.current.textContent=n.toString()),g.current&&(g.current.textContent=r.toString()),_.current&&(_.current.textContent=i.toString()),v.current&&(v.current.textContent=a.toString())};return K.addEventListener(`crop-update`,c),()=>{K.removeEventListener(`crop-update`,c)}},[u,p,m]),(0,f.jsxs)(`div`,{className:`crop-tools`,children:[(0,f.jsxs)(`div`,{className:`crop-tools-info`,children:[(0,f.jsx)(`div`,{className:`crop-tools-info-label`,children:`left`}),(0,f.jsx)(`div`,{className:`crop-tools-info-value semibold`,ref:h})]}),(0,f.jsxs)(`div`,{className:`crop-tools-info`,children:[(0,f.jsx)(`div`,{className:`crop-tools-info-label`,children:`top`}),(0,f.jsx)(`div`,{className:`crop-tools-info-value semibold`,ref:g})]}),(0,f.jsxs)(`div`,{className:`crop-tools-info`,children:[(0,f.jsx)(`div`,{className:`crop-tools-info-label`,children:`width`}),(0,f.jsx)(`div`,{className:`crop-tools-info-value semibold`,ref:_})]}),(0,f.jsxs)(`div`,{className:`crop-tools-info`,children:[(0,f.jsx)(`div`,{className:`crop-tools-info-label`,children:`height`}),(0,f.jsx)(`div`,{className:`crop-tools-info-value semibold`,ref:v})]}),(0,f.jsx)(B,{orientation:`vertical`}),(0,f.jsx)(R,{variant:`ghost`,className:`text-green`,style:{height:`36px`,width:`36px`},disabled:c,onClick:async()=>{if(!(!u||u.name!==`crop`))try{if(l(!0),!b.current)return;let{x:e,y:t,w:n,h:r}=b.current,{preset:c}=u.args,f=await o(d,e,t,n,r);if(c){let{w:e,h:t}=c;f=await s(f,e,t)}i({name:`Crop`,base64:f,width:c?c.w:b.current.w,height:c?c.h:b.current.h}),a(!0)}catch(e){console.error(`Failed to process image:`,e)}finally{l(!1)}},children:c?(0,f.jsx)(I,{}):(0,f.jsx)(T,{})}),(0,f.jsx)(B,{orientation:`vertical`}),(0,f.jsx)(R,{variant:`ghost`,style:{height:`36px`,width:`36px`},disabled:c,onClick:()=>{e(null),a(!0)},children:(0,f.jsx)(E,{className:`text-red`})})]})},me=({onMouseDown:e})=>(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(`span`,{className:`crop-b crop-b-t`,onMouseDown:t=>e(t,`t`,`ns`)}),(0,f.jsx)(`span`,{className:`crop-b crop-b-r`,onMouseDown:t=>e(t,`r`,`ew`)}),(0,f.jsx)(`span`,{className:`crop-b crop-b-b`,onMouseDown:t=>e(t,`b`,`ns`)}),(0,f.jsx)(`span`,{className:`crop-b crop-b-l`,onMouseDown:t=>e(t,`l`,`ew`)})]}),he=()=>(0,f.jsxs)(`div`,{className:`crop-l-box`,children:[(0,f.jsx)(`span`,{className:`crop-l crop-l-v`}),(0,f.jsx)(`span`,{className:`crop-l crop-l-h`})]}),ge=({onMouseDown:e})=>(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(`span`,{className:`crop-ps crop-ps-tl`,onMouseDown:t=>e(t,`tl`,`nwse`)}),(0,f.jsx)(`span`,{className:`crop-ps crop-ps-t`,onMouseDown:t=>e(t,`t`,`ns`)}),(0,f.jsx)(`span`,{className:`crop-ps crop-ps-tr`,onMouseDown:t=>e(t,`tr`,`nesw`)}),(0,f.jsx)(`span`,{className:`crop-ps crop-ps-r`,onMouseDown:t=>e(t,`r`,`ew`)}),(0,f.jsx)(`span`,{className:`crop-ps crop-ps-br`,onMouseDown:t=>e(t,`br`,`nwse`)}),(0,f.jsx)(`span`,{className:`crop-ps crop-ps-b`,onMouseDown:t=>e(t,`b`,`ns`)}),(0,f.jsx)(`span`,{className:`crop-ps crop-ps-bl`,onMouseDown:t=>e(t,`bl`,`nesw`)}),(0,f.jsx)(`span`,{className:`crop-ps crop-ps-l`,onMouseDown:t=>e(t,`l`,`ew`)})]});function J(e,t,n){return Math.min(Math.max(e,t),n)}function Y(e,t){return e/t*100}function _e(e,t,n,r,i){e.style.left=`${t}%`,e.style.top=`${n}%`,e.style.width=`${r}%`,e.style.height=`${i}%`}function ve(e,t,n,r,i){e.style.clipPath=`xywh(${t}% ${n}% ${r}% ${i}%)`}var ye=({imgRef:e,cropRef:n})=>{let{getCurrentAction:r,getLastHistoryItem:i}=L(),a=x(),o=(0,t.useRef)(null),s=(0,t.useRef)(``),c=(0,t.useRef)({xPct:0,yPct:0}),l=(0,t.useRef)({x:0,y:0,w:0,h:0});return(0,t.useEffect)(()=>{let t=e=>{if(n.current){let e=n.current.parentElement;e&&(c.current={xPct:Y(n.current.offsetLeft,e.offsetWidth),yPct:Y(n.current.offsetTop,e.offsetHeight)})}let t=`clientX`in e?e.clientX:e.touches[0].clientX,r=`clientY`in e?e.clientY:e.touches[0].clientY;o.current={x:t,y:r},document.body.style.cursor=`move`},a=t=>{if(!e.current||!n.current||!o.current)return;let r=n.current,i=e.current,a=r.parentElement;if(!a)return;let c=a.offsetWidth,l=a.offsetHeight;if(s.current){u(t,r,i,c,l);return}d(t,r,i,c,l)},u=(e,t,n,a,c)=>{let u=r();if(!u||u.name!==`crop`||!o.current)return;let{isFree:d,ratio:f}=u.args,p=`clientX`in e?e.clientX:e.touches[0].clientX,m=`clientY`in e?e.clientY:e.touches[0].clientY,{x:h,y:g,w:_,h:v}=de(s.current,d,f,o.current.x,o.current.y,p,m,a,c,l.current,t),y=Y(h,a),b=Y(g,c),x=Y(_,a),S=Y(v,c);_e(t,y,b,x,S),ve(n,y,b,x,S);let C=i();if(!C)return;let{width:w,height:T}=C;q({x:Math.round(y/100*w),y:Math.round(b/100*T),w:Math.round(x/100*w),h:Math.round(S/100*T)})},d=(e,t,n,r,a)=>{if(!o.current)return;console.log(`HandleDrag`);let s=t.offsetWidth,l=t.offsetHeight,u=`clientX`in e?e.clientX:e.touches[0].clientX,d=`clientY`in e?e.clientY:e.touches[0].clientY,f=Y(u-o.current.x,r),p=Y(d-o.current.y,a);o.current={x:u,y:d};let m=Y(r-s,r),h=Y(a-l,a),g=J(c.current.xPct+f,0,m),_=J(c.current.yPct+p,0,h),v=Y(s,r),y=Y(l,a);c.current={xPct:g,yPct:_},_e(t,g,_,v,y),ve(n,g,_,v,y);let{width:b,height:x}=i();q({x:Math.round(g/100*b),y:Math.round(_/100*x),w:Math.round(v/100*b),h:Math.round(y/100*x)})},f=()=>{n.current&&(o.current=null,s.current=``,n.current.style.cursor=`move`,document.body.style.cursor=`auto`)};if(!n.current)return;let p=new AbortController,{signal:m}=p;return n.current.addEventListener(`mousedown`,t,{signal:m}),n.current.addEventListener(`touchstart`,t,{signal:m}),document.addEventListener(`mousemove`,a,{signal:m}),document.addEventListener(`touchmove`,a,{signal:m}),document.addEventListener(`mouseup`,f,{signal:m}),document.addEventListener(`touchend`,f,{signal:m}),()=>p.abort()},[r,i,e,n]),{handleCropStart:(e,t,r)=>{if(!n.current)return;e.stopPropagation(),l.current={x:n.current.offsetLeft,y:n.current.offsetTop,w:n.current.offsetWidth,h:n.current.offsetHeight};let i=`clientX`in e?e.clientX:e.touches[0].clientX,c=`clientY`in e?e.clientY:e.touches[0].clientY;o.current={x:i,y:c},s.current=t,a||(n.current.style.cursor=`${r}-resize`,document.body.style.cursor=`${r}-resize`)}}},be=({onMouseDown:e})=>(0,f.jsx)(`div`,{className:`crop-p-b`,children:(0,f.jsx)(`div`,{className:`crop-p-p`,onTouchStart:t=>e(t,`br`,`nwse`)})}),X=10,Z=200,Q=(e,t,n)=>(e<X&&(e=X),e>Z&&(e=Z),{updatedScale:e,updatedWidth:Math.round(e/100*t),updatedHeight:Math.round(e/100*n)}),xe=({onResizing:e})=>{let{getLastHistoryItem:n,setCurrentAction:r,addToHistory:i,setSidebar:a}=L(),{width:o,height:s,base64:c}=n(),[l,u]=(0,t.useState)(!1),[d,p]=(0,t.useState)(o),[m,h]=(0,t.useState)(s),g=(0,t.useRef)(0),{resize:_}=y(),v=x(),b=t=>{let{updatedScale:n,updatedWidth:r,updatedHeight:i}=Q(parseInt(t.target.value)/o*100,o,s);p(r),h(i),e(n)},S=t=>{let{updatedScale:n,updatedWidth:r,updatedHeight:i}=Q(parseInt(t.target.value)/s*100,o,s);h(i),p(r),e(n)},C=()=>{e(100),r(null),a(!0)},w=async()=>{try{u(!0);let t=await _(c,d,m);i({name:`Resize`,base64:t,width:d,height:m}),e(100),a(!0)}catch(e){console.error(`Failed to process image:`,e)}finally{u(!1)}};return(0,t.useEffect)(()=>{let t=Math.round(d/o*100),n=t=>{let{updatedHeight:n,updatedWidth:r}=Q(t,o,s);h(n),p(r),e(t)},r=e=>{if(l)return;let r=Math.sign(e.deltaY);t-=r*2,t<=X&&(t=X),t>=Z&&(t=Z),n(t)},i=e=>{g.current=e.touches[0].clientY},a=e=>{if(l)return;let r=e.touches[0].clientY,i=g.current-r;Math.abs(i)<10||(t+=Math.sign(i)*2,t<=X&&(t=X),t>=Z&&(t=Z),n(t),g.current=r)},c=new AbortController,{signal:u}=c;return window.addEventListener(`wheel`,r,{signal:u}),window.addEventListener(`touchstart`,i,{signal:u}),window.addEventListener(`touchmove`,a,{signal:u}),()=>c.abort()},[s,o,l,v,e,d]),(0,f.jsxs)(`div`,{className:`resize`,children:[(0,f.jsx)(`div`,{className:`resize-text`,children:v?`Slide UP/Down to Resize`:`Scroll UP/Down to Resize`}),(0,f.jsx)(`div`,{className:`resize-border`}),(0,f.jsxs)(`div`,{className:`resize-tools`,children:[(0,f.jsx)(H,{value:d,name:`width`,label:`Width`,disabled:l,style:{width:`88px`},onChange:b}),(0,f.jsx)(D,{className:`resize-tools-lock`}),(0,f.jsx)(H,{value:m,name:`height`,label:`Height`,disabled:l,style:{width:`88px`},onChange:S}),(0,f.jsxs)(`div`,{className:`resize-tools-buttons`,children:[(0,f.jsx)(R,{variant:`outline`,className:`resize-tools-save text-green`,disabled:d===o||l,onClick:()=>w(),children:l?(0,f.jsx)(I,{}):(0,f.jsx)(T,{})}),(0,f.jsx)(R,{variant:`outline`,className:`resize-tools-close text-red`,disabled:l,onClick:C,children:(0,f.jsx)(E,{})})]})]})]})},Se=()=>{let{getLastHistoryItem:e,currentAction:n}=L(),r=(0,t.useRef)(null),i=(0,t.useRef)(null),{width:a,height:o,base64:s}=e(),c=n?.name===`crop`,l=n?.name===`resize`,u=c||l,d=e=>{r.current&&(r.current.style.transform=`scale(${e/100})`)},p=`frame ${u?`mask`:``}`,m=`frame-image ${u?`frame-image--faded`:``}`;return(0,f.jsxs)(`div`,{className:p,children:[(0,f.jsxs)(`div`,{ref:r,style:{aspectRatio:`${a} / ${o}`},className:`frame-preview`,children:[(0,f.jsx)(`img`,{ref:i,src:s,alt:`Image`,className:m}),c&&(0,f.jsx)(fe,{},n?.args?.id)]}),l&&(0,f.jsx)(xe,{onResizing:d}),c&&(0,f.jsx)(pe,{})]})},Ce=()=>{let{getLastHistoryItem:e,setCurrentAction:t,setSidebar:n}=L(),{width:r,height:i}=e()??{width:0,height:0};return(0,f.jsxs)(R,{variant:`outline`,className:`sidebar-resize`,onClick:()=>{t({name:`resize`,args:{width:r,height:i}}),n(!1)},children:[(0,f.jsxs)(`div`,{className:`sidebar-resize-icon`,children:[(0,f.jsx)(F,{}),`Resize`]}),(0,f.jsxs)(`div`,{className:`sidebar-resize-size`,children:[r,` x `,i]})]})},we=()=>{let{currentAction:e,setCurrentAction:t,getLastHistoryItem:n,setSidebar:r}=L(),{name:i,args:a}=e||{},o=i===`crop`?a?.id:``,{width:s,height:c}=n(),l=s/c,u=e=>{e!==o&&(t({name:`crop`,args:{id:e,ratio:e===`1:1`?1:l,isFree:e===`freeform`,preset:null}}),r(!1))};return(0,f.jsxs)(`div`,{className:`sidebar-crop`,children:[(0,f.jsx)(`h4`,{children:`Crop`}),(0,f.jsxs)(`div`,{className:`sidebar-crop-ratios`,children:[(0,f.jsx)(z,{label:`Freeform`,icon:(0,f.jsx)(M,{}),active:o===`freeform`,onClick:()=>u(`freeform`)}),(0,f.jsx)(z,{label:`Original`,icon:(0,f.jsx)(N,{}),active:o===`original`,onClick:()=>u(`original`)}),(0,f.jsx)(z,{label:`1:1`,icon:(0,f.jsx)(P,{}),active:o===`1:1`,onClick:()=>u(`1:1`)})]})]})},$=[{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`}]}],Te=$.map(e=>e.options).flat(),Ee=()=>{let{setCurrentAction:e,currentAction:t,setSidebar:n}=L(),r=t?.name===`crop`&&Te.some(e=>e.value===t.args.id)?t.args.id:``;return(0,f.jsxs)(`div`,{className:`sidebar-preset`,children:[(0,f.jsx)(`h4`,{children:`Presets`}),(0,f.jsx)(`div`,{className:`relative`,children:(0,f.jsx)(te,{value:r,placeholder:`Select a preset`,onChange:t=>{if(!t)return;let r=$.map(e=>e.options).flat().find(e=>e.value===t);if(!r)return;let i={id:t,ratio:r.w/r.h,isFree:!1,preset:{w:r.w,h:r.h}};e({name:`crop`,args:i}),n(!1)},items:$})})]})},De=()=>{let{getSidebar:e,setSidebar:t}=L(),n=e(),r=C(`md`);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(R,{variant:`outline`,className:`sidebar-settings`,onClick:()=>t(!0),children:(0,f.jsx)(j,{})}),(0,f.jsx)(`div`,{className:`sidebar`,style:{transform:r&&n?`translateX(-320px)`:`translateX(0%)`},children:(0,f.jsx)(`div`,{className:`sidebar-container`,children:(0,f.jsxs)(`div`,{className:`sidebar-content`,children:[r&&(0,f.jsx)(R,{variant:`ghost`,className:`sidebar-close-btn btn-rect`,onClick:()=>t(!1),children:(0,f.jsx)(E,{})}),(0,f.jsx)(Ce,{}),(0,f.jsx)(B,{className:`sidebar-separator`}),(0,f.jsx)(we,{}),(0,f.jsx)(B,{className:`sidebar-separator`}),(0,f.jsx)(Ee,{})]})})})]})};e.ImageEditor=({image:e,onSave:t,onBack:n})=>{let{loading:r,error:i,width:a,height:o,base64:s,extension:c}=v(e);return r||i||!s||!c?(0,f.jsxs)(`div`,{className:`picedi sys`,children:[r&&(0,f.jsx)(p,{size:48}),i&&(0,f.jsx)(`div`,{className:`text-red`,children:i}),!r&&!i&&(!s||!c)&&(0,f.jsx)(`div`,{className:`text-red`,children:`Failed to load image.`})]}):(0,f.jsx)(g,{base64:s,width:a,height:o,ext:c,children:(0,f.jsxs)(`div`,{className:`picedi main`,children:[(0,f.jsx)(ne,{onSave:t,onBack:n}),(0,f.jsxs)(`div`,{className:`grid`,children:[(0,f.jsx)(Se,{}),(0,f.jsx)(De,{})]})]})})}});
|
|
7
|
+
<%s key={someKey} {...props} />`,o,p,m,p),k[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===T&&(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`),ee=Symbol.for(`react.memo`),T=Symbol.for(`react.lazy`),E=Symbol.for(`react.activity`),te=Symbol.for(`react.client.reference`),D=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,ne=Object.prototype.hasOwnProperty,re=Array.isArray,O=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var ie,ae={},oe=m.react_stack_bottom_frame.bind(m,o)(),se=O(i(o)),k={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>D.recentlyCreatedOwnerStacks++;return d(e,t,n,!1,r?Error(`react-stack-top-frame`):oe,r?O(i(e)):se)},e.jsxs=function(e,t,n){var r=1e4>D.recentlyCreatedOwnerStacks++;return d(e,t,n,!0,r?Error(`react-stack-top-frame`):oe,r?O(i(e)):se)}})()})),h=c(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=p():t.exports=m()}))(),g=({children:e,mimeType:n,width:r,height:i,originalBlob:a,previewUrl:o,isAlpha:s,settings:c})=>{let[l,u]=(0,t.useState)(d(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=>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}}}),_=()=>{let{items:e,pointer:t}=l.history;return e.at(t)??e.at(0)??{width:0,height:0,action:{name:`initial`,args:null}}},v=()=>{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===`rotate`);return n?.action.name===`rotate`?n.action.args.degrees:0},y=()=>u(e=>({...e,history:{items:[e.history.items[0]],pointer:0}})),b=()=>u(e=>e.history.pointer<=0?e:{...e,history:{...e.history,pointer:e.history.pointer-1}}),x=()=>u(e=>e.history.pointer>=e.history.items.length-1?e:{...e,history:{...e.history,pointer:e.history.pointer+1}}),S=e=>u(t=>({...t,sidebar:e})),C=(0,t.useMemo)(()=>new EventTarget,[]),w=e=>{p.current&&URL.revokeObjectURL(p.current),p.current=URL.createObjectURL(e.previewBlob),u(d(e.mimeType,e.width,e.height,e.newBlob,p.current,e.isAlpha,c))};return(0,h.jsx)(f,{value:{...l,setImage:w,setCurrentAction:m,getLastHistoryItem:_,getLastRotation:v,addToHistory:g,resetHistory:y,undo:b,redo:x,setSidebar:S,eventBus:C},children:e})},_="(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.`})}}})();",v=typeof self<`u`&&self.Blob&&new Blob([`(self.URL || self.webkitURL).revokeObjectURL(self.location.href);`,_],{type:`text/javascript;charset=utf-8`});function y(e){let t;try{if(t=v&&(self.URL||self.webkitURL).createObjectURL(v),!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(_),{name:e?.name})}}var b=e=>{let[n,r]=(0,t.useState)({loading:!0,error:``,width:0,height:0,mimeType:``,originalBlob:null,previewUrl:``,isAlpha:!1}),i=(0,t.useRef)(null);return(0,t.useEffect)(()=>{if(!e)return;let t=new y;return t.postMessage(e),t.onmessage=e=>{let t=e.data;t.success?(i.current&&URL.revokeObjectURL(i.current),i.current=URL.createObjectURL(t.previewBlob),r({loading:!1,error:``,mimeType:t.mimeType,width:t.width,height:t.height,originalBlob:t.originalBlob,previewUrl:i.current,isAlpha:t.isAlpha})):r(e=>({...e,loading:!1,error:t.error||`Error processing image.`}))},()=>{t.terminate(),i.current&&=(URL.revokeObjectURL(i.current),null)}},[e]),n},x=()=>{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},S=()=>{let[e]=(0,t.useState)(()=>x());return e},C={sm:640,md:768,lg:1024,xl:1280},w={INITIAL:`initial`,RESIZE:`resize`,CROP:`crop`,PRESET_CROP:`presetCrop`,FLIP:`flip`,ROTATE:`rotate`,FILTERS:`filters`};function ee(e){let[n,r]=(0,t.useState)(()=>window.innerWidth<C[e]);return(0,t.useEffect)(()=>{function t(){r(window.innerWidth<C[e])}return window.addEventListener(`resize`,t),()=>window.removeEventListener(`resize`,t)},[e]),n}var T={xmlns:`http://w3.org`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`},E=e=>(0,h.jsx)(`svg`,{...T,...e,children:(0,h.jsx)(`path`,{d:`M20 6 9 17l-5-5`})}),te=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M18 6 6 18`}),(0,h.jsx)(`path`,{d:`m6 6 12 12`})]}),D=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`rect`,{width:`18`,height:`11`,x:`3`,y:`11`,rx:`2`,ry:`2`}),(0,h.jsx)(`path`,{d:`M7 11V7a5 5 0 0 1 10 0v4`})]}),ne=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`m12 19-7-7 7-7`}),(0,h.jsx)(`path`,{d:`M19 12H5`})]}),re=e=>(0,h.jsx)(`svg`,{...T,...e,children:(0,h.jsx)(`path`,{d:`m6 9 6 6 6-6`})}),O=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M3 7v6h6`}),(0,h.jsx)(`path`,{d:`M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13`})]}),ie=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M21 7v6h-6`}),(0,h.jsx)(`path`,{d:`M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7`})]}),ae=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915`}),(0,h.jsx)(`circle`,{cx:`12`,cy:`12`,r:`3`})]}),oe=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M6 2v14a2 2 0 0 0 2 2h14`}),(0,h.jsx)(`path`,{d:`M18 22V8a2 2 0 0 0-2-2H2`})]}),se=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`,ry:`2`}),(0,h.jsx)(`circle`,{cx:`9`,cy:`9`,r:`2`}),(0,h.jsx)(`path`,{d:`m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21`})]}),k=e=>(0,h.jsx)(`svg`,{...T,...e,children:(0,h.jsx)(`rect`,{width:`18`,height:`18`,x:`3`,y:`3`,rx:`2`})}),ce=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M3 7V5a2 2 0 0 1 2-2h2`}),(0,h.jsx)(`path`,{d:`M17 3h2a2 2 0 0 1 2 2v2`}),(0,h.jsx)(`path`,{d:`M21 17v2a2 2 0 0 1-2 2h-2`}),(0,h.jsx)(`path`,{d:`M7 21H5a2 2 0 0 1-2-2v-2`}),(0,h.jsx)(`rect`,{width:`10`,height:`8`,x:`7`,y:`8`,rx:`1`})]}),le=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M8 3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h3`}),(0,h.jsx)(`path`,{d:`M16 3h3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-3`}),(0,h.jsx)(`path`,{d:`M12 20v2`}),(0,h.jsx)(`path`,{d:`M12 14v2`}),(0,h.jsx)(`path`,{d:`M12 8v2`}),(0,h.jsx)(`path`,{d:`M12 2v2`})]}),ue=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M21 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3`}),(0,h.jsx)(`path`,{d:`M21 16v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3`}),(0,h.jsx)(`path`,{d:`M4 12H2`}),(0,h.jsx)(`path`,{d:`M10 12H8`}),(0,h.jsx)(`path`,{d:`M16 12h-2`}),(0,h.jsx)(`path`,{d:`M22 12h-2`})]}),de=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8`}),(0,h.jsx)(`path`,{d:`M21 3v5h-5`})]}),fe=e=>(0,h.jsxs)(`svg`,{...T,...e,children:[(0,h.jsx)(`path`,{d:`M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8`}),(0,h.jsx)(`path`,{d:`M3 3v5h5`})]}),A=e=>(0,h.jsx)(`svg`,{...T,...e,children:(0,h.jsx)(`path`,{d:`M21 12a9 9 0 1 1-6.219-8.56`,children:(0,h.jsx)(`animateTransform`,{attributeType:`xml`,attributeName:`transform`,type:`rotate`,from:`0 12 12`,to:`360 12 12`,dur:`0.8s`,repeatCount:`indefinite`})})}),j=()=>{let e=(0,t.useContext)(f);if(!e)throw Error(`usePixediContext must be used within an PixediProvider`);return e},M={button:`_button_snd36_1`,default:`_default_snd36_32`,outline:`_outline_snd36_39`,ghost:`_ghost_snd36_47`,rect:`_rect_snd36_54`},N=({className:e=``,variant:t=`default`,children:n,ref:r,...i})=>(0,h.jsx)(`button`,{ref:r,className:`${M.button} ${M[t]} ${e}`.trim(),...i,children:n}),P={root:`_root_kw2xl_8`,textRed:`_textRed_kw2xl_73`,bgRed:`_bgRed_kw2xl_76`,bgGreen:`_bgGreen_kw2xl_79`,textGreen:`_textGreen_kw2xl_82`,mask:`_mask_kw2xl_85`,semibold:`_semibold_kw2xl_88`,bold:`_bold_kw2xl_92`,system:`_system_kw2xl_96`,wrapper:`_wrapper_kw2xl_105`,main:`_main_kw2xl_111`,grid:`_grid_kw2xl_119`},pe={button:`_button_gf7m5_1`},me=({className:e=``,active:t=!1,icon:n,label:r,ref:i,...a})=>(0,h.jsxs)(`button`,{ref:i,type:`button`,"aria-pressed":t,className:`${pe.button} ${e}`.trim(),...a,children:[n,(0,h.jsx)(`span`,{className:P.semibold,children:r})]}),he={separator:`_separator_rqskq_1`},F=(0,t.forwardRef)(({className:e=``,orientation:t=`horizontal`,...n},r)=>(0,h.jsx)(`hr`,{ref:r,role:`separator`,"aria-orientation":t,"data-orientation":t,className:`${he.separator} ${e}`.trim(),...n}));F.displayName=`Separator`;var I={wrapper:`_wrapper_12rgt_1`,trigger:`_trigger_12rgt_6`,triggerArrow:`_triggerArrow_12rgt_29`,content:`_content_12rgt_38`,groupLabel:`_groupLabel_12rgt_68`,item:`_item_12rgt_75`,itemLeft:`_itemLeft_12rgt_91`,itemAddon:`_itemAddon_12rgt_95`,itemRightContainer:`_itemRightContainer_12rgt_112`,itemRight:`_itemRight_12rgt_112`,itemCheck:`_itemCheck_12rgt_121`},ge=({items:e,value:n,onChange:r,placeholder:i=`Select an option`,className:a=``,renderOption:o})=>{let[s,c]=(0,t.useState)(!1),l=(0,t.useRef)(null),u=(0,t.useRef)(null),d=(0,t.useRef)(null),f=(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);(0,t.useEffect)(()=>{let e=e=>{l.current&&!e.composedPath().includes(l.current)&&c(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]),(0,t.useLayoutEffect)(()=>{if(!s||!u.current||!d.current)return;let e=l.current?.closest(`.${P.main}`)?.getBoundingClientRect(),t=u.current.getBoundingClientRect(),n=d.current.getBoundingClientRect(),r=(e?.bottom??window.innerHeight)-16,i=t.bottom+n.height+4,a=`calc(100% + 4px)`;i>r&&(a=`calc(100% + 4px - ${i-r}px)`),d.current.style.top=a},[s,e]);let p=e=>{r(e),c(!1)};return(0,h.jsxs)(`div`,{ref:l,className:`${I.wrapper} ${a}`.trim(),"data-state":s?`open`:`closed`,children:[(0,h.jsxs)(`button`,{ref:u,type:`button`,className:I.trigger,onClick:()=>c(!s),children:[(0,h.jsx)(`span`,{children:f?f.fullName:i}),(0,h.jsx)(re,{className:I.triggerArrow})]}),(0,h.jsx)(`div`,{ref:d,className:I.content,children:e.map((e,t)=>e.options?(0,h.jsxs)(`div`,{children:[(0,h.jsx)(`div`,{className:`${I.groupLabel} ${P.semibold}`,children:e.label}),e.options.map(e=>(0,h.jsxs)(`div`,{className:I.item,onClick:()=>p(e.value),children:[o?o(e):(0,h.jsx)(`span`,{className:I.itemLeft,children:e.label}),(0,h.jsxs)(`div`,{className:I.itemAddon,children:[e.rightLabel&&(0,h.jsx)(`span`,{children:e.rightLabel}),n===e.value&&(0,h.jsx)(E,{className:I.itemCheck}),n!==e.value&&(0,h.jsx)(`b`,{})]})]},e.value))]},`group-${t}`):(0,h.jsxs)(`div`,{className:I.item,onClick:()=>p(e.value),children:[o?o(e):(0,h.jsx)(`span`,{className:I.itemLeft,children:e.label}),n===e.value&&(0,h.jsx)(E,{className:I.itemCheck})]},e.value))})]})},_e={input:`_input_j55nq_1`,numberClean:`_numberClean_j55nq_34`},ve=({className:e=``,type:t=`text`,hideArrows:n=!0,ref:r,...i})=>{let a=t===`number`&&n?_e.numberClean:``;return(0,h.jsx)(`input`,{ref:r,type:t,className:`${_e.input} ${a} ${e}`.trim(),...i})},ye={container:`_container_14vsv_1`,legend:`_legend_14vsv_4`,suffix:`_suffix_14vsv_13`},be=({label:e,className:t=``,style:n,ref:r,...i})=>(0,h.jsxs)(`div`,{className:`${ye.container} ${t}`.trim(),style:n,children:[(0,h.jsx)(`span`,{className:ye.legend,children:e}),(0,h.jsx)(ve,{ref:r,type:`number`,...i}),(0,h.jsx)(`span`,{className:ye.suffix,children:`px`})]}),xe={group:`_group_qpue1_1`,save:`_save_qpue1_6`,close:`_close_qpue1_13`},L=({onSave:e,onClose:t,saving:n=!1,disabled:r=!1})=>(0,h.jsxs)(`div`,{className:xe.group,children:[(0,h.jsx)(N,{variant:`outline`,className:xe.save,disabled:r||n,onClick:e,children:n?(0,h.jsx)(A,{}):(0,h.jsx)(E,{})}),(0,h.jsx)(N,{variant:`outline`,className:xe.close,disabled:n,onClick:t,children:(0,h.jsx)(te,{})})]}),R={sliderContainer:`_sliderContainer_1ntcm_1`,disabled:`_disabled_1ntcm_12`,sliderTrack:`_sliderTrack_1ntcm_18`,sliderRange:`_sliderRange_1ntcm_30`,sliderThumb:`_sliderThumb_1ntcm_38`,hiddenInput:`_hiddenInput_1ntcm_53`},Se=({min:e,max:n,value:r,step:i=1,disabled:a=!1,onChange:o,className:s,...c})=>{let l=(0,t.useMemo)(()=>{let t=n-e;return t<=0?0:(r-e)/t*100},[r,e,n]);return(0,h.jsxs)(`div`,{className:`${R.sliderContainer} ${a?R.disabled:``} ${s||``}`,style:{"--slider-progress":`${l}%`},children:[(0,h.jsxs)(`div`,{className:R.sliderTrack,children:[(0,h.jsx)(`div`,{className:R.sliderRange}),(0,h.jsx)(`div`,{className:R.sliderThumb,style:{left:`${l}%`}})]}),(0,h.jsx)(`input`,{type:`range`,min:e,max:n,step:i,value:r,disabled:a,onChange:e=>{a||o(Number(e.target.value))},className:R.hiddenInput,...c})]})},Ce=1920,we=.85,Te=[{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`}]}],z=32,Ee=(e,t,n,r,i,a,o,s,c,l)=>{let{x:u,y:d,w:f,h:p}=c;if(e){let e=o-c.w-c.x;u+=i-n,u<0&&(u=0),f=o-u-e,f<z&&(f=z,u=o-e-z);let t=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-t,p<z&&(p=z,d=s-t-z)}else{if(t>=1){let e=i-n,r=Math.round(e/t);f-=e,p-=r,u+=e,d+=r}else{let e=a-r,n=Math.round(e*t);f-=n,p-=e,u+=n,d+=e}if(u<0||d<0||f<z||p<z)return l}return{x:u,y:d,w:f,h:p}},De=(e,t,n,r,i,a,o,s,c,l)=>{let{x:u}=c,{y:d,w:f,h:p}=c;if(e){f+=i-n,f+u>o&&(f=o-u),f<z&&(f=z);let e=s-p-d;d+=a-r,d<0&&(d=0),p=s-d-e,p<z&&(p=z,d=s-e-z)}else{if(t>1){let e=i-n,r=Math.round(e/t);f+=e,p+=r,d-=r}else{let e=a-r,n=Math.round(e*t);f-=n,p-=e,d+=e}if(f+u>o||d<0||f<z||p<z)return l}return{x:u,y:d,w:f,h:p}},Oe=(e,t,n,r,i,a,o,s,c,l)=>{let{y:u}=c,{x:d,w:f,h:p}=c;if(e){p+=a-r,p+u>s&&(p=s-u),p<z&&(p=z);let e=o-c.w-c.x;d+=i-n,d<0&&(d=0),f=o-d-e,f<z&&(f=z,d=o-e-z)}else{if(t>=1){let e=i-n,r=Math.round(e/t);f-=e,p-=r,d+=e}else{let e=a-r,n=Math.round(e*t);f+=n,p+=e,d-=n}if(p+u>s||d<0||f<z||p<z)return l}return{x:d,y:u,w:f,h:p}},ke=(e,t,n,r,i,a,o,s,c,l)=>{let{x:u,y:d}=c,{w:f,h:p}=c;if(e)f+=i-n,f+u>o&&(f=o-u),f<z&&(f=z),p+=a-r,p+d>s&&(p=s-d),p<z&&(p=z);else{if(t>=1){let e=i-n,r=Math.round(e/t);f+=e,p+=r}else{let e=a-r,n=Math.round(e*t);f+=n,p+=e}if(p+d>s||f+u>o||f<z||p<z)return l}return{x:u,y:d,w:f,h:p}},Ae=(e,t,n,r,i,a,o,s,c,l,u)=>e===`tl`?Ee(t,n,r,i,a,o,s,c,l,u):e===`tr`?De(t,n,r,i,a,o,s,c,l,u):e===`bl`?Oe(t,n,r,i,a,o,s,c,l,u):e===`br`?ke(t,n,r,i,a,o,s,c,l,u):{x:0,y:0,w:0,h:0},je=(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;return{x:(t-a)/2/t*100,y:(n-o)/2/n*100,w:s,h:c}},Me=(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}},B=e=>Math.abs(Math.round(e/90))%2==1,Ne=(e,t,n,r)=>B(n)===B(r)?{width:e,height:t}:{width:t,height:e},Pe=async e=>{let{width:t,height:n}=e,r=Math.min(1,Ce/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:we})};function Fe(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 Ie=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 Le(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)},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 Pe(s),{width:l,height:u}=s,d=Fe(s);return s.close(),{newBlob:o,previewBlob:c,mimeType:a,width:l,height:u,isAlpha:d}}}}var V=(e,t,n)=>Math.max(t,Math.min(n,e)),Re=(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]]],ze=e=>(Math.round(e/90)%4+4)%4*90,Be=e=>{switch(ze(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]]}},Ve=(e,t)=>[[e?-1:1,0],[0,t?-1:1]],He=(e,t,n)=>Re(Ve(t,n),Be(-e)),Ue=e=>[+(e[0][0]<0||e[0][1]<0),+(e[1][0]<0||e[1][1]<0)],H=(e,t,n)=>{let r=Ue(e);return[e[0][0]*t+e[0][1]*n+r[0],e[1][0]*t+e[1][1]*n+r[1]]},We=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===`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===`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=He(i,a,o),u=[H(l,e,t),H(l,e+n,t),H(l,e,t+s),H(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===`flip`){let e=B(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===`rotate`&&(i=c.action.args.degrees)}let s=r.w*t,c=r.h*n,l=B(i),u=l?c:s,d=l?s:c,f=e.at(-1)?.width||0,p=e.at(-1)?.height||0;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}},Ge=e=>{let{box:t,flipH:n,flipV:r,rotation:i,newWidth:a,newHeight:o,initWidth:s,initHeight:c,viewWidth:l,viewHeight:u}=We(e),d=V(t.x,0,1),f=V(t.y,0,1),p={x:d,y:f,w:V(t.w,0,1-d),h:V(t.h,0,1-f)},m=ze(i);return{...p.x===0&&p.y===0&&p.w===1&&p.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)}},...m===0?{}:{rotate:{degrees:m}},...n||r?{flip:{horizontal:n,vertical:r}}:{},...Math.round(l)!==a||Math.round(u)!==o?{resize:{width:a,height:o}}:{}}},Ke=e=>{let[n,r]=(0,t.useState)(!1),{setImage:i,settings:a,history:o,originalBlob:s,setCurrentAction:c,resetHistory:l}=j();return{save:async()=>{if(!s)return;r(!0);let t=Ge(o.items.slice(0,o.pointer+1));try{let n=await Le(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);let{newBlob:r,previewBlob:o,mimeType:c,width:l,height:u,isAlpha:d}=await n.get(a),f=``;a.exportAs===`base64`&&(f=await Ie(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}},U={header:`_header_msw8l_1`,tools:`_tools_msw8l_11`,history:`_history_msw8l_15`,historyText:`_historyText_msw8l_20`},qe=({onBack:e,onSave:t})=>{let{save:n,reset:r,isSaving:i}=Ke(t),{history:a,undo:o,redo:s}=j(),c=a.items.length>1&&!i,l=a.pointer===0,u=a.pointer===a.items.length-1,d=a.items.length<2||i,f=d||a.pointer===0;return(0,h.jsxs)(`div`,{className:U.header,children:[(0,h.jsx)(N,{variant:`ghost`,className:M.rect,onClick:e,children:(0,h.jsx)(ne,{})}),(0,h.jsxs)(`div`,{className:U.tools,children:[c&&(0,h.jsxs)(`div`,{className:U.history,children:[(0,h.jsx)(N,{variant:`outline`,disabled:l,className:M.rect,onClick:o,children:(0,h.jsx)(O,{})}),(0,h.jsxs)(`div`,{className:U.historyText,children:[a.pointer+1,`/`,a.items.length]}),(0,h.jsx)(N,{variant:`outline`,disabled:u,className:M.rect,onClick:s,children:(0,h.jsx)(ie,{})})]}),(0,h.jsx)(N,{variant:`outline`,disabled:d,onClick:r,children:`Reset`}),(0,h.jsxs)(N,{disabled:f,onClick:n,children:[i?(0,h.jsx)(A,{}):(0,h.jsx)(E,{}),`Save`]})]})]})},Je=(e,t)=>{let n=new CustomEvent(`crop-update`,{detail:t});e.dispatchEvent(n)},Ye=(e,t)=>{let n=new CustomEvent(`clip-path-update`,{detail:t});e.dispatchEvent(n)},W=(e,t)=>{let n=new CustomEvent(`resize-update`,{detail:t});e.dispatchEvent(n)},G={resize:`_resize_11cwi_1`,slider:`_slider_11cwi_14`,border:`_border_11cwi_18`,tools:`_tools_11cwi_24`,toolsLock:`_toolsLock_11cwi_30`},K=10,q=200,J=(e,t,n)=>(e<K&&(e=K),e>q&&(e=q),{updatedScale:e,updatedWidth:Math.round(e/100*t),updatedHeight:Math.round(e/100*n)}),Xe=()=>{let{getLastHistoryItem:e,setCurrentAction:n,addToHistory:r,setSidebar:i,eventBus:a}=j(),{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)(0),g=S(),_=e=>{let{updatedScale:t,updatedWidth:n,updatedHeight:r}=J(e,o,s);l(n),d(r),p(t),W(a,t)},v=e=>{let{updatedScale:t,updatedWidth:n,updatedHeight:r}=J(parseInt(e.target?.value??`1`)/o*100,o,s);l(n),d(r),p(t),W(a,t)},y=e=>{let{updatedScale:t,updatedWidth:n,updatedHeight:r}=J(parseInt(e.target.value)/s*100,o,s);d(r),l(n),p(t),W(a,t)},b=()=>{W(a,100),n(null),i(!0)},x=()=>{r({width:c,height:u,action:{name:`resize`,args:{width:c,height:u}}}),W(a,100),i(!0)};return(0,t.useEffect)(()=>{let e=Math.round(c/o*100),t=e=>{let{updatedHeight:t,updatedWidth:n}=J(e,o,s);d(t),l(n),p(e),W(a,e)},n=n=>{let r=Math.sign(n.deltaY);e-=r*2,e<=K&&(e=K),e>=q&&(e=q),t(e)},r=e=>{m.current=e.touches[0].clientY},i=n=>{let r=n.touches[0].clientY,i=m.current-r;Math.abs(i)<10||(e+=Math.sign(i)*2,e<=K&&(e=K),e>=q&&(e=q),t(e),m.current=r)},u=new AbortController,{signal:f}=u;return window.addEventListener(`wheel`,n,{signal:f}),window.addEventListener(`touchstart`,r,{signal:f}),window.addEventListener(`touchmove`,i,{signal:f}),()=>u.abort()},[s,o,g,c,a]),(0,h.jsxs)(`div`,{className:G.resize,children:[(0,h.jsx)(Se,{min:K,max:q,value:f,className:G.slider,onChange:_}),(0,h.jsxs)(`div`,{className:G.tools,children:[(0,h.jsx)(be,{value:c,name:`width`,label:`Width`,style:{width:`88px`},onChange:e=>l(Number(e.target.value)),onBlur:v}),(0,h.jsx)(D,{className:G.toolsLock}),(0,h.jsx)(be,{value:u,name:`height`,label:`Height`,style:{width:`88px`},onChange:e=>d(Number(e.target.value)),onBlur:y}),(0,h.jsx)(L,{onSave:()=>x(),onClose:b,disabled:c===o})]})]})},Y={preview:`_preview_dvanl_1`,rotate:`_rotate_dvanl_12`,flip:`_flip_dvanl_24`,image:`_image_dvanl_32`},Ze=({isClipped:e,style:n={}})=>{let{history:r,previewUrl:i,currentAction:a,getLastRotation:o,eventBus:s}=j(),c=(0,t.useRef)(null),l=[];if(a){let{width:e,height:t}=r.items.at(r.pointer);l.push({...a.name===w.ROTATE?Ne(e,t,o(),a.args.degrees):{width:e,height:t},action:a})}let{box:u,boxWidth:d,boxHeight:f,viewWidth:p,viewHeight:m,rotation:g,flipH:_,flipV:v}=We([...r.items.slice(0,r.pointer+1),...l]);return(0,t.useEffect)(()=>{e&&c.current&&(c.current.style.transition=`none`);let t=e=>{let t=e.detail;c.current&&(c.current.style.transform=`scale(${t/100})`)},n=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}%)`)};return s.addEventListener(`resize-update`,t),s.addEventListener(`clip-path-update`,n),()=>{s.removeEventListener(`resize-update`,t),s.removeEventListener(`clip-path-update`,n)}},[e,s]),(0,h.jsx)(`div`,{ref:c,className:Y.preview,style:{aspectRatio:`${p} / ${m}`,...n},children:(0,h.jsx)(`div`,{className:Y.rotate,style:{width:`${d/p*100}%`,height:`${f/m*100}%`,transform:`translate(-50%, -50%) rotate(${g}deg)`},children:(0,h.jsx)(`div`,{className:Y.flip,style:{transform:`scale(${_?-1:1}, ${v?-1:1})`},children:(0,h.jsx)(`img`,{className:Y.image,src:i,alt:`Preview Image`,style:{width:`${1/u.w*100}%`,height:`${1/u.h*100}%`,left:`${-(u.x/u.w)*100}%`,top:`${-(u.y/u.h)*100}%`}})})})})},X={wrapper:`_wrapper_13nh3_1`,box:`_box_13nh3_9`,tools:`_tools_13nh3_18`,toolsInfo:`_toolsInfo_13nh3_34`,toolsInfoLabel:`_toolsInfoLabel_13nh3_41`,toolsInfoValue:`_toolsInfoValue_13nh3_46`,linesBox:`_linesBox_13nh3_51`,line:`_line_13nh3_51`,lineV:`_lineV_13nh3_61`,lineH:`_lineH_13nh3_69`,pointer:`_pointer_13nh3_77`,pointerTopLeft:`_pointerTopLeft_13nh3_83`,pointerTopRight:`_pointerTopRight_13nh3_90`,pointerBottomRight:`_pointerBottomRight_13nh3_97`,pointerBottomLeft:`_pointerBottomLeft_13nh3_104`,mobileBorder:`_mobileBorder_13nh3_111`,mobilePointer:`_mobilePointer_13nh3_117`},Qe=()=>{let{getLastHistoryItem:e}=j(),n=S(),r=(0,t.useRef)(null),{handleCropStart:i,initialCrop:a}=st({boxRef:r}),{width:o,height:s}=e(),{x:c,y:l,w:u,h:d}=a;return(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(Ze,{isClipped:!0,style:{clipPath:`xywh(${c}% ${l}% ${u}% ${d}%)`}}),(0,h.jsx)(`div`,{className:X.wrapper,style:{aspectRatio:`${o} / ${s}`},children:(0,h.jsxs)(`div`,{ref:r,className:X.box,style:{width:`${u}%`,height:`${d}%`,top:`${l}%`,left:`${c}%`},children:[(0,h.jsx)(et,{}),n?(0,h.jsx)(ct,{onMouseDown:i}):(0,h.jsx)(tt,{onMouseDown:i})]})})]})},$e=()=>{let{setCurrentAction:e,currentAction:n,getLastHistoryItem:r,addToHistory:i,setSidebar:a,eventBus:o}=j(),{width:s,height:c}=r(),l=(0,t.useRef)(null),u=(0,t.useRef)(null),d=(0,t.useRef)(null),f=(0,t.useRef)(null),p=(0,t.useRef)({x:0,y:0,w:0,h:0});return(0,t.useEffect)(()=>{if(n?.name!==`crop`)return;let e=je(n.args.ratio,s,c),{x:t,y:r,w:i,h:a}=e,m=Math.round(t/100*s),h=Math.round(r/100*c),g=Math.round(i/100*s),_=Math.round(a/100*c);p.current=e,l.current&&(l.current.textContent=m.toString()),u.current&&(u.current.textContent=h.toString()),d.current&&(d.current.textContent=g.toString()),f.current&&(f.current.textContent=_.toString());let v=e=>{let{x:t,y:n,w:r,h:i}=e.detail;l.current&&(l.current.textContent=t.toString()),u.current&&(u.current.textContent=n.toString()),d.current&&(d.current.textContent=r.toString()),f.current&&(f.current.textContent=i.toString())},y=e=>{p.current=e.detail};return o.addEventListener(`crop-update`,v),o.addEventListener(`clip-path-update`,y),()=>{o.removeEventListener(`crop-update`,v),o.removeEventListener(`clip-path-update`,y)}},[n,s,c,o]),(0,h.jsxs)(`div`,{className:X.tools,children:[(0,h.jsxs)(`div`,{className:X.toolsInfo,children:[(0,h.jsx)(`div`,{className:X.toolsInfoLabel,children:`left`}),(0,h.jsx)(`div`,{className:`${X.toolsInfoValue} ${P.semibold}`,ref:l})]}),(0,h.jsxs)(`div`,{className:X.toolsInfo,children:[(0,h.jsx)(`div`,{className:X.toolsInfoLabel,children:`top`}),(0,h.jsx)(`div`,{className:`${X.toolsInfoValue} ${P.semibold}`,ref:u})]}),(0,h.jsxs)(`div`,{className:X.toolsInfo,children:[(0,h.jsx)(`div`,{className:X.toolsInfoLabel,children:`width`}),(0,h.jsx)(`div`,{className:`${X.toolsInfoValue} ${P.semibold}`,ref:d})]}),(0,h.jsxs)(`div`,{className:X.toolsInfo,children:[(0,h.jsx)(`div`,{className:X.toolsInfoLabel,children:`height`}),(0,h.jsx)(`div`,{className:`${X.toolsInfoValue} ${P.semibold}`,ref:f})]}),(0,h.jsx)(L,{onSave:async()=>{if(!n||n.name!==w.CROP)return;let e=n.args?.preset?.width||Math.round(s*p.current.w/100),t=n.args?.preset?.height||Math.round(c*p.current.h/100);i({width:e,height:t,action:{name:`crop`,args:{...n.args,...p.current}}}),a(!0)},onClose:()=>{e(null),a(!0)}})]})},et=()=>(0,h.jsxs)(`div`,{className:X.linesBox,children:[(0,h.jsx)(`span`,{className:`${X.line} ${X.lineV}`}),(0,h.jsx)(`span`,{className:`${X.line} ${X.lineH}`})]}),tt=({onMouseDown:e})=>(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(`div`,{className:`${X.pointer} ${X.pointerTopLeft}`,onMouseDown:t=>e(t,`tl`,`nwse`)}),(0,h.jsx)(`div`,{className:`${X.pointer} ${X.pointerTopRight}`,onMouseDown:t=>e(t,`tr`,`nesw`)}),(0,h.jsx)(`div`,{className:`${X.pointer} ${X.pointerBottomRight}`,onMouseDown:t=>e(t,`br`,`nwse`)}),(0,h.jsx)(`div`,{className:`${X.pointer} ${X.pointerBottomLeft}`,onMouseDown:t=>e(t,`bl`,`nesw`)})]});function nt(e,t,n){return Math.min(Math.max(e,t),n)}function rt(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 it(e){let{width:t,height:n}=e.getBoundingClientRect();return{frameW:t,frameH:n}}function at({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 ot({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 st=({boxRef:e})=>{let{currentAction:n,getLastHistoryItem:r,eventBus:i}=j(),a=S(),{width:o,height:s}=r(),c=n?.name===w.CROP,l=c?n.args.ratio:1,u=!c||n.args.isFree,d=(0,t.useMemo)(()=>je(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,Ye(i,d)},[d,i]),(0,t.useEffect)(()=>{let t=(e,t)=>{m.current=t,rt(e,t),Je(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)}),Ye(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}=it(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=ot(Ae(p.current,u,l,f.current.x,f.current.y,a,c,r,i,at(h.current,r,i),at(m.current,r,i)),r,i);t(n,u?d:Me(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:nt(a+d,0,Math.max(0,100-s)),y:nt(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}},ct=({onMouseDown:e})=>(0,h.jsx)(`div`,{className:X.mobileBorder,children:(0,h.jsx)(`div`,{className:X.mobilePointer,onTouchStart:t=>e(t,`br`,`nwse`)})}),Z={flip:`_flip_17ic5_1`,btnH:`_btnH_17ic5_14`,btnV:`_btnV_17ic5_20`},lt=()=>{let{getLastHistoryItem:e,setCurrentAction:n,addToHistory:r,setSidebar:i}=j(),[a,o]=(0,t.useState)(!1),[s,c]=(0,t.useState)(!1),{width:l,height:u}=e();return(0,h.jsxs)(`div`,{className:Z.flip,children:[(0,h.jsxs)(`div`,{className:Z.scGroup,children:[(0,h.jsx)(N,{variant:`outline`,className:`${Z.btnH}`,onClick:()=>{o(e=>!e),n({name:w.FLIP,args:{horizontal:!a,vertical:s}})},children:(0,h.jsx)(le,{style:{color:a?`var(--accent-blue)`:`var(--foreground)`}})}),(0,h.jsx)(N,{variant:`outline`,className:`${Z.btnV} `,onClick:()=>{c(e=>!e),n({name:w.FLIP,args:{horizontal:a,vertical:!s}})},children:(0,h.jsx)(ue,{style:{color:s?`var(--accent-blue)`:`var(--foreground)`}})})]}),(0,h.jsx)(L,{disabled:!a&&!s,onSave:()=>{r({width:l,height:u,action:{name:w.FLIP,args:{horizontal:a,vertical:s}}}),i(!0)},onClose:()=>{n(null),i(!0)}})]})},Q={rotate:`_rotate_gkt07_1`,btnH:`_btnH_gkt07_14`,btnV:`_btnV_gkt07_20`},ut=()=>{let{getLastRotation:e,getLastHistoryItem:n,addToHistory:r,setSidebar:i,setCurrentAction:a}=j(),{width:o,height:s}=n(),c=e(),l=(0,t.useRef)(c),u=(0,t.useRef)(c),d=e=>{u.current+=e,a({name:`rotate`,args:{degrees:u.current}})};return(0,h.jsxs)(`div`,{className:Q.rotate,children:[(0,h.jsxs)(`div`,{className:Q.scGroup,children:[(0,h.jsx)(N,{variant:`outline`,className:`${Q.btnH}`,onClick:()=>d(90),children:(0,h.jsx)(de,{})}),(0,h.jsx)(N,{variant:`outline`,className:`${Q.btnV} `,onClick:()=>d(-90),children:(0,h.jsx)(fe,{})})]}),(0,h.jsx)(L,{onSave:async()=>{r({...Ne(o,s,l.current,u.current),action:{name:`rotate`,args:{degrees:u.current}}}),i(!0)},onClose:()=>{a(null),i(!0)}})]})},dt={frame:`_frame_xffug_1`},ft=()=>{let{currentAction:e}=j(),t=e?.name===w.CROP,n=e?.name===w.RESIZE,r=e?.name===w.FLIP,i=e?.name===w.ROTATE,a=t;return(0,h.jsxs)(`div`,{className:`${dt.frame} ${a?P.mask:``}`,children:[(0,h.jsx)(Ze,{style:t?{opacity:.4}:{}}),t&&(0,h.jsx)(Qe,{},e?.args?.id),n&&(0,h.jsx)(Xe,{}),t&&(0,h.jsx)($e,{}),r&&(0,h.jsx)(lt,{}),i&&(0,h.jsx)(ut,{})]})},$={sidebar:`_sidebar_8qtha_1`,settings:`_settings_8qtha_11`,container:`_container_8qtha_25`,content:`_content_8qtha_31`,closeBtn:`_closeBtn_8qtha_47`,separator:`_separator_8qtha_52`,resize:`_resize_8qtha_56`,resizeIcon:`_resizeIcon_8qtha_61`,resizeSize:`_resizeSize_8qtha_66`,crop:`_crop_8qtha_70`,ratio:`_ratio_8qtha_75`,sidebarPreset:`_sidebarPreset_8qtha_80`,flipRotate:`_flipRotate_8qtha_85`},pt=()=>{let{getLastHistoryItem:e,setCurrentAction:t,setSidebar:n}=j(),{width:r,height:i}=e()??{width:0,height:0};return(0,h.jsxs)(N,{variant:`outline`,className:$.resize,onClick:()=>{t({name:w.RESIZE,args:{width:r,height:i}}),n(!1)},children:[(0,h.jsxs)(`div`,{className:$.resizeIcon,children:[(0,h.jsx)(ce,{}),`Resize`]}),(0,h.jsxs)(`div`,{className:$.resizeSize,children:[r,` x `,i]})]})},mt=()=>{let{currentAction:e,setCurrentAction:t,getLastHistoryItem:n,setSidebar:r}=j(),{name:i,args:a}=e||{},o=i===`crop`?a?.id:``,{width:s,height:c}=n(),l=s/c,u=e=>{e!==o&&(t({name:`crop`,args:{id:e,ratio:e===`1:1`?1:l,isFree:e===`freeform`}}),r(!1))};return(0,h.jsxs)(`div`,{className:$.crop,children:[(0,h.jsx)(`h4`,{children:`Crop`}),(0,h.jsxs)(`div`,{className:$.ratio,children:[(0,h.jsx)(me,{label:`Freeform`,icon:(0,h.jsx)(oe,{}),active:o===`freeform`,onClick:()=>u(`freeform`)}),(0,h.jsx)(me,{label:`Original`,icon:(0,h.jsx)(se,{}),active:o===`original`,onClick:()=>u(`original`)}),(0,h.jsx)(me,{label:`1:1`,icon:(0,h.jsx)(k,{}),active:o===`1:1`,onClick:()=>u(`1:1`)})]})]})},ht=Te.map(e=>e.options).flat(),gt=()=>{let{setCurrentAction:e,currentAction:t,setSidebar:n}=j(),r=t?.name===`crop`&&ht.some(e=>e.value===t.args.id)?t.args.id:``;return(0,h.jsxs)(`div`,{className:$.sidebarPreset,children:[(0,h.jsx)(`h4`,{children:`Presets`}),(0,h.jsx)(`div`,{children:(0,h.jsx)(ge,{value:r,placeholder:`Select a preset`,onChange:t=>{if(!t)return;let r=Te.map(e=>e.options).flat().find(e=>e.value===t);if(!r)return;let i={id:t,ratio:r.w/r.h,isFree:!1,preset:{width:r.w,height:r.h}};e({name:`crop`,args:i}),n(!1)},items:Te})})]})},_t=()=>{let{setCurrentAction:e,setSidebar:t}=j();return(0,h.jsx)(N,{variant:`outline`,className:$.resize,onClick:()=>{e({name:w.FLIP,args:{horizontal:!1,vertical:!1}}),t(!1)},children:(0,h.jsxs)(`div`,{className:$.resizeIcon,children:[(0,h.jsx)(le,{}),`Flip`]})})},vt=()=>{let{getLastRotation:e,setCurrentAction:t,setSidebar:n}=j();return(0,h.jsx)(N,{variant:`outline`,className:$.resize,onClick:()=>{t({name:`rotate`,args:{degrees:e()}}),n(!1)},children:(0,h.jsxs)(`div`,{className:$.resizeIcon,children:[(0,h.jsx)(de,{}),`Rotate`]})})},yt=()=>{let{sidebar:e,setSidebar:t}=j(),n=ee(`md`);return(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(N,{variant:`outline`,className:$.settings,onClick:()=>t(!0),children:(0,h.jsx)(ae,{})}),(0,h.jsx)(`div`,{className:$.sidebar,style:{transform:n&&e?`translateX(-320px)`:`translateX(0%)`},children:(0,h.jsx)(`div`,{className:$.container,children:(0,h.jsxs)(`div`,{className:$.content,children:[n&&(0,h.jsx)(N,{variant:`ghost`,className:`${$.closeBtn} ${M.rect}`,onClick:()=>t(!1),children:(0,h.jsx)(te,{})}),(0,h.jsx)(pt,{}),(0,h.jsx)(F,{className:$.separator}),(0,h.jsx)(mt,{}),(0,h.jsx)(F,{className:$.separator}),(0,h.jsx)(gt,{}),(0,h.jsx)(F,{className:$.separator}),(0,h.jsxs)(`div`,{className:$.flipRotate,children:[(0,h.jsx)(_t,{}),(0,h.jsx)(vt,{})]})]})})})]})};e.Pixedi=({image:e,onSave:t,onBack:n,theme:r=`light`,settings:i=u})=>{let{loading:a,error:o,mimeType:s,width:c,height:l,originalBlob:d,previewUrl:f,isAlpha:p}=b(e);return a||o||!d||!s?(0,h.jsx)(`div`,{className:`${P.root} ${P.wrapper}`,"data-theme":r,children:(0,h.jsxs)(`div`,{className:P.system,children:[a&&(0,h.jsx)(A,{style:{width:48,height:48}}),o&&(0,h.jsx)(`div`,{className:P.textRed,children:o}),!a&&!o&&(!d||!s)&&(0,h.jsx)(`div`,{className:P.textRed,children:`Failed to load image.`})]})}):(0,h.jsx)(g,{mimeType:s,width:c,height:l,originalBlob:d,previewUrl:f,isAlpha:p,settings:{...u,...i},children:(0,h.jsx)(`div`,{className:`${P.root} ${P.wrapper}`,"data-theme":r,children:(0,h.jsxs)(`div`,{className:P.main,children:[(0,h.jsx)(qe,{onSave:t,onBack:n}),(0,h.jsxs)(`div`,{className:P.grid,children:[(0,h.jsx)(ft,{}),(0,h.jsx)(yt,{})]})]})})})}});
|