@mrshmllw/smores-react 2.4.4 → 2.4.5

package/README.md

@@ -35,10 +35,10 @@ $ npm install @mrshmllw/smores-react
 
 Before starting, make sure that `CHANGELOG.md` is updated according to [keepachangelog.com](https://keepachangelog.com/en/1.0.0/) with the latest release notes. If not, make a PR updating it before continuing.
 
-1. Checkout a new branch from the `Master` branch, update Changelog and _bump_ the project version.
+1. Checkout a new branch from the `main` branch, update Changelog and _bump_ the project version.
 
 ```
-git checkout master
+git checkout main
 git pull
 git checkout -b [branch_name]
 ```
@@ -49,10 +49,10 @@ git checkout -b [branch_name]
 npm version [major | minor | patch] 
 ```
 
-3. When merged, go the the `master` branch, pull and push the new tag to `origin`
+3. When merged, go the the `main` branch, pull and push the new tag to `origin`
 
 ```
-git checkout master
+git checkout main
 git pull
 git push origin --tags
 ```

package/dist/Accordion/Accordion.js

@@ -33,7 +33,7 @@ const Wrapper = styled(Box)(({ borderTop, fullBorder }) => css `
 
     ${fullBorder &&
     css `
-      border: 1px solid ${theme.colors.subtext};
+      border: 1px solid ${theme.colors.outline};
       border-radius: 8px;
       margin-bottom: 14px;
       padding: 20px 15px;

package/dist/CheckBoxGroup/CheckBox.d.ts

@@ -0,0 +1,9 @@
+import { FC, ReactNode } from 'react';
+declare type Props = {
+    id: string;
+    checked: boolean;
+    children: ReactNode;
+    toggle: () => void;
+};
+export declare const CheckBox: FC<Props>;
+export {};

package/dist/CheckBoxGroup/CheckBox.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import styled from 'styled-components';
+import { Text } from '../Text';
+import { theme } from '../theme';
+export const CheckBox = ({ id, checked, children, toggle }) => (React.createElement(BoxContainer, { id: id },
+    React.createElement(Text, { tag: "span", typo: "base" }, children),
+    React.createElement("input", { type: "checkbox", checked: checked, onChange: toggle }),
+    React.createElement(Checkmark, null)));
+const Checkmark = styled.span `
+  position: absolute;
+  left: 0;
+  width: 24px;
+  height: 24px;
+  border: solid 1px ${theme.colors.secondary};
+  box-sizing: border-box;
+  border-radius: 1px;
+
+  &:after {
+    content: '';
+    position: absolute;
+    display: none;
+    top: 3px;
+    left: 7px;
+    width: 5px;
+    height: 12px;
+    border: solid white;
+    border-width: 0 2px 2px 0;
+    -webkit-transform: rotate(45deg);
+    -ms-transform: rotate(45deg);
+    transform: rotate(45deg);
+  }
+`;
+const BoxContainer = styled.label `
+  position: relative;
+  display: flex;
+  align-items: center;
+  padding-left: 32px;
+  user-select: none;
+  cursor: pointer;
+
+  input {
+    position: absolute;
+    opacity: 0;
+    cursor: pointer;
+
+    &:checked ~ ${Checkmark} {
+      background-color: ${theme.colors.secondary};
+      border: solid 1px ${theme.colors.secondary};
+    }
+
+    &:checked ~ ${Checkmark}:after {
+      display: block;
+    }
+  }
+
+  &:hover {
+    ${Checkmark} {
+      background-color: ${theme.colors.background};
+      border: solid 1px ${theme.colors.secondary};
+    }
+  }
+
+  @media (min-width: 768px) {
+    padding-left: 32px;
+  }
+`;
+//# sourceMappingURL=CheckBox.js.map

package/dist/CheckBoxGroup/CheckBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckBox.js","sourceRoot":"","sources":["../../src/CheckBoxGroup/CheckBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAShC,MAAM,CAAC,MAAM,QAAQ,GAAc,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACxE,oBAAC,YAAY,IAAC,EAAE,EAAE,EAAE;IAClB,oBAAC,IAAI,IAAC,GAAG,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,IACzB,QAAQ,CACJ;IAEP,+BAAO,IAAI,EAAC,UAAU,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAI;IAC7D,oBAAC,SAAS,OAAG,CACA,CAChB,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;sBAKP,KAAK,CAAC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;CAkB3C,CAAA;AAED,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;;;;;;;;;kBAaf,SAAS;0BACD,KAAK,CAAC,MAAM,CAAC,SAAS;0BACtB,KAAK,CAAC,MAAM,CAAC,SAAS;;;kBAG9B,SAAS;;;;;;MAMrB,SAAS;0BACW,KAAK,CAAC,MAAM,CAAC,UAAU;0BACvB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;;;;CAO/C,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mrshmllw/smores-react",
-  "version": "2.4.4",
+  "version": "2.4.5",
   "main": "./dist/index.js",
   "description": "Collection of React components used by Marshmallow Technology",
   "keywords": [