@broxus/react-uikit 0.1.1 → 0.1.2

package/dist/cjs/components/Drop/placements.d.ts

@@ -0,0 +1,57 @@
+declare const placements: {
+    'bottom-center': {
+        offset: number[];
+        overflow: {
+            adjustX: number;
+            adjustY: number;
+        };
+        points: string[];
+        targetOffset: number[];
+    };
+    'bottom-left': {
+        offset: number[];
+        overflow: {
+            adjustX: number;
+            adjustY: number;
+        };
+        points: string[];
+        targetOffset: number[];
+    };
+    'bottom-right': {
+        offset: number[];
+        overflow: {
+            adjustX: number;
+            adjustY: number;
+        };
+        points: string[];
+        targetOffset: number[];
+    };
+    'top-center': {
+        offset: number[];
+        overflow: {
+            adjustX: number;
+            adjustY: number;
+        };
+        points: string[];
+        targetOffset: number[];
+    };
+    'top-left': {
+        offset: number[];
+        overflow: {
+            adjustX: number;
+            adjustY: number;
+        };
+        points: string[];
+        targetOffset: number[];
+    };
+    'top-right': {
+        offset: number[];
+        overflow: {
+            adjustX: number;
+            adjustY: number;
+        };
+        points: string[];
+        targetOffset: number[];
+    };
+};
+export default placements;

package/dist/cjs/components/Drop/placements.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const autoAdjustOverflow = {
+    adjustX: 1,
+    adjustY: 1,
+};
+const targetOffset = [0, 0];
+const placements = {
+    'bottom-center': {
+        offset: [0, 4],
+        overflow: autoAdjustOverflow,
+        points: ['tc', 'bc'],
+        targetOffset,
+    },
+    'bottom-left': {
+        offset: [0, 4],
+        overflow: autoAdjustOverflow,
+        points: ['tl', 'bl'],
+        targetOffset,
+    },
+    'bottom-right': {
+        offset: [0, 4],
+        overflow: autoAdjustOverflow,
+        points: ['tr', 'br'],
+        targetOffset,
+    },
+    'top-center': {
+        offset: [0, -4],
+        overflow: autoAdjustOverflow,
+        points: ['bc', 'tc'],
+        targetOffset,
+    },
+    'top-left': {
+        offset: [0, -4],
+        overflow: autoAdjustOverflow,
+        points: ['bl', 'tl'],
+        targetOffset,
+    },
+    'top-right': {
+        offset: [0, -4],
+        overflow: autoAdjustOverflow,
+        points: ['br', 'tr'],
+        targetOffset,
+    },
+};
+exports.default = placements;

package/dist/cjs/components/Dropdown/index.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import type { DropProps } from '../Drop';
+import './index.scss';
+export declare type DropdownProps = DropProps;
+export declare const Dropdown: React.ForwardRefExoticComponent<DropProps & React.RefAttributes<unknown>>;

package/dist/cjs/components/Dropdown/index.js

@@ -0,0 +1,36 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dropdown = void 0;
+const React = __importStar(require("react"));
+const Drop_1 = require("../Drop");
+require("./index.scss");
+exports.Dropdown = React.forwardRef((props, ref) => {
+    const { children, ...restProps } = props;
+    return (React.createElement(Drop_1.Drop, { ref: ref, ...restProps, prefixCls: "uk-dropdown" }, children));
+});
+if (process.env.NODE_ENV !== 'production') {
+    exports.Dropdown.displayName = 'Dropdown';
+}

package/dist/cjs/components/Flex/index.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import type { BreakpointsConfig } from '../../types';
+import type { PolymorphicComponentProps } from '../Component';
+import './index.scss';
+export declare type FlexAlignContent = 'stretch' | 'between' | 'around' | 'top' | 'middle' | 'bottom';
+export declare type FlexAlignItems = 'stretch' | 'top' | 'middle' | 'bottom';
+export declare type FlexDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
+export declare type FlexWrap = 'wrap' | 'nowrap' | 'wrap-reverse';
+export declare type FlexJustifyContent = 'left' | 'center' | 'right' | 'between' | 'around';
+export declare type FlexItemDimensions = 'none' | 'auto' | 'fill' | '1';
+export declare type FlexBreakpoint = {
+    alignContent?: FlexAlignContent;
+    alignItems?: FlexAlignItems;
+    flexDirection?: FlexDirection;
+    flexWrap?: FlexWrap;
+    itemDimensions?: FlexItemDimensions;
+    justifyContent?: FlexJustifyContent;
+};
+export declare type FlexBreakpointsConfig = BreakpointsConfig<FlexBreakpoint>;
+export declare type FlexOwnProps = FlexBreakpoint & FlexBreakpointsConfig & {
+    inline?: boolean;
+};
+export declare type FlexProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, FlexOwnProps>;
+declare const defaultElement = "div";
+export declare function Flex<E extends React.ElementType = typeof defaultElement>(props: FlexProps<E>): JSX.Element;
+export {};

package/dist/cjs/components/Flex/index.js

@@ -0,0 +1,48 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Flex = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const Component_1 = require("../Component");
+require("./index.scss");
+const defaultElement = 'div';
+function Flex(props) {
+    const { alignContent, alignItems, className, flexDirection, flexWrap, inline, itemDimensions, justifyContent, ...restProps } = props;
+    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)({
+            'uk-flex': !inline,
+            'uk-flex-inline': inline,
+            [`uk-flex-${alignItems}`]: alignItems !== undefined,
+            [`uk-flex-${flexDirection}`]: flexDirection !== undefined,
+            [`uk-flex-${flexWrap}`]: flexWrap !== undefined,
+            [`uk-flex-wrap-${alignContent}`]: flexWrap !== undefined && alignContent !== undefined,
+            [`uk-flex-${justifyContent}`]: justifyContent !== undefined,
+            [`uk-flex-${itemDimensions}`]: itemDimensions !== undefined,
+        }, className), component: defaultElement, ...restProps }));
+}
+exports.Flex = Flex;

package/dist/cjs/components/Form/Controls.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export declare type ControlsProps = React.HTMLAttributes<HTMLDivElement>;
+export declare function Controls(props: ControlsProps): JSX.Element;
+export declare namespace Controls {
+    var displayName: string;
+}

package/dist/cjs/components/Form/Controls.js

@@ -0,0 +1,39 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Controls = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+function Controls(props) {
+    const { className, ...restProps } = props;
+    return (React.createElement("div", { className: (0, classnames_1.default)('uk-form-controls', className), ...restProps }));
+}
+exports.Controls = Controls;
+if (process.env.NODE_ENV !== 'production') {
+    Controls.displayName = 'Form.Controls';
+}

package/dist/cjs/components/Form/ControlsText.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export declare type ControlsTextProps = React.HTMLAttributes<HTMLDivElement>;
+export declare function ControlsText(props: ControlsTextProps): JSX.Element;
+export declare namespace ControlsText {
+    var displayName: string;
+}

package/dist/cjs/components/Form/ControlsText.js

@@ -0,0 +1,39 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ControlsText = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+function ControlsText(props) {
+    const { className, ...restProps } = props;
+    return (React.createElement("div", { className: (0, classnames_1.default)('uk-form-controls-text', className), ...restProps }));
+}
+exports.ControlsText = ControlsText;
+if (process.env.NODE_ENV !== 'production') {
+    ControlsText.displayName = 'Form.ControlsText';
+}

package/dist/cjs/components/Form/Fieldset.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export declare type FieldsetProps = React.FieldsetHTMLAttributes<HTMLFieldSetElement>;
+export declare function Fieldset(props: FieldsetProps): JSX.Element;
+export declare namespace Fieldset {
+    var displayName: string;
+}

package/dist/cjs/components/Form/Fieldset.js

@@ -0,0 +1,39 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Fieldset = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+function Fieldset(props) {
+    const { className, ...restProps } = props;
+    return (React.createElement("fieldset", { className: (0, classnames_1.default)('uk-fieldset', className), ...restProps }));
+}
+exports.Fieldset = Fieldset;
+if (process.env.NODE_ENV !== 'production') {
+    Fieldset.displayName = 'Form.Fieldset';
+}

package/dist/cjs/components/Form/Form.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import type { PolymorphicComponentProps } from '../Component';
+export interface FormOwnProps {
+    layout?: 'stacked' | 'horizontal';
+}
+export declare type FormProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, FormOwnProps>;
+declare const defaultElement = "form";
+export declare function Form<E extends React.ElementType = typeof defaultElement>(props: FormProps<E>): JSX.Element;
+export {};

package/dist/cjs/components/Form/Form.js

@@ -0,0 +1,40 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Form = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const Component_1 = require("../Component");
+const defaultElement = 'form';
+function Form(props) {
+    const { className, layout, ...restProps } = props;
+    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)('uk-form', {
+            [`uk-form-${layout}`]: layout !== undefined,
+        }, className), component: defaultElement, ...restProps }));
+}
+exports.Form = Form;

package/dist/cjs/components/Form/Label.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export declare type LabelProps = React.LabelHTMLAttributes<HTMLLabelElement>;
+export declare function Label(props: LabelProps): JSX.Element;
+export declare namespace Label {
+    var displayName: string;
+}

package/dist/cjs/components/Form/Label.js

@@ -0,0 +1,39 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Label = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+function Label(props) {
+    const { className, htmlFor, ...restProps } = props;
+    return (React.createElement("label", { className: (0, classnames_1.default)('uk-form-label', className), htmlFor: htmlFor, ...restProps }));
+}
+exports.Label = Label;
+if (process.env.NODE_ENV !== 'production') {
+    Label.displayName = 'Form.Label';
+}

package/dist/cjs/components/Form/Legend.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export declare type LegendProps = React.HTMLAttributes<HTMLLegendElement>;
+export declare function Legend(props: LegendProps): JSX.Element;
+export declare namespace Legend {
+    var displayName: string;
+}

package/dist/cjs/components/Form/Legend.js

@@ -0,0 +1,39 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Legend = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+function Legend(props) {
+    const { className, ...restProps } = props;
+    return (React.createElement("legend", { className: (0, classnames_1.default)('uk-legend', className), ...restProps }));
+}
+exports.Legend = Legend;
+if (process.env.NODE_ENV !== 'production') {
+    Legend.displayName = 'Form.Legend';
+}

package/dist/cjs/components/Form/index.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { Controls } from './Controls';
+import { ControlsText } from './ControlsText';
+import { Fieldset } from './Fieldset';
+import { Label } from './Label';
+import { Legend } from './Legend';
+import type { FormProps } from './Form';
+import './index.scss';
+export type { FormProps };
+export interface CompoundedForm extends React.FunctionComponent<FormProps> {
+    Controls: typeof Controls;
+    ControlsText: typeof ControlsText;
+    Fieldset: typeof Fieldset;
+    Label: typeof Label;
+    Legend: typeof Legend;
+}
+export declare const Form: CompoundedForm;

package/dist/cjs/components/Form/index.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Form = void 0;
+const Controls_1 = require("./Controls");
+const ControlsText_1 = require("./ControlsText");
+const Fieldset_1 = require("./Fieldset");
+const Form_1 = require("./Form");
+const Label_1 = require("./Label");
+const Legend_1 = require("./Legend");
+require("./index.scss");
+exports.Form = Form_1.Form;
+exports.Form.Controls = Controls_1.Controls;
+exports.Form.ControlsText = ControlsText_1.ControlsText;
+exports.Form.Fieldset = Fieldset_1.Fieldset;
+exports.Form.Label = Label_1.Label;
+exports.Form.Legend = Legend_1.Legend;

package/dist/cjs/components/Grid/index.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { PolymorphicComponentProps } from '../Component';
+import type { ChildWidthBreakpointsConfig, ChildWidthSize } from '../Width';
+import './index.scss';
+export declare type GridGap = 'collapse' | 'xsmall' | 'small' | 'medium' | 'large';
+export declare type GridOwnProps = {
+    childWidth?: ChildWidthSize | ChildWidthBreakpointsConfig;
+    columnGap?: GridGap;
+    divider?: boolean;
+    gap?: GridGap;
+    margin?: GridGap;
+    match?: boolean;
+    rowGap?: GridGap;
+};
+export declare type GridProps<E extends React.ElementType = React.ElementType> = PolymorphicComponentProps<E, GridOwnProps>;
+declare const defaultElement = "div";
+export declare function Grid<E extends React.ElementType = typeof defaultElement>(props: GridProps<E>): JSX.Element;
+export {};

package/dist/cjs/components/Grid/index.js

@@ -0,0 +1,48 @@
+"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Grid = void 0;
+const React = __importStar(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const Component_1 = require("../Component");
+const Width_1 = require("../Width");
+require("./index.scss");
+const defaultElement = 'div';
+function Grid(props) {
+    const { childWidth, className, columnGap, divider, gap, margin, match, rowGap, ...restProps } = props;
+    const childWithClassName = React.useMemo(() => (0, Width_1.getChildWidthClassname)(childWidth), [childWidth]);
+    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)('uk-grid', {
+            [`uk-grid-${gap}`]: gap !== undefined,
+            [`uk-grid-row-${rowGap}`]: rowGap !== undefined,
+            [`uk-grid-column-${columnGap}`]: columnGap !== undefined,
+            [`uk-grid-margin-${margin}`]: margin !== undefined,
+            'uk-grid-divider': divider,
+            'uk-grid-match': match,
+        }, childWithClassName, className), component: defaultElement, "data-uk-grid": "margin: ", ...restProps }));
+}
+exports.Grid = Grid;

package/dist/cjs/components/Heading/index.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { PolymorphicComponentProps } from '../Component';
+import './index.scss';
+export declare type HeadingOwnProps = {
+    decoration?: 'bullet' | 'divider' | 'line';
+    size?: 'small' | 'medium' | 'large' | 'xlarge' | '2xlarge';
+};
+export declare type HeadingProps<E extends React.ElementType> = PolymorphicComponentProps<E, HeadingOwnProps>;
+declare const defaultElement = "div";
+export declare function Heading<E extends React.ElementType = typeof defaultElement>(props: HeadingProps<E>): JSX.Element;
+export {};