@cotype/ui - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2-feature-usecommonjsmodule.a0fd031

lib/BaseStyle/index.js

@@ -1,3 +0,6 @@
-import { createGlobalStyle, css } from 'styled-components';
-export const baseStyleCss = css `
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BaseStyle = exports.baseStyleCss = void 0;
+const styled_components_1 = require("styled-components");
+exports.baseStyleCss = styled_components_1.css `
   body,
@@ -77,5 +80,5 @@ html,
 `;
-export const BaseStyle = createGlobalStyle `
-  ${baseStyleCss}
+exports.BaseStyle = styled_components_1.createGlobalStyle `
+  ${exports.baseStyleCss}
 `;
 //# sourceMappingURL=index.js.map

lib/Button/index.js

@@ -1,6 +0,42 @@
-import React from 'react';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Button = exports.StyledLink = exports.StyledButton = void 0;
+const react_1 = __importDefault(require("react"));
 // eslint-disable-next-line import/named
-import styled, { css } from 'styled-components';
-import { Icon } from '../Icon';
-const cssStyle = ({ light }) => css `
+const styled_components_1 = __importStar(require("styled-components"));
+const Icon_1 = require("../Icon");
+const cssStyle = ({ light }) => styled_components_1.css `
   cursor: pointer;
@@ -30,6 +66,6 @@ display: inline-flex;
 `;
-export const StyledButton = styled.button `
+exports.StyledButton = styled_components_1.default.button `
   ${(p) => cssStyle(p)}
 `;
-export const StyledLink = styled.a `
+exports.StyledLink = styled_components_1.default.a `
   ${(p) => cssStyle(p)}
@@ -39,8 +75,10 @@ padding-top: 0;
 `;
-export const Button = ({ icon, children, css: style, ...props }) => {
-    const renderMutualContent = (React.createElement(React.Fragment, null,
-        icon && React.createElement(Icon, { path: icon }),
-        children && React.createElement("span", null, children)));
-    return 'asLink' in props && props.asLink === true ? (React.createElement(StyledLink, Object.assign({ css: style }, props), renderMutualContent)) : (React.createElement(StyledButton, Object.assign({ type: "button", css: style }, props), renderMutualContent));
+const Button = (_a) => {
+    var { icon, children, css: style } = _a, props = __rest(_a, ["icon", "children", "css"]);
+    const renderMutualContent = (react_1.default.createElement(react_1.default.Fragment, null,
+        icon && react_1.default.createElement(Icon_1.Icon, { path: icon }),
+        children && react_1.default.createElement("span", null, children)));
+    return 'asLink' in props && props.asLink === true ? (react_1.default.createElement(exports.StyledLink, Object.assign({ css: style }, props), renderMutualContent)) : (react_1.default.createElement(exports.StyledButton, Object.assign({ type: "button", css: style }, props), renderMutualContent));
 };
+exports.Button = Button;
 //# sourceMappingURL=index.js.map

lib/ChipList/index.js

@@ -1,8 +0,33 @@
-import ColorHash from 'color-hash';
-import React, { Component } from 'react';
-import styled from 'styled-components';
-import { Button, icons, paths, SimpleInput } from '../';
-import { testable } from '../util/helper';
-const colorHash = new ColorHash({ saturation: 0.7, lightness: 0.6 });
-export const Item = styled('div') `
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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.ChipList = exports.Item = void 0;
+const color_hash_1 = __importDefault(require("color-hash"));
+const react_1 = __importStar(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const __1 = require("../");
+const helper_1 = require("../util/helper");
+const colorHash = new color_hash_1.default({ saturation: 0.7, lightness: 0.6 });
+exports.Item = styled_components_1.default('div') `
   box-sizing: border-box;
@@ -27,3 +52,3 @@ color: '#fff';
 `;
-const StyledButton = styled('button') `
+const StyledButton = styled_components_1.default('button') `
   padding: 0;
@@ -37,14 +62,14 @@ border: none;
 `;
-const Root = styled('div') `
+const Root = styled_components_1.default('div') `
   margin: 10px 0;
 `;
-const Form = styled('form') `
+const Form = styled_components_1.default('form') `
   display: flex;
   width: 100%;
 `;
-const ClearCircleIcon = styled(icons.ClearCircle) `
+const ClearCircleIcon = styled_components_1.default(__1.icons.ClearCircle) `
   color: rgba(255, 255, 255, 0.8);
   margin: 0 0 0 4px;
 `;
-export class ChipList extends Component {
+class ChipList extends react_1.Component {
     constructor() {
@@ -64,5 +89,5 @@ super(...arguments);
         const { newValue } = this.state;
-        return (React.createElement(Root, null,
+        return (react_1.default.createElement(Root, null,
             values &&
-                values.map((v, index) => (React.createElement(Item, { key: index, style: {
+                values.map((v, index) => (react_1.default.createElement(exports.Item, { key: index, style: {
                         background: noColor
@@ -73,12 +98,13 @@ ? 'var(--accent-color)'
                     v,
-                    React.createElement(StyledButton, { type: "button", onClick: () => onDelete(index) },
-                        React.createElement(ClearCircleIcon, null))))),
-            React.createElement(Form, { onSubmit: (e) => {
+                    react_1.default.createElement(StyledButton, { type: "button", onClick: () => onDelete(index) },
+                        react_1.default.createElement(ClearCircleIcon, null))))),
+            react_1.default.createElement(Form, { onSubmit: (e) => {
                     e.preventDefault();
                     this.onAdd();
                 } },
-                React.createElement(SimpleInput, Object.assign({}, testable('chip-list-input'), { value: newValue, onChange: (e) => this.setState({ newValue: e.target.value }) })),
-                React.createElement(Button, { icon: paths.Plus, light: true, onClick: this.onAdd }, "Add"))));
+                react_1.default.createElement(__1.SimpleInput, Object.assign({}, helper_1.testable('chip-list-input'), { value: newValue, onChange: (e) => this.setState({ newValue: e.target.value }) })),
+                react_1.default.createElement(__1.Button, { icon: __1.paths.Plus, light: true, onClick: this.onAdd }, "Add"))));
     }
 }
+exports.ChipList = ChipList;
 //# sourceMappingURL=index.js.map

lib/DatePicker/index.js

@@ -1,10 +0,35 @@
-import 'react-day-picker/lib/style.css';
-import 'moment/locale/de';
-import React, { Component } from 'react';
-import DayPickerInput from 'react-day-picker/DayPickerInput';
-import MomentLocaleUtils from 'react-day-picker/moment';
-import styled from 'styled-components';
-import { inputClass } from '../SimpleElements';
-export const FORMAT = 'L';
-const Wrapper = styled('div') `
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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.DatePicker = exports.FORMAT = void 0;
+require("react-day-picker/lib/style.css");
+require("moment/locale/de");
+const react_1 = __importStar(require("react"));
+const DayPickerInput_1 = __importDefault(require("react-day-picker/DayPickerInput"));
+const moment_1 = __importDefault(require("react-day-picker/moment"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const SimpleElements_1 = require("../SimpleElements");
+exports.FORMAT = 'L';
+const Wrapper = styled_components_1.default('div') `
   .day-picker-container {
@@ -19,3 +44,3 @@ position: relative;
     & input {
-      ${inputClass}
+      ${SimpleElements_1.inputClass}
       width: auto;
@@ -27,3 +52,3 @@ font-feature-settings: 'tnum';
 `;
-export class DatePicker extends Component {
+class DatePicker extends react_1.Component {
     constructor() {
@@ -45,3 +70,3 @@ super(...arguments);
         return value
-            ? `${MomentLocaleUtils.formatDate(new Date(value), FORMAT, 'de')}`
+            ? `${moment_1.default.formatDate(new Date(value), exports.FORMAT, 'de')}`
             : '';
@@ -51,13 +76,14 @@ }
         const { value = '', placeholder } = this.props;
-        return (React.createElement(Wrapper, null,
-            React.createElement(DayPickerInput, { formatDate: MomentLocaleUtils.formatDate, parseDate: MomentLocaleUtils.parseDate, placeholder: placeholder || 'DD.MM.YYYY', classNames: {
+        return (react_1.default.createElement(Wrapper, null,
+            react_1.default.createElement(DayPickerInput_1.default, { formatDate: moment_1.default.formatDate, parseDate: moment_1.default.parseDate, placeholder: placeholder || 'DD.MM.YYYY', classNames: {
                     container: 'day-picker-container',
                     overlay: '',
                     overlayWrapper: '',
-                }, onDayChange: this.handleChange, format: [FORMAT, 'l', 'LL', 'll'], dayPickerProps: {
+                }, onDayChange: this.handleChange, format: [exports.FORMAT, 'l', 'LL', 'll'], dayPickerProps: {
                     locale: 'de',
-                    localeUtils: MomentLocaleUtils,
+                    localeUtils: moment_1.default,
                 }, value: this.format(value) })));
     }
 }
+exports.DatePicker = DatePicker;
 //# sourceMappingURL=index.js.map

lib/Icon/index.js

@@ -1,7 +0,26 @@
-import React from 'react';
-export const Icon = ({ path, ...props }) => {
-    return (React.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24" }, props),
-        React.createElement("path", { d: path, fill: "currentColor" })));
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
 };
-export const paths = {
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.icons = exports.paths = exports.Icon = void 0;
+const react_1 = __importDefault(require("react"));
+const Icon = (_a) => {
+    var { path } = _a, props = __rest(_a, ["path"]);
+    return (react_1.default.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24" }, props),
+        react_1.default.createElement("path", { d: path, fill: "currentColor" })));
+};
+exports.Icon = Icon;
+exports.paths = {
     OpenInTab: 'M14,3V5H17.59L7.76,14.83L9.17,16.24L19,6.41V10H21V3M19,19H5V5H12V3H5C3.89,3 3,3.9 3,5V19C3,20.1 3.9,21 5,21H19C20.1,21 21,20.1 21,19V12H19V19Z',
@@ -45,8 +64,8 @@ Link: 'M10.59,13.41C11,13.8 11,14.44 10.59,14.83C10.2,15.22 9.56,15.22 9.17,14.83C7.22,12.88 7.22,9.71 9.17,7.76V7.76L12.71,4.22C14.66,2.27 17.83,2.27 19.78,4.22C21.73,6.17 21.73,9.34 19.78,11.29L18.29,12.78C18.3,11.96 18.17,11.14 17.89,10.36L18.36,9.88C19.54,8.71 19.54,6.81 18.36,5.64C17.19,4.46 15.29,4.46 14.12,5.64L10.59,9.17C9.41,10.34 9.41,12.24 10.59,13.41M13.41,9.17C13.8,8.78 14.44,8.78 14.83,9.17C16.78,11.12 16.78,14.29 14.83,16.24V16.24L11.29,19.78C9.34,21.73 6.17,21.73 4.22,19.78C2.27,17.83 2.27,14.66 4.22,12.71L5.71,11.22C5.7,12.04 5.83,12.86 6.11,13.65L5.64,14.12C4.46,15.29 4.46,17.19 5.64,18.36C6.81,19.54 8.71,19.54 9.88,18.36L13.41,14.83C14.59,13.66 14.59,11.76 13.41,10.59C13,10.2 13,9.56 13.41,9.17Z',
 const internalIcons = {};
-Object.entries(paths).forEach(([name, path]) => {
-    const x = (props) => React.createElement(Icon, Object.assign({}, props, { path: path }));
+Object.entries(exports.paths).forEach(([name, path]) => {
+    const x = (props) => react_1.default.createElement(exports.Icon, Object.assign({}, props, { path: path }));
     x.displayName = name;
     internalIcons[name] = x;
 });
-export const icons = internalIcons;
+exports.icons = internalIcons;
 //# sourceMappingURL=index.js.map

lib/ImageCircle/index.js

@@ -1,6 +0,23 @@
-import ColorHash from 'color-hash';
-import React from 'react';
-import styled from 'styled-components';
-const colorHash = new ColorHash({ saturation: 0.7, lightness: 0.6 });
-const Circle = styled.div `
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ImageCircle = void 0;
+const color_hash_1 = __importDefault(require("color-hash"));
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const colorHash = new color_hash_1.default({ saturation: 0.7, lightness: 0.6 });
+const Circle = styled_components_1.default.div `
   flex-shrink: 0;
@@ -22,5 +39,6 @@ display: flex;
 `;
-export const ImageCircle = ({ src, alt = '', size = 24, ...rest }) => {
+const ImageCircle = (_a) => {
+    var { src, alt = '', size = 24 } = _a, rest = __rest(_a, ["src", "alt", "size"]);
     const validImageSrc = src && /\.(jpg|jpeg|svg|png)$/i.test(src);
-    return (React.createElement(Circle, Object.assign({}, rest, { style: {
+    return (react_1.default.createElement(Circle, Object.assign({}, rest, { style: {
             backgroundColor: validImageSrc
@@ -33,2 +51,3 @@ ? 'transparent'
 };
+exports.ImageCircle = ImageCircle;
 //# sourceMappingURL=index.js.map

lib/index.js

@@ -1,13 +0,25 @@
-export * from './BaseStyle';
-export * from './SimpleElements';
-export * from './Button';
-export * from './Icon';
-export * from './StatusLight';
-export * from './ToggleSwitch';
-export * from './ImageCircle';
-export * from './PopoverMenu';
-export * from './ProgressCircle';
-export * from './DatePicker';
-export * from './ChipList';
-export * from './TimeInput';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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("./BaseStyle"), exports);
+__exportStar(require("./SimpleElements"), exports);
+__exportStar(require("./Button"), exports);
+__exportStar(require("./Icon"), exports);
+__exportStar(require("./StatusLight"), exports);
+__exportStar(require("./ToggleSwitch"), exports);
+__exportStar(require("./ImageCircle"), exports);
+__exportStar(require("./PopoverMenu"), exports);
+__exportStar(require("./ProgressCircle"), exports);
+__exportStar(require("./DatePicker"), exports);
+__exportStar(require("./ChipList"), exports);
+__exportStar(require("./TimeInput"), exports);
 //# sourceMappingURL=index.js.map

lib/PopoverMenu/index.js

@@ -1,5 +0,30 @@
-import React, { Component } from 'react';
-import Popover, { ArrowContainer } from 'react-tiny-popover';
-import styled from 'styled-components';
-export const PopoverMenuMenu = styled('div') `
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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.PopoverMenu = exports.PopoverMenuItem = exports.PopoverMenuMenu = void 0;
+const react_1 = __importStar(require("react"));
+const react_tiny_popover_1 = __importStar(require("react-tiny-popover"));
+const styled_components_1 = __importDefault(require("styled-components"));
+exports.PopoverMenuMenu = styled_components_1.default('div') `
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
@@ -12,3 +37,3 @@ background: #fff;
 `;
-export const PopoverMenuItem = styled('div') `
+exports.PopoverMenuItem = styled_components_1.default('div') `
   padding: 15px;
@@ -24,3 +49,3 @@ border-bottom: 1px solid #f0f0f0;
 `;
-export class PopoverMenu extends Component {
+class PopoverMenu extends react_1.Component {
     constructor() {
@@ -35,3 +60,3 @@ super(...arguments);
         this.renderPopover = ({ position, targetRect, popoverRect, }) => {
-            return (React.createElement(ArrowContainer, { position: position, targetRect: targetRect, popoverRect: popoverRect, arrowColor: '#fff', arrowSize: 5 }, this.props.renderMenu(this.close)));
+            return (react_1.default.createElement(react_tiny_popover_1.ArrowContainer, { position: position, targetRect: targetRect, popoverRect: popoverRect, arrowColor: '#fff', arrowSize: 5 }, this.props.renderMenu(this.close)));
         };
@@ -42,6 +67,7 @@ }
         const { isPopoverOpen } = this.state;
-        return (React.createElement(Popover, { isOpen: isPopoverOpen, position: position, align: align, content: this.renderPopover, containerStyle: { overflow: 'visible', zIndex: '4' }, onClickOutside: this.close, transitionDuration: 0 },
-            React.createElement("div", { style: { display: 'inline-flex' }, onClick: () => this.setState({ isPopoverOpen: !isPopoverOpen }) }, children)));
+        return (react_1.default.createElement(react_tiny_popover_1.default, { isOpen: isPopoverOpen, position: position, align: align, content: this.renderPopover, containerStyle: { overflow: 'visible', zIndex: '4' }, onClickOutside: this.close, transitionDuration: 0 },
+            react_1.default.createElement("div", { style: { display: 'inline-flex' }, onClick: () => this.setState({ isPopoverOpen: !isPopoverOpen }) }, children)));
     }
 }
+exports.PopoverMenu = PopoverMenu;
 //# sourceMappingURL=index.js.map

lib/ProgressCircle/index.js

@@ -1,5 +0,11 @@
-import React from 'react';
-import { CircularProgressbar } from 'react-circular-progressbar';
-import { createGlobalStyle } from 'styled-components';
-const GlobalStyle = createGlobalStyle `
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ProgressCircle = void 0;
+const react_1 = __importDefault(require("react"));
+const react_circular_progressbar_1 = require("react-circular-progressbar");
+const styled_components_1 = require("styled-components");
+const GlobalStyle = styled_components_1.createGlobalStyle `
 .circlePath{
@@ -30,7 +36,8 @@ stroke: var(--primary-color);
 };
-export const ProgressCircle = ({ percentage, size = '100%' }) => {
-    return (React.createElement(React.Fragment, null,
-        React.createElement(GlobalStyle, null),
-        React.createElement(CircularProgressbar, { value: percentage, text: `${percentage}%`, classes: classes, styles: { root: { width: size } } })));
+const ProgressCircle = ({ percentage, size = '100%' }) => {
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(GlobalStyle, null),
+        react_1.default.createElement(react_circular_progressbar_1.CircularProgressbar, { value: percentage, text: `${percentage}%`, classes: classes, styles: { root: { width: size } } })));
 };
+exports.ProgressCircle = ProgressCircle;
 //# sourceMappingURL=index.js.map

lib/SimpleElements/index.js

@@ -0,4 +1,26 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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.SimpleButton = exports.SimpleError = exports.SimpleLabel = exports.SimpleField = exports.SimpleInput = exports.buttonClass = exports.outputClass = exports.inputClass = exports.errorClass = exports.labelClass = exports.fieldClass = exports.fieldGroupClass = void 0;
 // eslint-disable-next-line import/named
-import styled, { css } from 'styled-components';
-export const fieldGroupClass = css `
+const styled_components_1 = __importStar(require("styled-components"));
+exports.fieldGroupClass = styled_components_1.css `
   box-sizing: border-box;
@@ -9,7 +31,7 @@ padding-top: 24px;
 `;
-export const fieldClass = css `
+exports.fieldClass = styled_components_1.css `
   display: block;
   margin-bottom: 24px;
 `;
-export const labelClass = css `
+exports.labelClass = styled_components_1.css `
   display: block;
@@ -19,7 +41,7 @@ color: #848484;
 `;
-export const errorClass = css `
+exports.errorClass = styled_components_1.css `
   color: var(--error-color);
   margin-top: 6px;
 `;
-export const inputClass = css `
+exports.inputClass = styled_components_1.css `
   background: #fff;
@@ -41,3 +63,3 @@ border-radius: 4px;
 `;
-export const outputClass = css `
+exports.outputClass = styled_components_1.css `
   width: 100%;
@@ -52,3 +74,3 @@ box-sizing: border-box;
 `;
-export const buttonClass = css `
+exports.buttonClass = styled_components_1.css `
   background: var(--primary-color);
@@ -61,17 +83,17 @@ font-size: 1.5em;
 `;
-export const SimpleInput = styled.input `
-  ${inputClass}
+exports.SimpleInput = styled_components_1.default.input `
+  ${exports.inputClass}
 `;
-export const SimpleField = styled.label `
-  ${fieldClass}
+exports.SimpleField = styled_components_1.default.label `
+  ${exports.fieldClass}
 `;
-export const SimpleLabel = styled.div `
-  ${labelClass}
+exports.SimpleLabel = styled_components_1.default.div `
+  ${exports.labelClass}
 `;
-export const SimpleError = styled.div `
-  ${errorClass}
+exports.SimpleError = styled_components_1.default.div `
+  ${exports.errorClass}
 `;
-export const SimpleButton = styled.button `
-  ${buttonClass}
+exports.SimpleButton = styled_components_1.default.button `
+  ${exports.buttonClass}
 `;
 //# sourceMappingURL=index.js.map

lib/StatusLight/index.js

@@ -1,2 +0,8 @@
-import styled from 'styled-components';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusLight = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
 const colors = {
@@ -8,3 +14,3 @@ grey: '#aaa',
 };
-export const StatusLight = styled.div `
+exports.StatusLight = styled_components_1.default.div `
   width: 10px;
@@ -11,0 +17,0 @@ height: 10px;

lib/TimeInput/index.js

@@ -1,5 +0,27 @@
-import React, { Component } from 'react';
-import { css } from 'styled-components';
-import { SimpleInput } from '../SimpleElements';
-const timeInputClass = css `
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (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.TimeInput = void 0;
+const react_1 = __importStar(require("react"));
+const styled_components_1 = require("styled-components");
+const SimpleElements_1 = require("../SimpleElements");
+const timeInputClass = styled_components_1.css `
   width: 5em;
@@ -12,3 +34,3 @@ font-feature-settings: 'tnum';
 const isValidMinutes = (m) => (Number.isInteger(m) && m >= 0 && m < 60) || Number.isNaN(m);
-export class TimeInput extends Component {
+class TimeInput extends react_1.Component {
     constructor() {
@@ -60,5 +82,6 @@ super(...arguments);
     render() {
-        return (React.createElement(SimpleInput, { css: timeInputClass, type: "tel", value: this.state.value, placeholder: this.props.placeholder, onChange: (e) => this.onChange(e.target.value) }));
+        return (react_1.default.createElement(SimpleElements_1.SimpleInput, { css: timeInputClass, type: "tel", value: this.state.value, placeholder: this.props.placeholder, onChange: (e) => this.onChange(e.target.value) }));
     }
 }
+exports.TimeInput = TimeInput;
 //# sourceMappingURL=index.js.map

lib/ToggleSwitch/index.js

@@ -1,4 +0,10 @@
-import React from 'react';
-import styled from 'styled-components';
-const Track = styled.div `
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ToggleSwitch = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Track = styled_components_1.default.div `
   width: 44px;
@@ -17,3 +23,3 @@ height: 22px;
 `;
-const Knob = styled.div `
+const Knob = styled_components_1.default.div `
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26);
@@ -27,4 +33,5 @@ width: 18px;
 `;
-export const ToggleSwitch = ({ on, onClick, disabled }) => (React.createElement(Track, { active: on, onClick: onClick, disabled: disabled },
-    React.createElement(Knob, { active: on })));
+const ToggleSwitch = ({ on, onClick, disabled }) => (react_1.default.createElement(Track, { active: on, onClick: onClick, disabled: disabled },
+    react_1.default.createElement(Knob, { active: on })));
+exports.ToggleSwitch = ToggleSwitch;
 //# sourceMappingURL=index.js.map

lib/util/helper.js

@@ -1,2 +0,5 @@
-export function formatBytes(bytes, decimals) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.testable = exports.slugify = exports.formatBytes = void 0;
+function formatBytes(bytes, decimals) {
     if (bytes === 0)
@@ -10,3 +13,4 @@ return '0 Bytes';
 }
-export function slugify(text) {
+exports.formatBytes = formatBytes;
+function slugify(text) {
     const specialChars = {
@@ -70,3 +74,4 @@ à: 'a',
 }
-export function testable(id) {
+exports.slugify = slugify;
+function testable(id) {
     return {
@@ -76,2 +81,3 @@ 'data-testid': id,
 }
+exports.testable = testable;
 //# sourceMappingURL=helper.js.map

package.json

 {
   "name": "@cotype/ui",
-  "version": "1.0.1",
+  "version": "1.0.2-feature-usecommonjsmodule.a0fd031",
   "description": "UI Components for cotype Admin UI",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

6191925

increased by0.19%

Lines of code

13010

increased by1.89%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Number of low quality alerts

2

increased by100%

No dependency changes