New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

@solid-primitives/resize-observer

Package Overview
Dependencies
Maintainers
3
Versions
39
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@solid-primitives/resize-observer - npm Package Compare versions

Comparing version 2.0.10 to 2.0.11-beta.0

./dist/server.cjs

74

dist/index.d.ts

@@ -1,3 +0,3 @@

import { Accessor } from 'solid-js';
import { MaybeAccessor, Many } from '@solid-primitives/utils';
import { Accessor } from "solid-js";
import { MaybeAccessor, Many } from "@solid-primitives/utils";

@@ -12,5 +12,8 @@ type ResizeHandler = (rect: DOMRectReadOnly, element: Element, entry: ResizeObserverEntry) => void;

*/
declare function makeResizeObserver<T extends Element>(callback: ResizeObserverCallback, options?: ResizeObserverOptions): {
observe: (ref: T) => void;
unobserve: (ref: T) => void;
declare function makeResizeObserver<T extends Element>(
callback: ResizeObserverCallback,
options?: ResizeObserverOptions,
): {
observe: (ref: T) => void;
unobserve: (ref: T) => void;
};

@@ -32,3 +35,7 @@ /**

*/
declare function createResizeObserver(targets: MaybeAccessor<Many<Element>>, onResize: ResizeHandler, options?: ResizeObserverOptions): void;
declare function createResizeObserver(
targets: MaybeAccessor<Many<Element>>,
onResize: ResizeHandler,
options?: ResizeObserverOptions,
): void;
/**

@@ -38,4 +45,4 @@ * @returns object with width and height dimensions of window, page and screen.

declare function getWindowSize(): {
width: number;
height: number;
width: number;
height: number;
};

@@ -51,4 +58,4 @@ /**

declare function createWindowSize(): {
readonly width: number;
readonly height: number;
readonly width: number;
readonly height: number;
};

@@ -71,9 +78,11 @@ /**

*/
declare function getElementSize(target: Element | false | undefined | null): {
width: number;
height: number;
} | {
width: null;
height: null;
};
declare function getElementSize(target: Element | false | undefined | null):
| {
width: number;
height: number;
}
| {
width: null;
height: null;
};
/**

@@ -90,13 +99,24 @@ * Creates a reactive store-like object of current width and height dimensions of {@link target} element.

declare function createElementSize(target: Element): {
readonly width: number;
readonly height: number;
readonly width: number;
readonly height: number;
};
declare function createElementSize(target: Accessor<Element | false | undefined | null>): {
readonly width: number;
readonly height: number;
} | {
readonly width: null;
readonly height: null;
declare function createElementSize(target: Accessor<Element | false | undefined | null>):
| {
readonly width: number;
readonly height: number;
}
| {
readonly width: null;
readonly height: null;
};
export {
ResizeHandler,
createElementSize,
createResizeObserver,
createWindowSize,
getElementSize,
getWindowSize,
makeResizeObserver,
useWindowSize,
};
export { ResizeHandler, createElementSize, createResizeObserver, createWindowSize, getElementSize, getWindowSize, makeResizeObserver, useWindowSize };

@@ -1,5 +0,5 @@

import { onCleanup, $PROXY, createEffect, on, onMount, $TRACK } from 'solid-js';
import { asArray, handleDiffArray, createStaticStore } from '@solid-primitives/utils';
import { createSharedRoot } from '@solid-primitives/rootless';
import { makeEventListener } from '@solid-primitives/event-listener';
import { onCleanup, $PROXY, createEffect, on, onMount, $TRACK } from "solid-js";
import { asArray, handleDiffArray, createStaticStore } from "@solid-primitives/utils";
import { createSharedRoot } from "@solid-primitives/rootless";
import { makeEventListener } from "@solid-primitives/event-listener";

@@ -11,4 +11,4 @@ // src/index.ts

return {
observe: (ref) => resizeObserver.observe(ref, options),
unobserve: resizeObserver.unobserve.bind(resizeObserver)
observe: ref => resizeObserver.observe(ref, options),
unobserve: resizeObserver.unobserve.bind(resizeObserver),
};

@@ -32,4 +32,3 @@ }

let refs;
if (typeof targets === "function")
refs = () => asArray(targets()).slice();
if (typeof targets === "function") refs = () => asArray(targets()).slice();
else if (Array.isArray(targets) && $PROXY in targets)

@@ -45,3 +44,3 @@ refs = () => {

createEffect(
on(refs, (current, prev = []) => handleDiffArray(current, prev, observe, unobserve))
on(refs, (current, prev = []) => handleDiffArray(current, prev, observe, unobserve)),
);

@@ -52,3 +51,3 @@ }

width: window.innerWidth,
height: window.innerHeight
height: window.innerHeight,
};

@@ -64,4 +63,3 @@ }

function getElementSize(target) {
if (!target)
return { width: null, height: null };
if (!target) return { width: null, height: null };
const { width, height } = target.getBoundingClientRect();

@@ -72,8 +70,10 @@ return { width, height };

const [size, setSize] = createStaticStore(
typeof target !== "function" ? getElementSize(target) : (() => {
onMount(() => setSize(getElementSize(target())));
return { width: null, height: null };
})()
typeof target !== "function"
? getElementSize(target)
: (() => {
onMount(() => setSize(getElementSize(target())));
return { width: null, height: null };
})(),
);
const updateSize = (e) => setSize({ width: e.width, height: e.height });
const updateSize = e => setSize({ width: e.width, height: e.height });
createResizeObserver(typeof target === "function" ? () => target() || [] : target, updateSize);

@@ -83,2 +83,10 @@ return size;

export { createElementSize, createResizeObserver, createWindowSize, getElementSize, getWindowSize, makeResizeObserver, useWindowSize };
export {
createElementSize,
createResizeObserver,
createWindowSize,
getElementSize,
getWindowSize,
makeResizeObserver,
useWindowSize,
};

@@ -1,5 +0,5 @@

import 'solid-js';
import '@solid-primitives/utils';
import { createSharedRoot } from '@solid-primitives/rootless';
import '@solid-primitives/event-listener';
import "solid-js";
import "@solid-primitives/utils";
import { createSharedRoot } from "@solid-primitives/rootless";
import "@solid-primitives/event-listener";

@@ -10,6 +10,4 @@ // src/index.ts

return {
observe: () => {
},
unobserve: () => {
}
observe: () => {},
unobserve: () => {},
};

@@ -39,2 +37,10 @@ }

export { createElementSize, createResizeObserver, createWindowSize, getElementSize, getWindowSize, makeResizeObserver, useWindowSize };
export {
createElementSize,
createResizeObserver,
createWindowSize,
getElementSize,
getWindowSize,
makeResizeObserver,
useWindowSize,
};
{
"name": "@solid-primitives/resize-observer",
"version": "2.0.10",
"version": "2.0.11-beta.0",
"description": "Reactive primitives for observing resizing of HTML elements.",

@@ -80,5 +80,5 @@ "author": "Moshe Udimar",

"dependencies": {
"@solid-primitives/event-listener": "^2.2.7",
"@solid-primitives/rootless": "^1.2.5",
"@solid-primitives/utils": "^5.2.1"
"@solid-primitives/event-listener": "^2.2.8-beta.0",
"@solid-primitives/rootless": "^1.2.6-beta.0",
"@solid-primitives/utils": "^5.4.0-beta.0"
},

@@ -85,0 +85,0 @@ "peerDependencies": {

@@ -0,0 +0,0 @@ <p>

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc