1.1.7 • Published 1 year ago

stickerface-sdk v1.1.7

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

stickerface-sdk

Made with create-react-library

NPM JavaScript Style Guide

Install

npm

npm install --save stickerface-sdk

yarn

yarn add stickerface-sdk

yarn add stickerface-sdk@<version>

Usage

StickerFaceEditor

import React, { useState } from 'react'

import { StickerFaceEditor, TransportContextProvider } from 'stickerface-sdk'
import 'stickerface-sdk/dist/index.css'

const App = () => {
  const [layers, setLayers] = useState<string | null>();

  return (
    <div className={'container'}>
      <TransportContextProvider>
        <StickerFaceEditor
          layers={layers}
          size={{
            width: '100%',
            height: '100%',
          }}
          onInit={() => {
            console.log('On init')
          }}
          showButtonSaveAvatar
          onSave={(layers) => {
            setLayers(layers)
          }}
        />
      </TransportContextProvider>
    </div>
  )
}

export default App

Screenshot 2022-11-07 at 21 10 59

Params StickerFaceEditor

showButtonSaveAvatar?: boolean

layers: string | null

size: { width: string, height: string }

onInit: () => void

onInit={() => {
  console.log('On init')
}}

Use onChange when showButtonSaveAvatar = false

onChange: (layers: string) => void

onChange={(layers) => {
  // @ts-ignore
  setLayers(layers?.data?.data)
}}

Use onSave when showButtonSaveAvatar = true

onSave?: (layers: string) => void

onSave={(layers) => {
  setLayers(layers)
}}

config: IConfig

interface IConfig {
  excludedSections?: string
  selectedSections?: string
}

StickerFaceAvatar

Screenshot 2022-11-02 at 16 15 01

Add 4 blocks to the top part inside the body

<body>
  <div id="render-canvas-container"></div>
  <div id="render-continer"></div>
  <script type="text/javascript" src="https://stickerface.io/api/init-min.js"></script>
  <script type="text/javascript" src="https://stickerface.io/js/render.js"></script>
...
import React from 'react'

import { StickerFaceAvatar } from 'stickerface-sdk'

const App = () => {
  const layers = '1;83;73;3412;100;6;219;214;203;7;11;28;68;13;320;2;273;159;160';
  
  return (
    <div className={'container'}>
      <StickerFaceAvatar layers={layers} noBackground={false} />
    </div>
  )
}

export default App

Params StickerFaceAvatar

interface IAvatarProps {
  layers: string
  noBackground?: boolean
}

License

MIT © Dimitreee | Thepetruha

classnames
@everything-registry/sub-chunk-2827@infinitebrahmanuniverse/nolb-sti
1.1.7

1 year ago

1.1.6

1 year ago

1.1.5

2 years ago

1.1.4

2 years ago

1.1.3

2 years ago

1.1.2

2 years ago

1.1.1

2 years ago

1.1.0

2 years ago

1.0.19

2 years ago

1.0.18

2 years ago

1.0.17

2 years ago

1.0.16

2 years ago

1.0.15

2 years ago

1.0.14

2 years ago

1.0.13

2 years ago

1.0.12

2 years ago

1.0.11

2 years ago

1.0.10

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.2

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago