{"version":3,"file":"RatingItem.cjs","names":["useRatingContext","useDirection","Box","StarSymbol"],"sources":["../../../../src/components/Rating/RatingItem/RatingItem.tsx"],"sourcesContent":["import { Box, BoxProps, ElementProps, useDirection } from '../../../core';\nimport { useRatingContext } from '../Rating.context';\nimport { StarSymbol } from '../StarSymbol/StarSymbol';\n\nexport interface RatingItemProps extends BoxProps, ElementProps<'input', 'value' | 'size'> {\n  getSymbolLabel: ((value: number) => string) | undefined;\n  emptyIcon?: React.ReactNode | ((value: number) => React.ReactNode);\n  fullIcon?: React.ReactNode | ((value: number) => React.ReactNode);\n  full: boolean;\n  active: boolean;\n  fractionValue: number;\n  value: number;\n  id: string;\n  onChange: (event: React.ChangeEvent<HTMLInputElement> | number) => void;\n  onInputChange: (event: React.ChangeEvent<HTMLInputElement> | number) => void;\n}\n\nexport function RatingItem({\n  getSymbolLabel,\n  emptyIcon,\n  fullIcon,\n  full,\n  active,\n  value,\n  readOnly,\n  fractionValue,\n  color,\n  id,\n  onBlur,\n  onChange,\n  onInputChange,\n  style,\n  ...others\n}: RatingItemProps) {\n  const ctx = useRatingContext();\n  const _fullIcon = typeof fullIcon === 'function' ? fullIcon(value) : fullIcon;\n  const _emptyIcon = typeof emptyIcon === 'function' ? emptyIcon(value) : emptyIcon;\n  const { dir } = useDirection();\n\n  return (\n    <>\n      {!readOnly && (\n        <input\n          {...ctx.getStyles('input')}\n          onKeyDown={(event) => (event.key === ' ' || event.key === 'Enter') && onChange(value)}\n          id={id}\n          type=\"radio\"\n          data-active={active || undefined}\n          aria-label={getSymbolLabel?.(value)}\n          value={value}\n          onBlur={onBlur}\n          onChange={onInputChange}\n          {...others}\n        />\n      )}\n\n      <Box\n        component={readOnly ? 'div' : 'label'}\n        {...ctx.getStyles('label')}\n        data-read-only={readOnly || undefined}\n        htmlFor={id}\n        onClick={readOnly ? undefined : () => onChange(value)}\n        __vars={{\n          '--rating-item-z-index': (fractionValue === 1 ? undefined : active ? 2 : 0)?.toString(),\n        }}\n      >\n        <Box\n          {...ctx.getStyles('symbolBody')}\n          __vars={{\n            '--rating-symbol-clip-path':\n              fractionValue === 1\n                ? undefined\n                : dir === 'ltr'\n                  ? `inset(0 ${active ? 100 - fractionValue * 100 : 100}% 0 0)`\n                  : `inset(0 0 0 ${active ? 100 - fractionValue * 100 : 100}% )`,\n          }}\n        >\n          {full\n            ? _fullIcon || <StarSymbol type=\"full\" />\n            : _emptyIcon || <StarSymbol type=\"empty\" />}\n        </Box>\n      </Box>\n    </>\n  );\n}\n\nRatingItem.displayName = '@mantine/core/RatingItem';\n"],"mappings":";;;;;;;;AAiBA,SAAgB,WAAW,EACzB,gBACA,WACA,UACA,MACA,QACA,OACA,UACA,eACA,OACA,IACA,QACA,UACA,eACA,OACA,GAAG,UACe;CAClB,MAAM,MAAMA,uBAAAA,kBAAkB;CAC9B,MAAM,YAAY,OAAO,aAAa,aAAa,SAAS,MAAM,GAAG;CACrE,MAAM,aAAa,OAAO,cAAc,aAAa,UAAU,MAAM,GAAG;CACxE,MAAM,EAAE,QAAQC,0BAAAA,cAAc;AAE9B,QACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACG,CAAC,YACA,iBAAA,GAAA,kBAAA,KAAC,SAAD;EACE,GAAI,IAAI,UAAU,QAAQ;EAC1B,YAAY,WAAW,MAAM,QAAQ,OAAO,MAAM,QAAQ,YAAY,SAAS,MAAM;EACjF;EACJ,MAAK;EACL,eAAa,UAAU,KAAA;EACvB,cAAY,iBAAiB,MAAM;EAC5B;EACC;EACR,UAAU;EACV,GAAI;EACJ,CAAA,EAGJ,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,WAAW,WAAW,QAAQ;EAC9B,GAAI,IAAI,UAAU,QAAQ;EAC1B,kBAAgB,YAAY,KAAA;EAC5B,SAAS;EACT,SAAS,WAAW,KAAA,UAAkB,SAAS,MAAM;EACrD,QAAQ,EACN,0BAA0B,kBAAkB,IAAI,KAAA,IAAY,SAAS,IAAI,IAAI,UAAU,EACxF;YAED,iBAAA,GAAA,kBAAA,KAACA,YAAAA,KAAD;GACE,GAAI,IAAI,UAAU,aAAa;GAC/B,QAAQ,EACN,6BACE,kBAAkB,IACd,KAAA,IACA,QAAQ,QACN,WAAW,SAAS,MAAM,gBAAgB,MAAM,IAAI,UACpD,eAAe,SAAS,MAAM,gBAAgB,MAAM,IAAI,MACjE;aAEA,OACG,aAAa,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD,EAAY,MAAK,QAAS,CAAA,GACvC,cAAc,iBAAA,GAAA,kBAAA,KAACA,mBAAAA,YAAD,EAAY,MAAK,SAAU,CAAA;GACzC,CAAA;EACF,CAAA,CACL,EAAA,CAAA;;AAIP,WAAW,cAAc"}