@uxf/cms 6.0.0-beta.8 → 10.0.0-beta.5

package/ui/tw-tokens/tw-containers.js

@@ -0,0 +1,11 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twContainers = void 0;
+exports.twContainers = {
+    xs: "33.75rem",
+    sm: "45rem",
+    md: "58rem",
+    lg: "64rem",
+    xl: "76rem",
+};

package/ui/tw-tokens/tw-font-size.d.ts

@@ -0,0 +1,55 @@
+export declare const twFontSize: {
+    xs: (string | {
+        lineHeight: string;
+    })[];
+    sm: (string | {
+        lineHeight: string;
+    })[];
+    base: (string | {
+        lineHeight: string;
+    })[];
+    lg: (string | {
+        lineHeight: string;
+    })[];
+    xl: (string | {
+        lineHeight: string;
+    })[];
+    "2xl": (string | {
+        lineHeight: string;
+    })[];
+    "3xl": (string | {
+        lineHeight: string;
+    })[];
+    "4xl": (string | {
+        lineHeight: string;
+    })[];
+    "5xl": (string | {
+        lineHeight: string;
+    })[];
+    "6xl": (string | {
+        lineHeight: string;
+    })[];
+    "7xl": (string | {
+        lineHeight: string;
+    })[];
+    "8xl": (string | {
+        lineHeight: string;
+    })[];
+    "9xl": (string | {
+        lineHeight: string;
+    })[];
+    desktopH1: (string | number)[];
+    desktopH2: (string | number)[];
+    desktopH3: (string | number)[];
+    desktopH4: (string | number)[];
+    desktopH5: (string | number)[];
+    desktopH6: (string | number)[];
+    body: (string | number)[];
+    body2: (string | number)[];
+    button: (string | number)[];
+    caption: (string | number)[];
+    medium: (string | number)[];
+    medium2: (string | number)[];
+    overline: (string | number)[];
+};
+export type TwFontSize = typeof twFontSize;

package/ui/tw-tokens/tw-font-size.js

@@ -0,0 +1,32 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twFontSize = void 0;
+exports.twFontSize = {
+    xs: ["0.75rem", { lineHeight: "1rem" }],
+    sm: ["0.875rem", { lineHeight: "1.25rem" }],
+    base: ["1rem", { lineHeight: "1.5rem" }],
+    lg: ["1.125rem", { lineHeight: "1.75rem" }],
+    xl: ["1.25rem", { lineHeight: "1.75rem" }],
+    "2xl": ["1.5rem", { lineHeight: "2rem" }],
+    "3xl": ["1.875rem", { lineHeight: "2.25rem" }],
+    "4xl": ["2.25rem", { lineHeight: "2.5rem" }],
+    "5xl": ["3rem", { lineHeight: "1" }],
+    "6xl": ["3.75rem", { lineHeight: "1" }],
+    "7xl": ["4.5rem", { lineHeight: "1" }],
+    "8xl": ["6rem", { lineHeight: "1" }],
+    "9xl": ["8rem", { lineHeight: "1" }],
+    desktopH1: ["6rem", 1.1666666666666667],
+    desktopH2: ["3.75rem", 1.2],
+    desktopH3: ["3rem", 1.3333333333333333],
+    desktopH4: ["2.125rem", 1.1764705882352942],
+    desktopH5: ["1.5rem", 1.3333333333333333],
+    desktopH6: ["1rem", 1.375],
+    body: ["1rem", 1.5],
+    body2: ["0.875rem", 1.4285714285714286],
+    button: ["1rem", 1.5],
+    caption: ["0.75rem", 1.3333333333333333],
+    medium: ["1rem", 1.5],
+    medium2: ["0.875rem", 1.4285714285714286],
+    overline: ["0.625rem", 1.6],
+};

package/ui/tw-tokens/tw-font-weight.d.ts

@@ -0,0 +1,12 @@
+export declare const twFontWeight: {
+    thin: string;
+    extralight: string;
+    light: string;
+    normal: string;
+    medium: string;
+    semibold: string;
+    bold: string;
+    extrabold: string;
+    black: string;
+};
+export type TwFontWeight = typeof twFontWeight;

package/ui/tw-tokens/tw-font-weight.js

@@ -0,0 +1,15 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twFontWeight = void 0;
+exports.twFontWeight = {
+    thin: "100",
+    extralight: "200",
+    light: "300",
+    normal: "400",
+    medium: "500",
+    semibold: "600",
+    bold: "700",
+    extrabold: "800",
+    black: "900",
+};

package/ui/tw-tokens/tw-line-height.d.ts

@@ -0,0 +1,17 @@
+export declare const twLineHeight: {
+    3: string;
+    4: string;
+    5: string;
+    6: string;
+    7: string;
+    8: string;
+    9: string;
+    10: string;
+    none: string;
+    tight: string;
+    snug: string;
+    normal: string;
+    relaxed: string;
+    loose: string;
+};
+export type TwLineHeight = typeof twLineHeight;

package/ui/tw-tokens/tw-line-height.js

@@ -0,0 +1,20 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twLineHeight = void 0;
+exports.twLineHeight = {
+    3: ".75rem",
+    4: "1rem",
+    5: "1.25rem",
+    6: "1.5rem",
+    7: "1.75rem",
+    8: "2rem",
+    9: "2.25rem",
+    10: "2.5rem",
+    none: "1",
+    tight: "1.25",
+    snug: "1.375",
+    normal: "1.5",
+    relaxed: "1.625",
+    loose: "2",
+};

package/ui/tw-tokens/tw-screens.d.ts

@@ -0,0 +1,8 @@
+export declare const twScreens: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+};
+export type TwScreens = typeof twScreens;

package/ui/tw-tokens/tw-screens.js

@@ -0,0 +1,11 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twScreens = void 0;
+exports.twScreens = {
+    xs: "36em",
+    sm: "48em",
+    md: "62em",
+    lg: "75em",
+    xl: "90em",
+};

package/ui/tw-tokens/tw-spacing.d.ts

@@ -0,0 +1,39 @@
+export declare const twSpacing: {
+    0: string;
+    1: string;
+    2: string;
+    3: string;
+    4: string;
+    5: string;
+    6: string;
+    7: string;
+    8: string;
+    9: string;
+    10: string;
+    11: string;
+    12: string;
+    14: string;
+    16: string;
+    20: string;
+    24: string;
+    28: string;
+    32: string;
+    36: string;
+    40: string;
+    44: string;
+    48: string;
+    52: string;
+    56: string;
+    60: string;
+    64: string;
+    72: string;
+    80: string;
+    96: string;
+    px: string;
+    0.5: string;
+    1.5: string;
+    2.5: string;
+    3.5: string;
+    inherit: string;
+};
+export type TwSpacing = typeof twSpacing;

package/ui/tw-tokens/tw-spacing.js

@@ -0,0 +1,42 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twSpacing = void 0;
+exports.twSpacing = {
+    0: "0px",
+    1: "0.25rem",
+    2: "0.5rem",
+    3: "0.75rem",
+    4: "1rem",
+    5: "1.25rem",
+    6: "1.5rem",
+    7: "1.75rem",
+    8: "2rem",
+    9: "2.25rem",
+    10: "2.5rem",
+    11: "2.75rem",
+    12: "3rem",
+    14: "3.5rem",
+    16: "4rem",
+    20: "5rem",
+    24: "6rem",
+    28: "7rem",
+    32: "8rem",
+    36: "9rem",
+    40: "10rem",
+    44: "11rem",
+    48: "12rem",
+    52: "13rem",
+    56: "14rem",
+    60: "15rem",
+    64: "16rem",
+    72: "18rem",
+    80: "20rem",
+    96: "24rem",
+    px: "1px",
+    0.5: "0.125rem",
+    1.5: "0.375rem",
+    2.5: "0.625rem",
+    3.5: "0.875rem",
+    inherit: "inherit",
+};

package/ui/tw-tokens/tw-z-index.d.ts

@@ -0,0 +1,19 @@
+export declare const twZIndex: {
+    0: string;
+    1: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    auto: string;
+    focus: string;
+    fixed: string;
+    menu: string;
+    header: string;
+    modal: string;
+    dropdown: string;
+    flashMessage: string;
+    tooltip: string;
+};
+export type TwZIndex = typeof twZIndex;

package/ui/tw-tokens/tw-z-index.js

@@ -0,0 +1,22 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twZIndex = void 0;
+exports.twZIndex = {
+    0: "0",
+    1: "1",
+    10: "10",
+    20: "20",
+    30: "30",
+    40: "40",
+    50: "50",
+    auto: "auto",
+    focus: "5",
+    fixed: "10",
+    menu: "25",
+    header: "50",
+    modal: "100",
+    dropdown: "200",
+    flashMessage: "250",
+    tooltip: "300",
+};

package/ui/widget/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./widget";
+export * from "./types";

package/ui/widget/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./widget"), exports);
+__exportStar(require("./types"), exports);

package/ui/widget/types.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+import { PaperProps } from "@uxf/ui/paper/paper";
+export interface WidgetProps extends PaperProps {
+    footer?: ReactNode;
+    withDividers?: boolean;
+}

package/ui/widget/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/ui/widget/widget.d.ts

@@ -0,0 +1,3 @@
+import { FC, PropsWithChildren } from "react";
+import { WidgetProps } from "./types";
+export declare const Widget: FC<PropsWithChildren<WidgetProps>>;

package/ui/widget/widget.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Widget = void 0;
+const paper_1 = require("@uxf/ui/paper/paper");
+const react_1 = __importDefault(require("react"));
+const Widget = (props) => {
+    var _a;
+    return (react_1.default.createElement(paper_1.Paper, { className: `dark:bg-gray-950 ${props.footer ? "rounded-b-none" : ""} ${props.withDividers ? "divide-y divide-lightBorder dark:divide-darkBorder" : ""} ${(_a = props.className) !== null && _a !== void 0 ? _a : ""}` },
+        props.children,
+        props.footer && react_1.default.createElement("div", { className: "bg-gray-50 px-4 py-3 dark:bg-gray-800" }, props.footer)));
+};
+exports.Widget = Widget;

package/utils/icons.config.js

@@ -1,4 +1,41 @@
 /** @type {import('@uxf/icons-generator/types').Config['icons']} */
 module.exports = {
     ...require("@uxf/ui/utils/icons-config"),
+    ...require("@uxf/data-grid/icons-config"),
+    ...require("@uxf/wysiwyg/icons"),
+    angleRight: {
+        width: 256,
+        height: 512,
+        data: `<path fill="currentColor" d="m89.45 87.5 143.1 152a23.94 23.94 0 0 1 6.562 16.5 23.96 23.96 0 0 1-6.562 16.5l-143.1 152c-9.12 9.6-24.31 10-33.93.9-9.688-9.125-10.03-24.38-.938-33.94l128.4-135.5-128.4-135.5c-9.092-9.56-8.752-24.71.938-33.9 9.62-9.09 24.81-8.69 33.93.94z"/>`,
+    },
+    "arrow-down-from-line": {
+        width: 384,
+        height: 512,
+        data: `<path fill="currentColor" d="M174.5 472.4c4.5 4.8 10.9 7.6 17.5 7.6s12.9-2.7 17.5-7.6l128-136c9.1-9.7 8.6-24.8-1-33.9s-24.8-8.6-33.9 1L216 395.5l0-83.5 0-128c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 128 0 83.5L81.5 303.6c-9.1-9.7-24.3-10.1-33.9-1s-10.1 24.3-1 33.9l128 136zM360 80c13.3 0 24-10.7 24-24s-10.7-24-24-24L24 32C10.7 32 0 42.7 0 56S10.7 80 24 80l336 0z"/>`,
+    },
+    "arrow-up-to-line": {
+        width: 384,
+        height: 512,
+        data: `<path fill="currentColor" d="M24 32C10.7 32 0 42.7 0 56S10.7 80 24 80H360c13.3 0 24-10.7 24-24s-10.7-24-24-24H24zM209.5 167.6c-4.5-4.8-10.9-7.6-17.5-7.6s-12.9 2.7-17.5 7.6l-128 136c-9.1 9.7-8.6 24.8 1 33.9s24.8 8.6 33.9-1L168 244.5V328 456c0 13.3 10.7 24 24 24s24-10.7 24-24V328 244.5l86.5 91.9c9.1 9.7 24.3 10.1 33.9 1s10.1-24.3 1-33.9l-128-136z"/>`,
+    },
+    "grip-dots-vertical": {
+        width: 256,
+        height: 512,
+        data: `<path fill="currentColor" d="M64 128a32 32 0 1 0 0-64 32 32 0 1 0 0 64zm0 160a32 32 0 1 0 0-64 32 32 0 1 0 0 64zM96 416a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zm96-288a32 32 0 1 0 0-64 32 32 0 1 0 0 64zm32 128a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM192 448a32 32 0 1 0 0-64 32 32 0 1 0 0 64z"/>`,
+    },
+    key: {
+        width: 512,
+        height: 512,
+        data: `<path fill="currentColor" d="M336 144C336 126.3 350.3 112 368 112C385.7 112 400 126.3 400 144C400 161.7 385.7 176 368 176C350.3 176 336 161.7 336 144zM336 352C326.5 352 317.2 351.3 308.1 349.8L280.1 376.1C276.5 381.5 270.4 384 264 384H224V424C224 437.3 213.3 448 200 448H160V488C160 501.3 149.3 512 136 512H24C10.75 512 0 501.3 0 488V376C0 369.6 2.529 363.5 7.029 359L162.2 203.9C160.8 194.8 160 185.5 160 176C160 78.8 238.8 0 336 0C433.2 0 512 78.8 512 176C512 273.2 433.2 352 336 352zM336 304C406.7 304 464 246.7 464 176C464 105.3 406.7 48 336 48C265.3 48 208 105.3 208 176C208 182.9 208.5 189.7 209.6 196.3L213.4 220.5L47.1 385.9V464H111.1V400H175.1V336H254.1L291.5 298.6L315.7 302.4C322.3 303.5 329.1 304 336 304z"/>`,
+    },
+    plus: {
+        width: 448,
+        height: 512,
+        data: `<path fill="currentColor" d="M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z"/>`,
+    },
+    "right-from-bracket": {
+        width: 512,
+        height: 512,
+        data: `<path fill="currentColor" d="M168 432H96c-26.4 0-48-21.6-48-48V128c0-26.4 21.6-48 48-48h72C181.3 80 192 69.25 192 56C192 42.74 181.3 32 168 32H96C42.98 32 0 74.98 0 128v256c0 53.02 42.98 96 96 96h72C181.3 480 192 469.3 192 456C192 442.7 181.3 432 168 432zM503.9 238.6L351.5 104.4c-9.844-8.75-24-10.88-36.09-5.469C303.6 104.3 296 115.9 296 128.7v55.31H176c-22.06 0-40 17.94-40 40v64c0 22.06 17.94 40 40 40h120v55.31c0 12.75 7.625 24.41 19.41 29.72c4.438 2 9.156 2.969 13.84 2.969c8.062 0 16.03-2.906 22.25-8.438l152.4-133.1C509.1 269.9 512 263.4 512 256.5S509.1 243.1 503.9 238.6zM344 350V279.1h-160v-48h160V161.1l107.8 94.54L344 350z"/>`,
+    },
 };

package/utils/styles.css

@@ -0,0 +1,43 @@
+.sidebar__nav {
+    /* width */
+    &::-webkit-scrollbar {
+        width: 4px;
+    }
+
+    /* Track */
+    &::-webkit-scrollbar-track {
+        background: theme("colors.sidebar.background");
+    }
+
+    /* Handle */
+    &::-webkit-scrollbar-thumb {
+        background: theme("colors.sidebar.highlight");
+    }
+
+    /* Handle on hover */
+    &::-webkit-scrollbar-thumb:hover {
+        background: theme("colors.sidebar.hover");
+    }
+}
+
+.sidebar__scrollbar {
+    --scrollbar-color: theme("colors.darkBorder");
+
+    -ms-overflow-style: -ms-autohiding-scrollbar;
+    scrollbar-color: var(--scrollbar-color) transparent;
+    scrollbar-width: thin;
+
+    &::-webkit-scrollbar {
+        @apply w-2;
+    }
+
+    &::-webkit-scrollbar-track {
+        background: theme("colors.sidebar.highlight");
+    }
+
+    &::-webkit-scrollbar-thumb {
+        @apply rounded-full border-none;
+
+        background-color: var(--scrollbar-color);
+    }
+}

package/utils/tailwind.config.js

@@ -8,12 +8,12 @@ module.exports = {
                 dataGridPrimary: "#140939",
                 dataGridSecondary: "#FF4F06",
                 sidebar: {
-                    background: "#140939",
-                    highlight: "#241459",
-                    hover: "#241459",
+                    background: "#1F2937",
+                    highlight: "#111827",
+                    hover: "#111827",
                 },
             },
         },
     },
-    plugins: [require("@tailwindcss/forms")({ strategy: "class" })],
+    plugins: [],
 };

package/utils/use-viewport-height.d.ts

@@ -0,0 +1 @@
+export declare function useViewportHeight(scrollLock?: boolean): string | number;

package/utils/use-viewport-height.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useViewportHeight = void 0;
+const react_1 = require("react");
+function getHeight() {
+    var _a, _b;
+    if (typeof window === "undefined") {
+        return "100vh";
+    }
+    return (_b = (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.height) !== null && _b !== void 0 ? _b : "100vh";
+}
+function useViewportHeight(scrollLock) {
+    const [height, setHeight] = (0, react_1.useState)(() => getHeight());
+    (0, react_1.useEffect)(() => {
+        if (scrollLock) {
+            document.body.classList.add("xl:overflow-hidden");
+        }
+        const handler = () => setHeight(getHeight());
+        window.addEventListener("resize", handler);
+        return () => {
+            if (scrollLock) {
+                document.body.classList.remove("xl:overflow-hidden");
+            }
+            window.removeEventListener("resize", handler);
+        };
+    }, [scrollLock]);
+    return height;
+}
+exports.useViewportHeight = useViewportHeight;

package/README.md

@@ -1,142 +0,0 @@
-# @uxf/cms
-[![npm](https://img.shields.io/npm/v/@uxf/cms)](https://www.npmjs.com/package/@uxf/cms)
-[![size](https://img.shields.io/bundlephobia/min/@uxf/cms)](https://www.npmjs.com/package/@uxf/cms)
-[![quality](https://img.shields.io/npms-io/quality-score/@uxf/cms)](https://www.npmjs.com/package/@uxf/cms)
-[![license](https://img.shields.io/npm/l/@uxf/cms)](https://www.npmjs.com/package/@uxf/cms)
-
-[Changelog](./CHANGELOG.md)
-
-## Changelog
-- **v4** - přidání tailwindu
-- **v5** - závislost na @uxf/router v3 (nepředává se do containeru celý router ale pouze funkce `route` a `useActiveRoute`)
-- **v6** - odstranění mui a nahrazení react-final-form za react-hook-form
-
-## Rozdělení balíčku
-
-- [@uxf/cms/ui](./README_ui.md) - UI komponenty
-- [@uxf/cms/form](./README_form.md) - Formulářové prvky
-- [@uxf/cms/pages](./README_pages.md) - NextJS stránky
-- [@uxf/cms/lab](./README_lab.md) - Komponenty které ještě nejsou odladěné na stabilní verzi
-
-## Instalace
-
-Od verze 4.0 balíček používá Tailwind CSS
-
-```shell
-yarn add @uxf/cms dayjs
-```
-
-Do souboru `tailwind.config.js` přidat následující řádky
-
-```js
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-    content: [
-        "./node_modules/@uxf/cms/**/*.js"
-    ],
-    presets: [
-        require("@uxf/cms/utils/tailwind.config"),
-    ],
-    plugins: [],
-};
-```
-
-## Použití balíčku
-
-Konfigurace balíčku se prvádí v souboru `_app.tsx`.
-
-```tsx
-// _app.tsx
-import { locale } from "dayjs";
-import "dayjs/locale/cs";
-import { config, container } from "@uxf/cms/config";
-
-cmsConfig.set("api-url", "== api url ==");
-
-container
-    .register("router", Router<any>)
-    .register("service.error", ErrorService)
-    .register("useLoggedUser", UseLoggedUser)
-    .register("api.getLoggedUser", GetLoggedUser)
-    .register("api.getUserConfig", GetUserConfig)
-    .register("api.uploadFile", (file, namespace) => TODO); // default value
-
-locale("cs")
-```
-
-## Api
-- cookie je předávána automaticky z kontextu
-
-```tsx
-import {...} from  "@uxf/cms/api";
-```
-
-- `getLoggedUser`
-- `getEntityMetaSchemas`
-- `getFormSchema`
-- `getFormValues`
-- `login`
-- `autocompleteRows`
-- `saveFormValues`
-- `userConfigSave`
-- `userConfigGetAll`
-- `userConfigGet`
-- `uploadFile`
-
-## FlashMessages
-
-```tsx
-// pages/_app.tsx
-
-import { FlashMessages } from "@uxf/ui/flash-messages/flash-messages";
-import { getFlashMessagesRef } from "@uxf/ui/flash-messages/flash-messages-service";
-
-function App(props: any) {
-    const { Component, pageProps } = props;
-
-    return (
-        <>
-            <Component {...pageProps} />
-            <FlashMessages ref={getFlashMessagesRef()} />
-        </>
-    );
-}
-
-export default App;
-```
-
-```tsx
-// pages/index.tsx
-
-import { flashMessage } from "@uxf/ui/flash-messages/flash-messages-service";
-
-function IndexPage(props) {
-    return <Button onClick={() => flashMessage({ variant: "success", message: "Hotovo" })}>Klikni</Button>;
-}
-
-export default IndexPage;
-```
-
-## Jak vyvíjet?
-```bash
-git clone git@gitlab.com:uxf-npm/cms.git
-cd ./cms
-npm install
-make dev
-```
-
-## Vydání balíčku:
-
-Balíček se vydá po mergi do `master` nebo `beta` branche.
-
-K publikování nových verzí do npm je opužit balíček [semantic-release](https://github.com/semantic-release/semantic-release) .
-
-### Jak má vypadat commit message?
-
-https://github.com/angular/angular.js/blob/master/DEVELOPERS.md#-git-commit-guidelines
-
-| Commit message                                                                                                                                                                                   | Release type               |
-|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------------------------|
-| `fix(pencil): stop graphite breaking when too much pressure applied`                                                                                                                             | Patch Release              |
-| `feat(pencil): add 'graphiteWidth' option`                                                                                                                                                       | ~~Minor~~ Feature Release  |
-| `perf(pencil): remove graphiteWidth option`<br><br>`BREAKING CHANGE: The graphiteWidth option has been removed.`<br>`The default graphite width of 10mm is always used for performance reasons.` | ~~Major~~ Breaking Release |