@typeolymp/ui-components 2.2.6 → 2.2.7

package/build/components/organisms/Chart/index.d.ts

@@ -4,6 +4,8 @@ import { Period, ExerciseResult } from "./utils";
 declare type BasePropsType = {
     exerciseResults: ExerciseResult[];
     locale: Locale;
+    hideTitle?: boolean;
+    hidePeriod?: boolean;
     defaultPeriod?: Period;
     onChangePeriod?: (period: Period) => void;
 };

package/build/components/organisms/Chart/stories.d.ts

@@ -15,7 +15,10 @@ export declare const Multiple: () => JSX.Element;
 export declare const Playground: {
     (args: any): JSX.Element;
     args: {
+        type: string[];
         locale: Locale;
+        hideTitle: boolean;
+        hidePeriod: boolean;
         exerciseResults: ({
             _id: string;
             student: string;

package/build/index.es.js

@@ -48070,7 +48070,7 @@ var TimeChart = function (_a) {
 };
 
 var Chart = function (_a) {
-    var type = _a.type, locale = _a.locale, exerciseResults = _a.exerciseResults, _b = _a.defaultPeriod, defaultPeriod = _b === void 0 ? Period.TODAY : _b, onChangePeriod = _a.onChangePeriod, nExercisesInCourse = _a.nExercisesInCourse;
+    var type = _a.type, locale = _a.locale, hideTitle = _a.hideTitle, hidePeriod = _a.hidePeriod, exerciseResults = _a.exerciseResults, _b = _a.defaultPeriod, defaultPeriod = _b === void 0 ? Period.TODAY : _b, onChangePeriod = _a.onChangePeriod, nExercisesInCourse = _a.nExercisesInCourse;
     var _c = useState(defaultPeriod), period = _c[0], setPeriod = _c[1];
     useEffect(function () {
         setPeriod(defaultPeriod);
@@ -48107,20 +48107,20 @@ var Chart = function (_a) {
                 return jsx$1(TimeChart, __assign$2({}, props));
         }
     };
-    return (jsxs(Fragment$1, { children: [jsxs("div", __assign$2({ style: {
+    return (jsxs(Fragment$1, { children: [(!hideTitle || !hidePeriod) && (jsxs("div", __assign$2({ style: {
                     display: "flex",
                     gap: 20,
                     alignItems: "baseline",
-                    justifyContent: "space-between",
+                    justifyContent: "flex-end",
                     marginBottom: 10,
                     padding: "0 15px 0 5px",
-                } }, { children: [jsx$1(Heading, __assign$2({ type: "h3" }, { children: titles[type] })), jsx$1(Select, __assign$2({ defaultValue: period, onChange: function (value) {
+                } }, { children: [!hideTitle && (jsx$1("div", __assign$2({ style: { marginRight: "auto" } }, { children: jsx$1(Heading, __assign$2({ type: "h3" }, { children: titles[type] })) }))), !hidePeriod && (jsx$1(Select, __assign$2({ defaultValue: period, onChange: function (value) {
                             setPeriod(value);
                             onChangePeriod(value);
                         }, id: "period", name: "period" }, { children: periods.map(function (_a) {
                             var value = _a.value, label = _a.label;
                             return (jsx$1("option", __assign$2({ value: value }, { children: label }), value));
-                        }) }), period)] })), renderChart()] }));
+                        }) }), period))] }))), renderChart()] }));
 };
 
 var Container$5 = styled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject$1(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex-wrap: wrap;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex-wrap: wrap;\n"])));