flex-wrap-layout - npm Package Compare versions

Comparing version 0.11.0 to 0.12.0

dist/detectWrappedElements.js

@@ -1,4 +0,1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.detectWrappedElements = void 0;
 function getTopPosition(el) {
@@ -9,3 +6,3 @@ const { top } = el.getBoundingClientRect();
 }
-function detectWrappedElements(rootElement, wrapChildrenClassName, nextIsWrappedClassName, hasChildWrappedClassName) {
+export function detectWrappedElements(rootElement, wrapChildrenClassName, nextIsWrappedClassName, hasChildWrappedClassName) {
     const parents = Array.from(rootElement.getElementsByClassName(wrapChildrenClassName));
@@ -37,2 +34,1 @@ if (rootElement.classList.contains(wrapChildrenClassName))
 }
-exports.detectWrappedElements = detectWrappedElements;

dist/DevTools.js

@@ -1,29 +0,3 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DevTools = exports.useDevTools = void 0;
-const react_1 = __importStar(require("react"));
-const useDetectWrappedElements_1 = require("./useDetectWrappedElements");
+import React, { useState } from 'react';
+import { useDetectWrappedElements } from './useDetectWrappedElements';
 const panel = {
@@ -35,6 +9,6 @@ display: 'inline-block',
 };
-function useDevTools({ showBordersInit, detectWrappedElementsInit, flexFillInit }) {
-    const [showBorders, setShowBorders] = (0, react_1.useState)(showBordersInit);
-    const [detectWrappedElements, setDetectWrappedElements] = (0, react_1.useState)(detectWrappedElementsInit);
-    const [flexFill, setFlexFill] = (0, react_1.useState)(flexFillInit);
+export function useDevTools({ showBordersInit, detectWrappedElementsInit, flexFillInit }) {
+    const [showBorders, setShowBorders] = useState(showBordersInit);
+    const [detectWrappedElements, setDetectWrappedElements] = useState(detectWrappedElementsInit);
+    const [flexFill, setFlexFill] = useState(flexFillInit);
     const showBordersClassName = showBorders ? 'show-borders' : '';
@@ -53,27 +27,25 @@ const flexFillClassName = flexFill ? 'flex-fill' : '';
 }
-exports.useDevTools = useDevTools;
 function DetectWrappedElements({ detectWrappedElementsRef }) {
-    (0, useDetectWrappedElements_1.useDetectWrappedElements)(detectWrappedElementsRef);
+    useDetectWrappedElements(detectWrappedElementsRef);
     return null;
 }
-function DevTools(props) {
+export function DevTools(props) {
     const { detectWrappedElementsRef, context, ...otherProps } = props;
     const { showBorders, setShowBorders, detectWrappedElements, setDetectWrappedElements, flexFill, setFlexFill } = context;
-    return (react_1.default.createElement("div", { style: { ...panel }, ...otherProps },
-        detectWrappedElements && (react_1.default.createElement(DetectWrappedElements, { detectWrappedElementsRef: detectWrappedElementsRef })),
-        react_1.default.createElement("label", { title: "Dotted line: growing block, solid line: fixed block" },
-            react_1.default.createElement("input", { type: "checkbox", checked: showBorders, onChange: () => setShowBorders(!showBorders) }),
+    return (React.createElement("div", { style: { ...panel }, ...otherProps },
+        detectWrappedElements && (React.createElement(DetectWrappedElements, { detectWrappedElementsRef: detectWrappedElementsRef })),
+        React.createElement("label", { title: "Dotted line: growing block, solid line: fixed block" },
+            React.createElement("input", { type: "checkbox", checked: showBorders, onChange: () => setShowBorders(!showBorders) }),
             ' ',
             "Borders"),
         '  ',
-        react_1.default.createElement("label", { title: "Make previous and next blocks grow" },
-            react_1.default.createElement("input", { type: "checkbox", checked: detectWrappedElements, onChange: () => setDetectWrappedElements(!detectWrappedElements) }),
+        React.createElement("label", { title: "Make previous and next blocks grow" },
+            React.createElement("input", { type: "checkbox", checked: detectWrappedElements, onChange: () => setDetectWrappedElements(!detectWrappedElements) }),
             ' ',
             "detectWrappedElements()"),
         '  ',
-        react_1.default.createElement("label", null,
-            react_1.default.createElement("input", { type: "checkbox", checked: flexFill, onChange: () => setFlexFill(!flexFill) }),
+        React.createElement("label", null,
+            React.createElement("input", { type: "checkbox", checked: flexFill, onChange: () => setFlexFill(!flexFill) }),
             ' ',
             ".flex-fill")));
 }
-exports.DevTools = DevTools;

dist/forceDetectWrappedElements.js

@@ -1,5 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.forceDetectWrappedElements = void 0;
-function forceDetectWrappedElements() {
+export function forceDetectWrappedElements() {
     try {
@@ -16,2 +13,1 @@ window.dispatchEvent(new Event('resize'));
 }
-exports.forceDetectWrappedElements = forceDetectWrappedElements;

dist/index.js

@@ -1,20 +0,4 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./detectWrappedElements"), exports);
-__exportStar(require("./DevTools"), exports);
-__exportStar(require("./forceDetectWrappedElements"), exports);
-__exportStar(require("./useDetectWrappedElements"), exports);
+export * from './detectWrappedElements';
+export * from './DevTools';
+export * from './forceDetectWrappedElements';
+export * from './useDetectWrappedElements';

dist/useDetectWrappedElements.js

@@ -1,14 +0,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDetectWrappedElements = exports.hasChildWrappedClassName = exports.nextIsWrappedClassName = exports.wrapChildrenClassName = void 0;
-const react_1 = require("react");
-const detectWrappedElements_1 = require("./detectWrappedElements");
-exports.wrapChildrenClassName = 'wrap-children';
-exports.nextIsWrappedClassName = 'next-is-wrapped';
-exports.hasChildWrappedClassName = 'has-child-wrapped';
-function useDetectWrappedElements(ref) {
-    (0, react_1.useEffect)(() => {
+import { useEffect } from 'react';
+import { detectWrappedElements } from './detectWrappedElements';
+export const wrapChildrenClassName = 'wrap-children';
+export const nextIsWrappedClassName = 'next-is-wrapped';
+export const hasChildWrappedClassName = 'has-child-wrapped';
+export function useDetectWrappedElements(ref) {
+    useEffect(() => {
         const rootElement = ref.current;
         function run() {
-            (0, detectWrappedElements_1.detectWrappedElements)(rootElement, exports.wrapChildrenClassName, exports.nextIsWrappedClassName, exports.hasChildWrappedClassName);
+            detectWrappedElements(rootElement, wrapChildrenClassName, nextIsWrappedClassName, hasChildWrappedClassName);
         }
@@ -19,10 +16,9 @@ window.addEventListener('resize', run);
             window.removeEventListener('resize', run);
-            const children = rootElement.getElementsByClassName(exports.nextIsWrappedClassName);
+            const children = rootElement.getElementsByClassName(nextIsWrappedClassName);
             while (children.length > 0) {
-                children[0].classList.remove(exports.nextIsWrappedClassName);
+                children[0].classList.remove(nextIsWrappedClassName);
             }
-            rootElement.classList.remove(exports.hasChildWrappedClassName);
+            rootElement.classList.remove(hasChildWrappedClassName);
         };
     }, [ref]);
 }
-exports.useDetectWrappedElements = useDetectWrappedElements;

package.json

 {
   "name": "flex-wrap-layout",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "Experiments with flexbox layout",
@@ -11,3 +11,4 @@ "repository": "github:tkrotoff/flex-wrap-layout",
   ],
-  "main": "dist/index.js",
+  "main": "dist/cjs/index.js",
+  "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -22,5 +23,6 @@ "files": [
     "clean:all": "npm run clean && rm -rf node_modules package-lock.json examples/node_modules examples/package-lock.json",
-    "build": "npm run clean && npm run build:dts && npm run build:cjs",
+    "build": "npm run clean && npm run build:dts && npm run build:esm && npm run build:cjs",
     "build:dts": "tsc --project tsconfig.dist.json --declaration --emitDeclarationOnly --outDir dist",
-    "build:cjs": "tsc --project tsconfig.dist.json --removeComments --module commonjs --outDir dist",
+    "build:esm": "tsc --project tsconfig.dist.json --removeComments --outDir dist",
+    "build:cjs": "tsc --project tsconfig.dist.json --removeComments --module commonjs --outDir dist/cjs",
     "npm:install:examples": "cd examples && npm install",
@@ -36,3 +38,3 @@ "build:examples": "cd examples && ./node_modules/.bin/webpack --mode=development",
     "precommit": "lint-staged --verbose",
-    "prepush": "npm run build:cjs && npm run build:examples && npm run test && npm run test:examples",
+    "prepush": "npm run build:esm && npm run build:examples && npm run test && npm run test:examples",
     "prepublishOnly": "npm run clean && npm run build",
@@ -39,0 +41,0 @@ "publish:beta": "npm version 0.10.0-beta.1 && npm publish --tag next --dry-run",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

34447

increased by18.75%

Number of package files

26

increased by23.81%

Lines of code

611

increased by24.44%

No dependency changes