@web-lite/content-rating

// version @next compatible with react 17 and Mui version 5.0.0-rc.1 // size ~= 7.7kb import { openContentRating } from '@web-lite/content-rating/@next' // or import openContentRating from '@web-lite/content-rating/@next' // or import openContentRating from '@web-lite/content-rating'

Usage no npm install needed!

<script type="module">
  import webLiteContentRating from 'https://cdn.skypack.dev/@web-lite/content-rating';
</script>

README

Screen shots

Screenshots of design

Usage

// version @next compatible with react 17 and Mui version 5.0.0-rc.1
// size ~= 7.7kb
import { openContentRating } from '@web-lite/content-rating/@next'
// or
import openContentRating from '@web-lite/content-rating/@next'
// or
import openContentRating from '@web-lite/content-rating'

// version v4 compatible with react >=16.8 and no material needed
// size ~= 150kb
import { openContentRating } from '@web-lite/content-rating/@bundled'
// or
import openContentRating from '@web-lite/content-rating/@bundled'

type and Data

const t = {
  title: 'این محتوا را چگونه ارزیابی میکنید؟',
  submitText: 'ثبت',
  ratingFeedback: {
    1: 'ارزیابی شما ثبت شد، با تشکر',
    2: 'ارزیابی شما ثبت شد، با تشکر',
    3: 'ارزیابی شما ثبت شد، با تشکر',
    4: 'ارزیابی شما ثبت شد، با تشکر',
    5: 'ارزیابی شما ثبت شد، با تشکر',
  },
}

type Rate = 1 | 2 | 3 | 4 | 5

type SideEffectFunction = () => void

export interface ContentRateConfig {
  analyticsPrefix: string // as analytics event title in CONSTANT_CASE

  title?: typeof t['title']
  submitText?: typeof t['submitText']
  destroyDelay?: number
  onClose?: SideEffectFunction
  onSubmit?: (rate: Rate) => Promise<void>
  onDestroy: SideEffectFunction
  ratingFeedback?: typeof t['ratingFeedback']
}

exported functions

type openContentRating = async (
  instance: string,
  config: ContentRateConfig) => Promise<void>

TODO:

  • Add compatible version 4 using mui/lab to shrink code size
  • Export esm after this issue has been resolve