@postenbring/hedwig-react
Advanced tools
Comparing version 0.0.4 to 0.0.5
import * as react_jsx_runtime from 'react/jsx-runtime'; | ||
import * as React from 'react'; | ||
interface BadgeProps extends Omit<React.AnchorHTMLAttributes<HTMLSpanElement>, "className" | "style"> { | ||
interface BadgeProps extends React.AnchorHTMLAttributes<HTMLSpanElement> { | ||
/** | ||
@@ -28,2 +28,2 @@ * Font size of the badge | ||
export { Badge, BadgeProps, DarkBadge, WarningBadge, WhiteBadge }; | ||
export { Badge, type BadgeProps, DarkBadge, WarningBadge, WhiteBadge }; |
@@ -60,14 +60,2 @@ "use strict"; | ||
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
// src/utils.ts | ||
function warnForStyleOverrides(props) { | ||
if (props.className) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
if (props.styles) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
} | ||
// src/badge/badge.tsx | ||
var import_jsx_runtime = require("react/jsx-runtime"); | ||
@@ -84,4 +72,10 @@ function BaseBadge(_a) { | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_clsx.clsx)((0, import_typed_classname.t)("hds-badge"), (0, import_typed_classname.t)(`hds-badge--${size}`), (0, import_typed_classname.t)(`hds-badge--${variant}`)), children }); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( | ||
"span", | ||
__spreadProps(__spreadValues({ | ||
className: (0, import_clsx.clsx)((0, import_typed_classname.t)("hds-badge"), (0, import_typed_classname.t)(`hds-badge--${size}`), (0, import_typed_classname.t)(`hds-badge--${variant}`)) | ||
}, rest), { | ||
children | ||
}) | ||
); | ||
} | ||
@@ -88,0 +82,0 @@ BaseBadge.displayName = "BaseBadge"; |
@@ -58,5 +58,6 @@ "use strict"; | ||
module.exports = __toCommonJS(badge_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"); | ||
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"); | ||
@@ -66,14 +67,2 @@ // src/badge/badge.tsx | ||
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
// src/utils.ts | ||
function warnForStyleOverrides(props) { | ||
if (props.className) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
if (props.styles) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
} | ||
// src/badge/badge.tsx | ||
var import_jsx_runtime = require("react/jsx-runtime"); | ||
@@ -90,4 +79,10 @@ function BaseBadge(_a) { | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_clsx.clsx)((0, import_typed_classname.t)("hds-badge"), (0, import_typed_classname.t)(`hds-badge--${size}`), (0, import_typed_classname.t)(`hds-badge--${variant}`)), children }); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( | ||
"span", | ||
__spreadProps(__spreadValues({ | ||
className: (0, import_clsx.clsx)((0, import_typed_classname.t)("hds-badge"), (0, import_typed_classname.t)(`hds-badge--${size}`), (0, import_typed_classname.t)(`hds-badge--${variant}`)) | ||
}, rest), { | ||
children | ||
}) | ||
); | ||
} | ||
@@ -94,0 +89,0 @@ BaseBadge.displayName = "BaseBadge"; |
import * as react_jsx_runtime from 'react/jsx-runtime'; | ||
import * as React from 'react'; | ||
interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "className" | "style"> { | ||
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> { | ||
/** | ||
@@ -37,2 +37,2 @@ * The height, font size and padding of the button | ||
export { ButtonProps, PrimaryButton, SecondaryButton }; | ||
export { type ButtonProps, PrimaryButton, SecondaryButton }; |
@@ -58,14 +58,2 @@ "use strict"; | ||
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
// src/utils.ts | ||
function warnForStyleOverrides(props) { | ||
if (props.className) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
if (props.styles) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
} | ||
// src/button/button.tsx | ||
var import_jsx_runtime = require("react/jsx-runtime"); | ||
@@ -88,3 +76,2 @@ function BaseButton(_a) { | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( | ||
@@ -91,0 +78,0 @@ "button", |
@@ -56,5 +56,6 @@ "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"); | ||
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"); | ||
@@ -64,14 +65,2 @@ // src/button/button.tsx | ||
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
// src/utils.ts | ||
function warnForStyleOverrides(props) { | ||
if (props.className) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
if (props.styles) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
} | ||
// src/button/button.tsx | ||
var import_jsx_runtime = require("react/jsx-runtime"); | ||
@@ -94,3 +83,2 @@ function BaseButton(_a) { | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( | ||
@@ -97,0 +85,0 @@ "button", |
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 { ListProps, OrderedList, UnorderedList } from './list/list.js'; | ||
export { LinkList, LinkListProps } from './list/link-list.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'; |
@@ -52,7 +52,20 @@ "use strict"; | ||
__export(src_exports, { | ||
Accordion: () => Accordion, | ||
AccordionContent: () => AccordionContent, | ||
AccordionItem: () => AccordionItem, | ||
AccordionTrigger: () => AccordionTrigger, | ||
Badge: () => Badge, | ||
Box: () => Box, | ||
BoxCloseButton: () => BoxCloseButton, | ||
DarkBadge: () => DarkBadge, | ||
DescriptionDetails: () => DescriptionDetails, | ||
DescriptionList: () => DescriptionList, | ||
DescriptionTerm: () => DescriptionTerm, | ||
Link: () => Link, | ||
LinkList: () => LinkList, | ||
Message: () => Message, | ||
OrderedList: () => OrderedList, | ||
PrimaryButton: () => PrimaryButton, | ||
SecondaryButton: () => SecondaryButton, | ||
UnorderedList: () => UnorderedList, | ||
WarningBadge: () => WarningBadge, | ||
@@ -63,17 +76,11 @@ WhiteBadge: () => WhiteBadge | ||
// src/button/index.tsx | ||
var import_fonts = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css"); | ||
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.css"); | ||
// src/button/button.tsx | ||
var import_clsx = require("clsx"); | ||
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
// src/utils.ts | ||
function warnForStyleOverrides(props) { | ||
if (props.className) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
if (props.styles) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
} | ||
// src/button/button.tsx | ||
var import_jsx_runtime = require("react/jsx-runtime"); | ||
@@ -96,3 +103,2 @@ function BaseButton(_a) { | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( | ||
@@ -123,2 +129,8 @@ "button", | ||
// src/link/index.tsx | ||
var import_fonts2 = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css"); | ||
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.css"); | ||
// src/link/link.tsx | ||
@@ -140,3 +152,2 @@ var import_clsx2 = require("clsx"); | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)( | ||
@@ -158,2 +169,8 @@ "a", | ||
// src/badge/index.tsx | ||
var import_fonts3 = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css"); | ||
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.css"); | ||
// src/badge/badge.tsx | ||
@@ -173,4 +190,10 @@ var import_clsx3 = require("clsx"); | ||
]); | ||
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 | ||
}) | ||
); | ||
} | ||
@@ -194,11 +217,367 @@ BaseBadge.displayName = "BaseBadge"; | ||
WarningBadge.displayName = "WarningBadge"; | ||
// src/list/index.tsx | ||
var import_fonts4 = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css"); | ||
var import_tokens4 = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css"); | ||
var import_base4 = require("@postenbring/hedwig-css/dist/base.css"); | ||
var import_description_list = require("@postenbring/hedwig-css/dist/description-list.css"); | ||
var import_list2 = require("@postenbring/hedwig-css/dist/list.css"); | ||
// 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"]); | ||
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", __spreadProps(__spreadValues({}, rest), { children })); | ||
} | ||
function DescriptionTerm(_a) { | ||
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]); | ||
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"]); | ||
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" | ||
]); | ||
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 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 })); | ||
} | ||
BaseList.displayName = "BaseList"; | ||
OrderedList.displayName = "UnorderedList"; | ||
UnorderedList.displayName = "UnorderedList"; | ||
// src/list/link-list.tsx | ||
var import_jsx_runtime6 = require("react/jsx-runtime"); | ||
function LinkList(props) { | ||
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(UnorderedList, __spreadProps(__spreadValues({ listStyle: "no-bullets" }, props), { children: props.children })); | ||
} | ||
LinkList.displayName = "LinkList"; | ||
// src/box/index.tsx | ||
var import_fonts5 = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css"); | ||
var import_tokens5 = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css"); | ||
var import_base5 = require("@postenbring/hedwig-css/dist/base.css"); | ||
var import_box = require("@postenbring/hedwig-css/dist/box.css"); | ||
// 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_runtime7 = 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, | ||
className | ||
} = _b, rest = __objRest(_b, [ | ||
"as", | ||
"variant", | ||
"hideCloseButton", | ||
"onClose", | ||
"closed", | ||
"closeButtonProps", | ||
"children", | ||
"className" | ||
]); | ||
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_runtime7.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 }, | ||
className | ||
), | ||
ref | ||
}, rest), { | ||
children: [ | ||
!hideCloseButton && /* @__PURE__ */ (0, import_jsx_runtime7.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_runtime7.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"; | ||
// src/message/index.tsx | ||
var import_fonts6 = require("@postenbring/hedwig-tokens/tokens-output/css/fonts.css"); | ||
var import_tokens6 = require("@postenbring/hedwig-tokens/tokens-output/css/tokens.css"); | ||
var import_base6 = require("@postenbring/hedwig-css/dist/base.css"); | ||
var import_box3 = require("@postenbring/hedwig-css/dist/box.css"); | ||
var import_message = require("@postenbring/hedwig-css/dist/message.css"); | ||
// src/message/message.tsx | ||
var import_react2 = require("react"); | ||
var import_clsx7 = require("clsx"); | ||
var import_typed_classname7 = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
var import_jsx_runtime8 = require("react/jsx-runtime"); | ||
var Message = (0, import_react2.forwardRef)( | ||
(_a, ref) => { | ||
var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]); | ||
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)( | ||
Box, | ||
__spreadProps(__spreadValues({ | ||
className: (0, import_clsx7.clsx)((0, import_typed_classname7.t)(`hds-message`), (0, import_typed_classname7.t)(`hds-message--${variant}`), className), | ||
ref | ||
}, rest), { | ||
children: [ | ||
variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: (0, import_clsx7.clsx)((0, import_typed_classname7.t)("hds-message--neutral__icon"), iconClassName), children: icon }), | ||
children | ||
] | ||
}) | ||
); | ||
} | ||
); | ||
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_clsx8 = require("clsx"); | ||
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_clsx8.clsx)((0, import_typed_classname8.t)("hds-accordion"), className), ref, children })) }); | ||
} | ||
); | ||
Accordion.displayName = "Accordion"; | ||
// src/accordion/accordion-item.tsx | ||
var import_react5 = require("react"); | ||
var import_clsx9 = require("clsx"); | ||
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_clsx9.clsx)( | ||
(0, import_typed_classname9.t)("hds-accordion-item"), | ||
{ | ||
[(0, import_typed_classname9.t)(`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_clsx10 = require("clsx"); | ||
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_clsx10.clsx)((0, import_typed_classname10.t)("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_clsx10.clsx)((0, import_typed_classname10.t)("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_clsx11 = require("clsx"); | ||
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_clsx11.clsx)( | ||
(0, import_typed_classname11.t)("hds-accordion-item-content"), | ||
{ | ||
[(0, import_typed_classname11.t)(`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, | ||
Box, | ||
BoxCloseButton, | ||
DarkBadge, | ||
DescriptionDetails, | ||
DescriptionList, | ||
DescriptionTerm, | ||
Link, | ||
LinkList, | ||
Message, | ||
OrderedList, | ||
PrimaryButton, | ||
SecondaryButton, | ||
UnorderedList, | ||
WarningBadge, | ||
WhiteBadge | ||
}); |
@@ -55,5 +55,6 @@ "use strict"; | ||
module.exports = __toCommonJS(link_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"); | ||
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"); | ||
@@ -63,14 +64,2 @@ // src/link/link.tsx | ||
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
// src/utils.ts | ||
function warnForStyleOverrides(props) { | ||
if (props.className) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
if (props.styles) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
} | ||
// src/link/link.tsx | ||
var import_jsx_runtime = require("react/jsx-runtime"); | ||
@@ -89,3 +78,2 @@ function Link(_a) { | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( | ||
@@ -92,0 +80,0 @@ "a", |
import * as react_jsx_runtime from 'react/jsx-runtime'; | ||
import * as React from 'react'; | ||
interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "className" | "style"> { | ||
interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> { | ||
/** | ||
@@ -26,2 +26,2 @@ * The visual style of the link | ||
export { Link, LinkProps }; | ||
export { Link, type LinkProps }; |
@@ -57,14 +57,2 @@ "use strict"; | ||
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname/index.mjs"); | ||
// src/utils.ts | ||
function warnForStyleOverrides(props) { | ||
if (props.className) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
if (props.styles) { | ||
console.warn("Overriding styles are not premited"); | ||
} | ||
} | ||
// src/link/link.tsx | ||
var import_jsx_runtime = require("react/jsx-runtime"); | ||
@@ -83,3 +71,2 @@ function Link(_a) { | ||
]); | ||
warnForStyleOverrides(rest); | ||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( | ||
@@ -86,0 +73,0 @@ "a", |
{ | ||
"name": "@postenbring/hedwig-react", | ||
"version": "0.0.4", | ||
"version": "0.0.5", | ||
"main": "./dist/index.js", | ||
"module": "./dist/index.mjs", | ||
"types": "./dist/index.d.ts", | ||
"sideEffects": false, | ||
"sideEffects": true, | ||
"license": "MIT", | ||
@@ -12,26 +12,26 @@ "files": [ | ||
], | ||
"scripts": { | ||
"build": "tsup --format esm,cjs --dts --external react", | ||
"dev": "tsup --format esm,cjs --watch --dts --external react", | ||
"lint": "eslint src/", | ||
"typecheck": "tsc --noEmit", | ||
"clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist" | ||
}, | ||
"devDependencies": { | ||
"@types/react": "^18.2.37", | ||
"@types/react-dom": "^18.2.15", | ||
"eslint-config-custom": "*", | ||
"hedwig-tsconfig": "*", | ||
"react": "^18.2.0", | ||
"tsup": "^7.2.0", | ||
"typescript": "^5.2.2" | ||
"tsup": "^8.0.1", | ||
"typescript": "^5.2.2", | ||
"eslint-config-custom": "0.0.1", | ||
"hedwig-tsconfig": "0.0.0" | ||
}, | ||
"dependencies": { | ||
"@postenbring/hedwig-css": "*", | ||
"@postenbring/hedwig-tokens": "*", | ||
"clsx": "^2.0.0" | ||
"clsx": "^2.0.0", | ||
"@postenbring/hedwig-css": "0.0.5", | ||
"@postenbring/hedwig-tokens": "0.0.3" | ||
}, | ||
"publishConfig": { | ||
"access": "public" | ||
}, | ||
"scripts": { | ||
"build": "tsup --format esm,cjs --dts --external react", | ||
"dev": "tsup --format esm,cjs --watch --dts --external react", | ||
"lint": "eslint src/", | ||
"typecheck": "tsc --noEmit", | ||
"clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist" | ||
} | ||
} | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis 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 riskPackage 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
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Wildcard dependency
QualityPackage has a dependency with a floating version range. This can cause issues if the dependency publishes a new major version.
Found 2 instances in 1 package
Major refactor
Supply chain riskPackage 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
165990
108
4138
2
23
407
+ Added@postenbring/hedwig-css@0.0.5(transitive)
+ Added@postenbring/hedwig-tokens@0.0.3(transitive)
- Removed@postenbring/hedwig-css@1.4.0(transitive)
- Removed@postenbring/hedwig-tokens@1.1.0(transitive)