Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

messa-resizer

0.0.62 • Public • Published

Resizer Component (Experimental) [WIP]

storybook: https://resizer.messafilip.now.sh

storybook gif

Main Scripts

add to your a project

yarn add messa-resizer
 

install dependencies

yarn install

run storybook:

yarn storybook

run all test: (flow & eslint & jest)

yarn test

build library:

yarn build

Examples

Here is a minimal example. (without styles)

import React from "react";
import { Resizer } from "messa-resizer";
 
const App = () => {
  return <Resizer>Resizer component</Resizer>;
};

Component props

Name Type Default Description
children React.Node The content of the Resizer.
style StyleObject The root container's styles.
className string The root container's classNames.
defaultWidth number The defaultWidth of the Resizer.
defaultHeight number The defaultHeight of the Resizer.
maxHeight number Infinity The maxHeight of the Resizer.
minHeight number 20 The minHeight of the Resizer.
maxWidth number Infinity The maxWidth of the Resizer.
minWidth number 20 The minWidth of the Resizer.
handlersStyles HandlersStyles The handlebars' inline-styles.
handlersClassNames HandlersClassNames The handlebars' inline-styles.

type HandlersStyles = {|
  +bottom?: StyleObject,
  +right?: StyleObject,
  +"bottom-right"?: StyleObject
|};
type HandlersClassNames = {|
  +bottom?: string,
  +right?: string,
  +"bottom-right"?: string,
|};

TODOs

  • the defaultHeight and defaultWidth should handle string ('auto', '12px', '100%', etc...)
  • add E2E tests (cypress or Puppeteer)
  • The Handlebar component should be able to have children
  • improve unit tests
  • improve styles extend API
  • continuous integration
  • Add handlebars for left and top

Requirments

  • Use ES6 (with Flow) or TypeScript
  • Third-party apps should be able to modify styles
  • The example should work in Chrome, Firefox and Safari
  • Use React
  • Add unit tests (each component should be covered)

Install

npm i messa-resizer

DownloadsWeekly Downloads

22

Version

0.0.62

License

MIT

Unpacked Size

1.46 MB

Total Files

22

Last publish

Collaborators

  • avatar