├── .eslintrc
├── .gitignore
├── .nojekyll
├── .npmrc
├── .prettierignore
├── .prettierrc.json
├── CHANGELOG.md
├── CNAME
├── LICENSE
├── README.md
├── _coverpage.md
├── _navbar.md
├── _sidebar.md
├── bench
├── Box.js
├── Box_perf.js
├── cssModules.js
├── evokit
│ ├── checks.js
│ ├── className.js
│ ├── createBlock.js
│ ├── index.js
│ ├── utils.js
│ └── withProps.js
├── evokit_perf
│ ├── checks.js
│ ├── className.js
│ ├── createBlock.js
│ ├── index.js
│ ├── utils.js
│ └── withProps.js
├── index.js
├── package.json
└── utils.js
├── config
├── babel.config.js
├── jest.config.js
├── jest
│ ├── adapter.js
│ └── transformer.js
├── postcss.config.js
└── webpack
│ ├── index.config.js
│ ├── style.config.js
│ └── theme.config.js
├── demo
├── about
│ ├── css
│ │ ├── common.css
│ │ ├── custom.css
│ │ ├── evokit-box@3.0.1.css
│ │ ├── evokit-grid@3.0.1.css
│ │ ├── evokit-image@3.0.0.css
│ │ └── evokit-text@3.0.0.css
│ ├── images
│ │ ├── finish.png
│ │ ├── logo-bigl.svg
│ │ ├── logo-izi.svg
│ │ └── logo-prom.svg
│ ├── index.html
│ └── js
│ │ └── script.js
├── react-overflow-scrolling
│ ├── demo.js
│ └── index.html
└── slide
│ ├── css
│ ├── style.css
│ └── uikit.css
│ ├── index.html
│ ├── js
│ └── script.js
│ └── svg
│ ├── 1.svg
│ ├── 2-1.svg
│ ├── 2-2.svg
│ ├── 3-1.svg
│ ├── 3-2.svg
│ ├── 4-1.svg
│ ├── 4-2.svg
│ ├── 5-1.svg
│ ├── 5-2.svg
│ ├── 6-1.svg
│ ├── 6-2.svg
│ ├── 7-1.svg
│ ├── 7-2.svg
│ ├── jaba.png
│ ├── jdyn.png
│ ├── konec.jpg
│ ├── o4ki.png
│ ├── ogon.png
│ ├── povesilsa.png
│ ├── roja-1.png
│ ├── roja-2.png
│ └── roja-3.png
├── docs
├── _media
│ ├── apple-touch-icon.png
│ ├── css
│ │ ├── docsify.theme.css
│ │ └── tippy.css
│ ├── favicon-16x16.png
│ ├── favicon-32x32.png
│ ├── js
│ │ ├── docsify-copy-code.min.js
│ │ ├── docsify-external-script.min.js
│ │ ├── docsify.min.js
│ │ ├── docsify.plugin.emoji.min.js
│ │ ├── docsify.plugin.ga.min.js
│ │ ├── docsify.plugin.search.min.js
│ │ ├── popper.min.js
│ │ ├── prism-bash.min.js
│ │ ├── prism-jsx.min.js
│ │ ├── tippy-bundle.iife.min.js
│ │ └── vanilla-back-to-top.min.js
│ └── logo.svg
├── base
│ ├── create-block.md
│ ├── theme.md
│ ├── variables.md
│ └── with-props.md
├── deprecated
│ ├── removed_colors.md
│ ├── removed_mixes.md
│ ├── removed_panel.md
│ ├── removed_sizes.md
│ ├── removed_tags.md
│ ├── removed_text.md
│ └── removed_width.md
├── examples
│ ├── README.md
│ ├── _sidebar.md
│ ├── album.md
│ ├── prom-catalog.md
│ ├── prom-home.md
│ └── prom-product.md
├── future
│ └── README.md
├── getting-started
│ ├── installation.md
│ ├── introduction.md
│ ├── quick-start.md
│ └── webpack.md
└── props
│ ├── base.md
│ ├── media.md
│ └── variants.md
├── favicon.ico
├── index.html
├── lerna.json
├── new-block
├── index.js
└── template
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ └── Block.test.jsx
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ ├── index.js
│ ├── mixins.sss
│ ├── style.sss
│ └── theme.sss
│ └── webpack.config.js
├── package-lock.json
├── package.json
├── packages
├── evokit-body
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Body.background.test.jsx
│ │ ├── Body.color.test.jsx
│ │ ├── Body.display.test.jsx
│ │ ├── Body.indent.test.jsx
│ │ ├── Body.overflow-anchor.test.jsx
│ │ ├── Body.overflow.test.jsx
│ │ ├── Body.size.test.jsx
│ │ ├── Body.test.jsx
│ │ ├── Body.width.test.jsx
│ │ ├── BodySection.display.test.jsx
│ │ ├── BodySection.height.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Body.background.test.jsx.snap
│ │ │ ├── Body.color.test.jsx.snap
│ │ │ ├── Body.display.test.jsx.snap
│ │ │ ├── Body.indent.test.jsx.snap
│ │ │ ├── Body.overflow-anchor.test.jsx.snap
│ │ │ ├── Body.overflow.test.jsx.snap
│ │ │ ├── Body.size.test.jsx.snap
│ │ │ ├── Body.test.jsx.snap
│ │ │ ├── Body.width.test.jsx.snap
│ │ │ ├── BodySection.display.test.jsx.snap
│ │ │ └── BodySection.height.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-box
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Box.align.test.jsx
│ │ ├── Box.background.test.jsx
│ │ ├── Box.border.test.jsx
│ │ ├── Box.display.test.jsx
│ │ ├── Box.empty.test.jsx
│ │ ├── Box.height.test.jsx
│ │ ├── Box.margin.test.jsx
│ │ ├── Box.opacity.test.jsx
│ │ ├── Box.overflow.test.jsx
│ │ ├── Box.padding.test.jsx
│ │ ├── Box.place.test.jsx
│ │ ├── Box.position.test.jsx
│ │ ├── Box.round.test.jsx
│ │ ├── Box.test.jsx
│ │ ├── Box.width.test.jsx
│ │ ├── Box.zindex.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Box.align.test.jsx.snap
│ │ │ ├── Box.background.test.jsx.snap
│ │ │ ├── Box.border.test.jsx.snap
│ │ │ ├── Box.display.test.jsx.snap
│ │ │ ├── Box.empty.test.jsx.snap
│ │ │ ├── Box.height.test.jsx.snap
│ │ │ ├── Box.margin.test.jsx.snap
│ │ │ ├── Box.opacity.test.jsx.snap
│ │ │ ├── Box.overflow.test.jsx.snap
│ │ │ ├── Box.padding.test.jsx.snap
│ │ │ ├── Box.place.test.jsx.snap
│ │ │ ├── Box.position.test.jsx.snap
│ │ │ ├── Box.round.test.jsx.snap
│ │ │ ├── Box.test.jsx.snap
│ │ │ ├── Box.width.test.jsx.snap
│ │ │ └── Box.zindex.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-button
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Button.display.test.jsx
│ │ ├── Button.events.test.jsx
│ │ ├── Button.height.test.jsx
│ │ ├── Button.padding.test.jsx
│ │ ├── Button.round.test.jsx
│ │ ├── Button.size.test.jsx
│ │ ├── Button.test.jsx
│ │ ├── Button.theme.test.jsx
│ │ ├── Button.valign.test.jsx
│ │ ├── Button.weight.test.jsx
│ │ ├── Button.width.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Button.display.test.jsx.snap
│ │ │ ├── Button.events.test.jsx.snap
│ │ │ ├── Button.height.test.jsx.snap
│ │ │ ├── Button.padding.test.jsx.snap
│ │ │ ├── Button.round.test.jsx.snap
│ │ │ ├── Button.size.test.jsx.snap
│ │ │ ├── Button.test.jsx.snap
│ │ │ ├── Button.theme.test.jsx.snap
│ │ │ ├── Button.valign.test.jsx.snap
│ │ │ ├── Button.weight.test.jsx.snap
│ │ │ └── Button.width.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-flex
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Flex.content.test.jsx
│ │ ├── Flex.direction.test.jsx
│ │ ├── Flex.display.test.jsx
│ │ ├── Flex.height.test.jsx
│ │ ├── Flex.items.test.jsx
│ │ ├── Flex.test.jsx
│ │ ├── Flex.wrap.test.jsx
│ │ ├── FlexItem.align.test.jsx
│ │ ├── FlexItem.display.test.jsx
│ │ ├── FlexItem.empty.test.jsx
│ │ ├── FlexItem.order.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Flex.content.test.jsx.snap
│ │ │ ├── Flex.direction.test.jsx.snap
│ │ │ ├── Flex.display.test.jsx.snap
│ │ │ ├── Flex.height.test.jsx.snap
│ │ │ ├── Flex.items.test.jsx.snap
│ │ │ ├── Flex.test.jsx.snap
│ │ │ ├── Flex.wrap.test.jsx.snap
│ │ │ ├── FlexItem.align.test.jsx.snap
│ │ │ ├── FlexItem.display.test.jsx.snap
│ │ │ ├── FlexItem.empty.test.jsx.snap
│ │ │ └── FlexItem.order.test.jsx.snap
│ ├── _media
│ │ ├── align-content.svg
│ │ ├── align-self.svg
│ │ ├── direction.svg
│ │ ├── flex-items.svg
│ │ ├── justify-content.svg
│ │ └── wrap.svg
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ └── style.sss
│ └── webpack.config.js
├── evokit-grid
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Grid.align.test.jsx
│ │ ├── Grid.column.test.jsx
│ │ ├── Grid.direction.test.jsx
│ │ ├── Grid.display.test.jsx
│ │ ├── Grid.divider-column.test.jsx
│ │ ├── Grid.divider-indent.test.jsx
│ │ ├── Grid.divider.test.jsx
│ │ ├── Grid.height.test.jsx
│ │ ├── Grid.indent.test.jsx
│ │ ├── Grid.test.jsx
│ │ ├── Grid.valign.test.jsx
│ │ ├── Grid.wrap.test.jsx
│ │ ├── GridItem.display.test.jsx
│ │ ├── GridItem.order.test.jsx
│ │ ├── GridItem.width.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Grid.align.test.jsx.snap
│ │ │ ├── Grid.column.test.jsx.snap
│ │ │ ├── Grid.direction.test.jsx.snap
│ │ │ ├── Grid.display.test.jsx.snap
│ │ │ ├── Grid.divider-column.test.jsx.snap
│ │ │ ├── Grid.divider-indent.test.jsx.snap
│ │ │ ├── Grid.divider.test.jsx.snap
│ │ │ ├── Grid.height.test.jsx.snap
│ │ │ ├── Grid.indent.test.jsx.snap
│ │ │ ├── Grid.test.jsx.snap
│ │ │ ├── Grid.valign.test.jsx.snap
│ │ │ ├── Grid.wrap.test.jsx.snap
│ │ │ ├── GridItem.display.test.jsx.snap
│ │ │ ├── GridItem.order.test.jsx.snap
│ │ │ └── GridItem.width.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-image
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Image.align.test.jsx
│ │ ├── Image.alt.test.jsx
│ │ ├── Image.background.test.jsx
│ │ ├── Image.border.test.jsx
│ │ ├── Image.display.test.jsx
│ │ ├── Image.fit.test.jsx
│ │ ├── Image.height.test.jsx
│ │ ├── Image.mirror.test.jsx
│ │ ├── Image.round.test.jsx
│ │ ├── Image.test.jsx
│ │ ├── Image.valign.test.jsx
│ │ ├── Image.width.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Image.align.test.jsx.snap
│ │ │ ├── Image.alt.test.jsx.snap
│ │ │ ├── Image.background.test.jsx.snap
│ │ │ ├── Image.border.test.jsx.snap
│ │ │ ├── Image.display.test.jsx.snap
│ │ │ ├── Image.fit.test.jsx.snap
│ │ │ ├── Image.height.test.jsx.snap
│ │ │ ├── Image.mirror.test.jsx.snap
│ │ │ ├── Image.round.test.jsx.snap
│ │ │ ├── Image.test.jsx.snap
│ │ │ ├── Image.valign.test.jsx.snap
│ │ │ └── Image.width.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-line
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Line.color.test.jsx
│ │ ├── Line.display.test.jsx
│ │ ├── Line.indent.test.jsx
│ │ ├── Line.style.test.jsx
│ │ ├── Line.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Line.color.test.jsx.snap
│ │ │ ├── Line.display.test.jsx.snap
│ │ │ ├── Line.indent.test.jsx.snap
│ │ │ ├── Line.style.test.jsx.snap
│ │ │ └── Line.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-link
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Link.color.test.jsx
│ │ ├── Link.display.test.jsx
│ │ ├── Link.lheight.test.jsx
│ │ ├── Link.size.test.jsx
│ │ ├── Link.style.test.jsx
│ │ ├── Link.test.jsx
│ │ ├── Link.valign.test.jsx
│ │ ├── Link.weight.test.jsx
│ │ ├── Link.wrap.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Link.color.test.jsx.snap
│ │ │ ├── Link.display.test.jsx.snap
│ │ │ ├── Link.lheight.test.jsx.snap
│ │ │ ├── Link.size.test.jsx.snap
│ │ │ ├── Link.style.test.jsx.snap
│ │ │ ├── Link.test.jsx.snap
│ │ │ ├── Link.valign.test.jsx.snap
│ │ │ ├── Link.weight.test.jsx.snap
│ │ │ └── Link.wrap.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-list
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── List.color.test.jsx
│ │ ├── List.display.test.jsx
│ │ ├── List.divider-indent.test.jsx
│ │ ├── List.divider.test.jsx
│ │ ├── List.indent.test.jsx
│ │ ├── List.style.test.jsx
│ │ ├── List.test.jsx
│ │ ├── ListItem.display.test.jsx
│ │ └── __snapshots__
│ │ │ ├── List.color.test.jsx.snap
│ │ │ ├── List.display.test.jsx.snap
│ │ │ ├── List.divider-indent.test.jsx.snap
│ │ │ ├── List.divider.test.jsx.snap
│ │ │ ├── List.indent.test.jsx.snap
│ │ │ ├── List.style.test.jsx.snap
│ │ │ ├── List.test.jsx.snap
│ │ │ └── ListItem.display.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-picture
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Picture.background.test.jsx
│ │ ├── Picture.border.test.jsx
│ │ ├── Picture.display.test.jsx
│ │ ├── Picture.fit.test.jsx
│ │ ├── Picture.round.test.jsx
│ │ ├── Picture.test.jsx
│ │ ├── PictureItem.display.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Picture.background.test.jsx.snap
│ │ │ ├── Picture.border.test.jsx.snap
│ │ │ ├── Picture.display.test.jsx.snap
│ │ │ ├── Picture.fit.test.jsx.snap
│ │ │ ├── Picture.round.test.jsx.snap
│ │ │ ├── Picture.test.jsx.snap
│ │ │ └── PictureItem.display.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
├── evokit-text
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ │ ├── Text.align.test.jsx
│ │ ├── Text.color.test.jsx
│ │ ├── Text.display.test.jsx
│ │ ├── Text.lheight.test.jsx
│ │ ├── Text.size.test.jsx
│ │ ├── Text.style.test.jsx
│ │ ├── Text.test.jsx
│ │ ├── Text.transform.test.jsx
│ │ ├── Text.valign.test.jsx
│ │ ├── Text.weight.test.jsx
│ │ ├── Text.wrap.test.jsx
│ │ └── __snapshots__
│ │ │ ├── Text.align.test.jsx.snap
│ │ │ ├── Text.color.test.jsx.snap
│ │ │ ├── Text.display.test.jsx.snap
│ │ │ ├── Text.lheight.test.jsx.snap
│ │ │ ├── Text.size.test.jsx.snap
│ │ │ ├── Text.style.test.jsx.snap
│ │ │ ├── Text.test.jsx.snap
│ │ │ ├── Text.transform.test.jsx.snap
│ │ │ ├── Text.valign.test.jsx.snap
│ │ │ ├── Text.weight.test.jsx.snap
│ │ │ └── Text.wrap.test.jsx.snap
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ │ ├── index.js
│ │ ├── mixins.sss
│ │ ├── style.sss
│ │ └── theme.sss
│ └── webpack.config.js
└── evokit
│ ├── .npmignore
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── __tests__
│ ├── __snapshots__
│ │ ├── createBlock.test.js.snap
│ │ └── withProps.test.js.snap
│ ├── className.test.js
│ ├── createBlock.test.js
│ └── withProps.test.js
│ ├── index.js
│ ├── jest.config.js
│ ├── package.json
│ ├── src
│ ├── checks.js
│ ├── className.js
│ ├── createBlock.js
│ ├── index.js
│ ├── utils.js
│ └── withProps.js
│ └── webpack.config.js
├── public
├── dev.ec9e6aad4c1b97175340.js
├── dev.html
├── theming.ec9e6aad4c1b97175340.js
├── theming.html
└── vendor.ec9e6aad4c1b97175340.js
├── server.js
├── src
├── dev
│ ├── App.jsx
│ ├── UI
│ │ ├── Body
│ │ │ └── index.js
│ │ ├── Box
│ │ │ ├── index.js
│ │ │ ├── style.css
│ │ │ └── themes
│ │ │ │ └── evokit-box@3.1.0-red.css
│ │ ├── Button
│ │ │ ├── index.js
│ │ │ ├── style.css
│ │ │ └── themes
│ │ │ │ ├── TEMPLATE_NAME.css
│ │ │ │ ├── evokit-button@3.0.0-beta.0-blue.css
│ │ │ │ ├── evokit-button@testing-simple.css
│ │ │ │ └── evokit-button@testing-switcher.css
│ │ ├── Flex
│ │ │ └── index.js
│ │ ├── Grid
│ │ │ ├── index.js
│ │ │ ├── style.css
│ │ │ └── themes
│ │ │ │ └── evokit-grid@3.1.0-red.css
│ │ ├── Image
│ │ │ ├── index.js
│ │ │ ├── style.css
│ │ │ └── themes
│ │ │ │ ├── evokit-image@3.2.0-green.css
│ │ │ │ └── evokit-image@3.2.0-red.css
│ │ ├── Line
│ │ │ └── index.js
│ │ ├── Link
│ │ │ └── index.js
│ │ ├── List
│ │ │ ├── index.js
│ │ │ ├── style.css
│ │ │ └── themes
│ │ │ │ └── evokit-list@3.1.0-red.css
│ │ ├── Picture
│ │ │ └── index.js
│ │ └── Text
│ │ │ └── index.js
│ ├── data.js
│ └── index.jsx
└── theming
│ ├── ThemeGenerator
│ ├── LinkChangeLog.jsx
│ ├── PartTheme.jsx
│ ├── SelectPackage.jsx
│ ├── SwitchBox.jsx
│ ├── index.jsx
│ ├── style.css
│ └── utils.js
│ ├── UI
│ ├── index.js
│ ├── themes
│ │ ├── evokit-body@3.0.0-muted.css
│ │ ├── evokit-box@3.0.2-muted.css
│ │ ├── evokit-box@3.0.2-white.css
│ │ ├── evokit-button-blue.css
│ │ └── evokit-text@3.0.0-muted.css
│ └── vars
│ │ ├── evokit-body@3.0.1.css
│ │ └── evokit-button.css
│ └── index.jsx
└── webpack.config.js
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | dist
3 | lerna-debug.log
4 | .DS_Store
5 | packages/evokit/dist
6 | packages/evokit-*/index.js
7 | packages/*/style.css
8 | packages/*/style@*.css
9 | packages/*/theme.css
10 |
--------------------------------------------------------------------------------
/.nojekyll:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/docccdev/evokit/2ff5bec85b3591a51047cac3475358f45ce345d8/.nojekyll
--------------------------------------------------------------------------------
/.npmrc:
--------------------------------------------------------------------------------
1 | save-exact=true
2 | node-options="--openssl-legacy-provider"
3 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | coverage
3 | dist
4 | bench
5 | public
6 | new-block
7 | *.md
8 | *.html
9 | *.min.js
10 | packages/*/index.js
11 | package-lock.json
12 | lerna.json
13 |
--------------------------------------------------------------------------------
/.prettierrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "useTabs": false,
3 | "tabWidth": 4,
4 | "jsxSingleQuote": true,
5 | "printWidth": 120,
6 | "singleQuote": true,
7 | "singleAttributePerLine": true
8 | }
9 |
--------------------------------------------------------------------------------
/CNAME:
--------------------------------------------------------------------------------
1 | evokit.net
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2019 Марченко Евгений Сергеевич
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # EvoKit
2 |
3 | [](https://gitter.im/evokit/community?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
4 |
5 | Tool for creating UI React blocks.
6 |
7 | ---
8 |
9 | ## Concept
10 |
11 | ``` jsx
12 | const MyBlock = createBlock('div', 'block', ['padding']);
13 |
14 | // usage
15 |
', () => { 8 | it('props body-background', () => { 9 | const wrapper = shallow(
); 10 | expect(wrapper).toMatchSnapshot(); 11 | 12 | expect(wrapper.html()).toEqual('
', () => { 8 | it('props body-color', () => { 9 | const wrapper = shallow(
); 10 | expect(wrapper).toMatchSnapshot(); 11 | 12 | expect(wrapper.html()).toEqual('
', () => { 8 | it('props body-display', () => { 9 | const wrapper = shallow(
); 10 | expect(wrapper).toMatchSnapshot(); 11 | 12 | expect(wrapper.html()).toEqual('
', () => { 8 | it('props body-overflow-anchor', () => { 9 | const wrapper = shallow(
); 10 | expect(wrapper).toMatchSnapshot(); 11 | 12 | expect(wrapper.html()).toEqual('
', () => { 8 | it('props body-size', () => { 9 | const wrapper = shallow(
); 10 | expect(wrapper).toMatchSnapshot(); 11 | 12 | expect(wrapper.html()).toEqual('
props body-background 1`] = ` 4 |
7 | `; 8 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.color.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`
props body-color 1`] = ` 4 |
7 | `; 8 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.display.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`
props body-display 1`] = ` 4 |
7 | `; 8 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.indent.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`
props body-indent 1`] = ` 4 |
7 | `; 8 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.overflow-anchor.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`
props body-overflow-anchor 1`] = ` 4 |
7 | `; 8 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.overflow.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`
extend 2 props body-overflow 1`] = ` 4 |
7 | `; 8 | 9 | exports[`
props body-overflow 1`] = ` 10 |
13 | `; 14 | 15 | exports[`
props body-overflow-x 1`] = ` 16 |
19 | `; 20 | 21 | exports[`
props body-overflow-y 1`] = ` 22 |
25 | `; 26 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.size.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`DEPRECATED
props body-size 1`] = ` 4 |
7 | `; 8 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`
props body-tag 1`] = ` 4 | 7 | `; 8 | 9 | exports[`
props body-tag 2`] = ` 10 | 13 | `; 14 | 15 | exports[`
props className 1`] = ` 16 |
19 | `; 20 | 21 | exports[`
props className 2`] = ` 22 |
25 | `; 26 | 27 | exports[`
render 1`] = ` 28 |
31 | `; 32 | 33 | exports[`
render 2`] = ` 34 |
37 | `; 38 | -------------------------------------------------------------------------------- /packages/evokit-body/__tests__/__snapshots__/Body.width.test.jsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`
extend 2 props body-width 1`] = ` 4 |
7 | `; 8 | 9 | exports[`
props body-width 1`] = ` 10 |
13 | `; 14 | 15 | exports[`
props body-width-max 1`] = ` 16 |
19 | `; 20 | 21 | exports[`
props body-width-min 1`] = ` 22 |
25 | `;
26 |
--------------------------------------------------------------------------------
/packages/evokit-body/__tests__/__snapshots__/BodySection.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-body/__tests__/__snapshots__/BodySection.height.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-body/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-body/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-body",
3 | "version": "3.2.0",
4 | "description": "Used for body of the web page and sets the basic styles",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-body/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "body"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-body/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const Body = createBlock('body', 'body', [
4 | 'background',
5 | 'color',
6 | 'display',
7 | 'indent',
8 | 'overflow-anchor',
9 | ['overflow', [
10 | 'overflow-x',
11 | 'overflow-y',
12 | ]],
13 | ['width', [
14 | 'width-min',
15 | 'width-max',
16 | ]],
17 | // DEPRECATED
18 | 'size',
19 | ]);
20 |
21 | export const BodySection = createBlock('div', 'body__section', [
22 | 'display',
23 | 'height',
24 | ]);
25 |
26 | Body.Section = BodySection;
27 |
--------------------------------------------------------------------------------
/packages/evokit-body/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-body-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-body-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-body-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-body-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-body-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
--------------------------------------------------------------------------------
/packages/evokit-body/src/theme.sss:
--------------------------------------------------------------------------------
1 | @import './mixins.sss'
2 |
3 | :root
4 | --ek-body-background-TEMPLATE_NAME: var(--background)
5 | --ek-body-color-TEMPLATE_NAME: var(--color)
6 |
7 | @mixin media .body_background_TEMPLATE_NAME
8 | background: var(--ek-body-background-TEMPLATE_NAME)
9 |
10 | @mixin media .body_color_TEMPLATE_NAME
11 | color: var(--ek-body-color-TEMPLATE_NAME)
12 |
--------------------------------------------------------------------------------
/packages/evokit-body/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitBody'),
7 | makeStyleConfig(__dirname, 'body'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-box/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/Box.align.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Box } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-box_align_none').exists()).toBeTruthy();
19 | expect(css.rule('.ek-box_align_left').exists()).toBeTruthy();
20 | expect(css.rule('.ek-box_align_center').exists()).toBeTruthy();
21 | expect(css.rule('.ek-box_align_right').exists()).toBeTruthy();
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/Box.background.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../theme.css';
5 | import { Box } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-box_background_TEMPLATE_NAME').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/Box.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Box } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-box_display_block').exists()).toBeTruthy();
19 | expect(css.rule('.ek-box_display_inline-block').exists()).toBeTruthy();
20 | expect(css.rule('.ek-box_display_inline').exists()).toBeTruthy();
21 | expect(css.rule('.ek-box_display_none').exists()).toBeTruthy();
22 | expect(css.rule('.ek-box_display_none\:empty:empty').exists()).toBeTruthy();
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/Box.empty.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Box } from '../src';
6 |
7 | describe('DEPRECATED
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-box_empty_hidden:empty').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/Box.height.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Box } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-box_height_auto').exists()).toBeTruthy();
19 | expect(css.rule('.ek-box_height_1-1').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/Box.width.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Box } from '../src';
6 |
7 | const range = (start, end) => {
8 | if (start === end) return [start];
9 | return [start, ...range(start + 1, end)];
10 | };
11 |
12 | describe('
');
18 | });
19 |
20 | it('css', () => {
21 | const css = barista({ content: style });
22 |
23 | expect(css.rule(`.ek-box_width_auto`).exists()).toBeTruthy();
24 |
25 | range(1, 10).forEach((from) => {
26 | range(from, 10).filter((to) => to > from || (from == 1 && to == 1)).forEach((to) => {
27 | expect(css.rule(`.ek-box_width_${from}-${to}`).exists()).toBeTruthy();
28 | });
29 | });
30 | });
31 | });
32 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.align.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.background.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.border.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
21 | exports[`
25 | `;
26 |
27 | exports[`
31 | `;
32 |
33 | exports[`
37 | `;
38 |
39 | exports[`
43 | `;
44 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.empty.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`DEPRECATED
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.height.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.opacity.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.overflow.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
21 | exports[`
25 | `;
26 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.place.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.position.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.width.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/__tests__/__snapshots__/Box.zindex.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-box/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-box/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-box",
3 | "version": "3.4.0",
4 | "description": "The content block allows to apply indents, position and more",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-box/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "box"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-box/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-box-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-box-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-box-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-box-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-box-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
--------------------------------------------------------------------------------
/packages/evokit-box/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitBox'),
7 | makeStyleConfig(__dirname, 'box'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/Button.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Button } from '../src';
6 |
7 | describe('', () => {
8 | it('props button-display', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-button_display_inline-flex').exists()).toBeTruthy();
19 | expect(css.rule('.ek-button_display_none').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/Button.events.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Button } from '../src';
6 |
7 | describe('', () => {
8 | it('props button-events', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-button_events_none').exists()).toBeTruthy();
19 | expect(css.rule('.ek-button_events_auto').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/Button.height.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Button } from '../src';
6 |
7 | describe('', () => {
8 | it('props button-height', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-button_height_auto').exists()).toBeTruthy();
19 | expect(css.rule('.ek-button_height_inherit').exists()).toBeTruthy();
20 | expect(css.rule('.ek-button_height_1-1').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/Button.theme.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../theme.css';
5 | import { Button } from '../src';
6 |
7 | describe('', () => {
8 | it('props button-theme', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-button_theme_TEMPLATE_NAME').exists()).toBeTruthy();
19 | expect(css.rule('.ek-button_theme_TEMPLATE_NAME:focus').exists()).toBeTruthy();
20 | expect(css.rule('.ek-button_theme_TEMPLATE_NAME:hover').exists()).toBeTruthy();
21 | expect(css.rule('.ek-button_theme_TEMPLATE_NAME:active').exists()).toBeTruthy();
22 | expect(css.rule('.ek-button_theme_TEMPLATE_NAME:disabled').exists()).toBeTruthy();
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/Button.weight.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Button } from '../src';
6 |
7 | describe('', () => {
8 | it('props button-weight', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-button_weight_thin').exists()).toBeTruthy();
19 | expect(css.rule('.ek-button_weight_light').exists()).toBeTruthy();
20 | expect(css.rule('.ek-button_weight_normal').exists()).toBeTruthy();
21 | expect(css.rule('.ek-button_weight_medium').exists()).toBeTruthy();
22 | expect(css.rule('.ek-button_weight_bold').exists()).toBeTruthy();
23 | expect(css.rule('.ek-button_weight_black').exists()).toBeTruthy();
24 | });
25 | });
26 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/Button.width.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Button } from '../src';
6 |
7 | describe('', () => {
8 | it('props button-width', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-button_width_auto').exists()).toBeTruthy();
19 | expect(css.rule('.ek-button_width_inherit').exists()).toBeTruthy();
20 | expect(css.rule('.ek-button_width_1-1').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-display 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.events.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-events 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.height.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-height 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.size.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-size 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-as 1`] = `
4 |
7 | `;
8 |
9 | exports[` props className 1`] = `
10 |
13 | `;
14 |
15 | exports[` render 1`] = `
16 |
19 | `;
20 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.theme.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-theme 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.valign.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-valign 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.weight.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-weight 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/__tests__/__snapshots__/Button.width.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props button-width 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-button/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-button/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-button",
3 | "version": "3.0.2",
4 | "description": "Just a button",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-button/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "button"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-button/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const Button = createBlock('button', 'button', [
4 | 'display',
5 | 'events',
6 | 'height',
7 | 'size',
8 | 'theme',
9 | 'valign',
10 | 'weight',
11 | 'width',
12 | ['padding', [
13 | ['padding-top', 'padding-bottom'],
14 | ['padding-right', 'padding-left'],
15 | 'padding-bottom',
16 | 'padding-left',
17 | ]],
18 | ['round', [
19 | ['round-top-left', 'round-bottom-right'],
20 | ['round-top-right', 'round-bottom-left'],
21 | 'round-bottom-right',
22 | 'round-bottom-left',
23 | ]],
24 | ]);
25 |
--------------------------------------------------------------------------------
/packages/evokit-button/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-button-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-button-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-button-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-button-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-button-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
25 | @define-mixin hover $selector
26 | @media (hover), (min-width:0\0), (min--moz-device-pixel-ratio:0)
27 | $(selector)
28 | &:hover
29 | @mixin-content
30 |
--------------------------------------------------------------------------------
/packages/evokit-button/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitButton'),
7 | makeStyleConfig(__dirname, 'button'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-flex/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/Flex.direction.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Flex } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex_direction_row').exists()).toBeTruthy();
19 | expect(css.rule('.ek-flex_direction_row-reverse').exists()).toBeTruthy();
20 | expect(css.rule('.ek-flex_direction_column').exists()).toBeTruthy();
21 | expect(css.rule('.ek-flex_direction_column-reverse').exists()).toBeTruthy();
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/Flex.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Flex } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex_display_flex').exists()).toBeTruthy();
19 | expect(css.rule('.ek-flex_display_inline-flex').exists()).toBeTruthy();
20 | expect(css.rule('.ek-flex_display_none').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/Flex.height.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Flex } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex_height_inherit').exists()).toBeTruthy();
19 | expect(css.rule('.ek-flex_height_auto').exists()).toBeTruthy();
20 | expect(css.rule('.ek-flex_height_1-1').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/Flex.items.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Flex } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex_items_start').exists()).toBeTruthy();
19 | expect(css.rule('.ek-flex_items_end').exists()).toBeTruthy();
20 | expect(css.rule('.ek-flex_items_center').exists()).toBeTruthy();
21 | expect(css.rule('.ek-flex_items_baseline').exists()).toBeTruthy();
22 | expect(css.rule('.ek-flex_items_stretch').exists()).toBeTruthy();
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/Flex.wrap.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Flex } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex_wrap_nowrap').exists()).toBeTruthy();
19 | expect(css.rule('.ek-flex_wrap_wrap').exists()).toBeTruthy();
20 | expect(css.rule('.ek-flex_wrap_wrap-reverse').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/FlexItem.align.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { FlexItem } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex__item_align_start').exists()).toBeTruthy();
19 | expect(css.rule('.ek-flex__item_align_end').exists()).toBeTruthy();
20 | expect(css.rule('.ek-flex__item_align_center').exists()).toBeTruthy();
21 | expect(css.rule('.ek-flex__item_align_baseline').exists()).toBeTruthy();
22 | expect(css.rule('.ek-flex__item_align_stretch').exists()).toBeTruthy();
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/FlexItem.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { FlexItem } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex__item_display_block').exists()).toBeTruthy();
19 | expect(css.rule('.ek-flex__item_display_none').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/FlexItem.empty.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { FlexItem } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-flex__item_empty_hidden:empty').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/Flex.content.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
21 | exports[`
25 | `;
26 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/Flex.direction.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/Flex.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/Flex.height.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/Flex.items.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/Flex.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
31 | `;
32 |
33 | exports[`
37 | `;
38 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/Flex.wrap.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/FlexItem.align.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/FlexItem.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/FlexItem.empty.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/__tests__/__snapshots__/FlexItem.order.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-flex/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-flex/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-flex",
3 | "version": "3.2.1",
4 | "description": "The block for building flexible layouts",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-flex/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "flex"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-flex/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const Flex = createBlock('div', 'flex', [
4 | 'direction',
5 | 'display',
6 | 'height',
7 | 'items',
8 | 'wrap',
9 | ['content', [
10 | 'content-align',
11 | 'content-justify',
12 | ]],
13 | ]);
14 |
15 | export const FlexItem = createBlock('div', 'flex__item', [
16 | 'align',
17 | 'display',
18 | 'empty',
19 | 'order',
20 | ]);
21 |
22 | Flex.Item = FlexItem;
23 |
--------------------------------------------------------------------------------
/packages/evokit-flex/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-flex-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-flex-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-flex-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-flex-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-flex-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
--------------------------------------------------------------------------------
/packages/evokit-flex/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 |
4 | module.exports = [
5 | makeIndexConfig(__dirname, 'EvoKitFlex'),
6 | makeStyleConfig(__dirname, 'flex')
7 | ];
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/Grid.align.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Grid } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid_align_left').exists()).toBeTruthy();
19 | expect(css.rule('.ek-grid_align_center').exists()).toBeTruthy();
20 | expect(css.rule('.ek-grid_align_right').exists()).toBeTruthy();
21 | expect(css.rule('.ek-grid_align_justify').exists()).toBeTruthy();
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/Grid.direction.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Grid } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid_direction_row').exists()).toBeTruthy();
19 | expect(css.rule('.ek-grid_direction_row-reverse').exists()).toBeTruthy();
20 | expect(css.rule('.ek-grid_direction_column').exists()).toBeTruthy();
21 | expect(css.rule('.ek-grid_direction_column-reverse').exists()).toBeTruthy();
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/Grid.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Grid } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid_display_flex').exists()).toBeTruthy();
19 | expect(css.rule('.ek-grid_display_none').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/Grid.divider.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../theme.css';
5 | import { Grid } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid_divider_TEMPLATE_NAME > .ek-grid__item').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/Grid.height.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Grid } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid_height_auto').exists()).toBeTruthy();
19 | expect(css.rule('.ek-grid_height_inherit').exists()).toBeTruthy();
20 | expect(css.rule('.ek-grid_height_1-1').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/Grid.valign.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Grid } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid_valign_top').exists()).toBeTruthy();
19 | expect(css.rule('.ek-grid_valign_middle').exists()).toBeTruthy();
20 | expect(css.rule('.ek-grid_valign_bottom').exists()).toBeTruthy();
21 | expect(css.rule('.ek-grid_valign_baseline').exists()).toBeTruthy();
22 | expect(css.rule('.ek-grid_valign_justify').exists()).toBeTruthy();
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/Grid.wrap.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Grid } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid_wrap_wrap').exists()).toBeTruthy();
19 | expect(css.rule('.ek-grid_wrap_nowrap').exists()).toBeTruthy();
20 | expect(css.rule('.ek-grid_wrap_wrap-reverse').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/GridItem.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { GridItem } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-grid__item_display_block').exists()).toBeTruthy();
19 | expect(css.rule('.ek-grid__item_display_none').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/GridItem.width.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { GridItem } from '../src';
6 |
7 | const range = (start, end) => {
8 | if (start === end) return [start];
9 | return [start, ...range(start + 1, end)];
10 | };
11 |
12 | describe('
');
18 | });
19 |
20 | it('css', () => {
21 | const css = barista({ content: style });
22 |
23 | expect(css.rule(`.ek-grid__item_width_auto`).exists()).toBeTruthy();
24 | expect(css.rule(`.ek-grid__item_width_expand`).exists()).toBeTruthy();
25 |
26 | range(1, 10).forEach((from) => {
27 | range(from, 10).filter((to) => to > from || (from == 1 && to == 1)).forEach((to) => {
28 | expect(css.rule(`.ek-grid__item_width_${from}-${to}`).exists()).toBeTruthy();
29 | });
30 | });
31 | });
32 | });
33 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.align.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.column.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.direction.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.divider-column.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.divider-indent.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
21 | exports[`
25 | `;
26 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.divider.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.height.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.indent.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
21 | exports[`
25 | `;
26 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
31 | `;
32 |
33 | exports[`
37 | `;
38 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.valign.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/Grid.wrap.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/GridItem.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/GridItem.order.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/__tests__/__snapshots__/GridItem.width.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-grid/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-grid/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-grid",
3 | "version": "3.3.0",
4 | "description": "The grid for placing content on the page, has 10 columns",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-grid/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "grid"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-grid/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const Grid = createBlock('div', 'grid', [
4 | 'align',
5 | 'column',
6 | 'direction',
7 | 'display',
8 | 'divider',
9 | 'divider-column',
10 | 'height',
11 | 'valign',
12 | 'wrap',
13 | ['divider-indent', [
14 | 'divider-indent-x',
15 | 'divider-indent-y',
16 | ]],
17 | ['indent', [
18 | 'indent-x',
19 | 'indent-y',
20 | ]],
21 | ]);
22 |
23 | export const GridItem = createBlock('div', 'grid__item', [
24 | 'display',
25 | 'order',
26 | 'width',
27 | ]);
28 |
29 | Grid.Item = GridItem;
30 |
--------------------------------------------------------------------------------
/packages/evokit-grid/src/theme.sss:
--------------------------------------------------------------------------------
1 | @import './mixins.sss'
2 |
3 | :root
4 | --ek-grid-border-TEMPLATE_NAME: var(--border)
5 |
6 | @mixin media .grid_divider_TEMPLATE_NAME
7 |
8 | & > .grid__item
9 | border: 0 solid var(--ek-grid-border-TEMPLATE_NAME)
10 |
11 | & + .grid__item
12 | border-left-width: 1px
13 |
--------------------------------------------------------------------------------
/packages/evokit-grid/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitGrid'),
7 | makeStyleConfig(__dirname, 'grid'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-image/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.align.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | describe('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_align_left').exists()).toBeTruthy();
19 | expect(css.rule('.ek-image_align_center').exists()).toBeTruthy();
20 | expect(css.rule('.ek-image_align_right').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.alt.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_alt_visible[alt]').exists()).toBeTruthy();
19 | expect(css.rule('.ek-image_alt_hidden[alt]').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.background.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../theme.css';
5 | import { Image } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_background_TEMPLATE_NAME').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_display_inline').exists()).toBeTruthy();
19 | expect(css.rule('.ek-image_display_block').exists()).toBeTruthy();
20 | expect(css.rule('.ek-image_display_none').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.fit.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_fit_none').exists()).toBeTruthy();
19 | expect(css.rule('.ek-image_fit_fill').exists()).toBeTruthy();
20 | expect(css.rule('.ek-image_fit_contain').exists()).toBeTruthy();
21 | expect(css.rule('.ek-image_fit_cover').exists()).toBeTruthy();
22 | expect(css.rule('.ek-image_fit_scale-down').exists()).toBeTruthy();
23 | });
24 | });
25 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.height.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_height_auto').exists()).toBeTruthy();
19 | expect(css.rule('.ek-image_height_1-1').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.mirror.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_mirror_x').exists()).toBeTruthy();
19 | expect(css.rule('.ek-image_mirror_y').exists()).toBeTruthy();
20 | expect(css.rule('.ek-image_mirror_xy').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.valign.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-image_valign_baseline').exists()).toBeTruthy();
19 | expect(css.rule('.ek-image_valign_bottom').exists()).toBeTruthy();
20 | expect(css.rule('.ek-image_valign_middle').exists()).toBeTruthy();
21 | expect(css.rule('.ek-image_valign_sub').exists()).toBeTruthy();
22 | expect(css.rule('.ek-image_valign_super').exists()).toBeTruthy();
23 | expect(css.rule('.ek-image_valign_text-bottom').exists()).toBeTruthy();
24 | expect(css.rule('.ek-image_valign_text-top').exists()).toBeTruthy();
25 | expect(css.rule('.ek-image_valign_top').exists()).toBeTruthy();
26 | });
27 | });
28 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/Image.width.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Image } from '../src';
6 |
7 | const range = (start, end) => {
8 | if (start === end) return [start];
9 | return [start, ...range(start + 1, end)];
10 | };
11 |
12 | describe('
');
18 | });
19 |
20 | it('css', () => {
21 | const css = barista({ content: style });
22 |
23 | expect(css.rule('.ek-image_width_auto').exists()).toBeTruthy();
24 |
25 | range(1, 10).forEach((from) => {
26 | range(from, 10).filter((to) => to > from || (from == 1 && to == 1)).forEach((to) => {
27 | console.log(from, to);
28 | expect(css.rule(`.ek-image_width_${from}-${to}`).exists()).toBeTruthy();
29 | });
30 | });
31 | });
32 | });
33 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.align.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.alt.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.background.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.border.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
13 | `;
14 |
15 | exports[`
19 | `;
20 |
21 | exports[`
25 | `;
26 |
27 | exports[`
31 | `;
32 |
33 | exports[`
37 | `;
38 |
39 | exports[`
43 | `;
44 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.fit.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.height.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.mirror.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
9 | `;
10 |
11 | exports[`
23 | `;
24 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.valign.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/__tests__/__snapshots__/Image.width.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-image/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-image/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-image",
3 | "version": "3.2.0",
4 | "description": "Used to display the image",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-image/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "image"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-image/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const Image = createBlock('img', 'image', [
4 | 'align',
5 | 'alt',
6 | 'background',
7 | 'border',
8 | 'border-bottom',
9 | 'border-left',
10 | 'border-lr',
11 | 'border-right',
12 | 'border-tb',
13 | 'border-top',
14 | 'display',
15 | 'fit',
16 | 'height',
17 | 'mirror',
18 | 'valign',
19 | 'width',
20 | ['round', [
21 | ['round-top-left', 'round-bottom-right'],
22 | ['round-top-right', 'round-bottom-left'],
23 | 'round-bottom-right',
24 | 'round-bottom-left',
25 | ]],
26 | // DEPRECATED
27 | 'round-bottom',
28 | 'round-left',
29 | 'round-right',
30 | 'round-top',
31 | ]);
32 |
--------------------------------------------------------------------------------
/packages/evokit-image/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-image-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-image-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-image-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-image-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-image-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
--------------------------------------------------------------------------------
/packages/evokit-image/src/theme.sss:
--------------------------------------------------------------------------------
1 | @import './mixins.sss'
2 |
3 | :root
4 | --ek-image-border-TEMPLATE_NAME: var(--border)
5 | --ek-image-background-TEMPLATE_NAME: var(--background)
6 |
7 | @mixin media .image_background_TEMPLATE_NAME
8 | background: var(--ek-image-background-TEMPLATE_NAME)
9 |
10 | @mixin media .image_border_TEMPLATE_NAME
11 | border: 1px solid var(--ek-image-border-TEMPLATE_NAME)
12 |
13 | @mixin media .image_border-top_TEMPLATE_NAME
14 | border-top: 1px solid var(--ek-image-border-TEMPLATE_NAME)
15 |
16 | @mixin media .image_border-right_TEMPLATE_NAME
17 | border-right: 1px solid var(--ek-image-border-TEMPLATE_NAME)
18 |
19 | @mixin media .image_border-bottom_TEMPLATE_NAME
20 | border-bottom: 1px solid var(--ek-image-border-TEMPLATE_NAME)
21 |
22 | @mixin media .image_border-left_TEMPLATE_NAME
23 | border-left: 1px solid var(--ek-image-border-TEMPLATE_NAME)
24 |
25 | @mixin media .image_border-tb_TEMPLATE_NAME
26 | border-top: 1px solid var(--ek-image-border-TEMPLATE_NAME)
27 | border-bottom: 1px solid var(--ek-image-border-TEMPLATE_NAME)
28 |
29 | @mixin media .image_border-lr_TEMPLATE_NAME
30 | border-left: 1px solid var(--ek-image-border-TEMPLATE_NAME)
31 | border-right: 1px solid var(--ek-image-border-TEMPLATE_NAME)
32 |
--------------------------------------------------------------------------------
/packages/evokit-image/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitImage'),
7 | makeStyleConfig(__dirname, 'image'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-line/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-line/CHANGELOG.md:
--------------------------------------------------------------------------------
1 | [README]: /packages/evokit-line/README.md
2 | [evokit]: /packages/evokit/README.md
3 |
4 | # EvoKit - Line
5 |
6 | [](https://www.npmjs.com/package/evokit-line)
7 | [][README]
8 |
9 | ---
10 |
11 | ## CHANGELOG
12 |
13 | ### 3.1.0 *(11.10.2019)*
14 |
15 | - **Updated** peer dependencies [`evokit`][evokit] >= **v3.1.0**
16 |
17 | ### 3.0.1
18 |
19 | - **Added** new prop `line-display`
20 | - **Added** new value `solid` for prop `line-style`
21 |
22 | ### 3.0.0
23 |
24 | - Initial version independent package. The [previous changelog](/packages/evokit/CHANGELOG.md) in another package.
25 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/Line.color.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import { Line } from '../src';
4 |
5 | describe('
');
11 | });
12 | });
13 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/Line.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import { Line } from '../src';
4 |
5 | describe('
');
11 | });
12 | });
13 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/Line.indent.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import { Line } from '../src';
4 |
5 | describe('
');
11 | });
12 | });
13 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/Line.style.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import { Line } from '../src';
4 |
5 | describe('
');
11 | });
12 | });
13 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/Line.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Line } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('props className', () => {
16 | const wrapper = shallow(
');
20 | });
21 |
22 | it('props line-tag', () => {
23 | const wrapper = shallow(
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/__snapshots__/Line.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/__snapshots__/Line.indent.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/__snapshots__/Line.style.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-line/__tests__/__snapshots__/Line.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
9 | exports[`
19 | `;
20 |
--------------------------------------------------------------------------------
/packages/evokit-line/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-line/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-line",
3 | "version": "3.1.0",
4 | "description": "Horizontal line, used to separate content",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-line/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "line"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-line/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const Line = createBlock('hr', 'line', [
4 | 'display',
5 | 'indent',
6 | 'style',
7 | 'color',
8 | ]);
9 |
--------------------------------------------------------------------------------
/packages/evokit-line/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-line-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-line-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-line-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-line-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-line-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
--------------------------------------------------------------------------------
/packages/evokit-line/src/theme.sss:
--------------------------------------------------------------------------------
1 | @import './mixins.sss'
2 |
3 | :root
4 | --ek-line-border-TEMPLATE_NAME: var(--border)
5 |
6 | @mixin media .line_color_TEMPLATE_NAME
7 | border-color: var(--ek-line-border-TEMPLATE_NAME)
8 |
--------------------------------------------------------------------------------
/packages/evokit-line/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitLine'),
7 | makeStyleConfig(__dirname, 'line'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-link/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/Link.color.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import theme from '../theme.css';
5 | import { Link } from '../src';
6 |
7 | describe('', () => {
8 | it('props link-color', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: theme });
17 |
18 | expect(css.rule('.ek-link_color_TEMPLATE_NAME').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/Link.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Link } from '../src';
6 |
7 | describe('', () => {
8 | it('props link-display', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-link_display_none').exists()).toBeTruthy();
19 | expect(css.rule('.ek-link_display_inline').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/Link.lheight.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Link } from '../src';
6 |
7 | describe('', () => {
8 | it('props link-lheight', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-link_lheight_default').exists()).toBeTruthy();
19 | expect(css.rule('.ek-link_lheight_medium').exists()).toBeTruthy();
20 | expect(css.rule('.ek-link_lheight_large').exists()).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/Link.style.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Link } from '../src';
6 |
7 | describe('', () => {
8 | it('props link-style', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-link_style_multi-line').exists()).toBeTruthy();
19 | expect(css.rule('.ek-link_style_multi-line:after').exists()).toBeTruthy();
20 |
21 | expect(css.rule('.ek-link_style_solid').exists()).toBeTruthy();
22 | expect(css.rule('.ek-link_style_solid:hover').exists()).toBeTruthy();
23 |
24 | expect(css.rule('.ek-link_style_dotted').exists()).toBeTruthy();
25 | expect(css.rule('.ek-link_style_dotted:hover').exists()).toBeTruthy();
26 |
27 | expect(css.rule('.ek-link_style_dashed').exists()).toBeTruthy();
28 | expect(css.rule('.ek-link_style_dashed:hover').exists()).toBeTruthy();
29 | });
30 | });
31 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/Link.valign.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Link } from '../src';
6 |
7 | describe('', () => {
8 | it('props link-valign', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-link_valign_baseline').exists()).toBeTruthy();
19 | expect(css.rule('.ek-link_valign_bottom').exists()).toBeTruthy();
20 | expect(css.rule('.ek-link_valign_middle').exists()).toBeTruthy();
21 | expect(css.rule('.ek-link_valign_sub').exists()).toBeTruthy();
22 | expect(css.rule('.ek-link_valign_super').exists()).toBeTruthy();
23 | expect(css.rule('.ek-link_valign_text-bottom').exists()).toBeTruthy();
24 | expect(css.rule('.ek-link_valign_text-top').exists()).toBeTruthy();
25 | expect(css.rule('.ek-link_valign_top').exists()).toBeTruthy();
26 | });
27 | });
28 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/Link.weight.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Link } from '../src';
6 |
7 | describe('', () => {
8 | it('props link-weight', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-link_weight_default').exists()).toBeTruthy();
19 | expect(css.rule('.ek-link_weight_thin').exists()).toBeTruthy();
20 | expect(css.rule('.ek-link_weight_light').exists()).toBeTruthy();
21 | expect(css.rule('.ek-link_weight_medium').exists()).toBeTruthy();
22 | expect(css.rule('.ek-link_weight_bold').exists()).toBeTruthy();
23 | expect(css.rule('.ek-link_weight_black').exists()).toBeTruthy();
24 | });
25 | });
26 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/Link.wrap.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Link } from '../src';
6 |
7 | describe('', () => {
8 | it('props link-wrap', () => {
9 | const wrapper = shallow();
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-link_wrap_normal').exists()).toBeTruthy();
19 | expect(css.rule('.ek-link_wrap_nowrap').exists()).toBeTruthy();
20 | expect(css.rule('.ek-link_wrap_pre').exists()).toBeTruthy();
21 | expect(css.rule('.ek-link_wrap_pre-wrap').exists()).toBeTruthy();
22 | expect(css.rule('.ek-link_wrap_pre-line').exists()).toBeTruthy();
23 | expect(css.rule('.ek-link_wrap_break').exists()).toBeTruthy();
24 | expect(css.rule('.ek-link_wrap_ellipsis').exists()).toBeTruthy();
25 | });
26 | });
27 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.color.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-color 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-display 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.lheight.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-lheight 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.size.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-size 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.style.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-style 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props className 1`] = `
4 |
7 | `;
8 |
9 | exports[` props link-tag 1`] = `
10 |
13 | `;
14 |
15 | exports[` render 1`] = `
16 |
19 | `;
20 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.valign.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-valign 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.weight.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-weight 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/__tests__/__snapshots__/Link.wrap.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props link-wrap 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-link/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-link",
3 | "version": "3.3.0",
4 | "description": "Used to create link",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-link/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "link"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-link/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const Link = createBlock('a', 'link', [
4 | 'color',
5 | 'display',
6 | 'lheight',
7 | 'size',
8 | 'style',
9 | 'valign',
10 | 'weight',
11 | 'wrap',
12 | ]);
13 |
--------------------------------------------------------------------------------
/packages/evokit-link/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-link-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-link-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-link-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-link-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-link-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
25 | @define-mixin hover $selector
26 | @media (hover), (min-width:0\0), (min--moz-device-pixel-ratio:0)
27 | $(selector)
28 | &:hover
29 | @mixin-content
30 |
--------------------------------------------------------------------------------
/packages/evokit-link/src/theme.sss:
--------------------------------------------------------------------------------
1 | @import './mixins.sss'
2 |
3 | :root
4 | --ek-link-color-TEMPLATE_NAME: var(--color)
5 |
6 | @mixin media .link_color_TEMPLATE_NAME
7 | color: var(--ek-link-color-TEMPLATE_NAME)
8 |
--------------------------------------------------------------------------------
/packages/evokit-link/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitLink'),
7 | makeStyleConfig(__dirname, 'link'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-list/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/List.color.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../theme.css';
5 | import { List } from '../src';
6 |
7 | describe('', () => {
8 | it('props list-color', () => {
9 | const wrapper = shallow(
);
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-list_color_TEMPLATE_NAME > .ek-list__item:before').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/List.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { List } from '../src';
6 |
7 | describe('', () => {
8 | it('props list-display', () => {
9 | const wrapper = shallow(
);
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-list_display_block').exists()).toBeTruthy();
19 | expect(css.rule('.ek-list_display_none').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/List.divider.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../theme.css';
5 | import { List } from '../src';
6 |
7 | describe('', () => {
8 | it('props list-divider', () => {
9 | const wrapper = shallow(
);
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-list_divider_TEMPLATE_NAME > .ek-list__item + .ek-list__item').exists()).toBeTruthy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/List.style.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { List } from '../src';
6 |
7 | describe('', () => {
8 | it('props list-style', () => {
9 | const wrapper = shallow(
);
10 | expect(wrapper).toMatchSnapshot();
11 |
12 | expect(wrapper.html()).toEqual('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-list_style_dash > .ek-list__item').exists()).toBeTruthy();
19 | expect(css.rule('.ek-list_style_decimal > .ek-list__item').exists()).toBeTruthy();
20 | expect(css.rule('.ek-list_style_disc > .ek-list__item').exists()).toBeTruthy();
21 |
22 | expect(css.rule('.ek-list_style_dash > .ek-list__item:before').exists()).toBeTruthy();
23 | expect(css.rule('.ek-list_style_decimal > .ek-list__item:before').exists()).toBeTruthy();
24 | expect(css.rule('.ek-list_style_disc > .ek-list__item:before').exists()).toBeTruthy();
25 | });
26 | });
27 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/ListItem.display.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { ListItem } from '../src';
6 |
7 | describe('
');
13 | });
14 |
15 | it('css', () => {
16 | const css = barista({ content: style });
17 |
18 | expect(css.rule('.ek-list__item_display_block').exists()).toBeTruthy();
19 | expect(css.rule('.ek-list__item_display_none').exists()).toBeTruthy();
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/List.color.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props list-color 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/List.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props list-display 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/List.divider-indent.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props list-divider-indent 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/List.divider.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props list-divider 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/List.indent.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props list-indent 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/List.style.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props list-style 1`] = `
4 |
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/List.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[` props className 1`] = `
4 |
7 | `;
8 |
9 | exports[` props className 2`] = `
10 |
13 | `;
14 |
15 | exports[` props list-tag 1`] = `
16 |
19 | `;
20 |
21 | exports[`
props list-tag 2`] = `
22 |
25 | `;
26 |
27 | exports[`
render 1`] = `
28 |
31 | `;
32 |
33 | exports[` render 2`] = `
34 |
37 | `;
38 |
--------------------------------------------------------------------------------
/packages/evokit-list/__tests__/__snapshots__/ListItem.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-list/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-list/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-list",
3 | "version": "3.3.0",
4 | "description": "Used to create list",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-list/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "list"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-list/src/index.js:
--------------------------------------------------------------------------------
1 | import { createBlock } from 'evokit';
2 |
3 | export const List = createBlock('ul', 'list', [
4 | 'color',
5 | 'display',
6 | 'divider',
7 | 'divider-indent',
8 | 'indent',
9 | 'style',
10 | ]);
11 |
12 | export const ListItem = createBlock('li', 'list__item', ['display']);
13 |
14 | List.Item = ListItem;
15 |
--------------------------------------------------------------------------------
/packages/evokit-list/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-list-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-list-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-list-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-list-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-list-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
--------------------------------------------------------------------------------
/packages/evokit-list/src/theme.sss:
--------------------------------------------------------------------------------
1 | @import './mixins.sss'
2 |
3 | :root
4 | --ek-list-border-TEMPLATE_NAME: var(--border)
5 | --ek-list-color-TEMPLATE_NAME: var(--color)
6 |
7 | @mixin media .list_color_TEMPLATE_NAME
8 | & > .list__item
9 | &:before
10 | color: var(--ek-list-color-TEMPLATE_NAME)
11 |
12 | @mixin media .list_divider_TEMPLATE_NAME
13 | & > .list__item
14 | & + .list__item
15 | border-top: 1px solid var(--ek-list-border-TEMPLATE_NAME)
16 |
--------------------------------------------------------------------------------
/packages/evokit-list/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitList'),
7 | makeStyleConfig(__dirname, 'list'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-picture/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-picture/__tests__/Picture.background.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import { Picture } from '../src';
4 |
5 | describe('');
11 | });
12 | });
13 |
--------------------------------------------------------------------------------
/packages/evokit-picture/__tests__/__snapshots__/Picture.background.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
13 | `;
14 |
15 | exports[`
37 | `;
38 |
--------------------------------------------------------------------------------
/packages/evokit-picture/__tests__/__snapshots__/PictureItem.display.test.jsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`
7 | `;
8 |
--------------------------------------------------------------------------------
/packages/evokit-picture/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = require('../../config/jest.config.js');
2 |
--------------------------------------------------------------------------------
/packages/evokit-picture/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "evokit-picture",
3 | "version": "3.2.0",
4 | "description": "Creates a square with an image",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest --colors",
8 | "build": "webpack --color",
9 | "watch": "webpack --color --progress --watch",
10 | "pretest": "npm run build",
11 | "prepublishOnly": "webpack"
12 | },
13 | "repository": {
14 | "type": "git",
15 | "url": "https://github.com/docccdev/evokit.git"
16 | },
17 | "homepage": "https://evokit.net/#/packages/evokit-picture/",
18 | "keywords": [
19 | "evokit",
20 | "react",
21 | "ui",
22 | "block",
23 | "uikit",
24 | "picture"
25 | ],
26 | "author": {
27 | "author": "docccdev",
28 | "email": "doccc.dev@gmail.com",
29 | "url": "http://evokit.net"
30 | },
31 | "license": "MIT",
32 | "peerDependencies": {
33 | "evokit": ">=3.1.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/packages/evokit-picture/src/mixins.sss:
--------------------------------------------------------------------------------
1 | @define-mixin media $selector
2 | $selector
3 | @mixin-content
4 |
5 | @media (--ek-picture-media-small)
6 | $(selector)\@small
7 | @mixin-content
8 |
9 | @media (--ek-picture-media-medium)
10 | $(selector)\@medium
11 | @mixin-content
12 |
13 | @media (--ek-picture-media-large)
14 | $(selector)\@large
15 | @mixin-content
16 |
17 | @media (--ek-picture-media-wide)
18 | $(selector)\@wide
19 | @mixin-content
20 |
21 | @media (--ek-picture-media-huge)
22 | $(selector)\@huge
23 | @mixin-content
24 |
--------------------------------------------------------------------------------
/packages/evokit-picture/webpack.config.js:
--------------------------------------------------------------------------------
1 | var makeIndexConfig = require('../../config/webpack/index.config.js');
2 | var makeStyleConfig = require('../../config/webpack/style.config.js');
3 | var makeThemeConfig = require('../../config/webpack/theme.config.js');
4 |
5 | module.exports = [
6 | makeIndexConfig(__dirname, 'EvoKitPicture'),
7 | makeStyleConfig(__dirname, 'picture'),
8 | makeThemeConfig(__dirname)
9 | ];
10 |
--------------------------------------------------------------------------------
/packages/evokit-text/.npmignore:
--------------------------------------------------------------------------------
1 | src
2 | __tests__
3 | webpack.config.js
4 | jest.config.js
5 |
--------------------------------------------------------------------------------
/packages/evokit-text/__tests__/Text.align.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Text } from '../src';
6 |
7 | describe('
');
27 | });
28 |
29 | it('css', () => {
30 | const css = barista({ content: style });
31 |
32 | expect(css.rule(':root').exists()).toBeTruthy();
33 | expect(css.rule(':root').prop('--ek-text-line-height')).toBe('1em');
34 |
35 | expect(css.rule('.ek-text').exists()).toBeTruthy();
36 | });
37 | });
38 |
--------------------------------------------------------------------------------
/packages/evokit-text/__tests__/Text.transform.test.jsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { shallow } from 'enzyme';
3 | import barista from 'seed-barista';
4 | import style from '../style.css';
5 | import { Text } from '../src';
6 |
7 | describe('
13 | `;
14 |
15 | exports[`