@zh-engineer/airorange-react - npm Package Compare versions

Comparing version 0.0.1 to 0.1.0

dist/components/Link/Link.d.ts

+/// <reference types="react" />
+interface LinkProps extends React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
+    size?: "xs" | "s" | "m-base" | "l" | "xl" | "xxl";
+}
+export declare function Link(props: LinkProps): import("react/jsx-runtime").JSX.Element;
+export {};

dist/components/Link/Link.js

+import "react/jsx-runtime";
+import { Link as m } from "../../main.js";
+export {
+  m as Link
+};

dist/components/Link/Link.stories.d.ts

+import type { StoryObj } from "@storybook/react";
+import { Link } from "./Link";
+declare const meta: {
+    title: string;
+    component: typeof Link;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        size: {
+            control: string;
+            options: string[];
+            defaultValue: string;
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const XXLSize: Story;

dist/components/Link/Link.stories.js

+import { Link as e } from "../../main.js";
+const o = {
+  title: "Link",
+  component: e,
+  parameters: {
+    // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/react/configure/story-layout
+    layout: "centered"
+  },
+  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
+  tags: ["autodocs"],
+  argTypes: {
+    size: {
+      control: "select",
+      options: ["xs", "s", "m-base", "l", "xl", "xxl"],
+      defaultValue: "m-base"
+    }
+  }
+}, t = {
+  args: {
+    children: "Some more information",
+    href: "#",
+    rel: "noreferrer"
+  }
+}, a = {
+  args: {
+    children: "Some more information",
+    href: "#",
+    rel: "noreferrer",
+    size: "xxl"
+  }
+};
+export {
+  t as Default,
+  a as XXLSize,
+  o as default
+};

dist/components/Tooltip/Tooltip.d.ts

+import * as React from "react";
+import { PlacesType } from "react-tooltip";
+interface TooltipProps extends React.PropsWithChildren {
+    text: string;
+    id?: string;
+    placement?: PlacesType;
+    accessory?: React.ReactNode;
+}
+export declare function Tooltip({ children, text, id, placement, accessory, }: TooltipProps): import("react/jsx-runtime").JSX.Element;
+export {};

dist/components/Tooltip/Tooltip.js

+import "react/jsx-runtime";
+import { Tooltip as t } from "../../main.js";
+export {
+  t as Tooltip
+};

dist/components/Tooltip/Tooltip.stories.js

+import { jsx as t } from "react/jsx-runtime";
+import { Tooltip as e, Link as r } from "../../main.js";
+const s = {
+  title: "Tooltip",
+  component: (o) => /* @__PURE__ */ t(e, { ...o, children: /* @__PURE__ */ t("button", { children: "Hover me" }) }),
+  parameters: {
+    // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/react/configure/story-layout
+    layout: "centered"
+  },
+  // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
+  tags: ["autodocs"],
+  argTypes: {
+    text: { control: "text" },
+    placement: {
+      control: "select",
+      options: [
+        "top",
+        "top-start",
+        "top-end",
+        "right",
+        "right-start",
+        "right-end",
+        "bottom",
+        "bottom-start",
+        "bottom-end",
+        "left",
+        "left-start",
+        "left-end"
+      ]
+    }
+  }
+}, i = {
+  args: {
+    text: "Some more information"
+  }
+}, l = {
+  args: {
+    text: "Some more information",
+    accessory: /* @__PURE__ */ t(
+      r,
+      {
+        href: "https://google.com",
+        size: "xs",
+        target: "_blank",
+        rel: "noopener noreferrer",
+        children: "Google"
+      }
+    )
+  }
+};
+export {
+  i as Default,
+  l as WithLink,
+  s as default
+};

dist/assets/main.css

@@ -1,1 +0,1 @@
-._container_v89ex_1{width:40px;height:40px;overflow:hidden;border-radius:22px;border-width:2px;border-style:solid;display:flex;align-items:center;justify-content:center}._image_v89ex_13{width:100%;height:100%;object-fit:fill}._area_ngp83_1{position:relative;border-radius:12px;width:48px;height:24px;border:none;padding:2px;transition:background .2s ease-in-out}._label_ngp83_11{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}._toggle_ngp83_23{background-color:#fff;width:20px;height:20px;border-radius:10px;position:relative;display:flex;align-items:center;justify-content:center;transform:translate(0);transition:transform .2s ease-in-out}._toggle_ngp83_23._checked_ngp83_36{transform:translate(24px)}._icon_ngp83_40{width:12px;height:12px}
+._container_v89ex_1{width:40px;height:40px;overflow:hidden;border-radius:22px;border-width:2px;border-style:solid;display:flex;align-items:center;justify-content:center}._image_v89ex_13{width:100%;height:100%;object-fit:fill}._area_ngp83_1{position:relative;border-radius:12px;width:48px;height:24px;border:none;padding:2px;transition:background .2s ease-in-out}._label_ngp83_11{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}._toggle_ngp83_23{background-color:#fff;width:20px;height:20px;border-radius:10px;position:relative;display:flex;align-items:center;justify-content:center;transform:translate(0);transition:transform .2s ease-in-out}._toggle_ngp83_23._checked_ngp83_36{transform:translate(24px)}._icon_ngp83_40{width:12px;height:12px}._container_ja17u_1 ._tooltip_ja17u_1{padding:16px;display:flex;gap:8px}._container_ja17u_1 ._target_ja17u_7{width:fit-content}

dist/main.d.ts

@@ -338,1 +338,3 @@ declare const Colors: {
 export { Toggle } from "./components/Toggle/Toggle";
+export { Link } from "./components/Link/Link";
+export { Tooltip } from "./components/Tooltip/Tooltip";

package.json

 {
   "name": "@zh-engineer/airorange-react",
-  "version": "0.0.1",
+  "version": "0.1.0",
   "type": "module",
@@ -66,4 +66,5 @@ "main": "dist/main.js",
   "dependencies": {
-    "@headlessui/react": "^1.7.17"
+    "@headlessui/react": "^1.7.17",
+    "react-tooltip": "^5.24.0"
   }
 }

New alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Fixed alerts

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Improved metrics

Total package byte prevSize

114711

84.15%

Number of package files

22

46.67%

Lines of code

3848

65.22%

Worsened metrics

Dependency count

4

33.33%

Number of low supply chain risk alerts

5

150%

Dependency changes

• + Added

  react-tooltip@^5.24.0

• + Added

  @floating-ui/core@1.8.0
  (transitive)

• + Added

  @floating-ui/dom@1.8.0
  (transitive)

• + Added

  @floating-ui/utils@0.2.12
  (transitive)

• + Added

  classnames@2.5.1
  (transitive)

• + Added

  react-tooltip@5.30.1
  (transitive)