freemium-ui 1.0.217 → 1.0.218
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
## Installation
|
|
8
8
|
|
|
9
9
|
Peer Dependencies to be installed
|
|
10
|
+
|
|
10
11
|
```
|
|
11
12
|
npm install styled-components
|
|
12
13
|
```
|
|
@@ -19,25 +20,20 @@ npm install @freshdesk/freemium-ui
|
|
|
19
20
|
|
|
20
21
|
Please note that `@next` will only point to pre-releases; to get the latest stable release use `@latest` instead.
|
|
21
22
|
|
|
22
|
-
|
|
23
23
|
## Usage
|
|
24
24
|
|
|
25
25
|
Here is a quick example to get you started, **it's all you need**:
|
|
26
26
|
|
|
27
27
|
```jsx
|
|
28
|
-
import React from 'react'
|
|
29
|
-
import ReactDOM from 'react-dom'
|
|
30
|
-
import {
|
|
28
|
+
import React from 'react'
|
|
29
|
+
import ReactDOM from 'react-dom'
|
|
30
|
+
import {Button} from 'freemium-ui'
|
|
31
31
|
|
|
32
32
|
function App() {
|
|
33
|
-
return
|
|
34
|
-
<Button>
|
|
35
|
-
Freemium Button
|
|
36
|
-
</Button>
|
|
37
|
-
);
|
|
33
|
+
return <Button>Freemium Button</Button>
|
|
38
34
|
}
|
|
39
35
|
|
|
40
|
-
ReactDOM.render(<App />, document.querySelector('#app'))
|
|
36
|
+
ReactDOM.render(<App />, document.querySelector('#app'))
|
|
41
37
|
```
|
|
42
38
|
|
|
43
39
|
## Contribution
|
|
@@ -47,11 +43,15 @@ Install Dependencies
|
|
|
47
43
|
```
|
|
48
44
|
npm install
|
|
49
45
|
```
|
|
46
|
+
|
|
50
47
|
Start the app using storybook
|
|
48
|
+
|
|
51
49
|
```
|
|
52
50
|
npm run storybook
|
|
53
51
|
```
|
|
52
|
+
|
|
54
53
|
Build Freemium Ui Core Components
|
|
54
|
+
|
|
55
55
|
```
|
|
56
56
|
npm run build
|
|
57
57
|
```
|
|
@@ -65,6 +65,7 @@ npm login --registry=https://registry.npmjs.org/
|
|
|
65
65
|
```
|
|
66
66
|
|
|
67
67
|
Publish the package to npm
|
|
68
|
+
|
|
68
69
|
```
|
|
69
70
|
npm publish
|
|
70
71
|
```
|
package/lib/index.cjs.js
CHANGED
|
@@ -352,7 +352,7 @@ object-assign
|
|
|
352
352
|
&.selected {
|
|
353
353
|
background-color: ${({theme:{colors:{components:{menu:{menuItem:{selected:e}}}}}})=>e.background};
|
|
354
354
|
}
|
|
355
|
-
`,Os=n.forwardRef(((e,t)=>{const{id:r,position:a="bottom",idAccessor:o="id",nameAccessor:c="name",inline:i=!0,defaultSelectedItem:s={},size:l
|
|
355
|
+
`,Os=n.forwardRef(((e,t)=>{const{id:r,position:a="bottom",idAccessor:o="id",nameAccessor:c="name",inline:i=!0,defaultSelectedItem:s={},size:l,disabled:h,type:u="primary",onClick:p=(()=>{}),items:d=[]}=e,[m,v]=n.useState(null);return n.createElement(Is,null,n.createElement(po,{overrideStyleClassName:"nopadding",ref:t,inline:i,size:l,disabled:h,type:u,onClick:e=>{h||p(s,e)}},n.createElement("div",null,s[c]),d&&d.length>1&&n.createElement(Rs,{"aria-describedby":r,onClick:e=>{h||(e.stopPropagation(),v(e.currentTarget))}},n.createElement(Vn,{size:"8",viewBox:"0 0 8 8",glyph:"top"===a?"chevron-up":"chevron-down"}))),n.createElement(dc,{id:r,anchorEl:m,onClose:()=>v(null),anchorOrigin:{vertical:"bottom"===a?"bottom":"top",horizontal:"right"},transformOrigin:{vertical:"bottom"===a?"top":"bottom",horizontal:"right"}},n.createElement(Ns,null,n.createElement(_s,{idAccessor:o,nameAccessor:c,options:d.filter((e=>e[o]!==s[o])),onSelect:e=>{p(e),v(null)}}))))})),Is=tt.div`
|
|
356
356
|
& > button.nopadding {
|
|
357
357
|
display: flex;
|
|
358
358
|
padding: 0 !important;
|
package/lib/index.esm.js
CHANGED
|
@@ -352,7 +352,7 @@ object-assign
|
|
|
352
352
|
&.selected {
|
|
353
353
|
background-color: ${({theme:{colors:{components:{menu:{menuItem:{selected:e}}}}}})=>e.background};
|
|
354
354
|
}
|
|
355
|
-
`,pl=e.forwardRef(((t,n)=>{const{id:r,position:a="bottom",idAccessor:o="id",nameAccessor:c="name",inline:i=!0,defaultSelectedItem:s={},size:l
|
|
355
|
+
`,pl=e.forwardRef(((t,n)=>{const{id:r,position:a="bottom",idAccessor:o="id",nameAccessor:c="name",inline:i=!0,defaultSelectedItem:s={},size:l,disabled:h,type:d="primary",onClick:p=(()=>{}),items:u=[]}=t,[m,v]=e.useState(null);return e.createElement(ul,null,e.createElement(Fo,{overrideStyleClassName:"nopadding",ref:n,inline:i,size:l,disabled:h,type:d,onClick:e=>{h||p(s,e)}},e.createElement("div",null,s[c]),u&&u.length>1&&e.createElement(vl,{"aria-describedby":r,onClick:e=>{h||(e.stopPropagation(),v(e.currentTarget))}},e.createElement(er,{size:"8",viewBox:"0 0 8 8",glyph:"top"===a?"chevron-up":"chevron-down"}))),e.createElement(Wc,{id:r,anchorEl:m,onClose:()=>v(null),anchorOrigin:{vertical:"bottom"===a?"bottom":"top",horizontal:"right"},transformOrigin:{vertical:"bottom"===a?"top":"bottom",horizontal:"right"}},e.createElement(ml,null,e.createElement(ll,{idAccessor:o,nameAccessor:c,options:u.filter((e=>e[o]!==s[o])),onSelect:e=>{p(e),v(null)}}))))})),ul=Et.div`
|
|
356
356
|
& > button.nopadding {
|
|
357
357
|
display: flex;
|
|
358
358
|
padding: 0 !important;
|
|
@@ -10,4 +10,4 @@ export interface ModalProps {
|
|
|
10
10
|
customClass?: string;
|
|
11
11
|
customModalContentStyles?: {};
|
|
12
12
|
}
|
|
13
|
-
export declare const Modal: ({ children, isOpen, onDismiss, position, align, size, customModalContentStyles, customClass }: ModalProps) => JSX.Element;
|
|
13
|
+
export declare const Modal: ({ children, isOpen, onDismiss, position, align, size, customModalContentStyles, customClass, }: ModalProps) => JSX.Element;
|