@jetbrains/kotlin-web-site-ui 4.4.7 → 4.5.0-alpha.1

package/out/components/quotes-slider/index.css

@@ -21,6 +21,15 @@
 }
     }
 
+.ktl-quotes-slider-module_icon-container-dark-theme_YwVUC svg > path {
+            fill: #ffffff;
+        }
+
+.ktl-quotes-slider-module_quote-text_u-x9D {
+    word-break: break-word;
+    margin: 0;
+}
+
 .ktl-quotes-slider-module_nav_0aZMC {
     margin-top: 16px;
 }
@@ -35,10 +44,6 @@
 }
     }
 
-.ktl-quotes-slider-module_title_wOsKl p {
-        color: var(--ktl-icon-color-dark);
-    }
-
 .ktl-quotes-slider-module_controls_OuyQ8 {
     display: flex;
     align-items: center;
@@ -68,10 +73,6 @@
         opacity: 1;
     }
 
-.ktl-quotes-slider-module_control-prev_9eMAN {
-    transform: scale(-1);
-}
-
 .ktl-quotes-slider-module_slides-count_T0-Ln {
     margin: 0 30px;
     -webkit-user-select: none;
@@ -80,7 +81,3 @@
     min-width: 40px;
     text-align: center;
 }
-
-.ktl-quotes-slider-module_slides-count_T0-Ln p {
-        color: var(--ktl-icon-color-dark);
-    }

package/out/components/quotes-slider/index.js

@@ -1,3 +1,3 @@
 import './index.css';
-import { QuotesSlider } from './quites-slider.js';
-export { QuotesSlider as default } from './quites-slider.js';
+import { QuotesSlider } from './quotes-slider.js';
+export { QuotesSlider as default } from './quotes-slider.js';

package/out/components/quotes-slider/{quites-slider.js → quotes-slider.js}

@@ -1,8 +1,10 @@
 import React__default, { useState, useCallback } from 'react';
 import SwipeableViews from 'react-swipeable-views';
+import { ArrowLeftIcon, ArrowRightIcon } from '@rescui/icons';
+import { useTheme } from '@rescui/ui-contexts';
+import { useTextStyles } from '@rescui/typography';
 import cn from 'classnames';
 import SvgQuote from './quote.svg.js';
-import SvgSliderArrow from './slider-arrow.svg.js';
 import styles from './quotes-slider.module.pcss.js';
 
 const QuotesSlider = ({
@@ -31,40 +33,50 @@ const QuotesSlider = ({
   const nextButtonClass = cn(styles.control, {
     [styles.controlActive]: index + 1 < totalSlides
   });
-  const quoteTextClass = large ? 'ktl-subtitle' : 'ktl-text-1';
+  const textCn = useTextStyles();
+  const theme = useTheme();
+  const quoteTextClass = large ? textCn('rs-subtitle-2') : textCn('rs-text-1');
   return React__default.createElement("div", {
-    className: styles.quotesSlider
+    className: cn(styles.quotesSlider, {
+      [styles.quotesSliderDarkTheme]: theme === 'dark'
+    })
   }, React__default.createElement("div", {
     className: styles.content
   }, React__default.createElement("div", {
-    className: styles.iconContainer
+    className: cn(styles.iconContainer, {
+      [styles.iconContainerDarkTheme]: theme === 'dark'
+    })
   }, React__default.createElement(SvgQuote, null)), React__default.createElement("div", null, quotes.length > 1 ? React__default.createElement(SwipeableViews, {
     index: index,
     onChangeIndex: handleChangeIndex
   }, quotes.map((quote, i) => React__default.createElement("p", {
-    className: quoteTextClass,
+    className: cn(quoteTextClass, styles.quoteText),
     key: i
   }, quote.text))) : React__default.createElement("p", {
-    className: quoteTextClass
+    className: cn(quoteTextClass, styles.quoteText)
   }, quotes[0].text), React__default.createElement("div", {
     className: styles.nav
   }, React__default.createElement("div", {
     className: styles.title
   }, React__default.createElement("p", {
-    className: "ktl-text-2"
+    className: textCn('rs-text-2')
   }, slideTitle)), quotes.length > 1 && React__default.createElement("div", {
     className: styles.controls
   }, React__default.createElement("div", {
     className: prevButtonClass,
     onClick: handlePrevSlide
-  }, React__default.createElement(SvgSliderArrow, null)), React__default.createElement("div", {
+  }, React__default.createElement(ArrowLeftIcon, {
+    theme: theme
+  })), React__default.createElement("div", {
     className: styles.slidesCount
   }, React__default.createElement("p", {
-    className: "ktl-text-2"
+    className: textCn('rs-text-2')
   }, index + 1, "/", totalSlides)), React__default.createElement("div", {
     className: nextButtonClass,
     onClick: handleNextSlide
-  }, React__default.createElement(SvgSliderArrow, null)))))));
+  }, React__default.createElement(ArrowRightIcon, {
+    theme: theme
+  })))))));
 };
 
 export { QuotesSlider };

package/out/components/quotes-slider/quotes-slider.module.pcss.js

@@ -2,12 +2,12 @@ var styles = {
   "quotesSlider": "ktl-quotes-slider-module_quotes-slider_y2xdf",
   "content": "ktl-quotes-slider-module_content_ycgWG",
   "iconContainer": "ktl-quotes-slider-module_icon-container_tRSxF",
+  "iconContainerDarkTheme": "ktl-quotes-slider-module_icon-container-dark-theme_YwVUC",
+  "quoteText": "ktl-quotes-slider-module_quote-text_u-x9D",
   "nav": "ktl-quotes-slider-module_nav_0aZMC",
-  "title": "ktl-quotes-slider-module_title_wOsKl",
   "controls": "ktl-quotes-slider-module_controls_OuyQ8",
   "control": "ktl-quotes-slider-module_control_eN3Tf",
   "controlActive": "ktl-quotes-slider-module_control-active_sE-QK",
-  "controlPrev": "ktl-quotes-slider-module_control-prev_9eMAN",
   "slidesCount": "ktl-quotes-slider-module_slides-count_T0-Ln"
 };
 export { styles as default };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@jetbrains/kotlin-web-site-ui",
   "description": "UI components for Kotlin web sites development",
-  "version": "4.4.7",
+  "version": "4.5.0-alpha.1",
   "license": "Apache-2.0",
   "author": "JetBrains",
   "files": [

package/out/components/quotes-slider/slider-arrow.svg.js

@@ -1,33 +0,0 @@
-import * as React from 'react';
-
-var _path;
-
-function _extends() {
-  _extends = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends.apply(this, arguments);
-}
-
-const SvgSliderArrow = props => /*#__PURE__*/React.createElement("svg", _extends({
-  width: 19,
-  height: 14,
-  fill: "none",
-  xmlns: "http://www.w3.org/2000/svg"
-}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
-  d: "M19 7.1 11 14V8.1H0v-2h11V.3l8 6.8Z",
-  fill: "currentColor"
-})));
-
-export { SvgSliderArrow as default };