@crystaldesign/content-item 26.8.0-beta.8 → 26.9.0-beta.1

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 (4) hide show
  1. package/build/esm/index.js +18 -5
  2. package/build/types/content-item/src/Components/Gallery/index.d.ts.map +1 -1
  3. package/build/types/content-item/src/Components/QuickConfig/index.d.ts.map +1 -1
  4. package/package.json +3 -3
package/build/esm/index.js CHANGED
@@ -651,9 +651,10 @@ styleInject(css_248z$4);
651
651
 
652
652
  var fullscreenWrapper = "fullscreen-wrapper-TiWjP";
653
653
  var fullscreenButton = "fullscreen-button-unFbw";
654
+ var fullscreenClose = "fullscreen-close--uM2v";
654
655
  var mySwiper2 = "mySwiper2-mfrK1";
655
656
  var mySwiper = "mySwiper-urn8y";
656
- var css_248z$3 = "#diva-content-item .swiper {\n width: 100%;\n height: 100%;\n}\n#diva-content-item .swiper-slide {\n text-align: center;\n font-size: 18px;\n background: #fff;\n\n /* Center slide text vertically */\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.fullscreen-wrapper-TiWjP {\n display: flex;\n justify-content: center;\n align-items: center;\n background: #fff;\n position: relative;\n height: 100%;\n width: 100%;\n z-index: 2000005;\n}\n\n.fullscreen-button-unFbw {\n cursor: pointer;\n position: absolute;\n width: 20px;\n height: 20px;\n top: 16px;\n right: 8px;\n border-radius: 3px;\n z-index: 1000;\n background: center / 75% no-repeat rgba(255,255,255,0.53333) url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M12 1H2C1.44772 1 1 1.44772 1 2V22C1 22.5523 1.44772 23 2 23H21.9999C22.5522 23 22.9999 22.5523 22.9999 22V12M16.0078 1H21.9989C22.5512 1 22.9989 1.44772 22.9989 2V7.99114M22.5002 1.5L13.3195 10.68%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.mobile #diva-content-item .swiper-slide {\n background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;\n background: initial;\n}\n\n#diva-content-item .swiper {\n width: 100%;\n height: 350px;\n margin-left: auto;\n margin-right: auto;\n}\n\n.in-gallery-in-fullscreen #DivaContentItemGallery {\n height: 90% !important;\n width: 90% !important;\n}\n\n.in-gallery-in-fullscreen #diva-content-item .mySwiper2-mfrK1 {\n height: 100%;\n}\n\n#diva-content-item .swiper-slide {\n background-size: cover;\n background-position: center;\n}\n#diva-content-item .mySwiper2-mfrK1 {\n height: 80%;\n width: 100%;\n}\n#diva-content-item .mySwiper-urn8y {\n height: 20%;\n box-sizing: border-box;\n padding: 10px 0;\n}\n#diva-content-item .mySwiper-urn8y .swiper-slide {\n width: 25%;\n height: 100%;\n opacity: 0.4;\n}\n#diva-content-item .mySwiper-urn8y .swiper-slide-thumb-active {\n opacity: 1;\n}\n";
657
+ var css_248z$3 = "#diva-content-item .swiper {\n width: 100%;\n height: 100%;\n}\n#diva-content-item .swiper-slide {\n text-align: center;\n font-size: 18px;\n background: #fff;\n\n /* Center slide text vertically */\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.fullscreen-wrapper-TiWjP {\n display: flex;\n justify-content: center;\n align-items: center;\n background: #fff;\n position: relative;\n height: 100%;\n width: 100%;\n z-index: 2000005;\n}\n\n.fullscreen-button-unFbw {\n cursor: pointer;\n position: absolute;\n width: 20px;\n height: 20px;\n top: 16px;\n right: 8px;\n border-radius: 3px;\n z-index: 1000;\n background: center / 75% no-repeat rgba(255,255,255,0.53333) url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M12 1H2C1.44772 1 1 1.44772 1 2V22C1 22.5523 1.44772 23 2 23H21.9999C22.5522 23 22.9999 22.5523 22.9999 22V12M16.0078 1H21.9989C22.5512 1 22.9989 1.44772 22.9989 2V7.99114M22.5002 1.5L13.3195 10.68%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n/* Matches the content-item header close button (grey cross, circle, border on hover) */\n.fullscreen-close--uM2v {\n position: absolute;\n top: 24px;\n right: 24px;\n width: 32px;\n height: 32px;\n z-index: 2000010;\n cursor: pointer;\n border: 1px solid transparent;\n border-radius: 50%;\n background: center / 70% no-repeat url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2248%22 viewBox%3D%220 -960 960 960%22 width%3D%2248%22 fill%3D%22%23ccc%22%3E%3Cpath d%3D%22m249-207-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z%22%2F%3E%3C%2Fsvg%3E\");\n transition:\n border-color 0.2s ease-in,\n background-image 0.2s ease-in;\n}\n\n.fullscreen-close--uM2v:hover {\n border-color: #aaa;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2248%22 viewBox%3D%220 -960 960 960%22 width%3D%2248%22 fill%3D%22%23aaa%22%3E%3Cpath d%3D%22m249-207-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.mobile #diva-content-item .swiper-slide {\n background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;\n background: initial;\n}\n\n#diva-content-item .swiper {\n width: 100%;\n height: 350px;\n margin-left: auto;\n margin-right: auto;\n}\n\n.in-gallery-in-fullscreen #DivaContentItemGallery {\n height: 90% !important;\n width: 90% !important;\n}\n\n.in-gallery-in-fullscreen #diva-content-item .mySwiper2-mfrK1 {\n height: 100%;\n}\n\n#diva-content-item .swiper-slide {\n background-size: cover;\n background-position: center;\n}\n#diva-content-item .mySwiper2-mfrK1 {\n height: 80%;\n width: 100%;\n}\n#diva-content-item .mySwiper-urn8y {\n height: 20%;\n box-sizing: border-box;\n padding: 10px 0;\n}\n#diva-content-item .mySwiper-urn8y .swiper-slide {\n width: 25%;\n height: 100%;\n opacity: 0.4;\n}\n#diva-content-item .mySwiper-urn8y .swiper-slide-thumb-active {\n opacity: 1;\n}\n";
657
658
  styleInject(css_248z$3);
658
659
 
659
660
  function ownKeys(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; }
@@ -674,7 +675,9 @@ var _Gallery = function Gallery(_ref) {
674
675
  swiper = _useState4[0],
675
676
  setSwiper = _useState4[1];
676
677
  var _useDivaCore = useDivaCore(),
677
- openFullscreen = _useDivaCore.actions.openFullscreen;
678
+ _useDivaCore$actions = _useDivaCore.actions,
679
+ openFullscreen = _useDivaCore$actions.openFullscreen,
680
+ closeFullscreen = _useDivaCore$actions.closeFullscreen;
678
681
  if (content.length == 0) return /*#__PURE__*/jsx(Fragment, {});
679
682
  if (content.length == 1) return /*#__PURE__*/jsx(ContentItem, {
680
683
  item: _objectSpread(_objectSpread({}, content[0]), {
@@ -685,10 +688,14 @@ var _Gallery = function Gallery(_ref) {
685
688
  openFullscreen({
686
689
  absoluteFullscreen: true,
687
690
  overwrittenZIndex: 3000000,
691
+ hideClose: true,
688
692
  content: /*#__PURE__*/jsxs("div", {
689
693
  id: "diva-content-item",
690
694
  className: classNames(fullscreenWrapper, 'in-gallery-in-fullscreen'),
691
- children: [/*#__PURE__*/jsx(_Gallery, {
695
+ children: [/*#__PURE__*/jsx("div", {
696
+ className: fullscreenClose,
697
+ onClick: closeFullscreen
698
+ }), /*#__PURE__*/jsx(_Gallery, {
692
699
  item: {
693
700
  content: content,
694
701
  wrappingStyle: wrappingStyle,
@@ -696,7 +703,7 @@ var _Gallery = function Gallery(_ref) {
696
703
  initIndex: swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex
697
704
  },
698
705
  inFullscreen: true
699
- }), ","]
706
+ })]
700
707
  })
701
708
  });
702
709
  };
@@ -812,7 +819,8 @@ var QuickConfigWrapper = function QuickConfigWrapper(_ref) {
812
819
  var item = _ref.item,
813
820
  params = _ref.params;
814
821
  var _useContentItem = useContentItem(),
815
- onEvent = _useContentItem.onEvent;
822
+ onEvent = _useContentItem.onEvent,
823
+ navigateTo = _useContentItem.navigateTo;
816
824
  return /*#__PURE__*/jsx(QuickConfig, {
817
825
  config: item.config,
818
826
  initialContext: params === null || params === void 0 ? void 0 : params.initialContext,
@@ -821,6 +829,11 @@ var QuickConfigWrapper = function QuickConfigWrapper(_ref) {
821
829
  contentItemId: id
822
830
  });
823
831
  },
832
+ onOpenContentItem: function onOpenContentItem(id) {
833
+ return navigateTo({
834
+ id: id
835
+ });
836
+ },
824
837
  onEvent: onEvent
825
838
  });
826
839
  };
package/build/types/content-item/src/Components/Gallery/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/Gallery/index.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AACtB,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAQ1C,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,WAAW,CAAA;CAAE,CAAC;AAEnC,QAAA,MAAM,OAAO,qFAAsF,KAAK,GAAG;IAAE,YAAY,CAAC,EAAE,OAAO,CAAA;CAAE,sBAgEpI,CAAC;AAEF,eAAe,OAAO,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/Gallery/index.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AACtB,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAQ1C,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,WAAW,CAAA;CAAE,CAAC;AAEnC,QAAA,MAAM,OAAO,qFAAsF,KAAK,GAAG;IAAE,YAAY,CAAC,EAAE,OAAO,CAAA;CAAE,sBAkEpI,CAAC;AAEF,eAAe,OAAO,CAAC"}
package/build/types/content-item/src/Components/QuickConfig/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/QuickConfig/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAI9C,UAAU,KAAK;IACb,IAAI,EAAE,eAAe,CAAC;IACtB,MAAM,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;CACjC;AAED,QAAA,MAAM,kBAAkB,qBAAsB,KAAK,sBAUlD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Components/QuickConfig/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAI9C,UAAU,KAAK;IACb,IAAI,EAAE,eAAe,CAAC;IACtB,MAAM,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;CACjC;AAED,QAAA,MAAM,kBAAkB,qBAAsB,KAAK,sBAWlD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@crystaldesign/content-item",
3
- "version": "26.8.0-beta.8",
3
+ "version": "26.9.0-beta.1",
4
4
  "license": "MIT",
5
5
  "scripts": {
6
6
  "storybook": "storybook dev -p 6006",
@@ -24,7 +24,7 @@
24
24
  "webpack": "^5.73.0"
25
25
  },
26
26
  "dependencies": {
27
- "@crystaldesign/quick-config": "26.8.0-beta.8",
27
+ "@crystaldesign/quick-config": "26.9.0-beta.1",
28
28
  "classnames": "^2.5.1",
29
29
  "swiper": "^12.1.2"
30
30
  },
@@ -35,5 +35,5 @@
35
35
  },
36
36
  "module": "build/esm/index.js",
37
37
  "types": "./build/types/content-item/src/index.d.ts",
38
- "gitHead": "8169b3514f0731ff31b085c1f844c4baa0645895"
38
+ "gitHead": "cce645449fa737e382514cb332e8afeed7627eed"
39
39
  }