@postenbring/hedwig-react - npm Package Compare versions

Comparing version 0.0.0-badge-20231116111626 to 0.0.0-box-pEjLq4Vx-20231118004854

dist/button/index.d.ts

@@ -1,37 +0,3 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-
-interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "className" | "style"> {
-    /**
-     * The height, font size and padding of the button
-     */
-    size?: "small" | "medium" | "large";
-    /**
-     * Make the button use 100% width available.
-     * Using the "mobile" it only stretch to full width on smaller screens
-     */
-    fullWidth?: boolean | "mobile";
-    /**
-     * The background of the button.
-     */
-    fill?: "contained" | "outlined";
-    children: React.ReactNode;
-    buttonRef?: React.ForwardedRef<HTMLButtonElement>;
-}
-/**
- * ## TODO
- *
- * - [ ] Handle links that looks like buttons
- * - [ ] Revisit how to handle outline
- * - [ ] Figure out outline-white
- */
-declare function PrimaryButton(props: ButtonProps): react_jsx_runtime.JSX.Element;
-declare namespace PrimaryButton {
-    var displayName: string;
-}
-declare function SecondaryButton(props: ButtonProps): react_jsx_runtime.JSX.Element;
-declare namespace SecondaryButton {
-    var displayName: string;
-}
-
-export { PrimaryButton, SecondaryButton };
+export { ButtonProps, PrimaryButton, SecondaryButton } from './button.js';
+import 'react/jsx-runtime';
+import 'react';

dist/button/index.js

@@ -56,2 +56,3 @@ "use strict";
 module.exports = __toCommonJS(button_exports);
+var import_fonts = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css");
 var import_tokens = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css");
@@ -63,3 +64,3 @@ var import_base = require("@postenbring/hedwig-css/dist/base.css");
 var import_clsx = require("clsx");
-var import_typed_classname = require("@postenbring/hedwig-css/typed-classname.mjs");
+var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs");
 
@@ -104,4 +105,3 @@ // src/utils.ts
       }),
-      ref: buttonRef,
-      type: "button"
+      ref: buttonRef
     }, rest), {
@@ -108,0 +108,0 @@ children

dist/index.d.ts

@@ -1,51 +0,8 @@
-export { PrimaryButton, SecondaryButton } from './button/index.js';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-
-interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "className" | "style"> {
-    /**
-     * The visual style of the link
-     */
-    variant?: "underline" | "solid" | "inverted" | "no-underline";
-    /**
-     * Font size of the link
-     */
-    size?: "small" | "medium" | "large";
-    children: React.ReactNode;
-    anchorRef?: React.ForwardedRef<HTMLAnchorElement>;
-}
-/**
- * ## TODO
- *
- * - [ ] Handle button styling
- */
-declare function Link({ children, variant, size, anchorRef, ...rest }: LinkProps): react_jsx_runtime.JSX.Element;
-declare namespace Link {
-    var displayName: string;
-}
-
-interface BadgeProps extends Omit<React.AnchorHTMLAttributes<HTMLSpanElement>, "className" | "style"> {
-    /**
-     * Font size of the badge
-     */
-    size?: "small" | "smaller";
-    children: React.ReactNode;
-}
-declare function Badge(props: BadgeProps): react_jsx_runtime.JSX.Element;
-declare namespace Badge {
-    var displayName: string;
-}
-declare function DarkBadge(props: BadgeProps): react_jsx_runtime.JSX.Element;
-declare namespace DarkBadge {
-    var displayName: string;
-}
-declare function WhiteBadge(props: BadgeProps): react_jsx_runtime.JSX.Element;
-declare namespace WhiteBadge {
-    var displayName: string;
-}
-declare function WarningBadge(props: BadgeProps): react_jsx_runtime.JSX.Element;
-declare namespace WarningBadge {
-    var displayName: string;
-}
-
-export { Badge, DarkBadge, Link, WarningBadge, WhiteBadge };
+export { ButtonProps, PrimaryButton, SecondaryButton } from './button/button.js';
+export { Link, LinkProps } from './link/link.js';
+export { Badge, BadgeProps, DarkBadge, WarningBadge, WhiteBadge } from './badge/badge.js';
+export { DescriptionDetails, DescriptionDetailsProps, default as DescriptionList, DescriptionListProps, DescriptionTerm, DescriptionTermProps } from './list/description-list.js';
+export { ListItem, ListItemProps, ListProps, OrderedList, UnorderedList } from './list/index.js';
+export { Box, BoxCloseButton, BoxCloseButtonProps, BoxProps } from './box/box.js';
+import 'react/jsx-runtime';
+import 'react';

dist/index.js

@@ -53,6 +53,14 @@ "use strict";
   Badge: () => Badge,
+  Box: () => Box,
+  BoxCloseButton: () => BoxCloseButton,
   DarkBadge: () => DarkBadge,
+  DescriptionDetails: () => DescriptionDetails,
+  DescriptionList: () => DescriptionList,
+  DescriptionTerm: () => DescriptionTerm,
   Link: () => Link,
+  ListItem: () => ListItem,
+  OrderedList: () => OrderedList,
   PrimaryButton: () => PrimaryButton,
   SecondaryButton: () => SecondaryButton,
+  UnorderedList: () => UnorderedList,
   WarningBadge: () => WarningBadge,
@@ -63,10 +71,5 @@ WhiteBadge: () => WhiteBadge
 
-// src/button/index.tsx
-var import_tokens = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css");
-var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_button = require("@postenbring/hedwig-css/dist/button/button.css");
-
 // src/button/button.tsx
 var import_clsx = require("clsx");
-var import_typed_classname = require("@postenbring/hedwig-css/typed-classname.mjs");
+var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs");
 
@@ -111,4 +114,3 @@ // src/utils.ts
       }),
-      ref: buttonRef,
-      type: "button"
+      ref: buttonRef
     }, rest), {
@@ -129,10 +131,5 @@ children
 
-// src/link/index.tsx
-var import_tokens2 = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css");
-var import_base2 = require("@postenbring/hedwig-css/dist/base.css");
-var import_link = require("@postenbring/hedwig-css/dist/link/link.css");
-
 // src/link/link.tsx
 var import_clsx2 = require("clsx");
-var import_typed_classname2 = require("@postenbring/hedwig-css/typed-classname.mjs");
+var import_typed_classname2 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
 var import_jsx_runtime2 = require("react/jsx-runtime");
@@ -168,10 +165,5 @@ function Link(_a) {
 
-// src/badge/index.tsx
-var import_tokens3 = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css");
-var import_base3 = require("@postenbring/hedwig-css/dist/base.css");
-var import_badge = require("@postenbring/hedwig-css/dist/badge/badge.css");
-
 // src/badge/badge.tsx
 var import_clsx3 = require("clsx");
-var import_typed_classname3 = require("@postenbring/hedwig-css/typed-classname.mjs");
+var import_typed_classname3 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
 var import_jsx_runtime3 = require("react/jsx-runtime");
@@ -189,3 +181,10 @@ function BaseBadge(_a) {
   warnForStyleOverrides(rest);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: (0, import_clsx3.clsx)((0, import_typed_classname3.t)("hds-badge"), (0, import_typed_classname3.t)(`hds-badge--${size}`), (0, import_typed_classname3.t)(`hds-badge--${variant}`)), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "span",
+    __spreadProps(__spreadValues({
+      className: (0, import_clsx3.clsx)((0, import_typed_classname3.t)("hds-badge"), (0, import_typed_classname3.t)(`hds-badge--${size}`), (0, import_typed_classname3.t)(`hds-badge--${variant}`))
+    }, rest), {
+      children
+    })
+  );
 }
@@ -208,12 +207,161 @@ BaseBadge.displayName = "BaseBadge";
 }
-WarningBadge.displayName = "Badge";
+WarningBadge.displayName = "WarningBadge";
+
+// src/list/description-list.tsx
+var import_clsx4 = require("clsx");
+var import_typed_classname4 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function DescriptionDetails(_a) {
+  var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
+  warnForStyleOverrides(rest);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", __spreadProps(__spreadValues({}, rest), { children }));
+}
+function DescriptionTerm(_a) {
+  var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
+  warnForStyleOverrides(rest);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", __spreadProps(__spreadValues({}, rest), { children }));
+}
+function DescriptionList(_a) {
+  var _b = _a, { variant = "vertical" } = _b, rest = __objRest(_b, ["variant"]);
+  warnForStyleOverrides(rest);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "dl",
+    __spreadValues({
+      className: (0, import_clsx4.clsx)((0, import_typed_classname4.t)("hds-description-list"), {
+        [(0, import_typed_classname4.t)("hds-description-list--horizontal")]: variant === "horizontal"
+      })
+    }, rest)
+  );
+}
+DescriptionList.displayName = "DescriptionList";
+DescriptionTerm.displayName = "DescriptionTerm";
+DescriptionDetails.displayName = "DescriptionDetails";
+
+// src/list/list.tsx
+var import_clsx5 = require("clsx");
+var import_typed_classname5 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function BaseList(_a) {
+  var _b = _a, {
+    as: ListTag = "ul",
+    children,
+    listStyle = "inherit",
+    size = "medium"
+  } = _b, rest = __objRest(_b, [
+    "as",
+    "children",
+    "listStyle",
+    "size"
+  ]);
+  warnForStyleOverrides(rest);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    ListTag,
+    __spreadProps(__spreadValues({
+      className: (0, import_clsx5.clsx)((0, import_typed_classname5.t)("hds-list"), (0, import_typed_classname5.t)(`hds-list--${size}`), {
+        [(0, import_typed_classname5.t)(`hds-list--style-hidden`)]: listStyle === "no-bullets"
+      })
+    }, rest), {
+      children
+    })
+  );
+}
+function ListItem(_a) {
+  var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
+  warnForStyleOverrides(rest);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("li", __spreadProps(__spreadValues({}, rest), { children }));
+}
+function UnorderedList(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(BaseList, __spreadProps(__spreadValues({ as: "ul" }, props), { children: props.children }));
+}
+function OrderedList(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(BaseList, __spreadProps(__spreadValues({ as: "ol" }, props), { children: props.children }));
+}
+ListItem.displayName = "ListItem";
+BaseList.displayName = "BaseList";
+OrderedList.displayName = "UnorderedList";
+UnorderedList.displayName = "UnorderedList";
+
+// src/box/box.tsx
+var import_react = require("react");
+var import_clsx6 = require("clsx");
+var import_typed_classname6 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var Box = (0, import_react.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, {
+      as: Component = "div",
+      variant = "light-grey",
+      hideCloseButton,
+      onClose: onCloseProp,
+      closed: closedProp,
+      closeButtonProps,
+      children
+    } = _b, rest = __objRest(_b, [
+      "as",
+      "variant",
+      "hideCloseButton",
+      "onClose",
+      "closed",
+      "closeButtonProps",
+      "children"
+    ]);
+    warnForStyleOverrides(rest);
+    const [closedState, setClosedState] = (0, import_react.useState)(false);
+    const onClose = (0, import_react.useCallback)(() => {
+      if (onCloseProp) {
+        const result = onCloseProp();
+        if (result === true) {
+          setClosedState(true);
+        }
+      } else {
+        setClosedState(true);
+      }
+    }, []);
+    const closed = closedProp != null ? closedProp : closedState;
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+      Component,
+      __spreadProps(__spreadValues({
+        className: (0, import_clsx6.clsx)((0, import_typed_classname6.t)("hds-box"), (0, import_typed_classname6.t)(`hds-box--${variant}`), { [(0, import_typed_classname6.t)("hds-box--closed")]: closed }),
+        ref
+      }, rest), {
+        children: [
+          !hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(BoxCloseButton, __spreadValues({ onClick: onClose }, closeButtonProps)),
+          children
+        ]
+      })
+    );
+  }
+);
+Box.displayName = "Box";
+var BoxCloseButton = (0, import_react.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      "button",
+      __spreadValues({
+        className: (0, import_clsx6.clsx)((0, import_typed_classname6.t)("hds-box__close-button"), className),
+        ref,
+        type: "button"
+      }, rest)
+    );
+  }
+);
+BoxCloseButton.displayName = "BoxCloseButton";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Badge,
+  Box,
+  BoxCloseButton,
   DarkBadge,
+  DescriptionDetails,
+  DescriptionList,
+  DescriptionTerm,
   Link,
+  ListItem,
+  OrderedList,
   PrimaryButton,
   SecondaryButton,
+  UnorderedList,
   WarningBadge,
   WhiteBadge
 });

package.json

 {
   "name": "@postenbring/hedwig-react",
-  "version": "0.0.0-badge-20231116111626",
+  "version": "0.0.0-box-pEjLq4Vx-20231118004854",
   "main": "./dist/index.js",
@@ -25,8 +25,8 @@ "module": "./dist/index.mjs",
     "react": "^18.2.0",
-    "tsup": "^7.2.0",
+    "tsup": "^7.3.0",
     "typescript": "^5.2.2"
   },
   "dependencies": {
-    "@postenbring/hedwig-css": "0.0.0-badge-20231116111626",
-    "@postenbring/hedwig-tokens": "*",
+    "@postenbring/hedwig-css": "0.0.0-box-pEjLq4Vx-20231118004854",
+    "@postenbring/hedwig-tokens": "0.0.0-box-pEjLq4Vx-20231118004854",
     "clsx": "^2.0.0"
@@ -33,0 +33,0 @@ },

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

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

Wildcard dependency

Quality

Package has a dependency with a floating version range. This can cause issues if the dependency publishes a new major version.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

89929

increased by266.61%

Number of package files

56

increased by460%

Lines of code

2308

increased by283.39%

Number of medium quality alerts

2

decreased by-33.33%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@parcel/watcher-linux-x64-glibc@2.5.0(transitive)

• + Added@postenbring/hedwig-css@0.0.0-box-pEjLq4Vx-20231118004854(transitive)

• + Added@postenbring/hedwig-tokens@0.0.0-box-pEjLq4Vx-20231118004854(transitive)

• - Removed@postenbring/hedwig-css@0.0.0-badge-20231116111626(transitive)

• - Removed@postenbring/hedwig-tokens@1.1.0(transitive)

• Updated@postenbring/hedwig-css@0.0.0-box-pEjLq4Vx-20231118004854

• Updated@postenbring/hedwig-tokens@0.0.0-box-pEjLq4Vx-20231118004854