@crystaldesign/content-item 25.9.0-beta.2 → 25.9.0-beta.21

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 (7) hide show
  1. package/build/esm/index.js +17 -9
  2. package/build/types/content-item/src/Components/Header/index.d.ts.map +1 -1
  3. package/build/types/content-item/src/Components/Title/index.d.ts +1 -1
  4. package/build/types/content-item/src/Components/Title/index.d.ts.map +1 -1
  5. package/build/types/content-item/src/types.d.ts +1 -0
  6. package/build/types/content-item/src/types.d.ts.map +1 -1
  7. package/package.json +2 -2
package/build/esm/index.js CHANGED
@@ -509,7 +509,7 @@ var paddingLeft = "padding-left-The7U";
509
509
  var headerLeft = "header-left-pbZcL";
510
510
  var backButton = "back-button-2IUJb";
511
511
  var closeButton = "close-button-VW8Z5";
512
- var css_248z$5 = ".header-7dWXW {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 0px 12px;\n width: calc(100% - 24px);\n justify-content: space-between;\n border-bottom: 1px solid lightgray;\n position: relative;\n}\n.padding-left-The7U {\n padding-left: 34px;\n}\n.header-left-pbZcL {\n display: flex;\n align-items: center;\n width: 90%;\n}\n\n.back-button-2IUJb {\n background: none;\n border: none;\n cursor: pointer;\n font-size: 20px;\n color: #666;\n transition:\n color 0.2s ease,\n background-color 0.2s ease;\n border-radius: 50%;\n width: 34px;\n height: 34px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding-bottom: 4px;\n}\n\n.back-button-2IUJb:after {\n content: '←';\n display: block;\n text-align: center;\n}\n\n.back-button-2IUJb:hover,\n.close-button-VW8Z5:hover {\n color: #333;\n background-color: rgba(0, 0, 0, 0.05);\n background-size: 45%;\n}\n.close-button-VW8Z5 {\n width: 36px;\n height: 36px;\n background-repeat: no-repeat;\n border-radius: 50%;\n background-position: center center;\n background-size: 40%;\n background-color: transparent;\n transition:\n background-color 0.2s ease,\n background-size 0.2s ease;\n background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%2210%22 viewBox%3D%220 0 10 10%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1.35355 0.646447C1.15829 0.451184 0.841709 0.451184 0.646447 0.646447C0.451184 0.841709 0.451184 1.15829 0.646447 1.35355L1.35355 0.646447ZM8.64645 9.35355C8.84171 9.54882 9.15829 9.54882 9.35355 9.35355C9.54882 9.15829 9.54882 8.84171 9.35355 8.64645L8.64645 9.35355ZM9.35355 1.35355C9.54882 1.15829 9.54882 0.841709 9.35355 0.646447C9.15829 0.451184 8.84171 0.451184 8.64645 0.646447L9.35355 1.35355ZM0.646447 8.64645C0.451185 8.84171 0.451185 9.15829 0.646447 9.35355C0.841709 9.54881 1.15829 9.54881 1.35355 9.35355L0.646447 8.64645ZM0.646447 1.35355L8.64645 9.35355L9.35355 8.64645L1.35355 0.646447L0.646447 1.35355ZM8.64645 0.646447L0.646447 8.64645L1.35355 9.35355L9.35355 1.35355L8.64645 0.646447Z%22 fill%3D%22%234F4F4F%22%2F%3E%3C%2Fsvg%3E\");\n z-index: 1000;\n border: none;\n padding: 0px;\n cursor: pointer;\n align-self: flex-start;\n margin-top: 10px;\n}\n";
512
+ var css_248z$5 = ".header-7dWXW {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 0px 12px;\n width: calc(100% - 24px);\n justify-content: space-between;\n border-bottom: 1px solid lightgray;\n position: relative;\n}\n.padding-left-The7U {\n padding-left: 34px !important;\n}\n.header-left-pbZcL {\n display: flex;\n align-items: center;\n width: 90%;\n}\n\n.back-button-2IUJb,\n.close-button-VW8Z5 {\n border: none;\n cursor: pointer;\n width: 36px;\n height: 36px;\n transition:\n background-color 0.2s ease,\n background-size 0.2s ease;\n padding: 0px;\n align-self: flex-start;\n margin-top: 10px;\n border-radius: 50%;\n color: #666;\n z-index: 1000;\n}\n\n.back-button-2IUJb {\n background: none;\n font-size: 22px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.back-button-2IUJb:after {\n content: '←';\n display: block;\n text-align: center;\n padding-bottom: 3px;\n}\n\n.back-button-2IUJb:hover,\n.close-button-VW8Z5:hover {\n color: #333;\n background-color: rgba(0, 0, 0, 0.05);\n background-size: 45%;\n}\n.close-button-VW8Z5 {\n background-repeat: no-repeat;\n background-position: center center;\n background-size: 40%;\n background-color: transparent;\n background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%2210%22 viewBox%3D%220 0 10 10%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1.35355 0.646447C1.15829 0.451184 0.841709 0.451184 0.646447 0.646447C0.451184 0.841709 0.451184 1.15829 0.646447 1.35355L1.35355 0.646447ZM8.64645 9.35355C8.84171 9.54882 9.15829 9.54882 9.35355 9.35355C9.54882 9.15829 9.54882 8.84171 9.35355 8.64645L8.64645 9.35355ZM9.35355 1.35355C9.54882 1.15829 9.54882 0.841709 9.35355 0.646447C9.15829 0.451184 8.84171 0.451184 8.64645 0.646447L9.35355 1.35355ZM0.646447 8.64645C0.451185 8.84171 0.451185 9.15829 0.646447 9.35355C0.841709 9.54881 1.15829 9.54881 1.35355 9.35355L0.646447 8.64645ZM0.646447 1.35355L8.64645 9.35355L9.35355 8.64645L1.35355 0.646447L0.646447 1.35355ZM8.64645 0.646447L0.646447 8.64645L1.35355 9.35355L9.35355 1.35355L8.64645 0.646447Z%22 fill%3D%22%234F4F4F%22%2F%3E%3C%2Fsvg%3E\");\n}\n";
513
513
  styleInject(css_248z$5);
514
514
 
515
515
  function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -530,19 +530,26 @@ var Header = function Header(_ref) {
530
530
  return /*#__PURE__*/jsxs("div", {
531
531
  className: classNames(header),
532
532
  children: [/*#__PURE__*/jsxs("div", {
533
- className: classNames(headerLeft, headerClassName, !canGoBack && hasNavigations && paddingLeft),
534
- style: headerWrapperStyle,
533
+ className: classNames(headerLeft),
535
534
  children: [canGoBack && /*#__PURE__*/jsx("button", {
536
535
  className: backButton,
537
536
  onClick: navigateBack,
538
537
  id: "diva-content-item-back-button",
539
538
  "aria-label": "Go back"
540
- }), renderTitle && /*#__PURE__*/jsx(Title, {
539
+ }), renderTitle ? /*#__PURE__*/jsx(Title, {
541
540
  item: _objectSpread$1(_objectSpread$1({}, renderTitle), {}, {
542
- style: _objectSpread$1(_objectSpread$1({}, renderTitle.style), {}, {
541
+ className: classNames(headerClassName, renderTitle.className, !canGoBack && hasNavigations && paddingLeft),
542
+ style: _objectSpread$1(_objectSpread$1({
543
+ flexGrow: 1
544
+ }, renderTitle.style), {}, {
543
545
  borderBottom: 'unset'
544
- })
546
+ }, headerWrapperStyle)
545
547
  })
548
+ }) : /*#__PURE__*/jsx("div", {
549
+ className: classNames(headerClassName, !canGoBack && hasNavigations && paddingLeft),
550
+ style: _objectSpread$1({
551
+ flexGrow: 1
552
+ }, headerWrapperStyle)
546
553
  })]
547
554
  }), onClose && /*#__PURE__*/jsx("button", {
548
555
  className: closeButton,
@@ -592,13 +599,14 @@ function ContentItemContextProvider(_ref) {
592
599
  var Title = function Title(_ref) {
593
600
  var _ref$item = _ref.item,
594
601
  text = _ref$item.text,
595
- style = _ref$item.style;
602
+ style = _ref$item.style,
603
+ className = _ref$item.className;
596
604
  var _useContentItem = useContentItem(),
597
605
  navigateTo = _useContentItem.navigateTo;
598
606
  if (!text) return /*#__PURE__*/jsx(Fragment, {});
599
607
  var processedContent = processContentItemLinks(text, navigateTo);
600
608
  return /*#__PURE__*/jsx("h4", {
601
- className: title,
609
+ className: classNames(title, className),
602
610
  style: style,
603
611
  children: processedContent.content
604
612
  });
@@ -829,7 +837,7 @@ function Loader() {
829
837
  var rootWrapper = "root-wrapper-WNprt";
830
838
  var contentWrapper = "content-wrapper-K5XIs";
831
839
  var loading = "loading-089Ib";
832
- var css_248z = ".root-wrapper-WNprt {\n min-height: 60px;\n position: relative;\n overflow: auto;\n}\n\n.content-wrapper-K5XIs {\n transition: opacity 0.2s ease-in-out;\n}\n.content-wrapper-K5XIs.loading-089Ib {\n opacity: 0.5;\n}\n";
840
+ var css_248z = ".root-wrapper-WNprt {\n min-height: 60px;\n position: relative;\n overflow: auto;\n}\n\n.content-wrapper-K5XIs {\n transition: opacity 0.2s ease-in-out;\n}\n.content-wrapper-K5XIs.loading-089Ib {\n opacity: 0.5;\n}\n\n.content-wrapper-K5XIs .content-item-link {\n touch-action: manipulation;\n color: #1668dc;\n text-decoration: none;\n background-color: transparent;\n outline: none;\n cursor: pointer;\n transition: color 0.2s ease-in-out;\n}\n\n.content-wrapper-K5XIs .content-item-link:hover {\n color: #15417e;\n}\n";
833
841
  styleInject(css_248z);
834
842
 
835
843
  var ContentItems = function ContentItems(_ref) {
package/build/types/content-item/src/Components/Header/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/Header/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,WAAW;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AACD,QAAA,MAAM,MAAM,+DAAgE,WAAW,sBAiBtF,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/Header/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,WAAW;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AACD,QAAA,MAAM,MAAM,+DAAgE,WAAW,sBA2BtF,CAAC;AAEF,eAAe,MAAM,CAAC"}
package/build/types/content-item/src/Components/Title/index.d.ts CHANGED
@@ -3,6 +3,6 @@ import { TitleType } from '../../types';
3
3
  type Props = {
4
4
  item: TitleType;
5
5
  };
6
- declare const Title: ({ item: { text, style } }: Props) => React.JSX.Element;
6
+ declare const Title: ({ item: { text, style, className } }: Props) => React.JSX.Element;
7
7
  export default Title;
8
8
  //# sourceMappingURL=index.d.ts.map
package/build/types/content-item/src/Components/Title/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/Title/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAKxC,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,SAAS,CAAA;CAAE,CAAC;AAEjC,QAAA,MAAM,KAAK,8BAA+B,KAAK,sBAU9C,CAAC;AAEF,eAAe,KAAK,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/Title/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAMxC,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,SAAS,CAAA;CAAE,CAAC;AAEjC,QAAA,MAAM,KAAK,yCAA0C,KAAK,sBAUzD,CAAC;AAEF,eAAe,KAAK,CAAC"}
package/build/types/content-item/src/types.d.ts CHANGED
@@ -23,6 +23,7 @@ export interface TitleType {
23
23
  type: 'Title';
24
24
  style?: React.CSSProperties;
25
25
  text: string;
26
+ className?: string;
26
27
  }
27
28
  export interface WrapperType {
28
29
  type: 'Wrapper';
package/build/types/content-item/src/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,sBAAsB;IACrC,UAAU,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC9C,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,eAAe,EAAE,CAAC;CAC5B;AAED,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,YAAY,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CAAC;AAErH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;CACd;AACD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,EAAE,eAAe,EAAE,CAAC;CAC5B;AACD,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;CACd;AACD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,CAAC,SAAS,GAAG,SAAS,CAAC,EAAE,CAAC;IACnC,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AACD,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AACD,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,KAAK,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC;CACd"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,sBAAsB;IACrC,UAAU,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC9C,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,eAAe,EAAE,CAAC;CAC5B;AAED,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,YAAY,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CAAC;AAErH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AACD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,EAAE,eAAe,EAAE,CAAC;CAC5B;AACD,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;CACd;AACD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,CAAC,SAAS,GAAG,SAAS,CAAC,EAAE,CAAC;IACnC,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACpC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AACD,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AACD,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,KAAK,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC;CACd"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@crystaldesign/content-item",
3
- "version": "25.9.0-beta.2",
3
+ "version": "25.9.0-beta.21",
4
4
  "license": "MIT",
5
5
  "scripts": {
6
6
  "storybook": "storybook dev -p 6006",
@@ -34,5 +34,5 @@
34
34
  },
35
35
  "module": "build/esm/index.js",
36
36
  "types": "./build/types/content-item/src/index.d.ts",
37
- "gitHead": "5bbeef377055646aadcf38f1150972f95a823a81"
37
+ "gitHead": "b191fe7a0df7872fcdc4a7780086a4c5f461bedb"
38
38
  }