@vnejs/uis.react.wrap-with-content 0.1.2

package/dist/WrapWithContent.d.ts

@@ -0,0 +1,29 @@
+import "./WrapWithContent.styl";
+export declare const WrapWithContent: ({ className, imageSrc, isSelected, isRounded, withHover, width, height, borderWidth, top, right, bottom, left, transition, renderTopLeft, renderTopRight, renderBottomLeft, renderBottomRight, topLeftText, topLeftSize, topRightText, topRightSize, bottomLeftText, bottomLeftSize, onClick, value, }: {
+    className: any;
+    imageSrc?: string;
+    isSelected?: boolean;
+    isRounded?: boolean;
+    withHover?: boolean;
+    width?: number;
+    height?: number;
+    borderWidth?: number;
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+    transition?: number;
+    renderTopLeft: any;
+    renderTopRight: any;
+    renderBottomLeft: any;
+    renderBottomRight: any;
+    topLeftText: any;
+    topLeftSize: any;
+    topRightText: any;
+    topRightSize: any;
+    bottomLeftText: any;
+    bottomLeftSize: any;
+    onClick: any;
+    value: any;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=WrapWithContent.d.ts.map

package/dist/WrapWithContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WrapWithContent.d.ts","sourceRoot":"","sources":["../src/WrapWithContent.tsx"],"names":[],"mappings":"AAMA,OAAO,wBAAwB,CAAC;AAiChC,eAAO,MAAM,eAAe,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;CA2B/B,4CAoDA,CAAC"}

package/dist/WrapWithContent.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo } from "react";
+import { cn, getVneLength } from "@vnejs/uis.utils";
+import { Text, Wrap } from "@vnejs/uis.react";
+import "./WrapWithContent.styl";
+const b = cn("WrapWithContent");
+const getCssPosition = (value) => () => value ? getVneLength(value) : "0";
+const renderOneItem = (props, style, renderFunc) => renderFunc && (_jsx("div", { className: b("item"), style: style, children: renderFunc(props) }));
+const useRenderContentCallback = (renderFunc, text, size) => {
+    return useCallback(({ isSelected = false }) => {
+        if (text)
+            return (_jsx(Text, { isSelected: isSelected, text: text, size: size }));
+        if (renderFunc)
+            return renderFunc();
+    }, [renderFunc, text, size]);
+};
+export const WrapWithContent = ({ 
+//
+className, imageSrc = "", isSelected = false, isRounded = false, withHover = false, width = 0, height = 0, borderWidth = 0, top = 0, right = 0, bottom = 0, left = 0, transition = 300, renderTopLeft, renderTopRight, renderBottomLeft, renderBottomRight, topLeftText, topLeftSize, topRightText, topRightSize, bottomLeftText, bottomLeftSize, onClick, value, }) => {
+    const realTop = useMemo(getCssPosition(top), [top]);
+    const realRight = useMemo(getCssPosition(right), [right]);
+    const realBottom = useMemo(getCssPosition(bottom), [bottom]);
+    const realLeft = useMemo(getCssPosition(left), [left]);
+    const styleTopLeft = useMemo(() => ({ top: realTop, left: realLeft }), [realTop, realLeft]);
+    const styleTopRight = useMemo(() => ({ top: realTop, right: realRight }), [realTop, realRight]);
+    const styleBottomLeft = useMemo(() => ({ bottom: realBottom, left: realLeft }), [realBottom, realLeft]);
+    const styleBottomRight = useMemo(() => ({ bottom: realBottom, right: realRight }), [realBottom, realRight]);
+    const props = useMemo(() => ({ isSelected }), [isSelected]);
+    const addClassNames = useMemo(() => [className, withHover && "TextHoverParent"].filter(Boolean), [className, withHover]);
+    const styleContent = useMemo(() => {
+        const result = {};
+        if (transition)
+            result.transition = `${transition}ms`;
+        return result;
+    }, [transition]);
+    const renderTopLeftHandler = useRenderContentCallback(renderTopLeft, topLeftText, topLeftSize);
+    const renderTopRightHandler = useRenderContentCallback(renderTopRight, topRightText, topRightSize);
+    const renderBottomLeftHandler = useRenderContentCallback(renderBottomLeft, bottomLeftText, bottomLeftSize);
+    return (_jsx(Wrap, { className: b({ withHover }, addClassNames), width: width, height: height, padding: 0, borderWidth: borderWidth, isSelected: isSelected, isRounded: isRounded, withHover: withHover, imageSrc: imageSrc, onClick: onClick, value: value, children: _jsxs("div", { className: b("content"), style: styleContent, children: [renderOneItem(props, styleTopLeft, renderTopLeftHandler), renderOneItem(props, styleTopRight, renderTopRightHandler), renderOneItem(props, styleBottomLeft, renderBottomLeftHandler), renderOneItem(props, styleBottomRight, renderBottomRight)] }) }));
+};
+//# sourceMappingURL=WrapWithContent.js.map

package/dist/WrapWithContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WrapWithContent.js","sourceRoot":"","sources":["../src/WrapWithContent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAE7C,OAAO,EAAE,EAAE,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEpD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE9C,OAAO,wBAAwB,CAAC;AAEhC,MAAM,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAEhC,MAAM,cAAc,GAAG,CAAC,KAAK,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;AAE1E,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,CACjD,UAAU,IAAI,CACZ,cACE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,KAAK,EAAE,KAAK,YAEX,UAAU,CAAC,KAAK,CAAC,GACd,CACP,CAAC;AAEJ,MAAM,wBAAwB,GAAG,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE;IAC1D,OAAO,WAAW,CAChB,CAAC,EAAE,UAAU,GAAG,KAAK,EAAE,EAAE,EAAE;QACzB,IAAI,IAAI;YACN,OAAO,CACL,KAAC,IAAI,IACH,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,GACV,CACH,CAAC;QACJ,IAAI,UAAU;YAAE,OAAO,UAAU,EAAE,CAAC;IACtC,CAAC,EACD,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,CAAC,CACzB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC;AAC9B,EAAE;AACF,SAAS,EACT,QAAQ,GAAG,EAAE,EACb,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,EACV,WAAW,GAAG,CAAC,EACf,GAAG,GAAG,CAAC,EACP,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,EACV,IAAI,GAAG,CAAC,EACR,UAAU,GAAG,GAAG,EAChB,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,WAAW,EACX,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,cAAc,EACd,OAAO,EACP,KAAK,GACN,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,OAAO,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IACpD,MAAM,SAAS,GAAG,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAC1D,MAAM,UAAU,GAAG,OAAO,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAC7D,MAAM,QAAQ,GAAG,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEvD,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC;IAC5F,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC;IAChG,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAC;IACxG,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC;IAE5G,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAE5D,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,SAAS,EAAE,SAAS,IAAI,iBAAiB,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC;IAEzH,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAChC,MAAM,MAAM,GAAwB,EAAE,CAAC;QAEvC,IAAI,UAAU;YAAE,MAAM,CAAC,UAAU,GAAG,GAAG,UAAU,IAAI,CAAC;QAEtD,OAAO,MAAM,CAAC;IAChB,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,oBAAoB,GAAG,wBAAwB,CAAC,aAAa,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC;IAC/F,MAAM,qBAAqB,GAAG,wBAAwB,CAAC,cAAc,EAAE,YAAY,EAAE,YAAY,CAAC,CAAC;IACnG,MAAM,uBAAuB,GAAG,wBAAwB,CAAC,gBAAgB,EAAE,cAAc,EAAE,cAAc,CAAC,CAAC;IAE3G,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,CAAC,CAAC,EAAE,SAAS,EAAE,EAAE,aAAa,CAAC,EAC1C,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,CAAC,EACV,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,YAEZ,eACE,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,EACvB,KAAK,EAAE,YAAY,aAElB,aAAa,CAAC,KAAK,EAAE,YAAY,EAAE,oBAAoB,CAAC,EACxD,aAAa,CAAC,KAAK,EAAE,aAAa,EAAE,qBAAqB,CAAC,EAC1D,aAAa,CAAC,KAAK,EAAE,eAAe,EAAE,uBAAuB,CAAC,EAC9D,aAAa,CAAC,KAAK,EAAE,gBAAgB,EAAE,iBAAiB,CAAC,IACtD,GACD,CACR,CAAC;AACJ,CAAC,CAAC"}

package/dist/WrapWithContent.styl

@@ -0,0 +1,17 @@
+.WrapWithContent
+    display: block
+    position: relative
+
+    &-item
+        position: absolute
+
+    &-content
+        background: rgba(0, 0, 0, 0.3)
+        position: absolute
+        top: 0
+        right: 0
+        bottom: 0
+        left: 0
+
+    &_withHover &-content[vne-cursor-target]
+        background: transparent

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./WrapWithContent";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+export * from "./WrapWithContent";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@vnejs/uis.react.wrap-with-content",
+  "version": "0.1.2",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "node ../../scripts/build-package.mjs",
+    "publish:major:plugin": "npm run publish:major",
+    "publish:minor:plugin": "npm run publish:minor",
+    "publish:patch:plugin": "npm run publish:patch",
+    "publish:major": "npm run build && npm version major && npm publish --access public",
+    "publish:minor": "npm run build && npm version minor && npm publish --access public",
+    "publish:patch": "npm run build && npm version patch && npm publish --access public"
+  },
+  "peerDependencies": {
+    "@bem-react/classname": "1.5.12",
+    "@vnejs/uis.utils": "~0.1.0",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "@vnejs/uis.react": "~0.1.0"
+  },
+  "devDependencies": {
+    "@vnejs/uis.react": "~0.1.0",
+    "typescript": "^5.7.3",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4"
+  },
+  "files": [
+    "dist",
+    "package.json"
+  ]
+}