@postenbring/hedwig-react - npm Package Compare versions

Comparing version 0.0.0-improve-typed-classname-20231126142550 to 0.0.0-improve-typed-classname-20231127094705

dist/badge/index.js

@@ -61,3 +61,3 @@ "use strict";
 var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_badge = require("@postenbring/hedwig-css/dist/badge/badge.css");
+var import_badge = require("@postenbring/hedwig-css/dist/badge.css");
 
@@ -64,0 +64,0 @@ // src/badge/badge.tsx

dist/box/box.d.ts

@@ -1,2 +0,36 @@
-import 'react';
-export { a as Box, c as BoxCloseButton, b as BoxCloseButtonProps, B as BoxProps } from '../index-OpbVH1tp.js';
+import * as React$1 from 'react';
+import { O as OverridableComponent } from '../utils-BfZsjuFH.js';
+
+interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: "light-grey" | "lighter" | "white" | "warning";
+    children: React.ReactNode;
+    /**
+     * If `true`, the close button will be hidden.
+     * Use when you want to control the close button using the BoxCloseButton component.
+     */
+    hideCloseButton?: boolean;
+    /**
+     * Callback fired when the component requests to be closed.
+     * If not set, the component will be closed without any user interaction.
+     *
+     * If set, and the handler returns non-true value, the component will not be closed.
+     * Use this if you want to control the closing of the component, using the `closed` prop
+     *
+     * If set, and the handler returns the true, the component will be closed.
+     * Use this with `window.confirm()` to ask the user to confirm closing the component.
+     */
+    onClose?: () => boolean | unknown;
+    /**
+     * If `true`, the box will be closed and hidden from view
+     */
+    closed?: boolean;
+    /**
+     * Props applied to the close button element.
+     */
+    closeButtonProps?: BoxCloseButtonProps;
+}
+declare const Box: OverridableComponent<BoxProps, HTMLDivElement>;
+type BoxCloseButtonProps = Omit<React.HTMLAttributes<HTMLButtonElement>, "children">;
+declare const BoxCloseButton: React$1.ForwardRefExoticComponent<BoxCloseButtonProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+export { Box, BoxCloseButton, type BoxCloseButtonProps, type BoxProps };

dist/box/index.d.ts

@@ -1,2 +0,3 @@
-export { a as Box, c as BoxCloseButton, b as BoxCloseButtonProps, B as BoxProps } from '../index-OpbVH1tp.js';
+export { Box, BoxCloseButton, BoxCloseButtonProps, BoxProps } from './box.js';
 import 'react';
+import '../utils-BfZsjuFH.js';

dist/box/index.js

@@ -59,4 +59,3 @@ "use strict";
 var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_box = require("@postenbring/hedwig-css/dist/box/box.css");
-var import_message = require("@postenbring/hedwig-css/dist/message/message.css");
+var import_box = require("@postenbring/hedwig-css/dist/box.css");
 
@@ -63,0 +62,0 @@ // src/box/box.tsx

dist/button/index.js

@@ -59,3 +59,3 @@ "use strict";
 var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_button = require("@postenbring/hedwig-css/dist/button/button.css");
+var import_button = require("@postenbring/hedwig-css/dist/button.css");
 
@@ -62,0 +62,0 @@ // src/button/button.tsx

dist/index.d.ts

@@ -7,5 +7,10 @@ export { ButtonProps, PrimaryButton, SecondaryButton } from './button/button.js';
 export { LinkList, LinkListProps } from './list/link-list.js';
-export { a as Box, c as BoxCloseButton, b as BoxCloseButtonProps, B as BoxProps } from './index-OpbVH1tp.js';
+export { Box, BoxCloseButton, BoxCloseButtonProps, BoxProps } from './box/box.js';
 export { Message, MessageProps } from './message/message.js';
+export { Accordion, AccordionProps } from './accordion/accordion.js';
+export { AccordionItem, AccordionItemChildrenType, AccordionItemProps } from './accordion/accordion-item.js';
+export { AccordionTrigger, AccordionTriggerProps } from './accordion/accordion-item-trigger.js';
+export { AccordionContent, AccordionContentProps } from './accordion/accordion-item-content.js';
 import 'react/jsx-runtime';
 import 'react';
+import './utils-BfZsjuFH.js';

dist/index.js

@@ -52,2 +52,6 @@ "use strict";
 __export(src_exports, {
+  Accordion: () => Accordion,
+  AccordionContent: () => AccordionContent,
+  AccordionItem: () => AccordionItem,
+  AccordionTrigger: () => AccordionTrigger,
   Badge: () => Badge,
@@ -76,3 +80,3 @@ Box: () => Box,
 var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_button = require("@postenbring/hedwig-css/dist/button/button.css");
+var import_button = require("@postenbring/hedwig-css/dist/button.css");
 
@@ -134,3 +138,3 @@ // src/button/button.tsx
 var import_base2 = require("@postenbring/hedwig-css/dist/base.css");
-var import_link = require("@postenbring/hedwig-css/dist/link/link.css");
+var import_link = require("@postenbring/hedwig-css/dist/link.css");
 
@@ -175,3 +179,3 @@ // src/link/link.tsx
 var import_base3 = require("@postenbring/hedwig-css/dist/base.css");
-var import_badge = require("@postenbring/hedwig-css/dist/badge/badge.css");
+var import_badge = require("@postenbring/hedwig-css/dist/badge.css");
 
@@ -229,4 +233,4 @@ // src/badge/badge.tsx
 var import_base4 = require("@postenbring/hedwig-css/dist/base.css");
-var import_description_list = require("@postenbring/hedwig-css/dist/list/description-list.css");
-var import_list2 = require("@postenbring/hedwig-css/dist/list/list.css");
+var import_description_list = require("@postenbring/hedwig-css/dist/description-list.css");
+var import_list2 = require("@postenbring/hedwig-css/dist/list.css");
 
@@ -323,4 +327,3 @@ // src/list/description-list.tsx
 var import_base5 = require("@postenbring/hedwig-css/dist/base.css");
-var import_box = require("@postenbring/hedwig-css/dist/box/box.css");
-var import_message = require("@postenbring/hedwig-css/dist/message/message.css");
+var import_box = require("@postenbring/hedwig-css/dist/box.css");
 
@@ -403,4 +406,4 @@ // src/box/box.tsx
 var import_base6 = require("@postenbring/hedwig-css/dist/base.css");
-var import_box3 = require("@postenbring/hedwig-css/dist/box/box.css");
-var import_message2 = require("@postenbring/hedwig-css/dist/message/message.css");
+var import_box3 = require("@postenbring/hedwig-css/dist/box.css");
+var import_message = require("@postenbring/hedwig-css/dist/message.css");
 
@@ -429,4 +432,159 @@ // src/message/message.tsx
 Message.displayName = "Message";
+
+// src/accordion/index.tsx
+var import_fonts7 = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css");
+var import_tokens7 = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css");
+var import_base7 = require("@postenbring/hedwig-css/dist/base.css");
+var import_accordion = require("@postenbring/hedwig-css/dist/accordion.css");
+
+// src/accordion/accordion.tsx
+var import_react4 = require("react");
+var import_typed_classname8 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
+
+// src/accordion/context.ts
+var import_react3 = require("react");
+var AccordionContext = (0, import_react3.createContext)({
+  variant: "multiple",
+  mounted: false,
+  openItems: [],
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- Added default section, without handling
+  toggleOpenItem: (id) => {
+  }
+});
+var AccordionItemContext = (0, import_react3.createContext)(null);
+
+// src/accordion/accordion.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var Accordion = (0, import_react4.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { as: Component = "div", children, className, variant = "multiple" } = _b, rest = __objRest(_b, ["as", "children", "className", "variant"]);
+    const [openItems, setOpenItems] = (0, import_react4.useState)([]);
+    const toggleOpenItem = (itemId) => {
+      if (variant === "single") {
+        setOpenItems([itemId]);
+      } else {
+        setOpenItems(
+          openItems.includes(itemId) ? openItems.filter((id) => id !== itemId) : [...openItems, itemId]
+        );
+      }
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AccordionContext.Provider, { value: { variant, openItems, toggleOpenItem, mounted: true }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname8.clsx)("hds-accordion", className), ref, children })) });
+  }
+);
+Accordion.displayName = "Accordion";
+
+// src/accordion/accordion-item.tsx
+var import_react5 = require("react");
+var import_typed_classname9 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var AccordionItem = (0, import_react5.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { as: Component = "div", children, className } = _b, rest = __objRest(_b, ["as", "children", "className"]);
+    const context = (0, import_react5.useContext)(AccordionContext);
+    const [open, setOpen] = (0, import_react5.useState)(false);
+    const accordionItemId = (0, import_react5.useId)();
+    const handleOpen = () => {
+      setOpen(!open);
+      if (context.variant === "single") {
+        context.toggleOpenItem(accordionItemId);
+      }
+    };
+    if (!context.mounted) {
+      throw new Error("Context required. Did you use <AccordionItem/> outside of <Accordion/>?");
+    }
+    (0, import_react5.useEffect)(() => {
+      if (context.variant === "multiple") {
+        return;
+      }
+      if (open && !context.openItems.includes(accordionItemId)) {
+        setOpen(false);
+      }
+    }, [context.openItems]);
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      Component,
+      __spreadProps(__spreadValues({}, rest), {
+        className: (0, import_typed_classname9.clsx)(
+          "hds-accordion-item",
+          {
+            "hds-accordion-item__expanded": open
+          },
+          className
+        ),
+        ref,
+        children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AccordionItemContext.Provider, { value: { open, setOpen: handleOpen }, children })
+      })
+    );
+  }
+);
+AccordionItem.displayName = "AccordionItem";
+
+// src/accordion/accordion-item-trigger.tsx
+var import_react6 = require("react");
+var import_typed_classname10 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function FaArrowDownButNotReally() {
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: "v " });
+}
+function FaArrowUpButNotReally() {
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: "^ " });
+}
+var AccordionTrigger = (0, import_react6.forwardRef)((_a, ref) => {
+  var _b = _a, { as: Component = "button", children, className, onClick } = _b, rest = __objRest(_b, ["as", "children", "className", "onClick"]);
+  const itemContext = (0, import_react6.useContext)(AccordionItemContext);
+  if (itemContext === null) {
+    return null;
+  }
+  const expandOrCollapse = (e) => {
+    itemContext.setOpen(!itemContext.open);
+    onClick && onClick(e);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    Component,
+    __spreadProps(__spreadValues({}, rest), {
+      "aria-expanded": itemContext.open,
+      className: (0, import_typed_classname10.clsx)("hds-accordion-item-trigger", className),
+      onClick: expandOrCollapse,
+      ref,
+      type: "button",
+      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: (0, import_typed_classname10.clsx)("hds-accordion-item-trigger--icon"), children: itemContext.open ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(FaArrowUpButNotReally, {}) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(FaArrowDownButNotReally, {}) }),
+        children
+      ] })
+    })
+  );
+});
+AccordionTrigger.displayName = "AccordionTrigger";
+
+// src/accordion/accordion-item-content.tsx
+var import_react7 = require("react");
+var import_typed_classname11 = require("@postenbring/hedwig-css/typed-classname/index.mjs");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var AccordionContent = (0, import_react7.forwardRef)((_a, ref) => {
+  var _b = _a, { as: Component = "div", children, className } = _b, rest = __objRest(_b, ["as", "children", "className"]);
+  const context = (0, import_react7.useContext)(AccordionItemContext);
+  if (context === null) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    Component,
+    __spreadProps(__spreadValues({}, rest), {
+      className: (0, import_typed_classname11.clsx)(
+        "hds-accordion-item-content",
+        {
+          "hds-accordion-item-content--closed": !context.open
+        },
+        className
+      ),
+      ref,
+      children
+    })
+  );
+});
+AccordionContent.displayName = "AccordionContent";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
   Badge,
@@ -433,0 +591,0 @@ Box,

dist/link/index.js

@@ -58,3 +58,3 @@ "use strict";
 var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_link = require("@postenbring/hedwig-css/dist/link/link.css");
+var import_link = require("@postenbring/hedwig-css/dist/link.css");
 
@@ -61,0 +61,0 @@ // src/link/link.tsx

dist/list/index.js

@@ -63,4 +63,4 @@ "use strict";
 var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_description_list = require("@postenbring/hedwig-css/dist/list/description-list.css");
-var import_list2 = require("@postenbring/hedwig-css/dist/list/list.css");
+var import_description_list = require("@postenbring/hedwig-css/dist/description-list.css");
+var import_list2 = require("@postenbring/hedwig-css/dist/list.css");
 
@@ -67,0 +67,0 @@ // src/list/description-list.tsx

dist/message/index.d.ts

 export { Message, MessageProps } from './message.js';
 import 'react';
-import '../index-OpbVH1tp.js';
+import '../utils-BfZsjuFH.js';
+import '../box/box.js';

dist/message/index.js

@@ -58,4 +58,4 @@ "use strict";
 var import_base = require("@postenbring/hedwig-css/dist/base.css");
-var import_box2 = require("@postenbring/hedwig-css/dist/box/box.css");
-var import_message = require("@postenbring/hedwig-css/dist/message/message.css");
+var import_box2 = require("@postenbring/hedwig-css/dist/box.css");
+var import_message = require("@postenbring/hedwig-css/dist/message.css");
 
@@ -62,0 +62,0 @@ // src/message/message.tsx

dist/message/message.d.ts

 import React__default from 'react';
-import { B as BoxProps, O as OverridableComponent } from '../index-OpbVH1tp.js';
+import { O as OverridableComponent } from '../utils-BfZsjuFH.js';
+import { BoxProps } from '../box/box.js';
 
@@ -4,0 +5,0 @@ type MessageProps = ({

package.json

 {
   "name": "@postenbring/hedwig-react",
-  "version": "0.0.0-improve-typed-classname-20231126142550",
+  "version": "0.0.0-improve-typed-classname-20231127094705",
   "main": "./dist/index.js",
@@ -18,8 +18,8 @@ "module": "./dist/index.mjs",
     "typescript": "^5.2.2",
-    "eslint-config-custom": "0.0.0-improve-typed-classname-20231126142550",
+    "eslint-config-custom": "0.0.0-improve-typed-classname-20231127094705",
     "hedwig-tsconfig": "0.0.0"
   },
   "dependencies": {
-    "@postenbring/hedwig-css": "0.0.0-improve-typed-classname-20231126142550",
-    "@postenbring/hedwig-tokens": "0.0.0-improve-typed-classname-20231126142550"
+    "@postenbring/hedwig-css": "0.0.0-improve-typed-classname-20231127094705",
+    "@postenbring/hedwig-tokens": "0.0.0-improve-typed-classname-20231127094705"
   },
@@ -26,0 +26,0 @@ "publishConfig": {

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

163709

increased by38.31%

Number of package files

108

increased by31.71%

Lines of code

4246

increased by34.49%

Dependency changes

• + Added@postenbring/hedwig-css@0.0.0-improve-typed-classname-20231127094705(transitive)

• + Added@postenbring/hedwig-tokens@0.0.0-improve-typed-classname-20231127094705(transitive)

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

• - Removed@postenbring/hedwig-css@0.0.0-improve-typed-classname-20231126142550(transitive)

• - Removed@postenbring/hedwig-tokens@0.0.0-improve-typed-classname-20231126142550(transitive)

• Updated@postenbring/hedwig-css@0.0.0-improve-typed-classname-20231127094705

• Updated@postenbring/hedwig-tokens@0.0.0-improve-typed-classname-20231127094705