@solostylist/image-editor 1.0.2 → 1.0.3

package/lib/components/tools/filters/filter-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filter-item.d.ts","sourceRoot":"","sources":["../../../../src/components/tools/filters/filter-item.tsx"],"names":[],"mappings":"AAWA,UAAU,eAAe;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC;IAC7C,WAAW,EAAE,CAAC,QAAQ,EAAE,GAAG,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,gBAAgB,CAAC;CACzB;uHAQE,eAAe;AA0ElB,wBAAgC"}
+{"version":3,"file":"filter-item.d.ts","sourceRoot":"","sources":["../../../../src/components/tools/filters/filter-item.tsx"],"names":[],"mappings":"AAWA,UAAU,eAAe;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC;IAC7C,WAAW,EAAE,CAAC,QAAQ,EAAE,GAAG,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,gBAAgB,CAAC;CACzB;uHAQE,eAAe;AA8ElB,wBAAgC"}

package/lib/components/tools/filters/filter-item.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{memo,useCallback,useEffect,useRef}from"react";import{Layer,Image,Stage}from"react-konva";import{Typography}from"@mui/material";import{SFlexBox}from"@solostylist/ui-kit/core";var MAX_FILTER_PREVIEW_WIDTH=60,MAX_FILTER_PREVIEW_HEIGHT=45,FilterItem=function(a){var b=a.filterLabel,c=a.filterFn,d=a.applyFilter,e=a.isActive,f=a.image,g=useRef(null),h=useCallback(function(){d(c)},[c]),i=useCallback(function(){g.current?g.current.cache():setTimeout(i,0)},[]);useEffect(function(){return f&&i(),function(){var a;null===(a=g.current)||void 0===a||a.clearCache()}},[f]);var j=f.width/f.height,k=1>j,l=k?MAX_FILTER_PREVIEW_WIDTH:MAX_FILTER_PREVIEW_HEIGHT*j,m=k?MAX_FILTER_PREVIEW_WIDTH/j:MAX_FILTER_PREVIEW_HEIGHT;return React.createElement(SFlexBox,{onClick:h,"aria-selected":e,sx:{flexDirection:"column",alignItems:"center",justifyContent:"center",gap:.5,cursor:"pointer"}},React.createElement(Stage,{width:MAX_FILTER_PREVIEW_WIDTH,height:MAX_FILTER_PREVIEW_HEIGHT,style:_objectSpread({padding:1},e&&{borderRadius:2,border:"1px solid",borderColor:"divider"})},React.createElement(Layer,{onTap:h},React.createElement(Image,{image:f,filters:c?[c]:[],width:l,height:m,x:-(l-MAX_FILTER_PREVIEW_WIDTH)/2,y:-(m-MAX_FILTER_PREVIEW_HEIGHT)/2,ref:g}))),React.createElement(Typography,null,b))};export default memo(FilterItem);
+import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{memo,useCallback,useEffect,useRef}from"react";import{Layer,Image,Stage}from"react-konva";import{Typography}from"@mui/material";import{SFlexBox}from"@solostylist/ui-kit/core";var MAX_FILTER_PREVIEW_WIDTH=80,MAX_FILTER_PREVIEW_HEIGHT=60,FilterItem=function(a){var b=a.filterLabel,c=a.filterFn,d=a.applyFilter,e=a.isActive,f=a.image,g=useRef(null),h=useCallback(function(){d(c)},[c]),i=useCallback(function(){g.current?g.current.cache():setTimeout(i,0)},[]);useEffect(function(){return f&&i(),function(){var a;null===(a=g.current)||void 0===a||a.clearCache()}},[f]);var j=f.width/f.height,k=j>MAX_FILTER_PREVIEW_WIDTH/MAX_FILTER_PREVIEW_HEIGHT,l=k?MAX_FILTER_PREVIEW_HEIGHT*j:MAX_FILTER_PREVIEW_WIDTH,m=k?MAX_FILTER_PREVIEW_HEIGHT:MAX_FILTER_PREVIEW_WIDTH/j;return React.createElement(SFlexBox,{onClick:h,"aria-selected":e,sx:{flexDirection:"column",alignItems:"center",justifyContent:"center",gap:.5,cursor:"pointer"}},React.createElement(Stage,{width:MAX_FILTER_PREVIEW_WIDTH,height:MAX_FILTER_PREVIEW_HEIGHT,style:_objectSpread({padding:1},e&&{borderRadius:2,border:"1px solid",borderColor:"divider"})},React.createElement(Layer,{onTap:h},React.createElement(Image,{image:f,filters:c?[c]:[],width:l,height:m,x:-(l-MAX_FILTER_PREVIEW_WIDTH)/2,y:-(m-MAX_FILTER_PREVIEW_HEIGHT)/2,ref:g}))),React.createElement(Typography,{whiteSpace:"nowrap",textAlign:"center",fontSize:"0.875rem"},b))};export default memo(FilterItem);

package/lib/components/tools/filters/filters.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filters.d.ts","sourceRoot":"","sources":["../../../../src/components/tools/filters/filters.tsx"],"names":[],"mappings":"AAkCA,QAAA,MAAM,OAAO,+CAwBZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"filters.d.ts","sourceRoot":"","sources":["../../../../src/components/tools/filters/filters.tsx"],"names":[],"mappings":"AAuCA,QAAA,MAAM,OAAO,+CAkCZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/components/tools/filters/filters.js

@@ -1 +1 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{SCarousel}from"@solostylist/ui-kit/carousel";import{useFilter,useStore}from"hooks";import FilterItem from"./filter-item";import{AVAILABLE_FILTERS}from"./filters.constants";var responsiveSettings=[{breakpoint:1400,settings:{slidesToShow:16,slidesToScroll:8}},{breakpoint:1200,settings:{slidesToShow:12,slidesToScroll:6}},{breakpoint:900,settings:{slidesToShow:10,slidesToScroll:5}},{breakpoint:600,settings:{slidesToShow:6,slidesToScroll:3}},{breakpoint:400,settings:{slidesToShow:4,slidesToScroll:2}}],Filters=function(){var a=useStore(),b=a.originalImage,c=useFilter(),d=_slicedToArray(c,2),e=d[0],f=d[1];return React.createElement(SCarousel,{slidesToShow:20,slidesToScroll:10,responsive:responsiveSettings},AVAILABLE_FILTERS.map(function(a){return React.createElement(FilterItem,{key:a.label,filterLabel:a.label,filterFn:a.filterFn,applyFilter:f,isActive:e===a.filterFn,image:b})}))};export default Filters;
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{Box}from"@mui/material";import{SCarousel}from"@solostylist/ui-kit/carousel";import{useFilter,useStore}from"hooks";import FilterItem from"./filter-item";import{AVAILABLE_FILTERS}from"./filters.constants";var responsiveSettings=[{breakpoint:1600,settings:{slidesToShow:14,slidesToScroll:7}},{breakpoint:1400,settings:{slidesToShow:12,slidesToScroll:6}},{breakpoint:1200,settings:{slidesToShow:10,slidesToScroll:5}},{breakpoint:900,settings:{slidesToShow:8,slidesToScroll:4}},{breakpoint:600,settings:{slidesToShow:5,slidesToScroll:3}},{breakpoint:400,settings:{slidesToShow:4,slidesToScroll:2}}],Filters=function(){var a=useStore(),b=a.originalImage,c=useFilter(),d=_slicedToArray(c,2),e=d[0],f=d[1];return React.createElement(Box,{sx:{width:"100%",flex:"1 1 100%",display:"block",minWidth:0,overflow:"hidden"}},React.createElement(SCarousel,{slidesToShow:16,slidesToScroll:8,responsive:responsiveSettings},AVAILABLE_FILTERS.map(function(a){return React.createElement(FilterItem,{key:a.label,filterLabel:a.label,filterFn:a.filterFn,applyFilter:f,isActive:e===a.filterFn,image:b})})))};export default Filters;

package/lib/components/tools-bar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tools-bar/index.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,QAAQ,+CAoIb,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tools-bar/index.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,QAAQ,+CAqIb,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/components/tools-bar/index.js

@@ -1 +1 @@
-import{useCallback,useEffect,useMemo}from"react";import{SFlexBox}from"@solostylist/ui-kit/core";import{SELECT_TOOL}from"actions";import{TABS_TOOLS,TOOLS_ITEMS}from"components/tools/tools.constants";import{useStore}from"hooks";import{TABS_IDS}from"utils/constants";var ToolsBar=function(){var a=useStore(),b=a.t,c=a.dispatch,d=a.tabId,e=a.toolId,f=a.annotations,g=a.selectionsIds,h=void 0===g?[]:g,i=a.config,j=i.defaultTabId,k=i.defaultToolId,l=d||j,m=l?TABS_TOOLS[l]:void 0,n=e||k||(null===m||void 0===m?void 0:m[0]),o=useMemo(function(){var a;return l?null!==(a=TABS_TOOLS[l])&&void 0!==a?a:[]:[]},[l]),p=useCallback(function(a){c({type:SELECT_TOOL,payload:{toolId:a}})},[]),q=useMemo(function(){return o.map(function(a){var c=TOOLS_ITEMS[a];if(!c)return null;var d=c.Item;if(!d)return null;return React.createElement(d,{key:a,selectTool:p,t:b,isSelected:n===a})})},[o,n,p,b]),r=useMemo(function(){if(!n)return null;var a=null;if(l===TABS_IDS.ANNOTATE){var c=h.length;if(1===c){var d,g=f[h[0]],i=null!==g&&void 0!==g&&g.name?TOOLS_ITEMS[g.name]:void 0;a=null!==(d=null===i||void 0===i?void 0:i.ItemOptions)&&void 0!==d?d:null}else if(1<c)return null}if(!a){var j=l?TABS_TOOLS[l]:void 0,k=e?TOOLS_ITEMS[e]:void 0,m=l&&n&&(null===j||void 0===j?void 0:j.includes(n));if(m){var o;a=null!==(o=null===k||void 0===k?void 0:k.ItemOptions)&&void 0!==o?o:null}}return a?React.createElement(SFlexBox,{gap:1,justifyContent:"center"},React.createElement(a,{t:b})):null},[l,n,f,h,b,e]);return useEffect(function(){!e&&n&&c({type:SELECT_TOOL,payload:{toolId:n}})},[]),React.createElement(SFlexBox,{height:120,width:"100%",gap:1,flexDirection:"column",alignItems:"center",sx:{p:1,zIndex:10,overflow:"visible"}},r,React.createElement(SFlexBox,{gap:1,alignItems:"flex-end",justifyContent:"center",flexWrap:"wrap",height:"100%"},q))};export default ToolsBar;
+import{useCallback,useEffect,useMemo}from"react";import{SFlexBox}from"@solostylist/ui-kit/core";import{SELECT_TOOL}from"actions";import{TABS_TOOLS,TOOLS_ITEMS}from"components/tools/tools.constants";import{useStore}from"hooks";import{TABS_IDS}from"utils/constants";var ToolsBar=function(){var a=useStore(),b=a.t,c=a.dispatch,d=a.tabId,e=a.toolId,f=a.annotations,g=a.selectionsIds,h=void 0===g?[]:g,i=a.config,j=i.defaultTabId,k=i.defaultToolId,l=d||j,m=l?TABS_TOOLS[l]:void 0,n=e||k||(null===m||void 0===m?void 0:m[0]),o=useMemo(function(){var a;return l?null!==(a=TABS_TOOLS[l])&&void 0!==a?a:[]:[]},[l]),p=useCallback(function(a){c({type:SELECT_TOOL,payload:{toolId:a}})},[]),q=useMemo(function(){return o.map(function(a){var c=TOOLS_ITEMS[a];if(!c)return null;var d=c.Item;if(!d)return null;return React.createElement(d,{key:a,selectTool:p,t:b,isSelected:n===a})})},[o,n,p,b]),r=useMemo(function(){if(!n)return null;var a=null;if(l===TABS_IDS.ANNOTATE){var c=h.length;if(1===c){var d,g=f[h[0]],i=null!==g&&void 0!==g&&g.name?TOOLS_ITEMS[g.name]:void 0;a=null!==(d=null===i||void 0===i?void 0:i.ItemOptions)&&void 0!==d?d:null}else if(1<c)return null}if(!a){var j=l?TABS_TOOLS[l]:void 0,k=e?TOOLS_ITEMS[e]:void 0,m=l&&n&&(null===j||void 0===j?void 0:j.includes(n));if(m){var o;a=null!==(o=null===k||void 0===k?void 0:k.ItemOptions)&&void 0!==o?o:null}}return a?React.createElement(SFlexBox,{gap:1,justifyContent:"center"},React.createElement(a,{t:b})):null},[l,n,f,h,b,e]);return useEffect(function(){!e&&n&&c({type:SELECT_TOOL,payload:{toolId:n}})},[]),React.createElement(SFlexBox,{height:120,width:"100%",gap:1,flexDirection:"column",alignItems:"center",sx:{p:1,zIndex:10,overflow:"visible"}},r,React.createElement(SFlexBox,{gap:1,alignItems:"flex-end",justifyContent:"center",flexWrap:"wrap",height:"100%",width:"100%"},q))};export default ToolsBar;

package/package.json

@@ -1,63 +1,68 @@
-{
-  "name": "@solostylist/image-editor",
-  "publishConfig": {
-    "access": "public"
-  },
-  "version": "1.0.2",
-  "license": "MIT",
-  "author": "Lê Đặng Trường Đạt",
-  "main": "./lib/index.js",
-  "types": "./lib/index.d.ts",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/ledangtruongdatdnvn/solostylist-image-editor"
-  },
-  "keywords": [
-    "Image editing react component",
-    "React Image Editor",
-    "image editor",
-    "solostylist image editor",
-    "edit image",
-    "modify image",
-    "update image",
-    "finetune",
-    "filters",
-    "weatermark",
-    "resize",
-    "annotate"
-  ],
-  "files": [
-    "lib"
-  ],
-  "dependencies": {
-    "@babel/runtime": "^7.28.6",
-    "@emotion/cache": "^11.14.0",
-    "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.1",
-    "@fontsource/outfit": "^5.2.8",
-    "@mui/icons-material": "^7.3.7",
-    "@mui/lab": "^7.0.1-beta.21",
-    "@mui/material": "^7.3.7",
-    "@mui/system": "^7.3.7",
-    "@mui/utils": "^7.3.7",
-    "@solostylist/ui-kit": "^1.0.195",
-    "dayjs": "^1.11.19",
-    "framer-motion": "^12.34.0",
-    "konva": "10.2.0",
-    "overlayscrollbars": "^2.14.0",
-    "overlayscrollbars-react": "^0.5.6",
-    "react-colorful": "^5.6.1",
-    "uuid": "^13.0.0"
-  },
-  "peerDependencies": {
-    "react": ">=17.0.0",
-    "react-dom": ">=17.0.0",
-    "react-konva": ">=17.0.0"
-  },
-  "scripts": {
-    "build:babel": "cross-env BABEL_ENV=production NODE_ENV=production babel src -d lib --config-file ../../babel.config.json --extensions '.ts,.tsx' --ignore '**/*.d.ts' --copy-files -D",
-    "build:types": "tsc --project tsconfig.build.json",
-    "build:lib": "rimraf lib && npm run build:babel && npm run build:types"
-  },
-  "gitHead": "eb3c52c580ba7169cbfe3a226748fa9b4ddd0d30"
-}
+{
+  "name": "@solostylist/image-editor",
+  "publishConfig": {
+    "access": "public"
+  },
+  "version": "1.0.3",
+  "license": "MIT",
+  "author": "Lê Đặng Trường Đạt",
+  "main": "./lib/index.js",
+  "types": "./lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ledangtruongdatdnvn/solostylist-image-editor"
+  },
+  "keywords": [
+    "Image editing react component",
+    "React Image Editor",
+    "image editor",
+    "solostylist image editor",
+    "edit image",
+    "modify image",
+    "update image",
+    "finetune",
+    "filters",
+    "weatermark",
+    "resize",
+    "annotate"
+  ],
+  "files": [
+    "lib"
+  ],
+  "dependencies": {
+    "@babel/runtime": "^7.28.6",
+    "@emotion/cache": "^11.14.0",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
+    "@fontsource/outfit": "^5.2.8",
+    "@mui/icons-material": "^7.3.7",
+    "@mui/lab": "^7.0.1-beta.21",
+    "@mui/material": "^7.3.7",
+    "@mui/system": "^7.3.7",
+    "@mui/utils": "^7.3.7",
+    "@solostylist/ui-kit": "^1.0.195",
+    "dayjs": "^1.11.19",
+    "framer-motion": "^12.34.0",
+    "konva": "10.2.0",
+    "overlayscrollbars": "^2.14.0",
+    "overlayscrollbars-react": "^0.5.6",
+    "react-colorful": "^5.6.1",
+    "uuid": "^13.0.0"
+  },
+  "peerDependencies": {
+    "react": ">=17.0.0",
+    "react-dom": ">=17.0.0",
+    "react-konva": ">=17.0.0"
+  },
+  "scripts": {
+    "build": "rimraf lib && yarn build:babel && yarn build:types",
+    "build:babel": "cross-env BABEL_ENV=production NODE_ENV=production babel src -d lib --config-file ../../babel.config.json --extensions '.ts,.tsx' --ignore '**/*.d.ts' --copy-files -D",
+    "build:types": "tsc --project tsconfig.build.json",
+    "clean": "rimraf lib",
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint:fix": "eslint src --ext .ts,.tsx --fix",
+    "typecheck": "tsc --noEmit",
+    "app:publish": "yarn npm publish"
+  },
+  "gitHead": "eb3c52c580ba7169cbfe3a226748fa9b4ddd0d30"
+}