@ndlib/component-library 0.0.96 → 0.0.98

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/components/composites/Card/index.js +1 -1
  2. package/dist/components/composites/Modal/index.d.ts +2 -1
  3. package/dist/components/composites/Modal/index.js +4 -4
  4. package/dist/components/composites/NavMenu/index.js +8 -2
  5. package/dist/theme/typography.js +1 -1
  6. package/package.json +1 -1
package/dist/components/composites/Card/index.js CHANGED
@@ -83,7 +83,7 @@ export const Card = ({ size, displayDate, headline, image, layout, onClick, rais
83
83
  } })), displayDate && _jsx(DateDisplay, { date: displayDate }), heading && (_jsxs(Row, Object.assign({ sx: Object.assign({ bg: COLOR.PRIMARY, color: COLOR.WHITE, width: '100%', px: contentPaddingX, py: 3, justifyContent: 'space-between', alignItems: 'center' }, headingStyles) }, { children: [_jsxs(Row, { children: [headingIcon && (_jsx(Icon, { icon: headingIcon, size: FONT_SIZE.LG, color: COLOR.WHITE, sx: { mr: 2 } })), _jsx(Heading, Object.assign({ size: HEADING_SIZE.SM, sx: {
84
84
  color: COLOR.WHITE,
85
85
  whiteSpace: 'nowrap',
86
- } }, { children: heading }))] }), _jsx(Row, { children: headingAction && headingAction })] }))), _jsx(Row, Object.assign({ sx: { px: contentPaddingX, py: contentPaddingY } }, { children: _jsxs(Column, Object.assign({ justify: "center" }, { children: [headline && (_jsx(Heading, Object.assign({ typography: typography }, { children: truncateHeadlineAfter ? (_jsx(ReadMore, Object.assign({ lines: truncateHeadlineAfter, typography: typography, sx: { bg: activeBackground } }, { children: headline }))) : (headline) }))), children && (_jsx(Box, Object.assign({ sx: { mt: headline && !heading ? 2 : 0 } }, { children: typeof children === 'function'
86
+ } }, { children: heading }))] }), _jsx(Row, { children: headingAction && headingAction })] }))), _jsx(Row, Object.assign({ sx: { px: contentPaddingX, py: contentPaddingY } }, { children: _jsxs(Column, Object.assign({ justify: "center" }, { children: [headline && (_jsx(Heading, Object.assign({ typography: typography, sx: { mt: 0 } }, { children: truncateHeadlineAfter ? (_jsx(ReadMore, Object.assign({ lines: truncateHeadlineAfter, typography: typography, sx: { bg: activeBackground } }, { children: headline }))) : (headline) }))), children && (_jsx(Box, Object.assign({ sx: { mt: headline && !heading ? 2 : 0 } }, { children: typeof children === 'function'
87
87
  ? children({ isHovered, activeBackground })
88
88
  : children })))] })) }))] })));
89
89
  };
package/dist/components/composites/Modal/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { StyledElementProps } from '../../../theme';
1
+ import { StyledElementProps, StylesProp } from '../../../theme';
2
2
  import React from 'react';
3
3
  import { ButtonProps } from '../../elements/Button';
4
4
  type ModalProps = StyledElementProps<HTMLDivElement, {
@@ -10,6 +10,7 @@ type ModalProps = StyledElementProps<HTMLDivElement, {
10
10
  footer?: React.ReactNode;
11
11
  actions?: ModalAction[];
12
12
  wrapWithTheme?: boolean;
13
+ bodyStyles?: StylesProp;
13
14
  }>;
14
15
  type ModalAction = {
15
16
  label: string;
package/dist/components/composites/Modal/index.js CHANGED
@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
12
12
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
13
  import _ReactModal from 'react-modal';
14
14
  import { importedDefaultComponentShim } from '../../../utils/misc';
15
- import { ThemeProvider, useTheme } from '../../../theme';
15
+ import { ThemeProvider, useTheme, } from '../../../theme';
16
16
  import { GROUP_TYPE, Group } from '../../elements/Group';
17
17
  import { Row } from '../../elements/layout/Row';
18
18
  import { HEADING_SIZE, Heading } from '../../elements/text/Heading';
@@ -23,7 +23,7 @@ import { useMediaQuery } from '../../providers/media';
23
23
  import { useComponentConfig } from '../../providers/componentConfig';
24
24
  const ReactModal = importedDefaultComponentShim(_ReactModal);
25
25
  export const Modal = (_a) => {
26
- var { children, heading, hideHeading, isOpen, footer, actions, wrapWithTheme, close, zIndex } = _a, props = __rest(_a, ["children", "heading", "hideHeading", "isOpen", "footer", "actions", "wrapWithTheme", "close", "zIndex"]);
26
+ var { children, heading, hideHeading, isOpen, footer, actions, wrapWithTheme, close, zIndex, bodyStyles } = _a, props = __rest(_a, ["children", "heading", "hideHeading", "isOpen", "footer", "actions", "wrapWithTheme", "close", "zIndex", "bodyStyles"]);
27
27
  const { breakpoint } = useMediaQuery();
28
28
  const { modal } = useComponentConfig();
29
29
  const theme = useTheme();
@@ -32,11 +32,11 @@ export const Modal = (_a) => {
32
32
  p: 3,
33
33
  borderBottom: 'solid 1px',
34
34
  borderColor: COLOR.LIGHT_GRAY,
35
- } }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.SM, typography: TYPOGRAPHY_TYPE.CONTROL_MEDIUM }, { children: heading })), _jsx(Button, Object.assign({ type: BUTTON_TYPE.TEXT, onClick: (e) => {
35
+ } }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.SM, typography: TYPOGRAPHY_TYPE.CONTROL_MEDIUM, sx: { mt: 0 } }, { children: heading })), _jsx(Button, Object.assign({ type: BUTTON_TYPE.TEXT, onClick: (e) => {
36
36
  e.preventDefault();
37
37
  e.stopPropagation();
38
38
  close(e);
39
- } }, { children: "Close" }))] }))), _jsx(Row, Object.assign({ sx: { p: 3 } }, { children: children })), shouldShowFooter && (_jsxs(Row, Object.assign({ sx: { borderTop: 'solid 1px', borderColor: COLOR.LIGHT_GRAY, p: 3 } }, { children: [footer, actions !== undefined && (_jsx(Row, Object.assign({ sx: { width: '100%', justifyContent: 'flex-end' } }, { children: actions.map((action, index) => (_jsx(Button, Object.assign({ type: action.isPrimary ? BUTTON_TYPE.DEFAULT : BUTTON_TYPE.OUTLINE, onClick: (e) => {
39
+ } }, { children: "Close" }))] }))), _jsx(Row, Object.assign({ sx: Object.assign({ p: 3 }, bodyStyles) }, { children: children })), shouldShowFooter && (_jsxs(Row, Object.assign({ sx: { borderTop: 'solid 1px', borderColor: COLOR.LIGHT_GRAY, p: 3 } }, { children: [footer, actions !== undefined && (_jsx(Row, Object.assign({ sx: { width: '100%', justifyContent: 'flex-end' } }, { children: actions.map((action, index) => (_jsx(Button, Object.assign({ type: action.isPrimary ? BUTTON_TYPE.DEFAULT : BUTTON_TYPE.OUTLINE, onClick: (e) => {
40
40
  action.onClick(e);
41
41
  }, sx: {
42
42
  mr: index < actions.length - 1 ? 1 : 0,
package/dist/components/composites/NavMenu/index.js CHANGED
@@ -43,10 +43,16 @@ export const NavMenu = (props) => {
43
43
  const submenuPath = [topLevelMenuId, submenuItem.id];
44
44
  const link = '//' + document.location.host + topLevelMenuId;
45
45
  const category = topLevelMenuId.charAt(1).toUpperCase() + topLevelMenuId.slice(2);
46
- return (_jsxs(Column, Object.assign({ sx: { flexBasis: '275px', p: 2, flexShrink: 0, flexGrow: 0 } }, { children: [_jsx(Heading, Object.assign({ standalone: true, size: HEADING_SIZE.SM, underline: true }, getMenuItemProps(submenuPath), { children: submenuItem.label })), _jsx(List, Object.assign({}, getMenuProps(submenuPath), { icon: ChevronRightIcon }, { children: leafMenuItems.map((leafMenuItem, i) => {
46
+ return (_jsxs(Column, Object.assign({ sx: {
47
+ flexBasis: '275px',
48
+ py: 2,
49
+ px: 4,
50
+ flexShrink: 0,
51
+ flexGrow: 0,
52
+ } }, { children: [_jsx(Heading, Object.assign({ standalone: true, size: HEADING_SIZE.SM, underline: true }, getMenuItemProps(submenuPath), { children: submenuItem.label })), _jsx(List, Object.assign({}, getMenuProps(submenuPath), { icon: ChevronRightIcon }, { children: leafMenuItems.map((leafMenuItem, i) => {
47
53
  var _a;
48
54
  const leafMenuPath = submenuPath.concat(leafMenuItem.id);
49
- return (_jsx(ListItem, Object.assign({ index: i, sx: { mt: 1 } }, getMenuItemProps(leafMenuPath), { children: _jsx(Link, Object.assign({ to: (_a = leafMenuItem === null || leafMenuItem === void 0 ? void 0 : leafMenuItem.action) === null || _a === void 0 ? void 0 : _a.to, sx: {
55
+ return (_jsx(ListItem, Object.assign({ index: i, sx: { mt: 2 } }, getMenuItemProps(leafMenuPath), { children: _jsx(Link, Object.assign({ to: (_a = leafMenuItem === null || leafMenuItem === void 0 ? void 0 : leafMenuItem.action) === null || _a === void 0 ? void 0 : _a.to, sx: {
50
56
  fontWeight: FONT_WEIGHT.BOLD,
51
57
  }, tabIndex: -1 }, { children: leafMenuItem.label })) }), leafMenuItem.id));
52
58
  }) })), i < 1 && (link.includes('esearch') || link.includes('ervices')) ? (_jsxs(ArrowLink, Object.assign({ to: link, sx: { margin: '20px 10px 10px 10px' } }, { children: ["View More ", category] }))) : null] }), submenuItem.id));
package/dist/theme/typography.js CHANGED
@@ -42,7 +42,7 @@ export var LINE_HEIGHT;
42
42
  LINE_HEIGHT["CONDENSED"] = "condensed";
43
43
  })(LINE_HEIGHT || (LINE_HEIGHT = {}));
44
44
  export const fontSizeMap = {
45
- [FONT_SIZE.XXS]: '0.675rem',
45
+ [FONT_SIZE.XXS]: '0.5rem',
46
46
  [FONT_SIZE.XS]: '0.75rem',
47
47
  [FONT_SIZE.SM]: '0.875rem',
48
48
  [FONT_SIZE.MS]: '1rem',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ndlib/component-library",
3
- "version": "0.0.96",
3
+ "version": "0.0.98",
4
4
  "type": "module",
5
5
  "sideEffects": false,
6
6
  "files": [