dinocollab-shared 1.1.17 → 1.1.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/dist/cart/widget.js +1 -1
  2. package/dist/cart/widget.js.map +1 -1
  3. package/dist/media-player/analytic-media.js +2 -0
  4. package/dist/media-player/analytic-media.js.map +1 -0
  5. package/dist/media-player/core/btn.fullscreen.js +2 -0
  6. package/dist/media-player/core/btn.fullscreen.js.map +1 -0
  7. package/dist/media-player/core/btn.pip.js +2 -0
  8. package/dist/media-player/core/btn.pip.js.map +1 -0
  9. package/dist/media-player/core/btn.play.js +2 -0
  10. package/dist/media-player/core/btn.play.js.map +1 -0
  11. package/dist/media-player/core/btn.volume.js +2 -0
  12. package/dist/media-player/core/btn.volume.js.map +1 -0
  13. package/dist/media-player/core/progressBar.js +2 -0
  14. package/dist/media-player/core/progressBar.js.map +1 -0
  15. package/dist/media-player/core/time.js +2 -0
  16. package/dist/media-player/core/time.js.map +1 -0
  17. package/dist/media-player/core/useVideoPlayerCore.js +2 -0
  18. package/dist/media-player/core/useVideoPlayerCore.js.map +1 -0
  19. package/dist/media-player/core/videoplayer.js +2 -0
  20. package/dist/media-player/core/videoplayer.js.map +1 -0
  21. package/dist/media-player/helpers.js +2 -0
  22. package/dist/media-player/helpers.js.map +1 -0
  23. package/dist/media-player/index.js +2 -0
  24. package/dist/media-player/index.js.map +1 -0
  25. package/dist/media-player/mediaMetadata.js +2 -0
  26. package/dist/media-player/mediaMetadata.js.map +1 -0
  27. package/dist/media-player/muted.js +2 -0
  28. package/dist/media-player/muted.js.map +1 -0
  29. package/dist/media-player/player.audio.js +2 -0
  30. package/dist/media-player/player.audio.js.map +1 -0
  31. package/dist/media-player/player.video-stream.js +2 -0
  32. package/dist/media-player/player.video-stream.js.map +1 -0
  33. package/dist/media-player/preview.js +2 -0
  34. package/dist/media-player/preview.js.map +1 -0
  35. package/dist/media-player/types.js +2 -0
  36. package/dist/media-player/types.js.map +1 -0
  37. package/dist/media-player.d.ts +2 -0
  38. package/dist/media-player.js +2 -0
  39. package/dist/media-player.mjs +2 -0
  40. package/dist/notification/widget.js +1 -1
  41. package/dist/notification/widget.js.map +1 -1
  42. package/dist/types/media-player/analytic-media.d.ts +15 -0
  43. package/dist/types/media-player/analytic-media.d.ts.map +1 -0
  44. package/dist/types/media-player/core/btn.fullscreen.d.ts +11 -0
  45. package/dist/types/media-player/core/btn.fullscreen.d.ts.map +1 -0
  46. package/dist/types/media-player/core/btn.pip.d.ts +10 -0
  47. package/dist/types/media-player/core/btn.pip.d.ts.map +1 -0
  48. package/dist/types/media-player/core/btn.play.d.ts +11 -0
  49. package/dist/types/media-player/core/btn.play.d.ts.map +1 -0
  50. package/dist/types/media-player/core/btn.volume.d.ts +15 -0
  51. package/dist/types/media-player/core/btn.volume.d.ts.map +1 -0
  52. package/dist/types/media-player/core/progressBar.d.ts +13 -0
  53. package/dist/types/media-player/core/progressBar.d.ts.map +1 -0
  54. package/dist/types/media-player/core/time.d.ts +8 -0
  55. package/dist/types/media-player/core/time.d.ts.map +1 -0
  56. package/dist/types/media-player/core/useVideoPlayerCore.d.ts +29 -0
  57. package/dist/types/media-player/core/useVideoPlayerCore.d.ts.map +1 -0
  58. package/dist/types/media-player/core/videoplayer.d.ts +24 -0
  59. package/dist/types/media-player/core/videoplayer.d.ts.map +1 -0
  60. package/dist/types/media-player/helpers.d.ts +10 -0
  61. package/dist/types/media-player/helpers.d.ts.map +1 -0
  62. package/dist/types/media-player/index.d.ts +9 -0
  63. package/dist/types/media-player/index.d.ts.map +1 -0
  64. package/dist/types/media-player/mediaMetadata.d.ts +7 -0
  65. package/dist/types/media-player/mediaMetadata.d.ts.map +1 -0
  66. package/dist/types/media-player/muted.d.ts +12 -0
  67. package/dist/types/media-player/muted.d.ts.map +1 -0
  68. package/dist/types/media-player/player.audio.d.ts +7 -0
  69. package/dist/types/media-player/player.audio.d.ts.map +1 -0
  70. package/dist/types/media-player/player.video-stream.d.ts +15 -0
  71. package/dist/types/media-player/player.video-stream.d.ts.map +1 -0
  72. package/dist/types/media-player/preview.d.ts +29 -0
  73. package/dist/types/media-player/preview.d.ts.map +1 -0
  74. package/dist/types/media-player/types.d.ts +36 -0
  75. package/dist/types/media-player/types.d.ts.map +1 -0
  76. package/package.json +15 -1
@@ -1,2 +1,2 @@
1
- import{inherits as r,createClass as e,objectSpread2 as t,classCallCheck as n,callSuper as o,defineProperty as i}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{Component as c,Fragment as s}from"react";import{ImageWithFallback as d}from"dinocollab-core/components";import{Badge as u,Typography as m,Divider as p,Button as h,Box as v,IconButton as f}from"@mui/material";import C from"@mui/icons-material/Remove";import g from"@mui/icons-material/ShoppingCartOutlined";import x from"@mui/icons-material/ShoppingCartCheckout";import{getTotalData as b}from"./helpers.js";import{MenuStyled as y,CartContentStyled as k,cartContentClasses as P}from"./styled.js";import{IconButtonDark as T}from"../components/buttons.js";import{NoDataPanel as N}from"../components/no-data-panel.js";var S=function(){function S(r){var e;return n(this,S),e=o(this,S,[r]),i(e,"render",function(){var r;return a(s,{children:[l(T,{onClick:function(r){return e.onOpen(r.currentTarget)},children:l(u,{badgeContent:e.state.hydrated&&null!==(r=e.carts.length)&&void 0!==r?r:0,color:"error",children:l(g,{})})}),l(y,{disableScrollLock:!0,anchorEl:e.state.anchorEl,open:Boolean(e.state.anchorEl),onClose:e.onClose,anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},MenuListProps:{component:"div"},children:e.renderContent()})]})}),i(e,"renderContent",function(){var r,n=b(e.carts);return a(k,{children:[a("div",{className:P.header,children:[a(m,{variant:"h6",component:"span",sx:{flex:1},children:["Your Cart (",null!==(r=n.quantity)&&void 0!==r?r:0," items)"]}),a(m,{variant:"h6",component:"span",children:["Total: $ ",n.price.toFixed(2)]})]}),l(p,{}),a("div",{className:P.items,children:[e.carts.map(function(r,t){return l(s,{children:e.renderItem(r)},"key"+t)}),e.carts.length<1&&l(N,{title:"Your cart is empty",subTitle:"Try adding some products",sx:{height:"100%"}})]}),l(p,{}),l("div",{className:P.footer,children:l(h,t(t(t({},e.props.hrefCart?{component:"a",href:e.props.hrefCart}:{}),{},{color:"inherit",endIcon:l(x,{}),onClick:function(r){e.onClose(),e.props.onMoveToCartClick&&e.props.onMoveToCartClick(r)},disabled:e.carts.length<1},e.props.buttonMoveToCartProps),{},{children:"Show in cart"}))})]})}),i(e,"renderTitle",function(r){var n,o=e.props,i=o.itemTitleProps,a=o.itemTitlePropsGetter,c=a?a(r,e.onClose):null!=i?i:{};return l(m,t(t({className:P.itemTitle,noWrap:!0,variant:"subtitle1"},c),{},{children:null!==(n=r.ProductName)&&void 0!==n?n:"Unknown Product"}))}),i(e,"renderItem",function(r){var t,n,o,i;return a("div",{className:P.item,children:[l(d,{className:P.itemImg,src:null==r?void 0:r.PictureUrl,title:null==r?void 0:r.PictureUrl,fallbackSrc:"images/default-video.webp",alt:"product-picture"}),a("div",{className:P.itemContent,children:[l(m,{className:P.itemTag,variant:"caption",sx:{color:null!==(t=r.PriceColor)&&void 0!==t?t:"#000"},children:null!==(n=r.PriceName)&&void 0!==n?n:"Unknown Price"}),e.renderTitle(r),a(v,{sx:{display:"flex",alignItems:"flex-end",gap:"2px",justifyContent:"flex-end"},children:[a(m,{variant:"subtitle1",children:["$ ",null!==(o=r.Price)&&void 0!==o?o:0]}),a(m,{variant:"body1",sx:{fontSize:"14px",mb:"3px",color:"#818181"},children:["x",null!==(i=r.Amount)&&void 0!==i?i:0," urls"]})]})]}),l(f,{size:"small",onClick:function(){var t,n;return null===(t=(n=e.props).onRemoveCart)||void 0===t?void 0:t.call(n,r)},sx:{color:"#818181"},children:l(C,{})})]})}),i(e,"onOpen",function(r){e.setState({anchorEl:r})}),i(e,"onClose",function(){e.setState({anchorEl:null})}),e.state={anchorEl:null,hydrated:!1},e}return r(S,c),e(S,[{key:"carts",get:function(){var r;return null!==(r=this.props.carts)&&void 0!==r?r:[]}},{key:"componentDidMount",value:function(){this.setState({hydrated:!0})}}])}(),j=function(r){var e=function(e){return l(S,t(t({},r),e))};return e.displayName="CartWidget",e};export{S as CartWidget,j as createCartWidget};
1
+ import{inherits as r,createClass as e,objectSpread2 as t,classCallCheck as n,callSuper as o,defineProperty as i}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{Component as c,Fragment as s}from"react";import{ImageWithFallback as d}from"dinocollab-core/components";import{Badge as m,Typography as u,Divider as p,Button as h,Box as f,IconButton as v}from"@mui/material";import C from"@mui/icons-material/Remove";import g from"@mui/icons-material/ShoppingCartOutlined";import x from"@mui/icons-material/ShoppingCartCheckout";import{getTotalData as b}from"./helpers.js";import{MenuStyled as y,CartContentStyled as k,cartContentClasses as P}from"./styled.js";import{IconButtonDark as T}from"../components/buttons.js";import{NoDataPanel as S}from"../components/no-data-panel.js";var N=function(){function N(r){var e;return n(this,N),e=o(this,N,[r]),i(e,"render",function(){var r;return a(s,{children:[l(T,{onClick:function(r){return e.onOpen(r.currentTarget)},children:l(m,{badgeContent:e.state.hydrated&&null!==(r=e.carts.length)&&void 0!==r?r:0,color:"error",children:l(g,{fontSize:"small"})})}),l(y,{disableScrollLock:!0,anchorEl:e.state.anchorEl,open:Boolean(e.state.anchorEl),onClose:e.onClose,anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},MenuListProps:{component:"div"},children:e.renderContent()})]})}),i(e,"renderContent",function(){var r,n=b(e.carts);return a(k,{children:[a("div",{className:P.header,children:[a(u,{variant:"h6",component:"span",sx:{flex:1},children:["Your Cart (",null!==(r=n.quantity)&&void 0!==r?r:0," items)"]}),a(u,{variant:"h6",component:"span",children:["Total: $ ",n.price.toFixed(2)]})]}),l(p,{}),a("div",{className:P.items,children:[e.carts.map(function(r,t){return l(s,{children:e.renderItem(r)},"key"+t)}),e.carts.length<1&&l(S,{title:"Your cart is empty",subTitle:"Try adding some products",sx:{height:"100%"}})]}),l(p,{}),l("div",{className:P.footer,children:l(h,t(t(t({},e.props.hrefCart?{component:"a",href:e.props.hrefCart}:{}),{},{color:"inherit",endIcon:l(x,{}),onClick:function(r){e.onClose(),e.props.onMoveToCartClick&&e.props.onMoveToCartClick(r)},disabled:e.carts.length<1},e.props.buttonMoveToCartProps),{},{children:"Show in cart"}))})]})}),i(e,"renderTitle",function(r){var n,o=e.props,i=o.itemTitleProps,a=o.itemTitlePropsGetter,c=a?a(r,e.onClose):null!=i?i:{};return l(u,t(t({className:P.itemTitle,noWrap:!0,variant:"subtitle1"},c),{},{children:null!==(n=r.ProductName)&&void 0!==n?n:"Unknown Product"}))}),i(e,"renderItem",function(r){var t,n,o,i;return a("div",{className:P.item,children:[l(d,{className:P.itemImg,src:null==r?void 0:r.PictureUrl,title:null==r?void 0:r.PictureUrl,fallbackSrc:"images/default-video.webp",alt:"product-picture"}),a("div",{className:P.itemContent,children:[l(u,{className:P.itemTag,variant:"caption",sx:{color:null!==(t=r.PriceColor)&&void 0!==t?t:"#000"},children:null!==(n=r.PriceName)&&void 0!==n?n:"Unknown Price"}),e.renderTitle(r),a(f,{sx:{display:"flex",alignItems:"flex-end",gap:"2px",justifyContent:"flex-end"},children:[a(u,{variant:"subtitle1",children:["$ ",null!==(o=r.Price)&&void 0!==o?o:0]}),a(u,{variant:"body1",sx:{fontSize:"14px",mb:"3px",color:"#818181"},children:["x",null!==(i=r.Amount)&&void 0!==i?i:0," urls"]})]})]}),l(v,{size:"small",onClick:function(){var t,n;return null===(t=(n=e.props).onRemoveCart)||void 0===t?void 0:t.call(n,r)},sx:{color:"#818181"},children:l(C,{})})]})}),i(e,"onOpen",function(r){e.setState({anchorEl:r})}),i(e,"onClose",function(){e.setState({anchorEl:null})}),e.state={anchorEl:null,hydrated:!1},e}return r(N,c),e(N,[{key:"carts",get:function(){var r;return null!==(r=this.props.carts)&&void 0!==r?r:[]}},{key:"componentDidMount",value:function(){this.setState({hydrated:!0})}}])}(),j=function(r){var e=function(e){return l(N,t(t({},r),e))};return e.displayName="CartWidget",e};export{N as CartWidget,j as createCartWidget};
2
2
  //# sourceMappingURL=widget.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"widget.js","sources":["../../src/cart/widget.tsx"],"sourcesContent":["import { Component, Fragment } from 'react'\r\nimport { ImageWithFallback } from 'dinocollab-core/components'\r\nimport { Badge, Box, Button, ButtonProps, Divider, IconButton, Typography } from '@mui/material'\r\nimport type { FC } from 'react'\r\nimport type { TypographyProps } from '@mui/material'\r\nimport RemoveIcon from '@mui/icons-material/Remove'\r\nimport ShoppingCartOutlinedIcon from '@mui/icons-material/ShoppingCartOutlined'\r\nimport ShoppingCartCheckoutIcon from '@mui/icons-material/ShoppingCartCheckout'\r\nimport { ICartItem } from './types'\r\nimport { getTotalData } from './helpers'\r\nimport { IAppSiteBaseUrl } from '../types'\r\nimport { IconButtonDark, NoDataPanel } from '../components'\r\nimport { cartContentClasses, CartContentStyled, MenuStyled } from './styled'\r\n\r\ntype ITypographyProps = TypographyProps & { [key: string]: any }\r\n\r\ninterface ICartWidgetProps {\r\n baseUrl: IAppSiteBaseUrl\r\n carts?: ICartItem[]\r\n hrefCart?: string\r\n buttonMoveToCartProps?: ButtonProps & { [key: string]: any }\r\n storageKey?: string\r\n onRemoveCart?: (item: ICartItem) => void\r\n onMoveToCartClick?: (e: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void\r\n itemTitleProps?: ITypographyProps\r\n itemTitlePropsGetter?: (item: ICartItem, close?: () => void) => ITypographyProps\r\n}\r\n\r\ninterface ICartWidgetState {\r\n anchorEl: HTMLElement | null\r\n hydrated: boolean\r\n}\r\n\r\nexport class CartWidget extends Component<ICartWidgetProps, ICartWidgetState> {\r\n constructor(props: ICartWidgetProps) {\r\n super(props)\r\n this.state = { anchorEl: null, hydrated: false }\r\n }\r\n\r\n get carts() {\r\n return this.props.carts ?? []\r\n }\r\n\r\n componentDidMount() {\r\n // When mounted on the client, set hydrated = true\r\n this.setState({ hydrated: true })\r\n }\r\n\r\n render = () => (\r\n <Fragment>\r\n <IconButtonDark onClick={(e) => this.onOpen(e.currentTarget)}>\r\n <Badge badgeContent={this.state.hydrated ? this.carts.length ?? 0 : 0} color='error'>\r\n <ShoppingCartOutlinedIcon />\r\n </Badge>\r\n </IconButtonDark>\r\n <MenuStyled\r\n disableScrollLock\r\n anchorEl={this.state.anchorEl}\r\n open={Boolean(this.state.anchorEl)}\r\n onClose={this.onClose}\r\n anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n transformOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n MenuListProps={{ component: 'div' }}\r\n >\r\n {this.renderContent()}\r\n </MenuStyled>\r\n </Fragment>\r\n )\r\n\r\n renderContent = () => {\r\n const totalData = getTotalData(this.carts)\r\n return (\r\n <CartContentStyled>\r\n <div className={cartContentClasses.header}>\r\n <Typography variant='h6' component='span' sx={{ flex: 1 }}>\r\n Your Cart ({totalData.quantity ?? 0} items)\r\n </Typography>\r\n <Typography variant='h6' component='span'>\r\n Total: $ {totalData.price.toFixed(2)}\r\n </Typography>\r\n </div>\r\n <Divider />\r\n <div className={cartContentClasses.items}>\r\n {this.carts.map((x, i) => (\r\n <Fragment key={'key' + i}>{this.renderItem(x)}</Fragment>\r\n ))}\r\n {this.carts.length < 1 && <NoDataPanel title='Your cart is empty' subTitle='Try adding some products' sx={{ height: '100%' }} />}\r\n </div>\r\n <Divider />\r\n <div className={cartContentClasses.footer}>\r\n <Button\r\n {...(this.props.hrefCart ? { component: 'a', href: this.props.hrefCart } : {})}\r\n color='inherit'\r\n endIcon={<ShoppingCartCheckoutIcon />}\r\n onClick={(event) => {\r\n this.onClose()\r\n if (this.props.onMoveToCartClick) {\r\n this.props.onMoveToCartClick(event as React.MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>)\r\n }\r\n }}\r\n disabled={this.carts.length < 1}\r\n {...this.props.buttonMoveToCartProps}\r\n >\r\n Show in cart\r\n </Button>\r\n </div>\r\n </CartContentStyled>\r\n )\r\n }\r\n\r\n renderTitle = (item: ICartItem) => {\r\n const { itemTitleProps, itemTitlePropsGetter } = this.props\r\n const currentProps: ITypographyProps = itemTitlePropsGetter ? itemTitlePropsGetter(item, this.onClose) : itemTitleProps ?? {}\r\n return (\r\n <Typography className={cartContentClasses.itemTitle} noWrap variant='subtitle1' {...currentProps}>\r\n {item.ProductName ?? 'Unknown Product'}\r\n </Typography>\r\n )\r\n }\r\n\r\n renderItem = (item: ICartItem) => (\r\n <div className={cartContentClasses.item}>\r\n <ImageWithFallback\r\n className={cartContentClasses.itemImg}\r\n src={item?.PictureUrl}\r\n title={item?.PictureUrl}\r\n fallbackSrc='images/default-video.webp'\r\n alt='product-picture'\r\n />\r\n <div className={cartContentClasses.itemContent}>\r\n <Typography className={cartContentClasses.itemTag} variant='caption' sx={{ color: item.PriceColor ?? '#000' }}>\r\n {item.PriceName ?? 'Unknown Price'}\r\n </Typography>\r\n {this.renderTitle(item)}\r\n <Box sx={{ display: 'flex', alignItems: 'flex-end', gap: '2px', justifyContent: 'flex-end' }}>\r\n <Typography variant='subtitle1'>$ {item.Price ?? 0}</Typography>\r\n <Typography variant='body1' sx={{ fontSize: '14px', mb: '3px', color: '#818181' }}>\r\n x{item.Amount ?? 0} urls\r\n </Typography>\r\n </Box>\r\n </div>\r\n <IconButton size='small' onClick={() => this.props.onRemoveCart?.(item)} sx={{ color: '#818181' }}>\r\n <RemoveIcon />\r\n </IconButton>\r\n </div>\r\n )\r\n\r\n onOpen = (target: HTMLElement) => {\r\n this.setState({ anchorEl: target })\r\n }\r\n\r\n onClose = () => {\r\n this.setState({ anchorEl: null })\r\n }\r\n}\r\n\r\nexport const createCartWidget = (params: ICartWidgetProps) => {\r\n const _CartWidget: FC<Partial<ICartWidgetProps>> = (props) => <CartWidget {...params} {...props} />\r\n _CartWidget.displayName = 'CartWidget'\r\n return _CartWidget\r\n}\r\n"],"names":["CartWidget","props","_this","_classCallCheck","_callSuper","_defineProperty","_this$carts$length","_jsxs","Fragment","children","_jsx","IconButtonDark","onClick","e","onOpen","currentTarget","Badge","badgeContent","state","hydrated","carts","length","color","ShoppingCartOutlinedIcon","MenuStyled","disableScrollLock","anchorEl","open","Boolean","onClose","anchorOrigin","vertical","horizontal","transformOrigin","MenuListProps","component","renderContent","_totalData$quantity","totalData","getTotalData","CartContentStyled","className","cartContentClasses","header","Typography","variant","sx","flex","quantity","price","toFixed","Divider","items","map","x","i","renderItem","NoDataPanel","title","subTitle","height","footer","Button","_objectSpread","hrefCart","href","endIcon","ShoppingCartCheckoutIcon","event","onMoveToCartClick","disabled","buttonMoveToCartProps","item","_item$ProductName","_this$props","itemTitleProps","itemTitlePropsGetter","currentProps","itemTitle","noWrap","ProductName","_item$PriceColor","_item$PriceName","_item$Price","_item$Amount","ImageWithFallback","itemImg","src","PictureUrl","fallbackSrc","alt","itemContent","itemTag","PriceColor","PriceName","renderTitle","Box","display","alignItems","gap","justifyContent","Price","fontSize","mb","Amount","IconButton","size","_this$props$onRemoveC","_this$props2","onRemoveCart","call","RemoveIcon","target","setState","_inherits","Component","_createClass","key","get","_this$props$carts","this","value","createCartWidget","params","_CartWidget","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"widget.js","sources":["../../src/cart/widget.tsx"],"sourcesContent":["import { Component, Fragment } from 'react'\r\nimport { ImageWithFallback } from 'dinocollab-core/components'\r\nimport { Badge, Box, Button, ButtonProps, Divider, IconButton, Typography } from '@mui/material'\r\nimport type { FC } from 'react'\r\nimport type { TypographyProps } from '@mui/material'\r\nimport RemoveIcon from '@mui/icons-material/Remove'\r\nimport ShoppingCartOutlinedIcon from '@mui/icons-material/ShoppingCartOutlined'\r\nimport ShoppingCartCheckoutIcon from '@mui/icons-material/ShoppingCartCheckout'\r\nimport { ICartItem } from './types'\r\nimport { getTotalData } from './helpers'\r\nimport { IAppSiteBaseUrl } from '../types'\r\nimport { IconButtonDark, NoDataPanel } from '../components'\r\nimport { cartContentClasses, CartContentStyled, MenuStyled } from './styled'\r\n\r\ntype ITypographyProps = TypographyProps & { [key: string]: any }\r\n\r\ninterface ICartWidgetProps {\r\n baseUrl: IAppSiteBaseUrl\r\n carts?: ICartItem[]\r\n hrefCart?: string\r\n buttonMoveToCartProps?: ButtonProps & { [key: string]: any }\r\n storageKey?: string\r\n onRemoveCart?: (item: ICartItem) => void\r\n onMoveToCartClick?: (e: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void\r\n itemTitleProps?: ITypographyProps\r\n itemTitlePropsGetter?: (item: ICartItem, close?: () => void) => ITypographyProps\r\n}\r\n\r\ninterface ICartWidgetState {\r\n anchorEl: HTMLElement | null\r\n hydrated: boolean\r\n}\r\n\r\nexport class CartWidget extends Component<ICartWidgetProps, ICartWidgetState> {\r\n constructor(props: ICartWidgetProps) {\r\n super(props)\r\n this.state = { anchorEl: null, hydrated: false }\r\n }\r\n\r\n get carts() {\r\n return this.props.carts ?? []\r\n }\r\n\r\n componentDidMount() {\r\n // When mounted on the client, set hydrated = true\r\n this.setState({ hydrated: true })\r\n }\r\n\r\n render = () => (\r\n <Fragment>\r\n <IconButtonDark onClick={(e) => this.onOpen(e.currentTarget)}>\r\n <Badge badgeContent={this.state.hydrated ? this.carts.length ?? 0 : 0} color='error'>\r\n <ShoppingCartOutlinedIcon fontSize='small' />\r\n </Badge>\r\n </IconButtonDark>\r\n <MenuStyled\r\n disableScrollLock\r\n anchorEl={this.state.anchorEl}\r\n open={Boolean(this.state.anchorEl)}\r\n onClose={this.onClose}\r\n anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n transformOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n MenuListProps={{ component: 'div' }}\r\n >\r\n {this.renderContent()}\r\n </MenuStyled>\r\n </Fragment>\r\n )\r\n\r\n renderContent = () => {\r\n const totalData = getTotalData(this.carts)\r\n return (\r\n <CartContentStyled>\r\n <div className={cartContentClasses.header}>\r\n <Typography variant='h6' component='span' sx={{ flex: 1 }}>\r\n Your Cart ({totalData.quantity ?? 0} items)\r\n </Typography>\r\n <Typography variant='h6' component='span'>\r\n Total: $ {totalData.price.toFixed(2)}\r\n </Typography>\r\n </div>\r\n <Divider />\r\n <div className={cartContentClasses.items}>\r\n {this.carts.map((x, i) => (\r\n <Fragment key={'key' + i}>{this.renderItem(x)}</Fragment>\r\n ))}\r\n {this.carts.length < 1 && <NoDataPanel title='Your cart is empty' subTitle='Try adding some products' sx={{ height: '100%' }} />}\r\n </div>\r\n <Divider />\r\n <div className={cartContentClasses.footer}>\r\n <Button\r\n {...(this.props.hrefCart ? { component: 'a', href: this.props.hrefCart } : {})}\r\n color='inherit'\r\n endIcon={<ShoppingCartCheckoutIcon />}\r\n onClick={(event) => {\r\n this.onClose()\r\n if (this.props.onMoveToCartClick) {\r\n this.props.onMoveToCartClick(event as React.MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>)\r\n }\r\n }}\r\n disabled={this.carts.length < 1}\r\n {...this.props.buttonMoveToCartProps}\r\n >\r\n Show in cart\r\n </Button>\r\n </div>\r\n </CartContentStyled>\r\n )\r\n }\r\n\r\n renderTitle = (item: ICartItem) => {\r\n const { itemTitleProps, itemTitlePropsGetter } = this.props\r\n const currentProps: ITypographyProps = itemTitlePropsGetter ? itemTitlePropsGetter(item, this.onClose) : itemTitleProps ?? {}\r\n return (\r\n <Typography className={cartContentClasses.itemTitle} noWrap variant='subtitle1' {...currentProps}>\r\n {item.ProductName ?? 'Unknown Product'}\r\n </Typography>\r\n )\r\n }\r\n\r\n renderItem = (item: ICartItem) => (\r\n <div className={cartContentClasses.item}>\r\n <ImageWithFallback\r\n className={cartContentClasses.itemImg}\r\n src={item?.PictureUrl}\r\n title={item?.PictureUrl}\r\n fallbackSrc='images/default-video.webp'\r\n alt='product-picture'\r\n />\r\n <div className={cartContentClasses.itemContent}>\r\n <Typography className={cartContentClasses.itemTag} variant='caption' sx={{ color: item.PriceColor ?? '#000' }}>\r\n {item.PriceName ?? 'Unknown Price'}\r\n </Typography>\r\n {this.renderTitle(item)}\r\n <Box sx={{ display: 'flex', alignItems: 'flex-end', gap: '2px', justifyContent: 'flex-end' }}>\r\n <Typography variant='subtitle1'>$ {item.Price ?? 0}</Typography>\r\n <Typography variant='body1' sx={{ fontSize: '14px', mb: '3px', color: '#818181' }}>\r\n x{item.Amount ?? 0} urls\r\n </Typography>\r\n </Box>\r\n </div>\r\n <IconButton size='small' onClick={() => this.props.onRemoveCart?.(item)} sx={{ color: '#818181' }}>\r\n <RemoveIcon />\r\n </IconButton>\r\n </div>\r\n )\r\n\r\n onOpen = (target: HTMLElement) => {\r\n this.setState({ anchorEl: target })\r\n }\r\n\r\n onClose = () => {\r\n this.setState({ anchorEl: null })\r\n }\r\n}\r\n\r\nexport const createCartWidget = (params: ICartWidgetProps) => {\r\n const _CartWidget: FC<Partial<ICartWidgetProps>> = (props) => <CartWidget {...params} {...props} />\r\n _CartWidget.displayName = 'CartWidget'\r\n return _CartWidget\r\n}\r\n"],"names":["CartWidget","props","_this","_classCallCheck","_callSuper","_defineProperty","_this$carts$length","_jsxs","Fragment","children","_jsx","IconButtonDark","onClick","e","onOpen","currentTarget","Badge","badgeContent","state","hydrated","carts","length","color","ShoppingCartOutlinedIcon","fontSize","MenuStyled","disableScrollLock","anchorEl","open","Boolean","onClose","anchorOrigin","vertical","horizontal","transformOrigin","MenuListProps","component","renderContent","_totalData$quantity","totalData","getTotalData","CartContentStyled","className","cartContentClasses","header","Typography","variant","sx","flex","quantity","price","toFixed","Divider","items","map","x","i","renderItem","NoDataPanel","title","subTitle","height","footer","Button","_objectSpread","hrefCart","href","endIcon","ShoppingCartCheckoutIcon","event","onMoveToCartClick","disabled","buttonMoveToCartProps","item","_item$ProductName","_this$props","itemTitleProps","itemTitlePropsGetter","currentProps","itemTitle","noWrap","ProductName","_item$PriceColor","_item$PriceName","_item$Price","_item$Amount","ImageWithFallback","itemImg","src","PictureUrl","fallbackSrc","alt","itemContent","itemTag","PriceColor","PriceName","renderTitle","Box","display","alignItems","gap","justifyContent","Price","mb","Amount","IconButton","size","_this$props$onRemoveC","_this$props2","onRemoveCart","call","RemoveIcon","target","setState","_inherits","Component","_createClass","key","get","_this$props$carts","this","value","createCartWidget","params","_CartWidget","displayName"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{objectWithoutProperties as e,slicedToArray as i,objectSpread2 as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as r,jsx as t}from"react/jsx-runtime";import{Box as o}from"@mui/material";import{createContext as d,useContext as n,useState as l}from"react";var s=["meidaId","videoId","children"],c=d(void 0),u=function(){var e=n(c);if(e)return e;console.error("useAnalyticMedia must be used within AnalyticMedia")},m=function(d){var n=d.meidaId,u=d.videoId,m=d.children,p=e(d,s),v=l(!1),h=i(v,2),f=h[0],y=h[1];return r(c.Provider,{value:{setStatus:y},children:[f&&t(o,{"data-media-id":n,"data-video-id":u,className:["analytic-video-player-control",f?"playing":"paused",p.className].join(" "),sx:{opacity:1,pointerEvents:"none",position:"absolute",height:"1px",width:"1px"}}),t(o,a(a({},p),{},{children:m}))]})};export{m as AnalyticMedia,c as AnalyticMediaContext,m as default,u as useAnalyticMedia};
2
+ //# sourceMappingURL=analytic-media.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"analytic-media.js","sources":["../../src/media-player/analytic-media.tsx"],"sourcesContent":["import { Box, BoxProps } from '@mui/material'\r\nimport { useState, createContext, useContext } from 'react'\r\nimport type { FC, PropsWithChildren } from 'react'\r\n\r\nexport const AnalyticMediaContext = createContext<{ setStatus: (status: boolean) => void } | undefined>(undefined)\r\n\r\nexport const useAnalyticMedia = () => {\r\n const ctx = useContext(AnalyticMediaContext)\r\n if (!ctx) {\r\n console.error('useAnalyticMedia must be used within AnalyticMedia')\r\n return undefined\r\n }\r\n return ctx\r\n}\r\n\r\nexport interface IAnalyticAudioProps extends PropsWithChildren, BoxProps {\r\n meidaId?: string\r\n videoId?: string\r\n}\r\n\r\nexport const AnalyticMedia: FC<IAnalyticAudioProps> = ({ meidaId, videoId, children, ...props }) => {\r\n const [status, setStatus] = useState(false)\r\n return (\r\n <AnalyticMediaContext.Provider value={{ setStatus }}>\r\n {status && (\r\n <Box\r\n data-media-id={meidaId}\r\n data-video-id={videoId}\r\n className={['analytic-video-player-control', status ? 'playing' : 'paused', props.className].join(' ')}\r\n sx={{ opacity: 1, pointerEvents: 'none', position: 'absolute', height: '1px', width: '1px' }}\r\n />\r\n )}\r\n <Box {...props}>{children}</Box>\r\n </AnalyticMediaContext.Provider>\r\n )\r\n}\r\n\r\nexport default AnalyticMedia\r\n"],"names":["AnalyticMediaContext","createContext","undefined","useAnalyticMedia","ctx","useContext","console","error","AnalyticMedia","_ref","meidaId","videoId","children","props","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","status","setStatus","_jsxs","Provider","value","_jsx","Box","className","join","sx","opacity","pointerEvents","position","height","width","_objectSpread"],"mappings":"0TAIaA,EAAuBC,OAAoEC,GAE3FC,EAAmB,WAC9B,IAAMC,EAAMC,EAAWL,GACvB,GAAKI,EAIL,OAAOA,EAHLE,QAAQC,MAAM,qDAIlB,EAOaC,EAAyC,SAA5BC,GAAyE,IAA1CC,EAAOD,EAAPC,QAASC,EAAOF,EAAPE,QAASC,EAAQH,EAARG,SAAaC,EAAKC,EAAAL,EAAAM,GAC3FC,EAA4BC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAApCI,EAAMF,EAAA,GAAEG,EAASH,EAAA,GACxB,OACEI,EAACtB,EAAqBuB,UAASC,MAAO,CAAEH,UAAAA,GACrCT,SAAA,CAAAQ,GACCK,EAACC,EACgB,CAAA,gBAAAhB,EACA,gBAAAC,EACfgB,UAAW,CAAC,gCAAiCP,EAAS,UAAY,SAAUP,EAAMc,WAAWC,KAAK,KAClGC,GAAI,CAAEC,QAAS,EAAGC,cAAe,OAAQC,SAAU,WAAYC,OAAQ,MAAOC,MAAO,SAGzFT,EAACC,EAAGS,EAAAA,EAAA,GAAKtB,GAAK,GAAA,CAAAD,SAAGA,OAGvB"}
@@ -0,0 +1,2 @@
1
+ import{objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{styled as i,IconButton as e}from"@mui/material";import l from"@mui/icons-material/Fullscreen";import t from"@mui/icons-material/FullscreenExit";var c=function(i){var e=i.hidden,c=i.isFullscreen,a=i.onClick,n=i.iconProps;return e?null:o(m,r(r({size:"small"},n),{},{onClick:a,children:o(c?t:l,{fontSize:null==n?void 0:n.size})}))},m=i(e)({width:"var(--mp-core1-icon-size, 24px)",height:"var(--mp-core1-icon-size, 24px)",color:"var(--mp-core1-color-text, #000)",svg:{color:"var(--mp-core1-color-text, #000)"}});export{c as default};
2
+ //# sourceMappingURL=btn.fullscreen.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.fullscreen.js","sources":["../../../src/media-player/core/btn.fullscreen.tsx"],"sourcesContent":["import { IconButton, IconButtonProps, styled } from '@mui/material'\r\nimport FullscreenIcon from '@mui/icons-material/Fullscreen'\r\nimport FullscreenExitIcon from '@mui/icons-material/FullscreenExit'\r\n\r\ninterface FullscreenButtonProps {\r\n hidden?: boolean\r\n isFullscreen: boolean\r\n onClick: () => void\r\n iconProps?: IconButtonProps\r\n}\r\n\r\nconst FullscreenButton: React.FC<FullscreenButtonProps> = ({ hidden, isFullscreen, onClick, iconProps }) => {\r\n if (hidden) return null\r\n return (\r\n <FullscreenIconButton size='small' {...iconProps} onClick={onClick}>\r\n {isFullscreen ? <FullscreenExitIcon fontSize={iconProps?.size} /> : <FullscreenIcon fontSize={iconProps?.size} />}\r\n </FullscreenIconButton>\r\n )\r\n}\r\n\r\nexport default FullscreenButton\r\n\r\nconst FullscreenIconButton = styled(IconButton)({\r\n width: 'var(--mp-core1-icon-size, 24px)',\r\n height: 'var(--mp-core1-icon-size, 24px)',\r\n color: 'var(--mp-core1-color-text, #000)',\r\n svg: {\r\n color: 'var(--mp-core1-color-text, #000)'\r\n }\r\n})\r\n"],"names":["FullscreenButton","_ref","hidden","isFullscreen","onClick","iconProps","_jsx","FullscreenIconButton","_objectSpread","size","children","FullscreenExitIcon","FullscreenIcon","fontSize","styled","IconButton","width","height","color","svg"],"mappings":"2QAWA,IAAMA,EAAoD,SAApCC,GAAqF,IAA9CC,EAAMD,EAANC,OAAQC,EAAYF,EAAZE,aAAcC,EAAOH,EAAPG,QAASC,EAASJ,EAATI,UAC1F,OAAIH,EAAe,KAEjBI,EAACC,EAAoBC,EAAAA,EAAA,CAACC,KAAK,SAAYJ,GAAS,GAAA,CAAED,QAASA,EAAOM,SAChDJ,EAAfH,EAAgBQ,EAAoDC,EAAjC,CAAAC,SAAUR,aAAS,EAATA,EAAWI,SAG/D,EAIMF,EAAuBO,EAAOC,EAAPD,CAAmB,CAC9CE,MAAO,kCACPC,OAAQ,kCACRC,MAAO,mCACPC,IAAK,CACHD,MAAO"}
@@ -0,0 +1,2 @@
1
+ import{objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{styled as i,IconButton as e}from"@mui/material";import t from"@mui/icons-material/PictureInPictureAlt";var l=function(i){var e=i.hidden,l=i.onClick,a=i.iconProps;return e?null:o(c,r(r({size:"small"},a),{},{onClick:l,children:o(t,{fontSize:null==a?void 0:a.size})}))},c=i(e)({width:"var(--mp-core1-icon-size, 24px)",height:"var(--mp-core1-icon-size, 24px)",color:"var(--mp-core1-color-text, #000)",svg:{color:"var(--mp-core1-color-text, #000)"}});export{l as default};
2
+ //# sourceMappingURL=btn.pip.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.pip.js","sources":["../../../src/media-player/core/btn.pip.tsx"],"sourcesContent":["import { IconButton, IconButtonProps, styled } from '@mui/material'\r\nimport PictureInPictureAltIcon from '@mui/icons-material/PictureInPictureAlt'\r\n\r\ninterface BtnPIPProps {\r\n onClick: () => void\r\n iconProps?: IconButtonProps\r\n hidden?: boolean\r\n}\r\n\r\nconst BtnPIP: React.FC<BtnPIPProps> = ({ hidden, onClick, iconProps }) => {\r\n if (hidden) return null\r\n return (\r\n <PIPIconButton size='small' {...iconProps} onClick={onClick}>\r\n <PictureInPictureAltIcon fontSize={iconProps?.size} />\r\n </PIPIconButton>\r\n )\r\n}\r\n\r\nexport default BtnPIP\r\n\r\nconst PIPIconButton = styled(IconButton)({\r\n width: 'var(--mp-core1-icon-size, 24px)',\r\n height: 'var(--mp-core1-icon-size, 24px)',\r\n color: 'var(--mp-core1-color-text, #000)',\r\n svg: {\r\n color: 'var(--mp-core1-color-text, #000)'\r\n }\r\n})\r\n"],"names":["BtnPIP","_ref","hidden","onClick","iconProps","_jsx","PIPIconButton","_objectSpread","size","children","PictureInPictureAltIcon","fontSize","styled","IconButton","width","height","color","svg"],"mappings":"kOASA,IAAMA,EAAgC,SAA1BC,GAA6D,IAAhCC,EAAMD,EAANC,OAAQC,EAAOF,EAAPE,QAASC,EAASH,EAATG,UACxD,OAAIF,EAAe,KAEjBG,EAACC,EAAaC,EAAAA,EAAA,CAACC,KAAK,SAAYJ,GAAS,GAAA,CAAED,QAASA,EAClDM,SAAAJ,EAACK,EAAuB,CAACC,SAAUP,aAAS,EAATA,EAAWI,SAGpD,EAIMF,EAAgBM,EAAOC,EAAPD,CAAmB,CACvCE,MAAO,kCACPC,OAAQ,kCACRC,MAAO,mCACPC,IAAK,CACHD,MAAO"}
@@ -0,0 +1,2 @@
1
+ import{objectSpread2 as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{styled as i,IconButton as e}from"@mui/material";import a from"@mui/icons-material/Pause";import l from"@mui/icons-material/PlayArrow";var m=function(i){var e=i.hidden,m=i.isPlaying,c=i.onClick,n=i.iconProps;return e?null:o(t,r(r({size:"small"},n),{},{onClick:c,children:o(m?a:l,{fontSize:null==n?void 0:n.size})}))},t=i(e)({width:"var(--mp-core1-icon-size, 24px)",height:"var(--mp-core1-icon-size, 24px)",color:"var(--mp-core1-color-text, #000)",":hover":{background:"var(--mp-core1-color-main, #fff)"},svg:{color:"var(--mp-core1-color-text, #000)"}});export{m as default};
2
+ //# sourceMappingURL=btn.play.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.play.js","sources":["../../../src/media-player/core/btn.play.tsx"],"sourcesContent":["import { IconButton, IconButtonProps, styled } from '@mui/material'\r\nimport PauseIcon from '@mui/icons-material/Pause'\r\nimport PlayArrowIcon from '@mui/icons-material/PlayArrow'\r\n\r\ninterface PlayButtonProps {\r\n isPlaying: boolean\r\n onClick: () => void\r\n iconProps?: IconButtonProps\r\n hidden?: boolean\r\n}\r\n\r\nconst PlayButton: React.FC<PlayButtonProps> = ({ hidden, isPlaying, onClick, iconProps }) => {\r\n if (hidden) return null\r\n return (\r\n <PlayIconButton size='small' {...iconProps} onClick={onClick}>\r\n {isPlaying ? <PauseIcon fontSize={iconProps?.size} /> : <PlayArrowIcon fontSize={iconProps?.size} />}\r\n </PlayIconButton>\r\n )\r\n}\r\n\r\nexport default PlayButton\r\n\r\nconst PlayIconButton = styled(IconButton)({\r\n width: 'var(--mp-core1-icon-size, 24px)',\r\n height: 'var(--mp-core1-icon-size, 24px)',\r\n color: 'var(--mp-core1-color-text, #000)',\r\n ':hover': {\r\n background: 'var(--mp-core1-color-main, #fff)'\r\n },\r\n svg: {\r\n color: 'var(--mp-core1-color-text, #000)'\r\n }\r\n})\r\n"],"names":["PlayButton","_ref","hidden","isPlaying","onClick","iconProps","_jsx","PlayIconButton","_objectSpread","size","children","PauseIcon","PlayArrowIcon","fontSize","styled","IconButton","width","height","color","background","svg"],"mappings":"iQAWA,IAAMA,EAAwC,SAA9BC,GAA4E,IAA3CC,EAAMD,EAANC,OAAQC,EAASF,EAATE,UAAWC,EAAOH,EAAPG,QAASC,EAASJ,EAATI,UAC3E,OAAIH,EAAe,KAEjBI,EAACC,EAAcC,EAAAA,EAAA,CAACC,KAAK,SAAYJ,GAAS,GAAA,CAAED,QAASA,EAAOM,SAC7CJ,EAAZH,EAAaQ,EAA2CC,EAAjC,CAAAC,SAAUR,aAAS,EAATA,EAAWI,SAGnD,EAIMF,EAAiBO,EAAOC,EAAPD,CAAmB,CACxCE,MAAO,kCACPC,OAAQ,kCACRC,MAAO,mCACP,SAAU,CACRC,WAAY,oCAEdC,IAAK,CACHF,MAAO"}
@@ -0,0 +1,2 @@
1
+ import{objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,jsx as e}from"react/jsx-runtime";import r from"@mui/material/IconButton";import i from"@mui/material/Slider";import l from"@mui/icons-material/VolumeOff";import a from"@mui/icons-material/VolumeUp";var n=function(n){var m=n.hidden,c=n.sliderPosition,s=void 0===c?"above":c,u=n.sliderHeight,f=void 0===u?60:u,p=n.sliderWidth,d=void 0===p?4:p,v=n.orientation,h=void 0===v?"vertical":v,b=n.volume,x=n.muted,g=n.setVolume,y=n.toggleMute,w={};return"above"===s?w={position:"absolute",left:"50%",bottom:"calc(100%)",transform:"translateX(-50%)",height:f,width:d}:"right"===s?w={opacity:1,height:d,width:f}:"below"===s&&(w={position:"absolute",left:"50%",top:"calc(100% + 8px)",transform:"translateX(-50%)",height:f,width:d}),m?null:t("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},className:"volume-slider-wrapper",children:[e(r,{size:"small",onClick:function(){return y()},children:e(x?l:a,{fontSize:"small",sx:{color:"var(--mp-core1-color-text, #fff)"}})}),e(i,{orientation:h,min:0,max:1,step:.01,value:x?0:b,onChange:function(o,t){return g(Number(t))},sx:o(o({opacity:0},w),{},{color:"var(--mp-core1-color-text, #fff)",pointerEvents:"none",transition:"opacity 0.2s","& .MuiSlider-thumb":{display:"none",width:12,height:12,backgroundColor:"var(--mp-core1-color-text, #fff)",border:"2px solid var(--mp-core1-color-text, #fff)"},"&:hover .MuiSlider-thumb":{display:"block","&::after":{content:"unset"}},".volume-slider-wrapper:hover &":{opacity:1,pointerEvents:"auto"},"& .MuiSlider-rail":{color:"var(--mp-core1-color-text, #fff)",opacity:.3},"& .MuiSlider-track":{color:"var(--mp-core1-color-text, #fff)"}})})]})};export{n as default};
2
+ //# sourceMappingURL=btn.volume.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.volume.js","sources":["../../../src/media-player/core/btn.volume.tsx"],"sourcesContent":["import IconButton from '@mui/material/IconButton'\r\nimport Slider from '@mui/material/Slider'\r\nimport VolumeOffIcon from '@mui/icons-material/VolumeOff'\r\nimport VolumeUpIcon from '@mui/icons-material/VolumeUp'\r\n\r\ntype MediaControlProps = {\r\n hidden?: boolean\r\n sliderPosition?: 'above' | 'right' | 'below'\r\n orientation?: 'horizontal' | 'vertical'\r\n sliderHeight?: number\r\n sliderWidth?: number\r\n volume?: number\r\n muted?: boolean\r\n setVolume: (value: number) => void\r\n toggleMute: () => void\r\n}\r\n\r\nconst BtnVolume: React.FC<MediaControlProps> = ({\r\n hidden,\r\n sliderPosition = 'above',\r\n sliderHeight = 60,\r\n sliderWidth = 4,\r\n orientation = 'vertical',\r\n volume,\r\n muted,\r\n setVolume,\r\n toggleMute\r\n}) => {\r\n const IconComp = muted ? VolumeOffIcon : VolumeUpIcon\r\n // Xác định style cho slider dựa vào vị trí\r\n let sliderStyle: React.CSSProperties = {}\r\n if (sliderPosition === 'above') {\r\n sliderStyle = {\r\n position: 'absolute',\r\n left: '50%',\r\n bottom: 'calc(100%)',\r\n transform: 'translateX(-50%)',\r\n height: sliderHeight,\r\n width: sliderWidth\r\n }\r\n } else if (sliderPosition === 'right') {\r\n sliderStyle = {\r\n opacity: 1,\r\n height: sliderWidth,\r\n width: sliderHeight\r\n }\r\n } else if (sliderPosition === 'below') {\r\n sliderStyle = {\r\n position: 'absolute',\r\n left: '50%',\r\n top: 'calc(100% + 8px)',\r\n transform: 'translateX(-50%)',\r\n height: sliderHeight,\r\n width: sliderWidth\r\n }\r\n }\r\n if (hidden) return null\r\n return (\r\n <div\r\n style={{\r\n position: 'relative',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center'\r\n }}\r\n className='volume-slider-wrapper'\r\n >\r\n <IconButton size='small' onClick={() => toggleMute()}>\r\n <IconComp fontSize='small' sx={{ color: 'var(--mp-core1-color-text, #fff)' }} />\r\n </IconButton>\r\n <Slider\r\n orientation={orientation}\r\n min={0}\r\n max={1}\r\n step={0.01}\r\n value={muted ? 0 : volume}\r\n onChange={(_, value) => setVolume(Number(value))}\r\n sx={{\r\n opacity: 0,\r\n ...sliderStyle,\r\n color: 'var(--mp-core1-color-text, #fff)',\r\n pointerEvents: 'none',\r\n transition: 'opacity 0.2s',\r\n '& .MuiSlider-thumb': {\r\n display: 'none',\r\n width: 12,\r\n height: 12,\r\n backgroundColor: 'var(--mp-core1-color-text, #fff)',\r\n border: `2px solid var(--mp-core1-color-text, #fff)`\r\n },\r\n '&:hover .MuiSlider-thumb': {\r\n display: 'block',\r\n '&::after': {\r\n content: 'unset'\r\n }\r\n },\r\n '.volume-slider-wrapper:hover &': {\r\n opacity: 1,\r\n pointerEvents: 'auto'\r\n },\r\n '& .MuiSlider-rail': {\r\n color: 'var(--mp-core1-color-text, #fff)',\r\n opacity: 0.3\r\n },\r\n '& .MuiSlider-track': {\r\n color: 'var(--mp-core1-color-text, #fff)'\r\n }\r\n }}\r\n />\r\n </div>\r\n )\r\n}\r\n\r\nexport default BtnVolume\r\n"],"names":["BtnVolume","_ref","hidden","_ref$sliderPosition","sliderPosition","_ref$sliderHeight","sliderHeight","_ref$sliderWidth","sliderWidth","_ref$orientation","orientation","volume","muted","setVolume","toggleMute","sliderStyle","position","left","bottom","transform","height","width","opacity","top","_jsxs","style","display","alignItems","justifyContent","className","_jsx","IconButton","size","onClick","children","VolumeOffIcon","VolumeUpIcon","fontSize","sx","color","Slider","min","max","step","value","onChange","_","Number","_objectSpread","pointerEvents","transition","backgroundColor","border","content"],"mappings":"mSAiBA,IAAMA,EAAyC,SAAhCC,GAUV,IATHC,EAAMD,EAANC,OAAMC,EAAAF,EACNG,eAAAA,OAAiB,IAAHD,EAAG,QAAOA,EAAAE,EAAAJ,EACxBK,aAAAA,OAAe,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EACjBO,YAAAA,OAAc,IAAHD,EAAG,EAACA,EAAAE,EAAAR,EACfS,YAAAA,OAAc,IAAHD,EAAG,WAAUA,EACxBE,EAAMV,EAANU,OACAC,EAAKX,EAALW,MACAC,EAASZ,EAATY,UACAC,EAAUb,EAAVa,WAIIC,EAAmC,CAAE,EA0BzC,MAzBuB,UAAnBX,EACFW,EAAc,CACZC,SAAU,WACVC,KAAM,MACNC,OAAQ,aACRC,UAAW,mBACXC,OAAQd,EACRe,MAAOb,GAEmB,UAAnBJ,EACTW,EAAc,CACZO,QAAS,EACTF,OAAQZ,EACRa,MAAOf,GAEmB,UAAnBF,IACTW,EAAc,CACZC,SAAU,WACVC,KAAM,MACNM,IAAK,mBACLJ,UAAW,mBACXC,OAAQd,EACRe,MAAOb,IAGPN,EAAe,KAEjBsB,EACE,MAAA,CAAAC,MAAO,CACLT,SAAU,WACVU,QAAS,OACTC,WAAY,SACZC,eAAgB,UAElBC,UAAU,kCAEVC,EAACC,GAAWC,KAAK,QAAQC,QAAS,WAAF,OAAQnB,GAAY,EAClDoB,SAAAJ,EAxCWlB,EAAQuB,EAAgBC,EAwC1B,CAACC,SAAS,QAAQC,GAAI,CAAEC,MAAO,wCAE1CT,EAACU,EAAM,CACL9B,YAAaA,EACb+B,IAAK,EACLC,IAAK,EACLC,KAAM,IACNC,MAAOhC,EAAQ,EAAID,EACnBkC,SAAU,SAACC,EAAGF,GAAK,OAAK/B,EAAUkC,OAAOH,GAAO,EAChDN,GAAEU,EAAAA,EAAA,CACA1B,QAAS,GACNP,GAAW,GAAA,CACdwB,MAAO,mCACPU,cAAe,OACfC,WAAY,eACZ,qBAAsB,CACpBxB,QAAS,OACTL,MAAO,GACPD,OAAQ,GACR+B,gBAAiB,mCACjBC,OAAM,8CAER,2BAA4B,CAC1B1B,QAAS,QACT,WAAY,CACV2B,QAAS,UAGb,iCAAkC,CAChC/B,QAAS,EACT2B,cAAe,QAEjB,oBAAqB,CACnBV,MAAO,mCACPjB,QAAS,IAEX,qBAAsB,CACpBiB,MAAO,0CAMnB"}
@@ -0,0 +1,2 @@
1
+ import{jsxs as r,jsx as e}from"react/jsx-runtime";import{Box as t,Slider as o}from"@mui/material";var i=function(i){var n=i.bufferedSegments,a=i.progress,l=i.isLoading,d=i.onChange;return r(t,{sx:{position:"relative",width:"100%",display:"flex",alignItems:"center"},children:[n.map(function(r,o){return e(t,{sx:{position:"absolute",top:"50%",transform:"translateY(-50%)",left:"".concat(r.left,"%"),width:"".concat(r.width,"%"),height:5,backgroundColor:"rgba(255,255,255,0.4)",pointerEvents:"none",borderRadius:2,zIndex:1}},o)}),l&&e(t,{sx:{position:"absolute",top:"50%",transform:"translateY(-50%)",left:0,height:5,width:"100%",backgroundImage:"repeating-linear-gradient(\n 30deg,\n rgba(255,255,255,0.2) 0px,\n rgba(255,255,255,0.2) 6px,\n rgba(255,255,255,0.08) 6px,\n rgba(255,255,255,0.08) 12px\n )",filter:"blur(0.5px)",backgroundSize:"48px 48px",animation:"stripeAnimation 4s linear infinite",pointerEvents:"none",overflow:"hidden",borderRadius:2,zIndex:2}}),e(o,{value:a,min:0,max:100,step:.1,onChange:function(r,e){return null==d?void 0:d(Number(e))},sx:{position:"absolute",top:"50%",left:0,width:"100%",transform:"translateY(-50%)",height:5,color:"var(--mp-core1-color-main, #ed4229)",zIndex:3,padding:0,"& .MuiSlider-thumb":{display:"none",width:12,height:12,backgroundColor:"var(--mp-core1-color-text, #fff)",border:"2px solid var(--mp-core1-color-text, #fff)"},"&:hover .MuiSlider-thumb":{display:"block"},"& .MuiSlider-rail":{color:"var(--mp-core1-color-text, #fff)",opacity:.3},"& .MuiSlider-track":{borderRadius:2}}})]})};export{i as default};
2
+ //# sourceMappingURL=progressBar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"progressBar.js","sources":["../../../src/media-player/core/progressBar.tsx"],"sourcesContent":["import React from 'react'\r\nimport { Slider, Box } from '@mui/material'\r\n\r\ninterface Props {\r\n bufferedSegments: { left: number; width: number }[]\r\n progress: number\r\n isLoading: boolean\r\n onChange?: (value: number) => void\r\n}\r\n\r\nconst ProgressBar: React.FC<Props> = ({\r\n bufferedSegments,\r\n progress,\r\n isLoading,\r\n onChange,\r\n}) => (\r\n <Box sx={{ position: 'relative', width: '100%', display: 'flex', alignItems: 'center' }}>\r\n {bufferedSegments.map((seg, idx) => (\r\n <Box\r\n key={idx}\r\n sx={{\r\n position: 'absolute',\r\n top: '50%',\r\n transform: 'translateY(-50%)',\r\n left: `${seg.left}%`,\r\n width: `${seg.width}%`,\r\n height: 5,\r\n backgroundColor: 'rgba(255,255,255,0.4)',\r\n pointerEvents: 'none',\r\n borderRadius: 2,\r\n zIndex: 1\r\n }}\r\n />\r\n ))}\r\n {/* Loading stripe */}\r\n {isLoading && (\r\n <Box\r\n sx={{\r\n position: 'absolute',\r\n top: '50%',\r\n transform: 'translateY(-50%)',\r\n left: 0,\r\n height: 5,\r\n width: '100%',\r\n backgroundImage: `repeating-linear-gradient(\r\n 30deg,\r\n rgba(255,255,255,0.2) 0px,\r\n rgba(255,255,255,0.2) 6px,\r\n rgba(255,255,255,0.08) 6px,\r\n rgba(255,255,255,0.08) 12px\r\n )`,\r\n filter: 'blur(0.5px)',\r\n backgroundSize: '48px 48px',\r\n animation: 'stripeAnimation 4s linear infinite',\r\n pointerEvents: 'none',\r\n overflow: 'hidden',\r\n borderRadius: 2,\r\n zIndex: 2\r\n }}\r\n />\r\n )}\r\n {/* Slider */}\r\n <Slider\r\n value={progress}\r\n min={0}\r\n max={100}\r\n step={0.1}\r\n onChange={(_, value) => onChange?.(Number(value))}\r\n sx={{\r\n position: 'absolute',\r\n top: '50%',\r\n left: 0,\r\n width: '100%',\r\n transform: 'translateY(-50%)',\r\n height: 5,\r\n color: 'var(--mp-core1-color-main, #ed4229)',\r\n zIndex: 3,\r\n padding: 0,\r\n '& .MuiSlider-thumb': {\r\n display: 'none',\r\n width: 12,\r\n height: 12,\r\n backgroundColor: 'var(--mp-core1-color-text, #fff)',\r\n border: `2px solid var(--mp-core1-color-text, #fff)`\r\n },\r\n '&:hover .MuiSlider-thumb': {\r\n display: 'block'\r\n },\r\n '& .MuiSlider-rail': {\r\n color: 'var(--mp-core1-color-text, #fff)',\r\n opacity: 0.3\r\n },\r\n '& .MuiSlider-track': {\r\n borderRadius: 2\r\n }\r\n }}\r\n />\r\n </Box>\r\n)\r\n\r\nexport default ProgressBar\r\n"],"names":["ProgressBar","_ref","bufferedSegments","progress","isLoading","onChange","_jsxs","Box","sx","position","width","display","alignItems","children","map","seg","idx","_jsx","top","transform","left","concat","height","backgroundColor","pointerEvents","borderRadius","zIndex","backgroundImage","filter","backgroundSize","animation","overflow","Slider","value","min","max","step","_","Number","color","padding","border","opacity"],"mappings":"kGAUA,IAAMA,EAA+B,SAApBC,GAAA,IACfC,EAAgBD,EAAhBC,iBACAC,EAAQF,EAARE,SACAC,EAASH,EAATG,UACAC,EAAQJ,EAARI,SAAQ,OAERC,EAACC,EAAG,CAACC,GAAI,CAAEC,SAAU,WAAYC,MAAO,OAAQC,QAAS,OAAQC,WAAY,UAC1EC,SAAA,CAAAX,EAAiBY,IAAI,SAACC,EAAKC,GAAG,OAC7BC,EAACV,EAEC,CAAAC,GAAI,CACFC,SAAU,WACVS,IAAK,MACLC,UAAW,mBACXC,QAAIC,OAAKN,EAAIK,KAAO,KACpBV,SAAKW,OAAKN,EAAIL,MAAQ,KACtBY,OAAQ,EACRC,gBAAiB,wBACjBC,cAAe,OACfC,aAAc,EACdC,OAAQ,IAXLV,EAaL,GAGHZ,GACCa,EAACV,EACC,CAAAC,GAAI,CACFC,SAAU,WACVS,IAAK,MACLC,UAAW,mBACXC,KAAM,EACNE,OAAQ,EACRZ,MAAO,OACPiB,gBAME,gOACFC,OAAQ,cACRC,eAAgB,YAChBC,UAAW,qCACXN,cAAe,OACfO,SAAU,SACVN,aAAc,EACdC,OAAQ,KAKdT,EAACe,EACC,CAAAC,MAAO9B,EACP+B,IAAK,EACLC,IAAK,IACLC,KAAM,GACN/B,SAAU,SAACgC,EAAGJ,GAAK,OAAK5B,aAAAA,EAAAA,EAAWiC,OAAOL,GAAO,EACjDzB,GAAI,CACFC,SAAU,WACVS,IAAK,MACLE,KAAM,EACNV,MAAO,OACPS,UAAW,mBACXG,OAAQ,EACRiB,MAAO,sCACPb,OAAQ,EACRc,QAAS,EACT,qBAAsB,CACpB7B,QAAS,OACTD,MAAO,GACPY,OAAQ,GACRC,gBAAiB,mCACjBkB,OAAM,8CAER,2BAA4B,CAC1B9B,QAAS,SAEX,oBAAqB,CACnB4B,MAAO,mCACPG,QAAS,IAEX,qBAAsB,CACpBjB,aAAc,QAIhB"}
@@ -0,0 +1,2 @@
1
+ import{jsxs as r}from"react/jsx-runtime";import{Typography as t}from"@mui/material";var o=function(r){if(isNaN(r))return"0:00";var t=Math.floor(r/60),o=Math.floor(r%60).toString().padStart(2,"0");return"".concat(t,":").concat(o)},a=function(a){var i=a.currentTime,n=void 0===i?0:i,e=a.duration,c=void 0===e?0:e;return r(t,{sx:{marginTop:"2px",flex:"0 0 auto"},variant:"caption",color:"white",children:[o(n)," / ",o(c)]})};export{a as default};
2
+ //# sourceMappingURL=time.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"time.js","sources":["../../../src/media-player/core/time.tsx"],"sourcesContent":["import { Typography } from '@mui/material'\r\n\r\ninterface BtnPIPProps {\r\n currentTime?: number\r\n duration?: number\r\n}\r\n\r\nconst formatTime = (time: number): string => {\r\n if (isNaN(time)) return '0:00'\r\n const minutes = Math.floor(time / 60)\r\n const seconds = Math.floor(time % 60)\r\n .toString()\r\n .padStart(2, '0')\r\n return `${minutes}:${seconds}`\r\n}\r\n\r\nconst MediaTime: React.FC<BtnPIPProps> = ({ currentTime = 0, duration = 0 }) => (\r\n <Typography sx={{ marginTop: '2px', flex: '0 0 auto' }} variant='caption' color='white'>\r\n {formatTime(currentTime)} / {formatTime(duration)}\r\n </Typography>\r\n)\r\n\r\nexport default MediaTime\r\n"],"names":["formatTime","time","isNaN","minutes","Math","floor","seconds","toString","padStart","concat","MediaTime","_ref","_ref$currentTime","currentTime","_ref$duration","duration","_jsxs","Typography","sx","marginTop","flex","variant","color"],"mappings":"oFAOA,IAAMA,EAAa,SAACC,GAClB,GAAIC,MAAMD,GAAO,MAAO,OACxB,IAAME,EAAUC,KAAKC,MAAMJ,EAAO,IAC5BK,EAAUF,KAAKC,MAAMJ,EAAO,IAC/BM,WACAC,SAAS,EAAG,KACf,MAAA,GAAAC,OAAUN,EAAOM,KAAAA,OAAIH,EACvB,EAEMI,EAAmC,SAA1BC,GAAA,IAAAC,EAAAD,EAA6BE,YAAAA,OAAc,IAAHD,EAAG,EAACA,EAAAE,EAAAH,EAAEI,SAAAA,OAAW,IAAHD,EAAG,EAACA,EAAA,OACvEE,EAACC,GAAWC,GAAI,CAAEC,UAAW,MAAOC,KAAM,YAAcC,QAAQ,UAAUC,MAAM,kBAC7EtB,EAAWa,GAAiB,MAAAb,EAAWe,KAC7B"}
@@ -0,0 +1,2 @@
1
+ import{slicedToArray as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{useState as t,useEffect as n}from"react";function r(r,u){var i=t(!0),c=e(i,2),o=c[0],a=c[1],d=t(!1),s=e(d,2),l=s[0],m=s[1],v=t(0),f=e(v,2),g=f[0],E=f[1],p=t(0),L=e(p,2),P=L[0],h=L[1],y=t(0),T=e(y,2),b=T[0],I=T[1],F=t([]),q=e(F,2),x=q[0],k=q[1],w=t(1),S=e(w,2),_=S[0],j=S[1],A=t(!1),B=e(A,2),H=B[0],M=B[1],V=t(!1),z=e(V,2),C=z[0],D=z[1];n(function(){var e=r.current;if(e){var t=function(){E(e.currentTime/e.duration*100),h(e.currentTime)},n=function(){j(e.volume)},u=function(){M(e.muted)},i=function(){for(var t=e.duration,n=[],r=0;r<e.buffered.length;r++){var u=e.buffered.start(r),i=e.buffered.end(r);n.push({left:u/t*100,width:(i-u)/t*100})}k(n)},c=function(){m(!0)},o=function(){m(!1)},d=function(){return a(!0)},s=function(){return a(!1)},l=function(){I(e.duration),i()};return e.addEventListener("play",c),e.addEventListener("pause",o),e.addEventListener("waiting",d),e.addEventListener("playing",s),e.addEventListener("timeupdate",t),e.addEventListener("progress",i),e.addEventListener("loadedmetadata",l),e.addEventListener("volumechange",n),e.addEventListener("mute",u),function(){e.src="about:blank",e.load(),document.pictureInPictureElement===e&&document.exitPictureInPicture().catch(function(){}),e.removeEventListener("play",c),e.removeEventListener("pause",o),e.removeEventListener("waiting",d),e.removeEventListener("playing",s),e.removeEventListener("timeupdate",t),e.removeEventListener("progress",i),e.removeEventListener("loadedmetadata",l),e.removeEventListener("volumechange",n),e.removeEventListener("mute",u)}}},[]),n(function(){var e=function(){var e=r.current;D(document.fullscreenElement===e)};return document.addEventListener("fullscreenchange",e),function(){document.removeEventListener("fullscreenchange",e)}},[r]);return{state:{isLoading:o,isPlaying:l,progress:g,currentTime:P,duration:b,bufferedSegments:x,volume:_,muted:H,isFullscreen:C},controls:{togglePlay:function(){var e=r.current;e&&(e.paused?e.play():e.pause())},handleSeek:function(e){var t=r.current;t&&t.duration&&(t.currentTime=e/100*t.duration,h(t.currentTime),E(t.currentTime/t.duration*100))},setVolume:function(e){r.current&&(r.current.volume=e,j(e),M(0===e),0===e&&(r.current.muted=!0,r.current.volume=1))},toggleMute:function(){r.current&&(r.current.muted=!r.current.muted,M(r.current.muted))},seek:function(e){r.current&&(r.current.currentTime=e,h(e))},togglePIP:function(){var e=r.current;e&&(document.pictureInPictureElement===e?document.exitPictureInPicture():"requestPictureInPicture"in e&&e.requestPictureInPicture())},toggleFullscreen:function(){var e=null==u?void 0:u.current;e&&(document.fullscreenElement===e?document.exitFullscreen():e.requestFullscreen&&e.requestFullscreen())}}}}export{r as useVideoPlayerCore};
2
+ //# sourceMappingURL=useVideoPlayerCore.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useVideoPlayerCore.js","sources":["../../../src/media-player/core/useVideoPlayerCore.ts"],"sourcesContent":["import { useState, useEffect } from 'react'\r\n\r\nexport interface VideoPlayerCoreState {\r\n isLoading: boolean\r\n isPlaying: boolean\r\n progress: number\r\n currentTime: number\r\n duration: number\r\n bufferedSegments: { left: number; width: number }[]\r\n volume: number\r\n muted: boolean\r\n isFullscreen: boolean\r\n}\r\n\r\nexport interface VideoPlayerCoreControls {\r\n togglePlay: () => void\r\n handleSeek: (value: number) => void\r\n setVolume: (value: number) => void\r\n toggleMute: () => void\r\n seek: (time: number) => void\r\n togglePIP: () => void\r\n toggleFullscreen: () => void\r\n}\r\n\r\nexport function useVideoPlayerCore(\r\n videoRef: React.RefObject<HTMLVideoElement>,\r\n videoContainerRef?: React.RefObject<HTMLDivElement>,\r\n): { state: VideoPlayerCoreState; controls: VideoPlayerCoreControls } {\r\n const [isLoading, setIsLoading] = useState(true)\r\n const [isPlaying, setIsPlaying] = useState(false)\r\n const [progress, setProgress] = useState(0)\r\n const [currentTime, setCurrentTime] = useState(0)\r\n const [duration, setDuration] = useState(0)\r\n const [bufferedSegments, setBufferedSegments] = useState<{ left: number; width: number }[]>([])\r\n const [volume, setVolume] = useState(1)\r\n const [muted, setMuted] = useState(false)\r\n const [isFullscreen, setIsFullscreen] = useState(false)\r\n\r\n useEffect(() => {\r\n const video = videoRef.current\r\n if (!video) return\r\n\r\n const updateTime = () => {\r\n setProgress((video.currentTime / video.duration) * 100)\r\n setCurrentTime(video.currentTime)\r\n }\r\n\r\n const updateVolume = () => {\r\n setVolume(video.volume)\r\n }\r\n\r\n const updateMuted = () => {\r\n setMuted(video.muted)\r\n }\r\n\r\n const updateBuffered = () => {\r\n const duration = video.duration\r\n const segments = []\r\n for (let i = 0; i < video.buffered.length; i++) {\r\n const start = video.buffered.start(i)\r\n const end = video.buffered.end(i)\r\n segments.push({\r\n left: (start / duration) * 100,\r\n width: ((end - start) / duration) * 100\r\n })\r\n }\r\n setBufferedSegments(segments)\r\n }\r\n\r\n const onPlay = () => {\r\n setIsPlaying(true)\r\n }\r\n const onPause = () => {\r\n setIsPlaying(false)\r\n }\r\n const onWaiting = () => setIsLoading(true)\r\n const onPlaying = () => setIsLoading(false)\r\n const onLoadedMetadata = () => {\r\n setDuration(video.duration)\r\n updateBuffered()\r\n }\r\n\r\n video.addEventListener('play', onPlay)\r\n video.addEventListener('pause', onPause)\r\n video.addEventListener('waiting', onWaiting)\r\n video.addEventListener('playing', onPlaying)\r\n video.addEventListener('timeupdate', updateTime)\r\n video.addEventListener('progress', updateBuffered)\r\n video.addEventListener('loadedmetadata', onLoadedMetadata)\r\n video.addEventListener('volumechange', updateVolume)\r\n video.addEventListener('mute', updateMuted)\r\n return () => {\r\n video.src = 'about:blank'\r\n video.load()\r\n // clear Pip\r\n if (document.pictureInPictureElement === video) {\r\n document.exitPictureInPicture().catch(() => { })\r\n }\r\n video.removeEventListener('play', onPlay)\r\n video.removeEventListener('pause', onPause)\r\n video.removeEventListener('waiting', onWaiting)\r\n video.removeEventListener('playing', onPlaying)\r\n video.removeEventListener('timeupdate', updateTime)\r\n video.removeEventListener('progress', updateBuffered)\r\n video.removeEventListener('loadedmetadata', onLoadedMetadata)\r\n video.removeEventListener('volumechange', updateVolume)\r\n video.removeEventListener('mute', updateMuted)\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [])\r\n\r\n useEffect(() => {\r\n const handleFullscreenChange = () => {\r\n const video = videoRef.current\r\n setIsFullscreen(document.fullscreenElement === video)\r\n }\r\n document.addEventListener('fullscreenchange', handleFullscreenChange)\r\n return () => {\r\n document.removeEventListener('fullscreenchange', handleFullscreenChange)\r\n }\r\n }, [videoRef])\r\n\r\n const togglePlay = () => {\r\n const video = videoRef.current\r\n if (!video) return\r\n if (video.paused) {\r\n video.play()\r\n } else {\r\n video.pause()\r\n }\r\n }\r\n\r\n const handleSeek = (value: number) => {\r\n const video = videoRef.current\r\n if (!video || !video.duration) return\r\n video.currentTime = (value / 100) * video.duration\r\n setCurrentTime(video.currentTime)\r\n setProgress((video.currentTime / video.duration) * 100)\r\n }\r\n\r\n const handleSetVolume = (value: number) => {\r\n if (videoRef.current) {\r\n videoRef.current.volume = value\r\n setVolume(value)\r\n setMuted(value === 0)\r\n if (value === 0) {\r\n videoRef.current.muted = true\r\n videoRef.current.volume = 1\r\n }\r\n }\r\n }\r\n\r\n const toggleMute = () => {\r\n if (videoRef.current) {\r\n videoRef.current.muted = !videoRef.current.muted\r\n setMuted(videoRef.current.muted)\r\n }\r\n }\r\n\r\n const seek = (time: number) => {\r\n if (videoRef.current) {\r\n videoRef.current.currentTime = time\r\n setCurrentTime(time)\r\n }\r\n }\r\n\r\n const togglePIP = () => {\r\n const video = videoRef.current\r\n if (!video) return\r\n if (document.pictureInPictureElement === video) {\r\n document.exitPictureInPicture()\r\n } else if ('requestPictureInPicture' in video) {\r\n video.requestPictureInPicture()\r\n }\r\n }\r\n\r\n const toggleFullscreen = () => {\r\n const video = videoContainerRef?.current\r\n if (!video) return\r\n if (document.fullscreenElement === video) {\r\n document.exitFullscreen()\r\n } else if (video.requestFullscreen) {\r\n video.requestFullscreen()\r\n }\r\n }\r\n\r\n return {\r\n state: { isLoading, isPlaying, progress, currentTime, duration, bufferedSegments, volume, muted, isFullscreen },\r\n controls: { togglePlay, handleSeek, setVolume: handleSetVolume, toggleMute, seek, togglePIP, toggleFullscreen }\r\n }\r\n}"],"names":["useVideoPlayerCore","videoRef","videoContainerRef","_useState","useState","_useState2","_slicedToArray","isLoading","setIsLoading","_useState3","_useState4","isPlaying","setIsPlaying","_useState5","_useState6","progress","setProgress","_useState7","_useState8","currentTime","setCurrentTime","_useState9","_useState0","duration","setDuration","_useState1","_useState10","bufferedSegments","setBufferedSegments","_useState11","_useState12","volume","setVolume","_useState13","_useState14","muted","setMuted","_useState15","_useState16","isFullscreen","setIsFullscreen","useEffect","video","current","updateTime","updateVolume","updateMuted","updateBuffered","segments","i","buffered","length","start","end","push","left","width","onPlay","onPause","onWaiting","onPlaying","onLoadedMetadata","addEventListener","src","load","document","pictureInPictureElement","exitPictureInPicture","removeEventListener","handleFullscreenChange","fullscreenElement","state","controls","togglePlay","paused","play","pause","handleSeek","value","toggleMute","seek","time","togglePIP","requestPictureInPicture","toggleFullscreen","exitFullscreen","requestFullscreen"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{defineProperty as e,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,jsx as r}from"react/jsx-runtime";import{forwardRef as a,useRef as n,useEffect as i}from"react";import{styled as l,Box as s,useTheme as d,useMediaQuery as c,Stack as m}from"@mui/material";import{useVideoPlayerCore as u}from"./useVideoPlayerCore.js";import p from"./progressBar.js";import f from"./btn.play.js";import g from"./btn.volume.js";import b from"./btn.pip.js";import v from"./btn.fullscreen.js";import y from"./time.js";var h={root:"MediaPlayerCore-root",control:"MediaPlayerCore-control",controlCompact:"MediaPlayerCore-control-compact",overlay:"MediaPlayerCore-overlay",bufferedSegments:"MediaPlayerCore-buffered-segments"},P={autoPlay:!1,muted:!1,pip:!1,fullscreen:!1,volume:!0,preload:"auto"},C=a(function(e,a){var l=n(null),s=n(null),C=d(),k=c(C.breakpoints.down("md")),x=function(){for(var e=arguments.length,o=new Array(e),t=0;t<e;t++)o[t]=arguments[t];return function(e){o.forEach(function(o){o&&("function"==typeof o?o(e):o.current=e)})}}(l,a),S=u(l,s),w=S.state,j=S.controls;i(function(){if("mediaSession"in navigator&&e.mediaMetadata&&l.current)return navigator.mediaSession.metadata=new MediaMetadata({title:e.mediaMetadata.title||"Video",artist:e.mediaMetadata.artist||"Berlin Tomek",album:e.mediaMetadata.album||"Media Album",artwork:e.mediaMetadata.artwork?Array.from(e.mediaMetadata.artwork):void 0}),function(){navigator.mediaSession.setActionHandler("play",null),navigator.mediaSession.setActionHandler("pause",null),navigator.mediaSession.setActionHandler("seekbackward",null),navigator.mediaSession.setActionHandler("seekforward",null),navigator.mediaSession.setActionHandler("seekto",null)}},[e.mediaMetadata]);var A=o(o({},P),e.controls);return t(M,{sx:e.sx,className:[h.root,e.className].filter(function(e){return!!e}).join(" "),ref:s,children:[r("video",{ref:x,controls:!1,width:"100%",height:"100%",src:e.src,autoPlay:A.autoPlay,muted:A.muted,preload:A.preload}),r("div",{className:h.overlay,onClick:j.togglePlay}),t("div",{className:h.control,children:[r(f,{isPlaying:w.isPlaying,onClick:j.togglePlay}),r(p,{bufferedSegments:w.bufferedSegments,progress:w.progress,isLoading:w.isLoading,onChange:j.handleSeek}),r(y,{currentTime:w.currentTime,duration:w.duration}),r(g,{hidden:k||A.muted||!A.volume,sliderPosition:"right",orientation:"horizontal",muted:w.muted,volume:w.volume,setVolume:j.setVolume,toggleMute:j.toggleMute}),t(m,{flexDirection:"row",alignItems:"center",gap:0,children:[e.anotherControls,r(b,{hidden:k||!A.pip,onClick:j.togglePIP}),r(v,{hidden:!A.fullscreen,isFullscreen:w.isFullscreen,onClick:j.toggleFullscreen})]})]}),r("div",{className:h.controlCompact,children:r(p,{bufferedSegments:w.bufferedSegments,progress:w.progress,isLoading:w.isLoading})})]})}),M=l(s)(e(e(e(e(e({"--mp-core1-color-main":"#ed4229","--mp-core1-color-text":"#fff","--mp-core1-icon-size":"34px",width:"640px",height:"360px",position:"relative"},".".concat(h.control),{position:"absolute",bottom:0,left:0,width:"100%",display:"flex",alignItems:"center",padding:"6px 8px",gap:"8px",zIndex:3,transition:"0.3s",transform:"translateY(100%)"}),".".concat(h.controlCompact),{position:"absolute",bottom:0,left:0,width:"100%",transition:"0.3s",zIndex:2,opacity:.5}),".".concat(h.overlay),{position:"absolute",bottom:0,left:0,width:"100%",height:"100%",zIndex:1,opacity:0,transition:"0.3s",cursor:"pointer",background:"linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 20%)"}),".".concat(h.bufferedSegments),{position:"absolute",top:0,height:"100%",backgroundColor:"rgba(255,255,255,0.4)",pointerEvents:"none"}),"&:hover",e(e(e({},".".concat(h.overlay),{opacity:1}),".".concat(h.control),{transform:"translateY(0)"}),".".concat(h.controlCompact),{opacity:0,transform:"translateY(110%)"})));export{C as default,P as defaultControlsConfig};
2
+ //# sourceMappingURL=videoplayer.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"videoplayer.js","sources":["../../../src/media-player/core/videoplayer.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef } from 'react'\r\nimport type { PropsWithChildren } from 'react'\r\nimport { Box, Stack, styled, SxProps, Theme, useMediaQuery, useTheme } from '@mui/material'\r\nimport { useVideoPlayerCore } from './useVideoPlayerCore'\r\nimport VideoProgressBar from './progressBar'\r\nimport PlayButton from './btn.play'\r\nimport BtnVolume from './btn.volume'\r\nimport BtnPIP from './btn.pip'\r\nimport FullscreenButton from './btn.fullscreen'\r\nimport MediaTime from './time'\r\n\r\nconst MPCoreClasses = {\r\n root: 'MediaPlayerCore-root',\r\n control: 'MediaPlayerCore-control',\r\n controlCompact: 'MediaPlayerCore-control-compact',\r\n overlay: 'MediaPlayerCore-overlay',\r\n playButton: 'MediaPlayerCore-play-button',\r\n timer: 'MediaPlayerCore-timer',\r\n progressBar: 'MediaPlayerCore-progress-bar',\r\n loading: 'MediaPlayerCore-loading',\r\n timeline: 'MediaPlayerCore-timeline',\r\n bufferedSegments: 'MediaPlayerCore-buffered-segments'\r\n}\r\n\r\nexport interface IControlsConfig {\r\n autoPlay?: boolean\r\n muted?: boolean\r\n volume?: boolean\r\n pip?: boolean\r\n fullscreen?: boolean\r\n preload?: 'auto' | 'metadata' | 'none'\r\n}\r\n\r\n// Giá trị mặc định cho MediaPlayerCore2Slots\r\nexport const defaultControlsConfig: IControlsConfig = {\r\n autoPlay: false,\r\n muted: false,\r\n pip: false,\r\n fullscreen: false,\r\n volume: true,\r\n preload: 'auto'\r\n}\r\n\r\nexport interface MediaPlayerSlot {\r\n controls?: IControlsConfig\r\n anotherControls?: React.ReactNode\r\n mediaMetadata?: MediaMetadata\r\n}\r\ninterface IProps extends MediaPlayerSlot, PropsWithChildren {\r\n src?: string\r\n sx?: SxProps<Theme>\r\n className?: string\r\n}\r\n\r\nconst MediaPlayerCore = forwardRef<HTMLVideoElement, IProps>((props, ref) => {\r\n const videoRef = useRef<HTMLVideoElement | null>(null)\r\n const videoContainerRef = useRef<HTMLDivElement>(null)\r\n const theme = useTheme()\r\n const isMobile = useMediaQuery(theme.breakpoints.down('md'))\r\n const combinedRef = mergeRefs(videoRef, ref)\r\n const { state, controls } = useVideoPlayerCore(videoRef, videoContainerRef)\r\n\r\n function mergeRefs<T>(...refs: (React.Ref<T> | undefined)[]): React.RefCallback<T> {\r\n return (value: T) => {\r\n refs.forEach((ref) => {\r\n if (!ref) return\r\n if (typeof ref === 'function') {\r\n ref(value)\r\n } else {\r\n ;(ref as React.MutableRefObject<T | null>).current = value\r\n }\r\n })\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if (!('mediaSession' in navigator) || !props.mediaMetadata) return\r\n const video = videoRef.current\r\n if (!video) return\r\n // Set metadata\r\n navigator.mediaSession.metadata = new MediaMetadata({\r\n title: props.mediaMetadata.title || 'Video',\r\n artist: props.mediaMetadata.artist || 'Berlin Tomek',\r\n album: props.mediaMetadata.album || 'Media Album',\r\n artwork: props.mediaMetadata.artwork ? Array.from(props.mediaMetadata.artwork) : undefined\r\n })\r\n return () => {\r\n navigator.mediaSession.setActionHandler('play', null)\r\n navigator.mediaSession.setActionHandler('pause', null)\r\n navigator.mediaSession.setActionHandler('seekbackward', null)\r\n navigator.mediaSession.setActionHandler('seekforward', null)\r\n navigator.mediaSession.setActionHandler('seekto', null)\r\n }\r\n }, [props.mediaMetadata])\r\n\r\n const controlsConfig = { ...defaultControlsConfig, ...props.controls }\r\n\r\n const getClasses = () => {\r\n return [MPCoreClasses.root, props.className].filter((x) => !!x).join(' ')\r\n }\r\n\r\n return (\r\n <Wrap sx={props.sx} className={getClasses()} ref={videoContainerRef}>\r\n <video\r\n ref={combinedRef}\r\n controls={false}\r\n width='100%'\r\n height='100%'\r\n src={props.src}\r\n autoPlay={controlsConfig.autoPlay}\r\n muted={controlsConfig.muted}\r\n preload={controlsConfig.preload}\r\n />\r\n <div className={MPCoreClasses.overlay} onClick={controls.togglePlay} />\r\n <div className={MPCoreClasses.control}>\r\n <PlayButton isPlaying={state.isPlaying} onClick={controls.togglePlay} />\r\n <VideoProgressBar\r\n bufferedSegments={state.bufferedSegments}\r\n progress={state.progress}\r\n isLoading={state.isLoading}\r\n onChange={controls.handleSeek}\r\n />\r\n <MediaTime currentTime={state.currentTime} duration={state.duration} />\r\n <BtnVolume\r\n hidden={isMobile || controlsConfig.muted || !controlsConfig.volume}\r\n sliderPosition='right'\r\n orientation='horizontal'\r\n muted={state.muted}\r\n volume={state.volume}\r\n setVolume={controls.setVolume}\r\n toggleMute={controls.toggleMute}\r\n />\r\n <Stack flexDirection='row' alignItems='center' gap={0}>\r\n {props.anotherControls}\r\n <BtnPIP hidden={isMobile || !controlsConfig.pip} onClick={controls.togglePIP} />\r\n <FullscreenButton hidden={!controlsConfig.fullscreen} isFullscreen={state.isFullscreen} onClick={controls.toggleFullscreen} />\r\n </Stack>\r\n </div>\r\n <div className={MPCoreClasses.controlCompact}>\r\n <VideoProgressBar bufferedSegments={state.bufferedSegments} progress={state.progress} isLoading={state.isLoading} />\r\n </div>\r\n </Wrap>\r\n )\r\n})\r\n\r\nexport default MediaPlayerCore\r\n\r\nconst Wrap = styled(Box)({\r\n '--mp-core1-color-main': '#ed4229',\r\n '--mp-core1-color-text': '#fff',\r\n '--mp-core1-icon-size': '34px',\r\n width: '640px',\r\n height: '360px',\r\n position: 'relative',\r\n [`.${MPCoreClasses.control}`]: {\r\n position: 'absolute',\r\n bottom: 0,\r\n left: 0,\r\n width: '100%',\r\n display: 'flex',\r\n alignItems: 'center',\r\n padding: '6px 8px',\r\n gap: '8px',\r\n zIndex: 3,\r\n transition: '0.3s',\r\n transform: 'translateY(100%)'\r\n },\r\n [`.${MPCoreClasses.controlCompact}`]: {\r\n position: 'absolute',\r\n bottom: 0,\r\n left: 0,\r\n width: '100%',\r\n transition: '0.3s',\r\n zIndex: 2,\r\n opacity: 0.5\r\n },\r\n [`.${MPCoreClasses.overlay}`]: {\r\n position: 'absolute',\r\n bottom: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n zIndex: 1,\r\n opacity: 0,\r\n transition: '0.3s',\r\n cursor: 'pointer',\r\n background: 'linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 20%)'\r\n },\r\n [`.${MPCoreClasses.bufferedSegments}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n height: '100%',\r\n backgroundColor: 'rgba(255,255,255,0.4)',\r\n pointerEvents: 'none'\r\n },\r\n '&:hover': {\r\n [`.${MPCoreClasses.overlay}`]: {\r\n opacity: 1\r\n },\r\n [`.${MPCoreClasses.control}`]: {\r\n transform: 'translateY(0)'\r\n },\r\n [`.${MPCoreClasses.controlCompact}`]: {\r\n opacity: 0,\r\n transform: 'translateY(110%)'\r\n }\r\n }\r\n})\r\n"],"names":["MPCoreClasses","root","control","controlCompact","overlay","bufferedSegments","defaultControlsConfig","autoPlay","muted","pip","fullscreen","volume","preload","MediaPlayerCore","forwardRef","props","ref","videoRef","useRef","videoContainerRef","theme","useTheme","isMobile","useMediaQuery","breakpoints","down","combinedRef","_len","arguments","length","refs","Array","_key","value","forEach","current","mergeRefs","_useVideoPlayerCore","useVideoPlayerCore","state","controls","useEffect","navigator","mediaMetadata","mediaSession","metadata","MediaMetadata","title","artist","album","artwork","from","undefined","setActionHandler","controlsConfig","_objectSpread","_jsxs","Wrap","sx","className","filter","x","join","children","_jsx","width","height","src","onClick","togglePlay","PlayButton","isPlaying","VideoProgressBar","progress","isLoading","onChange","handleSeek","MediaTime","currentTime","duration","BtnVolume","hidden","sliderPosition","orientation","setVolume","toggleMute","Stack","flexDirection","alignItems","gap","anotherControls","BtnPIP","togglePIP","FullscreenButton","isFullscreen","toggleFullscreen","styled","Box","_defineProperty","position","concat","bottom","left","display","padding","zIndex","transition","transform","opacity","cursor","background","top","backgroundColor","pointerEvents"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ import{slicedToArray as r,typeof as n,asyncToGenerator as t,regenerator as e}from"../_virtual/_rollupPluginBabelHelpers.js";import{useState as o,useEffect as a}from"react";import{EMediaPlayerStatus as i}from"./types.js";var u=function(n,u){var c=o(i.Loading),s=r(c,2),f=s[0],l=s[1],p=o(null),m=r(p,2),v=m[0],d=m[1];return a(function(){var r=new AbortController,o=function(){var o=t(e().m(function t(){var o,a;return e().w(function(t){for(;;)switch(t.p=t.n){case 0:if(l(i.Loading),t.p=1,n){t.n=2;break}return t.a(2);case 2:return t.n=3,u(n,r.signal);case 3:o=t.v,"string"==typeof(a=o[0].StreamUrl)&&a&&d(a),l(i.Loaded),t.n=5;break;case 4:t.p=4,t.v,l(i.Error);case 5:return t.a(2)}},t,null,[[1,4]])}));return function(){return o.apply(this,arguments)}}();return o(),function(){l(i.Loading),r.abort()}},[n,u]),{status:f,streamUrl:v}},c=function(r){if(!r)return arguments.length>1&&void 0!==arguments[1]?arguments[1]:"56.25%";if("number"==typeof r)return"".concat(r,"%");if("object"===n(r)){var t={};for(var e in r)t[e]="".concat(r[e],"%");return t}},s=function(r){return{paddingBottom:c(r)}};export{c as getAspectRatio,s as getAspectRatioStyled,u as useStreamUrl};
2
+ //# sourceMappingURL=helpers.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"helpers.js","sources":["../../src/media-player/helpers.ts"],"sourcesContent":["import { useEffect, useState } from 'react'\r\nimport { Breakpoint, SxProps, Theme } from '@mui/material'\r\nimport { EMediaPlayerStatus } from './types'\r\nimport type { AspectRatioParams, MediaPlayerBaseProps } from './types'\r\n\r\nexport const useStreamUrl = (resourceId: string | null, fetchDataStream: MediaPlayerBaseProps['fetchDataStream']) => {\r\n const [status, setStatus] = useState(EMediaPlayerStatus.Loading)\r\n const [streamUrl, setStreamUrl] = useState<string | null>(null)\r\n\r\n useEffect(() => {\r\n const abortController = new AbortController()\r\n const func = async () => {\r\n setStatus(EMediaPlayerStatus.Loading)\r\n try {\r\n if (!resourceId) return\r\n const res = await fetchDataStream(resourceId, abortController.signal)\r\n const url = res[0].StreamUrl\r\n if (typeof url === 'string' && !!url) setStreamUrl(url)\r\n setStatus(EMediaPlayerStatus.Loaded)\r\n } catch {\r\n setStatus(EMediaPlayerStatus.Error)\r\n }\r\n }\r\n func()\r\n return () => {\r\n setStatus(EMediaPlayerStatus.Loading)\r\n abortController.abort()\r\n }\r\n }, [resourceId, fetchDataStream])\r\n\r\n return { status, streamUrl }\r\n}\r\n\r\nexport const getAspectRatio = (value?: AspectRatioParams, defaultAspectRatio = '56.25%') => {\r\n if (!value) return defaultAspectRatio\r\n if (typeof value === 'number') return `${value}%`\r\n if (typeof value === 'object') {\r\n const result: Partial<Record<Breakpoint, string>> = {}\r\n for (const key in value) {\r\n result[key as Breakpoint] = `${value[key as Breakpoint]}%`\r\n }\r\n return result\r\n }\r\n return undefined\r\n}\r\n\r\nexport const getAspectRatioStyled = (value?: AspectRatioParams): SxProps<Theme> => {\r\n return { paddingBottom: getAspectRatio(value) }\r\n}\r\n"],"names":["useStreamUrl","resourceId","fetchDataStream","_useState","useState","EMediaPlayerStatus","Loading","_useState2","_slicedToArray","status","setStatus","_useState3","_useState4","streamUrl","setStreamUrl","useEffect","abortController","AbortController","func","_ref","_asyncToGenerator","_regenerator","m","_callee","res","url","w","_context","p","n","a","signal","v","StreamUrl","Loaded","Error","apply","this","arguments","abort","getAspectRatio","value","length","undefined","concat","_typeof","result","key","getAspectRatioStyled","paddingBottom"],"mappings":"4NAKO,IAAMA,EAAe,SAACC,EAA2BC,GACtD,IAAAC,EAA4BC,EAASC,EAAmBC,SAAQC,EAAAC,EAAAL,EAAA,GAAzDM,EAAMF,EAAA,GAAEG,EAASH,EAAA,GACxBI,EAAkCP,EAAwB,MAAKQ,EAAAJ,EAAAG,EAAA,GAAxDE,EAASD,EAAA,GAAEE,EAAYF,EAAA,GAuB9B,OArBAG,EAAU,WACR,IAAMC,EAAkB,IAAIC,gBACtBC,EAAI,WAAA,IAAAC,EAAAC,EAAAC,IAAAC,EAAG,SAAAC,IAAA,IAAAC,EAAAC,EAAA,OAAAJ,IAAAK,EAAA,SAAAC,GAAA,cAAAA,EAAAC,EAAAD,EAAAE,GAAA,KAAA,EAC0B,GAArCnB,EAAUL,EAAmBC,SAAQqB,EAAAC,EAAA,EAE9B3B,EAAU,CAAA0B,EAAAE,EAAA,EAAA,KAAA,CAAA,OAAAF,EAAAG,EAAA,GAAA,KAAA,EAAA,OAAAH,EAAAE,EAAA,EACG3B,EAAgBD,EAAYe,EAAgBe,QAAO,KAAA,EAA/DP,EAAGG,EAAAK,EAEU,iBADbP,EAAMD,EAAI,GAAGS,YACcR,GAAKX,EAAaW,GACnDf,EAAUL,EAAmB6B,QAAOP,EAAAE,EAAA,EAAA,MAAA,KAAA,EAAAF,EAAAC,EAAA,EAAAD,EAAAK,EAEpCtB,EAAUL,EAAmB8B,OAAM,KAAA,EAAA,OAAAR,EAAAG,EAAA,GAAA,EAAAP,EAAA,KAAA,CAAA,CAAA,EAAA,QAEtC,OAAA,WAXS,OAAAJ,EAAAiB,MAAAC,KAAAC,UAAA,EAAA,GAaV,OADApB,IACO,WACLR,EAAUL,EAAmBC,SAC7BU,EAAgBuB,OACjB,CACH,EAAG,CAACtC,EAAYC,IAET,CAAEO,OAAAA,EAAQI,UAAAA,EACnB,EAEa2B,EAAiB,SAACC,GAC7B,IAAKA,EAAO,OAD8DH,UAAAI,OAAA,QAAAC,IAAAL,UAAA,GAAAA,UAAA,GAAG,SAE7E,GAAqB,iBAAVG,EAAoB,MAAAG,GAAAA,OAAUH,EAAK,KAC9C,GAAqB,WAAjBI,EAAOJ,GAAoB,CAC7B,IAAMK,EAA8C,CAAE,EACtD,IAAK,IAAMC,KAAON,EAChBK,EAAOC,GAAkBH,GAAAA,OAAMH,EAAMM,GAAqB,KAE5D,OAAOD,CACR,CAEH,EAEaE,EAAuB,SAACP,GACnC,MAAO,CAAEQ,cAAeT,EAAeC,GACzC"}
@@ -0,0 +1,2 @@
1
+ export{EMediaPlayerStatus}from"./types.js";export{getAspectRatio,getAspectRatioStyled,useStreamUrl}from"./helpers.js";export{MediaPlayerAudio}from"./player.audio.js";import"./player.video-stream.js";export{MediaPlayerPreview}from"./preview.js";export{getMediaMetaTag}from"./mediaMetadata.js";export{AnalyticMedia,AnalyticMediaContext,useAnalyticMedia}from"./analytic-media.js";export{MediaPlayerMuted}from"./muted.js";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ var r=function(r){return{title:r.title||"Video Title",artist:(null==r?void 0:r.artist)||"BerlinTomek",album:(null==r?void 0:r.album)||"Media Album",artwork:r.artworkSrc?[{src:r.artworkSrc||"",sizes:"96x96",type:"image/png"},{src:r.artworkSrc||"",sizes:"128x128",type:"image/png"},{src:r.artworkSrc||"",sizes:"192x192",type:"image/png"},{src:r.artworkSrc||"",sizes:"256x256",type:"image/png"},{src:r.artworkSrc||"",sizes:"384x384",type:"image/png"},{src:r.artworkSrc||"",sizes:"512x512",type:"image/png"}]:[]}};export{r as getMediaMetaTag};
2
+ //# sourceMappingURL=mediaMetadata.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mediaMetadata.js","sources":["../../src/media-player/mediaMetadata.ts"],"sourcesContent":["export const getMediaMetaTag =\r\n (mediaMetadata:\r\n { title?: string; artist?: string; album?: string, artworkSrc?: string }\r\n ): MediaMetadata => {\r\n return {\r\n title: mediaMetadata.title || 'Video Title',\r\n artist: mediaMetadata?.artist || 'BerlinTomek',\r\n album: mediaMetadata?.album || 'Media Album',\r\n artwork: mediaMetadata.artworkSrc ? [\r\n {\r\n src: mediaMetadata.artworkSrc || '',\r\n sizes: '96x96',\r\n type: 'image/png'\r\n },\r\n {\r\n src: mediaMetadata.artworkSrc || '',\r\n sizes: '128x128',\r\n type: 'image/png'\r\n },\r\n {\r\n src: mediaMetadata.artworkSrc || '',\r\n sizes: '192x192',\r\n type: 'image/png'\r\n },\r\n {\r\n src: mediaMetadata.artworkSrc || '',\r\n sizes: '256x256',\r\n type: 'image/png'\r\n },\r\n {\r\n src: mediaMetadata.artworkSrc || '',\r\n sizes: '384x384',\r\n type: 'image/png'\r\n },\r\n {\r\n src: mediaMetadata.artworkSrc || '',\r\n sizes: '512x512',\r\n type: 'image/png'\r\n }\r\n ]: []\r\n }\r\n }\r\n"],"names":["getMediaMetaTag","mediaMetadata","title","artist","album","artwork","artworkSrc","src","sizes","type"],"mappings":"IAAaA,EACX,SAACC,GAGC,MAAO,CACLC,MAAOD,EAAcC,OAAS,cAC9BC,QAAQF,eAAAA,EAAeE,SAAU,cACjCC,OAAOH,eAAAA,EAAeG,QAAS,cAC/BC,QAASJ,EAAcK,WAAa,CAClC,CACEC,IAAKN,EAAcK,YAAc,GACjCE,MAAO,QACPC,KAAM,aAER,CACEF,IAAKN,EAAcK,YAAc,GACjCE,MAAO,UACPC,KAAM,aAER,CACEF,IAAKN,EAAcK,YAAc,GACjCE,MAAO,UACPC,KAAM,aAER,CACEF,IAAKN,EAAcK,YAAc,GACjCE,MAAO,UACPC,KAAM,aAER,CACEF,IAAKN,EAAcK,YAAc,GACjCE,MAAO,UACPC,KAAM,aAER,CACEF,IAAKN,EAAcK,YAAc,GACjCE,MAAO,UACPC,KAAM,cAEP,GAEP"}
@@ -0,0 +1,2 @@
1
+ import{objectSpread2 as o}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as r,jsx as i}from"react/jsx-runtime";import{styled as e,Box as t,Fade as a,Skeleton as l}from"@mui/material";import{useStreamUrl as n,getAspectRatioStyled as d}from"./helpers.js";import{EMediaPlayerStatus as s}from"./types.js";import m from"./core/videoplayer.js";var u=function(e){var t,u,h=n(e.resourceId,e.fetchDataStream),v=h.status,f=h.streamUrl;return r(p,{className:v===s.Loaded?"loaded":"",sx:d(null===(t=e.slots)||void 0===t?void 0:t.aspectRatio),children:[i(c,{children:f&&i(m,o({className:"player",src:f,anotherControls:!0,controls:{autoPlay:!0,muted:!0}},null===(u=e.slots)||void 0===u?void 0:u.coreProps))}),i(a,{in:v===s.Loading||e.loading,children:i(c,{children:function(){var o,r,t;if(null!==(o=e.slots)&&void 0!==o&&o.loading)return e.slots.loading;var a=null!==(r=null===(t=e.slots)||void 0===t||null===(t=t.loadingProps)||void 0===t?void 0:t.animationDuration)&&void 0!==r?r:"1s";return i(l,{animation:"wave",variant:"rounded",sx:{width:"100%",height:"100%","&::after":{animationDuration:a}}})}()})}),i(a,{in:v===s.Error&&!e.loading,unmountOnExit:!0,children:i(c,{children:i("img",{src:"images/video-error.webp",alt:"video-error",style:{width:"100%",height:"100%"}})})})]})},p=e(t)({"--mp-core1-color-main":"#ed4229","--mp-core1-color-text":"#fff","--mp-core1-icon-size":"34px",position:"relative",paddingBottom:"56.25%",borderRadius:"6px",overflow:"hidden","&.loaded":{background:"#000"}}),c=e(t)({position:"absolute",top:0,left:0,width:"100%",height:"100%",zIndex:2,".player":{width:"100%",height:"100%"}});export{u as MediaPlayerMuted,u as default};
2
+ //# sourceMappingURL=muted.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"muted.js","sources":["../../src/media-player/muted.tsx"],"sourcesContent":["import type { FC } from 'react'\r\nimport type { MediaPlayerBaseProps, MediaPlayerBaseSlots } from './types'\r\nimport { Box, Fade, Skeleton, styled } from '@mui/material'\r\nimport { getAspectRatioStyled, useStreamUrl } from './helpers'\r\nimport { EMediaPlayerStatus } from './types'\r\nimport MediaPlayerCore, { MediaPlayerSlot } from './core/videoplayer'\r\n\r\nexport interface SlotMediaPlayerMutedProps extends MediaPlayerBaseSlots {\r\n coreProps?: MediaPlayerSlot\r\n}\r\nexport interface IMediaPlayerMutedProps extends MediaPlayerBaseProps {\r\n slots?: SlotMediaPlayerMutedProps\r\n}\r\n\r\nexport const MediaPlayerMuted: FC<IMediaPlayerMutedProps> = (props) => {\r\n const { status, streamUrl } = useStreamUrl(props.resourceId, props.fetchDataStream)\r\n\r\n const renderLoading = () => {\r\n if (props.slots?.loading) return props.slots.loading\r\n const duration = props.slots?.loadingProps?.animationDuration ?? '1s'\r\n return <Skeleton animation='wave' variant='rounded' sx={{ width: '100%', height: '100%', '&::after': { animationDuration: duration } }} />\r\n }\r\n\r\n return (\r\n <WrapPlayer className={status === EMediaPlayerStatus.Loaded ? 'loaded' : ''} sx={getAspectRatioStyled(props.slots?.aspectRatio)}>\r\n <WrapVideo>\r\n {streamUrl && (\r\n // <MediaPlayerCore1 className='player' src={streamUrl} slots={props.slots?.core1Props} />\r\n <MediaPlayerCore\r\n className='player'\r\n src={streamUrl}\r\n anotherControls\r\n controls={{ autoPlay: true, muted: true }}\r\n {...props.slots?.coreProps}\r\n />\r\n )}\r\n </WrapVideo>\r\n <Fade in={status === EMediaPlayerStatus.Loading || props.loading}>\r\n <WrapVideo>{renderLoading()}</WrapVideo>\r\n </Fade>\r\n <Fade in={status === EMediaPlayerStatus.Error && !props.loading} unmountOnExit>\r\n <WrapVideo>\r\n <img src='images/video-error.webp' alt='video-error' style={{ width: '100%', height: '100%' }} />\r\n </WrapVideo>\r\n </Fade>\r\n </WrapPlayer>\r\n )\r\n}\r\n\r\nexport default MediaPlayerMuted\r\n\r\nconst WrapPlayer = styled(Box)({\r\n '--mp-core1-color-main': '#ed4229',\r\n '--mp-core1-color-text': '#fff',\r\n '--mp-core1-icon-size': '34px',\r\n position: 'relative',\r\n paddingBottom: '56.25%',\r\n borderRadius: '6px',\r\n overflow: 'hidden',\r\n '&.loaded': {\r\n background: '#000'\r\n }\r\n})\r\n\r\nconst WrapVideo = styled(Box)({\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n zIndex: 2,\r\n '.player': {\r\n width: '100%',\r\n height: '100%'\r\n }\r\n})\r\n"],"names":["MediaPlayerMuted","props","_props$slots3","_props$slots4","_useStreamUrl","useStreamUrl","resourceId","fetchDataStream","status","streamUrl","_jsxs","WrapPlayer","className","EMediaPlayerStatus","Loaded","sx","getAspectRatioStyled","slots","aspectRatio","children","_jsx","WrapVideo","MediaPlayerCore","_objectSpread","src","anotherControls","controls","autoPlay","muted","coreProps","Fade","in","Loading","loading","_props$slots","_props$slots$loadingP","_props$slots2","duration","loadingProps","animationDuration","Skeleton","animation","variant","width","height","renderLoading","Error","unmountOnExit","alt","style","styled","Box","position","paddingBottom","borderRadius","overflow","background","top","left","zIndex"],"mappings":"kWAcaA,EAA+C,SAACC,GAAS,IAAAC,EAAAC,EACpEC,EAA8BC,EAAaJ,EAAMK,WAAYL,EAAMM,iBAA3DC,EAAMJ,EAANI,OAAQC,EAASL,EAATK,UAQhB,OACEC,EAACC,EAAU,CAACC,UAAWJ,IAAWK,EAAmBC,OAAS,SAAW,GAAIC,GAAIC,EAAgC,QAAZd,EAACD,EAAMgB,aAAK,IAAAf,OAAA,EAAXA,EAAagB,aACjHC,SAAA,CAAAC,EAACC,EAAS,CAAAF,SACPV,GAECW,EAACE,EAAeC,EAAA,CACdX,UAAU,SACVY,IAAKf,EACLgB,mBACAC,SAAU,CAAEC,UAAU,EAAMC,OAAO,IACpBzB,QAD0BA,EACrCF,EAAMgB,aAANd,IAAWA,OAAXA,EAAAA,EAAa0B,cAIvBT,EAACU,EAAK,CAAAC,GAAIvB,IAAWK,EAAmBmB,SAAW/B,EAAMgC,QACvDd,SAAAC,EAACC,EAAS,CAAAF,SArBM,WAAK,IAAAe,EAAAC,EAAAC,EACzB,WAAAF,EAAIjC,EAAMgB,aAAK,IAAAiB,GAAXA,EAAaD,QAAS,OAAOhC,EAAMgB,MAAMgB,QAC7C,IAAMI,EAAuD,QAA/CF,EAAc,QAAdC,EAAGnC,EAAMgB,aAAK,IAAAmB,GAAc,QAAdA,EAAXA,EAAaE,oBAAY,IAAAF,OAAA,EAAzBA,EAA2BG,yBAAiB,IAAAJ,EAAAA,EAAI,KACjE,OAAOf,EAACoB,EAAS,CAAAC,UAAU,OAAOC,QAAQ,UAAU3B,GAAI,CAAE4B,MAAO,OAAQC,OAAQ,OAAQ,WAAY,CAAEL,kBAAmBF,KAC3H,CAiBiBQ,OAEdzB,EAACU,EAAK,CAAAC,GAAIvB,IAAWK,EAAmBiC,QAAU7C,EAAMgC,QAASc,eAC/D,EAAA5B,SAAAC,EAACC,EAAS,CAAAF,SACRC,SAAKI,IAAI,0BAA0BwB,IAAI,cAAcC,MAAO,CAAEN,MAAO,OAAQC,OAAQ,gBAK/F,EAIMjC,EAAauC,EAAOC,EAAPD,CAAY,CAC7B,wBAAyB,UACzB,wBAAyB,OACzB,uBAAwB,OACxBE,SAAU,WACVC,cAAe,SACfC,aAAc,MACdC,SAAU,SACV,WAAY,CACVC,WAAY,UAIVnC,EAAY6B,EAAOC,EAAPD,CAAY,CAC5BE,SAAU,WACVK,IAAK,EACLC,KAAM,EACNf,MAAO,OACPC,OAAQ,OACRe,OAAQ,EACR,UAAW,CACThB,MAAO,OACPC,OAAQ"}
@@ -0,0 +1,2 @@
1
+ import{jsx as r}from"react/jsx-runtime";var t=function(t){return r("audio",{controls:!0,src:t.src,style:{width:"500px"}})};export{t as MediaPlayerAudio,t as default};
2
+ //# sourceMappingURL=player.audio.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"player.audio.js","sources":["../../src/media-player/player.audio.tsx"],"sourcesContent":["import type { FC } from 'react'\r\n\r\nexport interface IMediaPlayerAudioProps {\r\n src: string\r\n}\r\n\r\nexport const MediaPlayerAudio: FC<IMediaPlayerAudioProps> = (props) => {\r\n return <audio controls src={props.src} style={{ width: '500px' }} />\r\n}\r\n\r\nexport default MediaPlayerAudio\r\n"],"names":["MediaPlayerAudio","props","_jsx","controls","src","style","width"],"mappings":"4CAMaA,EAA+C,SAACC,GAC3D,OAAOC,WAAOC,UAAQ,EAACC,IAAKH,EAAMG,IAAKC,MAAO,CAAEC,MAAO,UACzD"}
@@ -0,0 +1,2 @@
1
+ import{defineProperty as o}from"../_virtual/_rollupPluginBabelHelpers.js";import"react/jsx-runtime";import"react";import{styled as e,Box as r}from"@mui/material";import"./types.js";import"./core/videoplayer.js";e(r)(o({"--mp-core1-color-main":"#ed4229","--mp-core1-color-text":"#fff","--mp-core1-icon-size":"34px",position:"relative",aspectRatio:"16/9",borderRadius:"6px",overflow:"hidden","&.loaded":{background:"#000",boxShadow:"rgba(0, 0, 0, 0.24) 0px 3px 8px"}},"&.".concat("disabled-background"),{background:"unset"})),e(r)({"--plyr-color-main":"#ed4229",position:"absolute",top:0,left:0,width:"100%",height:"100%",zIndex:2,".MPCore1-root":{width:"100%",height:"100%"}});
2
+ //# sourceMappingURL=player.video-stream.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"player.video-stream.js","sources":["../../src/media-player/player.video-stream.tsx"],"sourcesContent":["import React, { useEffect } from 'react'\r\nimport { Box, Fade, Skeleton, styled } from '@mui/material'\r\nimport { useStreamUrl } from './helpers'\r\nimport MediaPlayerCore, { MediaPlayerSlot } from './core/videoplayer'\r\nimport { EMediaPlayerStatus } from './types'\r\nimport type { MediaPlayerBaseProps, MediaPlayerBaseSlots } from './types'\r\n\r\nexport interface MediaPlayerSlotsProps extends MediaPlayerBaseSlots {\r\n disabledBackground?: boolean\r\n keepTabActive?: boolean\r\n}\r\n\r\ninterface IProps extends MediaPlayerBaseProps {\r\n slots?: MediaPlayerSlotsProps\r\n slotMedia?: MediaPlayerSlot\r\n mediaMetadata?: MediaMetadata\r\n}\r\n\r\nconst mediaPlayerClasses = {\r\n disabledLoading: 'disabled-loading',\r\n disabledBackground: 'disabled-background'\r\n}\r\n\r\nconst MediaPlayerVideo = React.forwardRef<HTMLVideoElement, IProps>((props, ref) => {\r\n const { status, streamUrl } = useStreamUrl(props.resourceId, props.fetchDataStream)\r\n\r\n useEffect(() => {\r\n const keepActive = () => requestAnimationFrame(keepActive)\r\n const rafId = requestAnimationFrame(keepActive)\r\n return () => cancelAnimationFrame(rafId)\r\n }, [])\r\n\r\n const renderLoading = () => {\r\n if (props.slots?.loading) return props.slots.loading\r\n const duration = props.slots?.loadingProps?.animationDuration ?? '1s'\r\n return <Skeleton animation='wave' variant='rounded' sx={{ width: '100%', height: '100%', '&::after': { animationDuration: duration } }} />\r\n }\r\n\r\n const getClasses = (): string | undefined => {\r\n const classes: string[] = []\r\n if (props.slots?.loadingProps?.disabled) classes.push(mediaPlayerClasses.disabledLoading)\r\n if (props.slots?.disabledBackground) classes.push(mediaPlayerClasses.disabledBackground)\r\n if (status !== EMediaPlayerStatus.Loading && !props.loading && streamUrl) {\r\n classes.push('loaded')\r\n }\r\n return classes.length > 0 ? classes.join(' ') : undefined\r\n }\r\n\r\n return (\r\n <WrapPlayer className={getClasses()}>\r\n <WrapVideo sx={{ zIndex: 3 }}>\r\n {streamUrl && (\r\n <MediaPlayerCore\r\n ref={ref}\r\n className='player'\r\n src={streamUrl}\r\n mediaMetadata={props.mediaMetadata}\r\n {...props.slotMedia}\r\n controls={props.slotMedia?.controls}\r\n />\r\n )}\r\n </WrapVideo>\r\n <Fade in={(status === EMediaPlayerStatus.Loading || props.loading) && props.slots?.loadingProps?.disabled !== true}>\r\n <WrapVideo>{renderLoading()}</WrapVideo>\r\n </Fade>\r\n <Fade in={status === EMediaPlayerStatus.Error && !props.loading} unmountOnExit>\r\n <WrapVideo>\r\n <img src='images/video-error.webp' alt='video-error' style={{ width: '100%', height: '100%' }} />\r\n </WrapVideo>\r\n </Fade>\r\n </WrapPlayer>\r\n )\r\n})\r\n\r\nexport default React.memo(MediaPlayerVideo)\r\n\r\nconst WrapPlayer = styled(Box)({\r\n '--mp-core1-color-main': '#ed4229',\r\n '--mp-core1-color-text': '#fff',\r\n '--mp-core1-icon-size': '34px',\r\n position: 'relative',\r\n aspectRatio: '16/9',\r\n borderRadius: '6px',\r\n overflow: 'hidden',\r\n '&.loaded': {\r\n background: '#000',\r\n boxShadow: 'rgba(0, 0, 0, 0.24) 0px 3px 8px'\r\n },\r\n [`&.${mediaPlayerClasses.disabledBackground}`]: {\r\n background: 'unset'\r\n }\r\n})\r\n\r\nconst WrapVideo = styled(Box)({\r\n '--plyr-color-main': '#ed4229',\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n zIndex: 2,\r\n '.MPCore1-root': {\r\n width: '100%',\r\n height: '100%'\r\n }\r\n})\r\n"],"names":["styled","Box","_defineProperty","position","aspectRatio","borderRadius","overflow","background","boxShadow","concat","top","left","width","height","zIndex"],"mappings":"mNA4EmBA,EAAOC,EAAPD,CAAWE,EAAA,CAC5B,wBAAyB,UACzB,wBAAyB,OACzB,uBAAwB,OACxBC,SAAU,WACVC,YAAa,OACbC,aAAc,MACdC,SAAU,SACV,WAAY,CACVC,WAAY,OACZC,UAAW,oCACZ,KAAAC,OAnEmB,uBAoE4B,CAC9CF,WAAY,WAIEP,EAAOC,EAAPD,CAAY,CAC5B,oBAAqB,UACrBG,SAAU,WACVO,IAAK,EACLC,KAAM,EACNC,MAAO,OACPC,OAAQ,OACRC,OAAQ,EACR,gBAAiB,CACfF,MAAO,OACPC,OAAQ"}
@@ -0,0 +1,2 @@
1
+ import{objectWithoutProperties as e,objectSpread2 as t,inherits as o,createClass as i,classCallCheck as r,callSuper as l,defineProperty as n}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,Fragment as s,jsxs as c}from"react/jsx-runtime";import{Component as d}from"react";import{createPortal as h}from"react-dom";import{styled as p,Box as u,IconButton as f,Fade as m,Typography as v}from"@mui/material";import b from"@mui/icons-material/Close";var g=["children"],x="mpp-root",k="mpp-content",C="mpp-backdrop",y={show:function(){console.log("MediaPlayerPreviewProvider is not found!")},close:function(){console.log("MediaPlayerPreviewProvider is not found!")}},w={Provider:function(){function e(t){var o;return r(this,e),o=l(this,e,[t]),n(o,"handleShow",function(e){o.setState(e)}),n(o,"handleClose",function(e){"backdropClick"===e&&!0===o.state.disabledBackdrop||o.setState({player:null})}),o.state={player:null},o}return o(e,d),i(e,[{key:"componentDidMount",value:function(){y.show=this.handleShow,y.close=this.handleClose}},{key:"render",value:function(){var e=this;if(!this.state.player)return a(s,{});var t=this.state.player;return h(c(P,{className:x,children:[a(S,{className:C,onClick:function(){return e.handleClose("backdropClick")}}),c(j,{children:[a(m,{in:Boolean(this.state.title),children:a(v,{variant:"subtitle1",sx:{flex:1,color:"#fff"},children:this.state.title})}),a(I,{onClick:function(){return e.handleClose("closeButton")},size:"small",children:a(b,{fontSize:"small"})})]}),a(z,{className:k,children:a(t,{close:this.handleClose})})]}),document.body)}}])}(),Api:y},P=p(function(o){var i=o.children,r=e(o,g);return a(u,t(t({},r),{},{children:a("div",{children:i})}))})({position:"fixed",top:0,left:0,bottom:0,right:0,zIndex:1500,"& > div":{position:"relative",width:"100%",height:"100%"}}),S=p(u)({position:"absolute",top:0,left:0,width:"100%",height:"100%",background:"rgba(0,0,0,0.325)",zIndex:1}),z=p(u)({position:"absolute",zIndex:2,top:"50%",left:"50%",transform:"translate(-50%, -50%)",maxHeight:"calc(100vh - 24px)",overflowY:"auto"}),I=p(f)({color:"#fff","&:hover":{color:"#ff200c"}}),j=p(u)({background:"rgba(0,0,0,0.35)",position:"absolute",top:0,left:0,width:"100%",height:"48px",display:"flex",alignItems:"center",padding:"0 20px",zIndex:3});export{w as MediaPlayerPreview,w as default};
2
+ //# sourceMappingURL=preview.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"preview.js","sources":["../../src/media-player/preview.tsx"],"sourcesContent":["import { Component } from 'react'\r\nimport { createPortal } from 'react-dom'\r\nimport { Box, BoxProps, Fade, IconButton, styled, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport { MediaPlayerClose, MediaPlayerShow } from './types'\r\n\r\nexport interface MediaPlayerProps {\r\n close?: MediaPlayerClose\r\n}\r\n\r\nconst mppClasses = {\r\n root: 'mpp-root',\r\n content: 'mpp-content',\r\n backdrop: 'mpp-backdrop'\r\n}\r\n\r\ninterface IState {\r\n player: React.ComponentType<MediaPlayerProps> | null\r\n title?: string\r\n disabledBackdrop?: boolean\r\n}\r\n\r\ninterface IActions {\r\n show: MediaPlayerShow<IState>\r\n close: MediaPlayerClose\r\n}\r\n\r\nconst MediaPlayerPreviewApi: IActions = {\r\n show: () => {\r\n console.log('MediaPlayerPreviewProvider is not found!')\r\n },\r\n close: () => {\r\n console.log('MediaPlayerPreviewProvider is not found!')\r\n }\r\n}\r\n\r\ninterface IProps {}\r\n\r\nclass MediaPlayerPreviewProvider extends Component<IProps, IState> {\r\n constructor(props: IProps) {\r\n super(props)\r\n this.state = { player: null }\r\n }\r\n\r\n handleShow: MediaPlayerShow<IState> = (value) => {\r\n this.setState(value)\r\n }\r\n\r\n handleClose: MediaPlayerClose = (reason) => {\r\n if (reason === 'backdropClick' && this.state.disabledBackdrop === true) return\r\n this.setState({ player: null })\r\n }\r\n\r\n componentDidMount() {\r\n MediaPlayerPreviewApi.show = this.handleShow\r\n MediaPlayerPreviewApi.close = this.handleClose\r\n }\r\n\r\n render() {\r\n if (!this.state.player) return <></>\r\n const PlayerComponent = this.state.player\r\n return createPortal(\r\n <Wrap className={mppClasses.root}>\r\n <Backdrop className={mppClasses.backdrop} onClick={() => this.handleClose('backdropClick')} />\r\n <TopBar>\r\n <Fade in={Boolean(this.state.title)}>\r\n <Typography variant='subtitle1' sx={{ flex: 1, color: '#fff' }}>\r\n {this.state.title}\r\n </Typography>\r\n </Fade>\r\n <BtnClose onClick={() => this.handleClose('closeButton')} size='small'>\r\n <CloseIcon fontSize='small' />\r\n </BtnClose>\r\n </TopBar>\r\n <WrapContent className={mppClasses.content}>\r\n <PlayerComponent close={this.handleClose} />\r\n </WrapContent>\r\n </Wrap>,\r\n document.body\r\n )\r\n }\r\n}\r\n\r\nexport const MediaPlayerPreview = {\r\n Provider: MediaPlayerPreviewProvider,\r\n Api: MediaPlayerPreviewApi\r\n}\r\n\r\nexport default MediaPlayerPreview\r\n\r\nconst Wrap = styled(({ children, ...props }: BoxProps) => (\r\n <Box {...props}>\r\n <div>{children}</div>\r\n </Box>\r\n))({\r\n position: 'fixed',\r\n top: 0,\r\n left: 0,\r\n bottom: 0,\r\n right: 0,\r\n zIndex: 1500,\r\n '& > div': {\r\n position: 'relative',\r\n width: '100%',\r\n height: '100%'\r\n }\r\n})\r\n\r\nconst Backdrop = styled(Box)({\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n background: 'rgba(0,0,0,0.325)',\r\n zIndex: 1\r\n})\r\n\r\nconst WrapContent = styled(Box)({\r\n position: 'absolute',\r\n zIndex: 2,\r\n top: '50%',\r\n left: '50%',\r\n transform: 'translate(-50%, -50%)',\r\n maxHeight: 'calc(100vh - 24px)',\r\n overflowY: 'auto'\r\n})\r\n\r\nconst BtnClose = styled(IconButton)({\r\n color: '#fff',\r\n '&:hover': {\r\n color: '#ff200c'\r\n }\r\n})\r\n\r\nconst TopBar = styled(Box)({\r\n background: 'rgba(0,0,0,0.35)',\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '48px',\r\n display: 'flex',\r\n alignItems: 'center',\r\n padding: '0 20px',\r\n zIndex: 3\r\n})\r\n"],"names":["mppClasses","MediaPlayerPreviewApi","show","console","log","close","MediaPlayerPreview","Provider","MediaPlayerPreviewProvider","props","_this","_classCallCheck","_callSuper","_defineProperty","value","setState","reason","state","disabledBackdrop","player","_inherits","Component","_createClass","key","this","handleShow","handleClose","_this2","_jsx","PlayerComponent","createPortal","_jsxs","Wrap","className","children","Backdrop","onClick","TopBar","Fade","in","Boolean","title","Typography","variant","sx","flex","color","BtnClose","size","CloseIcon","fontSize","WrapContent","document","body","Api","styled","_ref","_objectWithoutProperties","_excluded","Box","_objectSpread","position","top","left","bottom","right","zIndex","width","height","background","transform","maxHeight","overflowY","IconButton","display","alignItems","padding"],"mappings":"6dAUMA,EACE,WADFA,EAEK,cAFLA,EAGM,eAcNC,EAAkC,CACtCC,KAAM,WACJC,QAAQC,IAAI,2CACb,EACDC,MAAO,WACLF,QAAQC,IAAI,2CACd,GAkDWE,EAAqB,CAChCC,oBA7CA,SAAAC,EAAYC,GAAa,IAAAC,EAEM,OAFNC,OAAAH,GACvBE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAIwB,aAAA,SAACI,GACrCJ,EAAKK,SAASD,KACfD,EAAAH,EAE+B,cAAA,SAACM,GAChB,kBAAXA,IAA8D,IAAhCN,EAAKO,MAAMC,kBAC7CR,EAAKK,SAAS,CAAEI,OAAQ,SATxBT,EAAKO,MAAQ,CAAEE,OAAQ,MAAMT,CAC/B,CAAC,OAAAU,EAAAZ,EAJsCa,GAItCC,EAAAd,EAAA,CAAA,CAAAe,IAAA,oBAAAT,MAWD,WACEb,EAAsBC,KAAOsB,KAAKC,WAClCxB,EAAsBI,MAAQmB,KAAKE,WACrC,GAAC,CAAAH,IAAA,SAAAT,MAED,WAAM,IAAAa,EAAAH,KACJ,IAAKA,KAAKP,MAAME,OAAQ,OAAOS,QAC/B,IAAMC,EAAkBL,KAAKP,MAAME,OACnC,OAAOW,EACLC,EAACC,EAAK,CAAAC,UAAWjC,EACfkC,SAAA,CAAAN,EAACO,EAAQ,CAACF,UAAWjC,EAAqBoC,QAAS,WAAF,OAAQT,EAAKD,YAAY,gBAAgB,IAC1FK,EAACM,EACC,CAAAH,SAAA,CAAAN,EAACU,EAAI,CAACC,GAAIC,QAAQhB,KAAKP,MAAMwB,OAAMP,SACjCN,EAACc,EAAW,CAAAC,QAAQ,YAAYC,GAAI,CAAEC,KAAM,EAAGC,MAAO,QAAQZ,SAC3DV,KAAKP,MAAMwB,UAGhBb,EAACmB,GAASX,QAAS,WAAF,OAAQT,EAAKD,YAAY,cAAc,EAAEsB,KAAK,QAAOd,SACpEN,EAACqB,EAAS,CAACC,SAAS,eAGxBtB,EAACuB,EAAW,CAAClB,UAAWjC,EACtBkC,SAAAN,EAACC,EAAe,CAACxB,MAAOmB,KAAKE,mBAGjC0B,SAASC,KAEb,IAAC,IAKDC,IAAKrD,GAKD+B,EAAOuB,EAAO,SAAAC,GAAA,IAAGtB,EAAQsB,EAARtB,SAAazB,EAAKgD,EAAAD,EAAAE,GAAA,OACvC9B,EAAC+B,EAAGC,EAAAA,KAAKnD,GAAK,GAAA,CAAAyB,SACZN,EAAM,MAAA,CAAAM,SAAAA,MACF,EAHKqB,CAIV,CACDM,SAAU,QACVC,IAAK,EACLC,KAAM,EACNC,OAAQ,EACRC,MAAO,EACPC,OAAQ,KACR,UAAW,CACTL,SAAU,WACVM,MAAO,OACPC,OAAQ,UAINjC,EAAWoB,EAAOI,EAAPJ,CAAY,CAC3BM,SAAU,WACVC,IAAK,EACLC,KAAM,EACNI,MAAO,OACPC,OAAQ,OACRC,WAAY,oBACZH,OAAQ,IAGJf,EAAcI,EAAOI,EAAPJ,CAAY,CAC9BM,SAAU,WACVK,OAAQ,EACRJ,IAAK,MACLC,KAAM,MACNO,UAAW,wBACXC,UAAW,qBACXC,UAAW,SAGPzB,EAAWQ,EAAOkB,EAAPlB,CAAmB,CAClCT,MAAO,OACP,UAAW,CACTA,MAAO,aAILT,EAASkB,EAAOI,EAAPJ,CAAY,CACzBc,WAAY,mBACZR,SAAU,WACVC,IAAK,EACLC,KAAM,EACNI,MAAO,OACPC,OAAQ,OACRM,QAAS,OACTC,WAAY,SACZC,QAAS,SACTV,OAAQ"}
@@ -0,0 +1,2 @@
1
+ var o;!function(o){o.Loading="Loading",o.Loaded="Loaded",o.Error="Error"}(o||(o={}));export{o as EMediaPlayerStatus};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.js","sources":["../../src/media-player/types.ts"],"sourcesContent":["import { ReactNode } from 'react'\r\nimport { Breakpoint } from '@mui/material'\r\n\r\ntype IReason = 'backdropClick' | 'escape' | 'closeButton'\r\n\r\nexport type MediaPlayerClose = (reason?: IReason) => void\r\n\r\nexport type MediaPlayerShow<T> = (value: T) => void\r\n\r\nexport interface IMediaStream {\r\n code: number\r\n token: string\r\n StreamUrl: string\r\n}\r\n\r\nexport type FetchDataStream = (resourceId: string, signal?: AbortSignal) => Promise<IMediaStream[]>\r\n\r\nexport interface MediaPlayerBaseProps {\r\n resourceId: string\r\n fetchDataStream: FetchDataStream\r\n loading?: boolean\r\n}\r\n\r\nexport type AspectRatioParams = number | Partial<Record<Breakpoint, number>>\r\n\r\nexport interface MediaPlayerBaseSlots {\r\n /**\r\n * Aspect ratio (height / width), used to calculate height based on width.\r\n * @default 56.25 (%)\r\n */\r\n aspectRatio?: AspectRatioParams\r\n loading?: ReactNode\r\n loadingProps?: {\r\n disabled?: boolean\r\n animationDuration?: string\r\n }\r\n}\r\n\r\nexport enum EMediaPlayerStatus {\r\n Loading = 'Loading',\r\n Loaded = 'Loaded',\r\n Error = 'Error'\r\n}\r\n"],"names":["EMediaPlayerStatus"],"mappings":"IAsCYA,GAAZ,SAAYA,GACVA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACD,CAJD,CAAYA,IAAAA,EAIX,CAAA"}
@@ -0,0 +1,2 @@
1
+ // Re-export types from media-player submodule
2
+ export * from './types/media-player/index';
@@ -0,0 +1,2 @@
1
+ // Re-export from media-player submodule
2
+ module.exports = require('./media-player/index.js');
@@ -0,0 +1,2 @@
1
+ // Re-export from media-player submodule (ESM)
2
+ export * from './media-player/index.js';
@@ -1,2 +1,2 @@
1
- import{slicedToArray as t,inherits as n,createClass as o,asyncToGenerator as r,objectSpread2 as e,classCallCheck as a,callSuper as i,defineProperty as l,regenerator as c}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u,Fragment as d}from"react/jsx-runtime";import{Badge as f}from"@mui/material";import{useState as p,useEffect as h,Component as m}from"react";import{GlobalModal as v,mapGlobalModalContext as C}from"dinocollab-core/api-context";import g from"@mui/icons-material/NotificationsNone";import{MenuStyled as y}from"./styled.js";import{IconButtonDark as k}from"../components/buttons.js";import{useFetchData as b}from"./hook.js";import j from"./notify-list.js";import x from"./notify-detail.js";var E=function(){function t(n){var o;return a(this,t),o=i(this,t,[n]),l(o,"onClickHandler",function(t){var n;o.onClose(),null===(n=o.globalModalContext)||void 0===n||n.show({backdropActivated:!0,renderContent:function(){var n;return s(x,{data:[t],onRead:o.onReadHandler,onClose:null===(n=o.globalModalContext)||void 0===n?void 0:n.close})}})}),l(o,"onOpen",function(t){o.setState({anchorEl:t})}),l(o,"onClose",function(){o.setState({anchorEl:null})}),l(o,"onReadHandler",function(t){var n;null===(n=o.globalModalContext)||void 0===n||n.close();try{var r,e;null===(r=(e=o.props).onReaded)||void 0===r||r.call(e,t.Id)}catch(t){console.error("Error updating read state:",t)}}),o.state={anchorEl:null,hydrated:!1},o}return n(t,m),o(t,[{key:"notifications",get:function(){var t;return null!==(t=this.props.data)&&void 0!==t?t:[]}},{key:"newFeatureCount",get:function(){return this.notifications.filter(function(t){return!t.IsRead}).length}},{key:"componentDidMount",value:function(){this.setState({hydrated:!0})}},{key:"render",value:function(){var t=this;return u(d,{children:[s(k,{onClick:function(n){return t.onOpen(n.currentTarget)},children:s(f,{badgeContent:this.state.hydrated?this.newFeatureCount:0,color:"error",children:s(g,{})})}),s(y,{disableScrollLock:!0,anchorEl:this.state.anchorEl,open:Boolean(this.state.anchorEl),onClose:this.onClose,anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},MenuListProps:{component:"div"},children:C(function(n){return t.globalModalContext=n,s(j,{data:t.props.data,onClick:t.onClickHandler})})})]})}}])}(),R=function(n){var o=b(n.featData),a=p([]),i=t(a,2),l=i[0],u=i[1];h(function(){o.data&&u(o.data)},[o.data]);var d=function(){var t=r(c().m(function t(o,r){var a;return c().w(function(t){for(;;)switch(t.n){case 0:return t.n=1,null===(a=n.readed)||void 0===a?void 0:a.call(n,o,r);case 1:u(function(t){return t.map(function(t){return t.Id===o?e(e({},t),{},{IsRead:!0}):t})});case 2:return t.a(2)}},t)}));return function(n,o){return t.apply(this,arguments)}}();return s(v,{children:s(E,{data:l,loading:o.loading,onReaded:d})})},M=function(t){var n=function(n){return s(R,e(e({},t),n))};return n.displayName="NotificationWidget",n};export{R as NotificationWidget,M as createNotificationWidget,R as default};
1
+ import{slicedToArray as t,inherits as n,createClass as o,asyncToGenerator as r,objectSpread2 as e,classCallCheck as a,callSuper as i,defineProperty as l,regenerator as c}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u,Fragment as d}from"react/jsx-runtime";import{Badge as f}from"@mui/material";import{useState as p,useEffect as h,Component as m}from"react";import{GlobalModal as v,mapGlobalModalContext as C}from"dinocollab-core/api-context";import g from"@mui/icons-material/NotificationsNone";import{MenuStyled as y}from"./styled.js";import{IconButtonDark as k}from"../components/buttons.js";import{useFetchData as b}from"./hook.js";import j from"./notify-list.js";import x from"./notify-detail.js";var E=function(){function t(n){var o;return a(this,t),o=i(this,t,[n]),l(o,"onClickHandler",function(t){var n;o.onClose(),null===(n=o.globalModalContext)||void 0===n||n.show({backdropActivated:!0,renderContent:function(){var n;return s(x,{data:[t],onRead:o.onReadHandler,onClose:null===(n=o.globalModalContext)||void 0===n?void 0:n.close})}})}),l(o,"onOpen",function(t){o.setState({anchorEl:t})}),l(o,"onClose",function(){o.setState({anchorEl:null})}),l(o,"onReadHandler",function(t){var n;null===(n=o.globalModalContext)||void 0===n||n.close();try{var r,e;null===(r=(e=o.props).onReaded)||void 0===r||r.call(e,t.Id)}catch(t){console.error("Error updating read state:",t)}}),o.state={anchorEl:null,hydrated:!1},o}return n(t,m),o(t,[{key:"notifications",get:function(){var t;return null!==(t=this.props.data)&&void 0!==t?t:[]}},{key:"newFeatureCount",get:function(){return this.notifications.filter(function(t){return!t.IsRead}).length}},{key:"componentDidMount",value:function(){this.setState({hydrated:!0})}},{key:"render",value:function(){var t=this;return u(d,{children:[s(k,{onClick:function(n){return t.onOpen(n.currentTarget)},children:s(f,{badgeContent:this.state.hydrated?this.newFeatureCount:0,color:"error",children:s(g,{fontSize:"small"})})}),s(y,{disableScrollLock:!0,anchorEl:this.state.anchorEl,open:Boolean(this.state.anchorEl),onClose:this.onClose,anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},MenuListProps:{component:"div"},children:C(function(n){return t.globalModalContext=n,s(j,{data:t.props.data,onClick:t.onClickHandler})})})]})}}])}(),R=function(n){var o=b(n.featData),a=p([]),i=t(a,2),l=i[0],u=i[1];h(function(){o.data&&u(o.data)},[o.data]);var d=function(){var t=r(c().m(function t(o,r){var a;return c().w(function(t){for(;;)switch(t.n){case 0:return t.n=1,null===(a=n.readed)||void 0===a?void 0:a.call(n,o,r);case 1:u(function(t){return t.map(function(t){return t.Id===o?e(e({},t),{},{IsRead:!0}):t})});case 2:return t.a(2)}},t)}));return function(n,o){return t.apply(this,arguments)}}();return s(v,{children:s(E,{data:l,loading:o.loading,onReaded:d})})},S=function(t){var n=function(n){return s(R,e(e({},t),n))};return n.displayName="NotificationWidget",n};export{R as NotificationWidget,S as createNotificationWidget,R as default};
2
2
  //# sourceMappingURL=widget.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"widget.js","sources":["../../src/notification/widget.tsx"],"sourcesContent":["import { Badge } from '@mui/material'\r\nimport { Component, FC, useEffect, useState } from 'react'\r\nimport { GlobalModal, IGlobalModalContext, mapGlobalModalContext } from 'dinocollab-core/api-context'\r\nimport NotificationsNoneIcon from '@mui/icons-material/NotificationsNone'\r\nimport { MenuStyled } from './styled'\r\nimport { IconButtonDark } from '../components/buttons'\r\nimport { FetcherFunction, useFetchData } from './hook'\r\nimport { INotification, ReadedFunction } from './types'\r\nimport NotifyList from './notify-list'\r\nimport NotifyDetail from './notify-detail'\r\n\r\ninterface INotificationProps {\r\n loading?: boolean\r\n data: INotification[]\r\n onReaded?: ReadedFunction\r\n}\r\n\r\ninterface INotificationState {\r\n anchorEl: HTMLElement | null\r\n hydrated: boolean\r\n}\r\nclass NotificationContent extends Component<INotificationProps, INotificationState> {\r\n globalModalContext?: IGlobalModalContext\r\n constructor(props: INotificationProps) {\r\n super(props)\r\n this.state = { anchorEl: null, hydrated: false }\r\n }\r\n\r\n get notifications() {\r\n return this.props.data ?? []\r\n }\r\n\r\n get newFeatureCount() {\r\n return this.notifications.filter((n) => !n.IsRead).length\r\n }\r\n\r\n componentDidMount() {\r\n // When mounted on the client, set hydrated = true\r\n this.setState({ hydrated: true })\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n <IconButtonDark onClick={(e) => this.onOpen(e.currentTarget)}>\r\n <Badge badgeContent={this.state.hydrated ? this.newFeatureCount : 0} color='error'>\r\n <NotificationsNoneIcon />\r\n </Badge>\r\n </IconButtonDark>\r\n <MenuStyled\r\n disableScrollLock\r\n anchorEl={this.state.anchorEl}\r\n open={Boolean(this.state.anchorEl)}\r\n onClose={this.onClose}\r\n anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n transformOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n MenuListProps={{ component: 'div' }}\r\n >\r\n {mapGlobalModalContext((context: IGlobalModalContext) => {\r\n this.globalModalContext = context\r\n return <NotifyList data={this.props.data} onClick={this.onClickHandler} />\r\n })}\r\n </MenuStyled>\r\n </>\r\n )\r\n }\r\n\r\n onClickHandler = (value: INotification) => {\r\n this.onClose()\r\n this.globalModalContext?.show({\r\n backdropActivated: true,\r\n renderContent: () => <NotifyDetail data={[value]} onRead={this.onReadHandler} onClose={this.globalModalContext?.close} />\r\n })\r\n }\r\n\r\n onOpen = (target: HTMLElement) => {\r\n this.setState({ anchorEl: target })\r\n }\r\n\r\n onClose = () => {\r\n this.setState({ anchorEl: null })\r\n }\r\n\r\n onReadHandler = (value: INotification) => {\r\n this.globalModalContext?.close()\r\n // NotifyLocalStorage.setSingle(value.Id)\r\n try {\r\n // Call the callback to update the read state in the parent component\r\n this.props.onReaded?.(value.Id)\r\n } catch (error) {\r\n console.error('Error updating read state:', error)\r\n }\r\n }\r\n}\r\n\r\nexport interface INotificationWidgetProps {\r\n featData: FetcherFunction<INotification[]>\r\n readed?: ReadedFunction\r\n}\r\n\r\nexport const NotificationWidget: FC<INotificationWidgetProps> = (props) => {\r\n const intitialData = useFetchData<INotification[]>(props.featData)\r\n const [data, setData] = useState<INotification[]>([])\r\n\r\n // When initialData changes, update the local state\r\n useEffect(() => {\r\n if (intitialData.data) setData(intitialData.data)\r\n }, [intitialData.data])\r\n\r\n // Function to update read notifications\r\n const handleRead: ReadedFunction = async (id: string, signal?: AbortSignal) => {\r\n await props.readed?.(id, signal)\r\n setData((prev) => prev.map((n) => (n.Id === id ? { ...n, IsRead: true } : n)))\r\n }\r\n\r\n return (\r\n <GlobalModal>\r\n <NotificationContent data={data} loading={intitialData.loading} onReaded={handleRead} />\r\n </GlobalModal>\r\n )\r\n}\r\nexport default NotificationWidget\r\n\r\nexport const createNotificationWidget = (params: INotificationWidgetProps) => {\r\n const _NotificationWidget: FC<Partial<INotificationWidgetProps>> = (props) => <NotificationWidget {...params} {...props} />\r\n _NotificationWidget.displayName = 'NotificationWidget'\r\n return _NotificationWidget\r\n}\r\n"],"names":["NotificationContent","props","_this","_classCallCheck","_callSuper","_defineProperty","value","_this$globalModalCont","onClose","globalModalContext","show","backdropActivated","renderContent","_this$globalModalCont2","_jsx","NotifyDetail","data","onRead","onReadHandler","close","target","setState","anchorEl","_this$globalModalCont3","_this$props$onReaded","_this$props","onReaded","call","Id","error","console","state","hydrated","_inherits","Component","_createClass","key","get","_this$props$data","this","notifications","filter","n","IsRead","length","_this2","_jsxs","_Fragment","children","IconButtonDark","onClick","e","onOpen","currentTarget","Badge","badgeContent","newFeatureCount","color","NotificationsNoneIcon","MenuStyled","disableScrollLock","open","Boolean","anchorOrigin","vertical","horizontal","transformOrigin","MenuListProps","component","mapGlobalModalContext","context","NotifyList","onClickHandler","NotificationWidget","intitialData","useFetchData","featData","_useState","useState","_useState2","_slicedToArray","setData","useEffect","handleRead","_ref","_asyncToGenerator","_regenerator","m","_callee","id","signal","_props$readed","w","_context","readed","prev","map","_objectSpread","a","_x","_x2","apply","arguments","GlobalModal","loading","createNotificationWidget","params","_NotificationWidget","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"widget.js","sources":["../../src/notification/widget.tsx"],"sourcesContent":["import { Badge } from '@mui/material'\r\nimport { Component, FC, useEffect, useState } from 'react'\r\nimport { GlobalModal, IGlobalModalContext, mapGlobalModalContext } from 'dinocollab-core/api-context'\r\nimport NotificationsNoneIcon from '@mui/icons-material/NotificationsNone'\r\nimport { MenuStyled } from './styled'\r\nimport { IconButtonDark } from '../components/buttons'\r\nimport { FetcherFunction, useFetchData } from './hook'\r\nimport { INotification, ReadedFunction } from './types'\r\nimport NotifyList from './notify-list'\r\nimport NotifyDetail from './notify-detail'\r\n\r\ninterface INotificationProps {\r\n loading?: boolean\r\n data: INotification[]\r\n onReaded?: ReadedFunction\r\n}\r\n\r\ninterface INotificationState {\r\n anchorEl: HTMLElement | null\r\n hydrated: boolean\r\n}\r\nclass NotificationContent extends Component<INotificationProps, INotificationState> {\r\n globalModalContext?: IGlobalModalContext\r\n constructor(props: INotificationProps) {\r\n super(props)\r\n this.state = { anchorEl: null, hydrated: false }\r\n }\r\n\r\n get notifications() {\r\n return this.props.data ?? []\r\n }\r\n\r\n get newFeatureCount() {\r\n return this.notifications.filter((n) => !n.IsRead).length\r\n }\r\n\r\n componentDidMount() {\r\n // When mounted on the client, set hydrated = true\r\n this.setState({ hydrated: true })\r\n }\r\n\r\n render() {\r\n return (\r\n <>\r\n <IconButtonDark onClick={(e) => this.onOpen(e.currentTarget)}>\r\n <Badge badgeContent={this.state.hydrated ? this.newFeatureCount : 0} color='error'>\r\n <NotificationsNoneIcon fontSize='small' />\r\n </Badge>\r\n </IconButtonDark>\r\n <MenuStyled\r\n disableScrollLock\r\n anchorEl={this.state.anchorEl}\r\n open={Boolean(this.state.anchorEl)}\r\n onClose={this.onClose}\r\n anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n transformOrigin={{ vertical: 'top', horizontal: 'right' }}\r\n MenuListProps={{ component: 'div' }}\r\n >\r\n {mapGlobalModalContext((context: IGlobalModalContext) => {\r\n this.globalModalContext = context\r\n return <NotifyList data={this.props.data} onClick={this.onClickHandler} />\r\n })}\r\n </MenuStyled>\r\n </>\r\n )\r\n }\r\n\r\n onClickHandler = (value: INotification) => {\r\n this.onClose()\r\n this.globalModalContext?.show({\r\n backdropActivated: true,\r\n renderContent: () => <NotifyDetail data={[value]} onRead={this.onReadHandler} onClose={this.globalModalContext?.close} />\r\n })\r\n }\r\n\r\n onOpen = (target: HTMLElement) => {\r\n this.setState({ anchorEl: target })\r\n }\r\n\r\n onClose = () => {\r\n this.setState({ anchorEl: null })\r\n }\r\n\r\n onReadHandler = (value: INotification) => {\r\n this.globalModalContext?.close()\r\n // NotifyLocalStorage.setSingle(value.Id)\r\n try {\r\n // Call the callback to update the read state in the parent component\r\n this.props.onReaded?.(value.Id)\r\n } catch (error) {\r\n console.error('Error updating read state:', error)\r\n }\r\n }\r\n}\r\n\r\nexport interface INotificationWidgetProps {\r\n featData: FetcherFunction<INotification[]>\r\n readed?: ReadedFunction\r\n}\r\n\r\nexport const NotificationWidget: FC<INotificationWidgetProps> = (props) => {\r\n const intitialData = useFetchData<INotification[]>(props.featData)\r\n const [data, setData] = useState<INotification[]>([])\r\n\r\n // When initialData changes, update the local state\r\n useEffect(() => {\r\n if (intitialData.data) setData(intitialData.data)\r\n }, [intitialData.data])\r\n\r\n // Function to update read notifications\r\n const handleRead: ReadedFunction = async (id: string, signal?: AbortSignal) => {\r\n await props.readed?.(id, signal)\r\n setData((prev) => prev.map((n) => (n.Id === id ? { ...n, IsRead: true } : n)))\r\n }\r\n\r\n return (\r\n <GlobalModal>\r\n <NotificationContent data={data} loading={intitialData.loading} onReaded={handleRead} />\r\n </GlobalModal>\r\n )\r\n}\r\nexport default NotificationWidget\r\n\r\nexport const createNotificationWidget = (params: INotificationWidgetProps) => {\r\n const _NotificationWidget: FC<Partial<INotificationWidgetProps>> = (props) => <NotificationWidget {...params} {...props} />\r\n _NotificationWidget.displayName = 'NotificationWidget'\r\n return _NotificationWidget\r\n}\r\n"],"names":["NotificationContent","props","_this","_classCallCheck","_callSuper","_defineProperty","value","_this$globalModalCont","onClose","globalModalContext","show","backdropActivated","renderContent","_this$globalModalCont2","_jsx","NotifyDetail","data","onRead","onReadHandler","close","target","setState","anchorEl","_this$globalModalCont3","_this$props$onReaded","_this$props","onReaded","call","Id","error","console","state","hydrated","_inherits","Component","_createClass","key","get","_this$props$data","this","notifications","filter","n","IsRead","length","_this2","_jsxs","_Fragment","children","IconButtonDark","onClick","e","onOpen","currentTarget","Badge","badgeContent","newFeatureCount","color","NotificationsNoneIcon","fontSize","MenuStyled","disableScrollLock","open","Boolean","anchorOrigin","vertical","horizontal","transformOrigin","MenuListProps","component","mapGlobalModalContext","context","NotifyList","onClickHandler","NotificationWidget","intitialData","useFetchData","featData","_useState","useState","_useState2","_slicedToArray","setData","useEffect","handleRead","_ref","_asyncToGenerator","_regenerator","m","_callee","id","signal","_props$readed","w","_context","readed","prev","map","_objectSpread","a","_x","_x2","apply","arguments","GlobalModal","loading","createNotificationWidget","params","_NotificationWidget","displayName"],"mappings":"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"}
@@ -0,0 +1,15 @@
1
+ import { BoxProps } from '@mui/material';
2
+ import type { FC, PropsWithChildren } from 'react';
3
+ export declare const AnalyticMediaContext: import("react").Context<{
4
+ setStatus: (status: boolean) => void;
5
+ } | undefined>;
6
+ export declare const useAnalyticMedia: () => {
7
+ setStatus: (status: boolean) => void;
8
+ } | undefined;
9
+ export interface IAnalyticAudioProps extends PropsWithChildren, BoxProps {
10
+ meidaId?: string;
11
+ videoId?: string;
12
+ }
13
+ export declare const AnalyticMedia: FC<IAnalyticAudioProps>;
14
+ export default AnalyticMedia;
15
+ //# sourceMappingURL=analytic-media.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"analytic-media.d.ts","sourceRoot":"","sources":["../../../src/media-player/analytic-media.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,QAAQ,EAAE,MAAM,eAAe,CAAA;AAE7C,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAElD,eAAO,MAAM,oBAAoB;wBAAuC,OAAO,KAAK,IAAI;cAA0B,CAAA;AAElH,eAAO,MAAM,gBAAgB;wBAF2C,OAAO,KAAK,IAAI;aASvF,CAAA;AAED,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB,EAAE,QAAQ;IACtE,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,mBAAmB,CAejD,CAAA;AAED,eAAe,aAAa,CAAA"}
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import { IconButtonProps } from '@mui/material';
3
+ interface FullscreenButtonProps {
4
+ hidden?: boolean;
5
+ isFullscreen: boolean;
6
+ onClick: () => void;
7
+ iconProps?: IconButtonProps;
8
+ }
9
+ declare const FullscreenButton: React.FC<FullscreenButtonProps>;
10
+ export default FullscreenButton;
11
+ //# sourceMappingURL=btn.fullscreen.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.fullscreen.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/btn.fullscreen.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAc,eAAe,EAAU,MAAM,eAAe,CAAA;AAInE,UAAU,qBAAqB;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,YAAY,EAAE,OAAO,CAAA;IACrB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,SAAS,CAAC,EAAE,eAAe,CAAA;CAC5B;AAED,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAOrD,CAAA;AAED,eAAe,gBAAgB,CAAA"}
@@ -0,0 +1,10 @@
1
+ /// <reference types="react" />
2
+ import { IconButtonProps } from '@mui/material';
3
+ interface BtnPIPProps {
4
+ onClick: () => void;
5
+ iconProps?: IconButtonProps;
6
+ hidden?: boolean;
7
+ }
8
+ declare const BtnPIP: React.FC<BtnPIPProps>;
9
+ export default BtnPIP;
10
+ //# sourceMappingURL=btn.pip.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.pip.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/btn.pip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAc,eAAe,EAAU,MAAM,eAAe,CAAA;AAGnE,UAAU,WAAW;IACnB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,SAAS,CAAC,EAAE,eAAe,CAAA;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAOjC,CAAA;AAED,eAAe,MAAM,CAAA"}
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import { IconButtonProps } from '@mui/material';
3
+ interface PlayButtonProps {
4
+ isPlaying: boolean;
5
+ onClick: () => void;
6
+ iconProps?: IconButtonProps;
7
+ hidden?: boolean;
8
+ }
9
+ declare const PlayButton: React.FC<PlayButtonProps>;
10
+ export default PlayButton;
11
+ //# sourceMappingURL=btn.play.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.play.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/btn.play.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAc,eAAe,EAAU,MAAM,eAAe,CAAA;AAInE,UAAU,eAAe;IACvB,SAAS,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,SAAS,CAAC,EAAE,eAAe,CAAA;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAOzC,CAAA;AAED,eAAe,UAAU,CAAA"}
@@ -0,0 +1,15 @@
1
+ /// <reference types="react" />
2
+ type MediaControlProps = {
3
+ hidden?: boolean;
4
+ sliderPosition?: 'above' | 'right' | 'below';
5
+ orientation?: 'horizontal' | 'vertical';
6
+ sliderHeight?: number;
7
+ sliderWidth?: number;
8
+ volume?: number;
9
+ muted?: boolean;
10
+ setVolume: (value: number) => void;
11
+ toggleMute: () => void;
12
+ };
13
+ declare const BtnVolume: React.FC<MediaControlProps>;
14
+ export default BtnVolume;
15
+ //# sourceMappingURL=btn.volume.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"btn.volume.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/btn.volume.tsx"],"names":[],"mappings":";AAKA,KAAK,iBAAiB,GAAG;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,CAAA;IAC5C,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,UAAU,EAAE,MAAM,IAAI,CAAA;CACvB,CAAA;AAED,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA8F1C,CAAA;AAED,eAAe,SAAS,CAAA"}
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ interface Props {
3
+ bufferedSegments: {
4
+ left: number;
5
+ width: number;
6
+ }[];
7
+ progress: number;
8
+ isLoading: boolean;
9
+ onChange?: (value: number) => void;
10
+ }
11
+ declare const ProgressBar: React.FC<Props>;
12
+ export default ProgressBar;
13
+ //# sourceMappingURL=progressBar.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"progressBar.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/progressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,UAAU,KAAK;IACb,gBAAgB,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACnD,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwFhC,CAAA;AAED,eAAe,WAAW,CAAA"}
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ interface BtnPIPProps {
3
+ currentTime?: number;
4
+ duration?: number;
5
+ }
6
+ declare const MediaTime: React.FC<BtnPIPProps>;
7
+ export default MediaTime;
8
+ //# sourceMappingURL=time.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"time.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/time.tsx"],"names":[],"mappings":";AAEA,UAAU,WAAW;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAWD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAIpC,CAAA;AAED,eAAe,SAAS,CAAA"}
@@ -0,0 +1,29 @@
1
+ /// <reference types="react" />
2
+ export interface VideoPlayerCoreState {
3
+ isLoading: boolean;
4
+ isPlaying: boolean;
5
+ progress: number;
6
+ currentTime: number;
7
+ duration: number;
8
+ bufferedSegments: {
9
+ left: number;
10
+ width: number;
11
+ }[];
12
+ volume: number;
13
+ muted: boolean;
14
+ isFullscreen: boolean;
15
+ }
16
+ export interface VideoPlayerCoreControls {
17
+ togglePlay: () => void;
18
+ handleSeek: (value: number) => void;
19
+ setVolume: (value: number) => void;
20
+ toggleMute: () => void;
21
+ seek: (time: number) => void;
22
+ togglePIP: () => void;
23
+ toggleFullscreen: () => void;
24
+ }
25
+ export declare function useVideoPlayerCore(videoRef: React.RefObject<HTMLVideoElement>, videoContainerRef?: React.RefObject<HTMLDivElement>): {
26
+ state: VideoPlayerCoreState;
27
+ controls: VideoPlayerCoreControls;
28
+ };
29
+ //# sourceMappingURL=useVideoPlayerCore.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useVideoPlayerCore.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/useVideoPlayerCore.ts"],"names":[],"mappings":";AAEA,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,OAAO,CAAA;IAClB,SAAS,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,MAAM,CAAA;IAChB,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,gBAAgB,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACnD,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,OAAO,CAAA;IACd,YAAY,EAAE,OAAO,CAAA;CACtB;AAED,MAAM,WAAW,uBAAuB;IACtC,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC5B,SAAS,EAAE,MAAM,IAAI,CAAA;IACrB,gBAAgB,EAAE,MAAM,IAAI,CAAA;CAC7B;AAED,wBAAgB,kBAAkB,CAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAC3C,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,GAClD;IAAE,KAAK,EAAE,oBAAoB,CAAC;IAAC,QAAQ,EAAE,uBAAuB,CAAA;CAAE,CAmKpE"}
@@ -0,0 +1,24 @@
1
+ import type { PropsWithChildren } from 'react';
2
+ import { SxProps, Theme } from '@mui/material';
3
+ export interface IControlsConfig {
4
+ autoPlay?: boolean;
5
+ muted?: boolean;
6
+ volume?: boolean;
7
+ pip?: boolean;
8
+ fullscreen?: boolean;
9
+ preload?: 'auto' | 'metadata' | 'none';
10
+ }
11
+ export declare const defaultControlsConfig: IControlsConfig;
12
+ export interface MediaPlayerSlot {
13
+ controls?: IControlsConfig;
14
+ anotherControls?: React.ReactNode;
15
+ mediaMetadata?: MediaMetadata;
16
+ }
17
+ interface IProps extends MediaPlayerSlot, PropsWithChildren {
18
+ src?: string;
19
+ sx?: SxProps<Theme>;
20
+ className?: string;
21
+ }
22
+ declare const MediaPlayerCore: import("react").ForwardRefExoticComponent<IProps & import("react").RefAttributes<HTMLVideoElement>>;
23
+ export default MediaPlayerCore;
24
+ //# sourceMappingURL=videoplayer.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"videoplayer.d.ts","sourceRoot":"","sources":["../../../../src/media-player/core/videoplayer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAC9C,OAAO,EAAsB,OAAO,EAAE,KAAK,EAA2B,MAAM,eAAe,CAAA;AAsB3F,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,GAAG,CAAC,EAAE,OAAO,CAAA;IACb,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,MAAM,CAAA;CACvC;AAGD,eAAO,MAAM,qBAAqB,EAAE,eAOnC,CAAA;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,eAAe,CAAA;IAC1B,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACjC,aAAa,CAAC,EAAE,aAAa,CAAA;CAC9B;AACD,UAAU,MAAO,SAAQ,eAAe,EAAE,iBAAiB;IACzD,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,eAAe,qGAyFnB,CAAA;AAEF,eAAe,eAAe,CAAA"}
@@ -0,0 +1,10 @@
1
+ import { Breakpoint, SxProps, Theme } from '@mui/material';
2
+ import { EMediaPlayerStatus } from './types';
3
+ import type { AspectRatioParams, MediaPlayerBaseProps } from './types';
4
+ export declare const useStreamUrl: (resourceId: string | null, fetchDataStream: MediaPlayerBaseProps['fetchDataStream']) => {
5
+ status: EMediaPlayerStatus;
6
+ streamUrl: string | null;
7
+ };
8
+ export declare const getAspectRatio: (value?: AspectRatioParams, defaultAspectRatio?: string) => string | Partial<Record<Breakpoint, string>> | undefined;
9
+ export declare const getAspectRatioStyled: (value?: AspectRatioParams) => SxProps<Theme>;
10
+ //# sourceMappingURL=helpers.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/media-player/helpers.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAC5C,OAAO,KAAK,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEtE,eAAO,MAAM,YAAY,eAAgB,MAAM,GAAG,IAAI,mBAAmB,oBAAoB,CAAC,iBAAiB,CAAC;;;CA0B/G,CAAA;AAED,eAAO,MAAM,cAAc,WAAY,iBAAiB,0FAWvD,CAAA;AAED,eAAO,MAAM,oBAAoB,WAAY,iBAAiB,KAAG,QAAQ,KAAK,CAE7E,CAAA"}
@@ -0,0 +1,9 @@
1
+ export * from './types';
2
+ export * from './helpers';
3
+ export * from './player.audio';
4
+ export * from './player.video-stream';
5
+ export * from './preview';
6
+ export * from './mediaMetadata';
7
+ export * from './analytic-media';
8
+ export * from './muted';
9
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/media-player/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AAEvB,cAAc,WAAW,CAAA;AAEzB,cAAc,gBAAgB,CAAA;AAE9B,cAAc,uBAAuB,CAAA;AAErC,cAAc,WAAW,CAAA;AAEzB,cAAc,iBAAiB,CAAA;AAE/B,cAAc,kBAAkB,CAAA;AAEhC,cAAc,SAAS,CAAA"}
@@ -0,0 +1,7 @@
1
+ export declare const getMediaMetaTag: (mediaMetadata: {
2
+ title?: string;
3
+ artist?: string;
4
+ album?: string;
5
+ artworkSrc?: string;
6
+ }) => MediaMetadata;
7
+ //# sourceMappingURL=mediaMetadata.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mediaMetadata.d.ts","sourceRoot":"","sources":["../../../src/media-player/mediaMetadata.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,kBAExB;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,KACvE,aAsCF,CAAA"}
@@ -0,0 +1,12 @@
1
+ import type { FC } from 'react';
2
+ import type { MediaPlayerBaseProps, MediaPlayerBaseSlots } from './types';
3
+ import { MediaPlayerSlot } from './core/videoplayer';
4
+ export interface SlotMediaPlayerMutedProps extends MediaPlayerBaseSlots {
5
+ coreProps?: MediaPlayerSlot;
6
+ }
7
+ export interface IMediaPlayerMutedProps extends MediaPlayerBaseProps {
8
+ slots?: SlotMediaPlayerMutedProps;
9
+ }
10
+ export declare const MediaPlayerMuted: FC<IMediaPlayerMutedProps>;
11
+ export default MediaPlayerMuted;
12
+ //# sourceMappingURL=muted.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"muted.d.ts","sourceRoot":"","sources":["../../../src/media-player/muted.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAC/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAIzE,OAAwB,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAErE,MAAM,WAAW,yBAA0B,SAAQ,oBAAoB;IACrE,SAAS,CAAC,EAAE,eAAe,CAAA;CAC5B;AACD,MAAM,WAAW,sBAAuB,SAAQ,oBAAoB;IAClE,KAAK,CAAC,EAAE,yBAAyB,CAAA;CAClC;AAED,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,sBAAsB,CAiCvD,CAAA;AAED,eAAe,gBAAgB,CAAA"}
@@ -0,0 +1,7 @@
1
+ import type { FC } from 'react';
2
+ export interface IMediaPlayerAudioProps {
3
+ src: string;
4
+ }
5
+ export declare const MediaPlayerAudio: FC<IMediaPlayerAudioProps>;
6
+ export default MediaPlayerAudio;
7
+ //# sourceMappingURL=player.audio.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"player.audio.d.ts","sourceRoot":"","sources":["../../../src/media-player/player.audio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAE/B,MAAM,WAAW,sBAAsB;IACrC,GAAG,EAAE,MAAM,CAAA;CACZ;AAED,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,sBAAsB,CAEvD,CAAA;AAED,eAAe,gBAAgB,CAAA"}
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import { MediaPlayerSlot } from './core/videoplayer';
3
+ import type { MediaPlayerBaseProps, MediaPlayerBaseSlots } from './types';
4
+ export interface MediaPlayerSlotsProps extends MediaPlayerBaseSlots {
5
+ disabledBackground?: boolean;
6
+ keepTabActive?: boolean;
7
+ }
8
+ interface IProps extends MediaPlayerBaseProps {
9
+ slots?: MediaPlayerSlotsProps;
10
+ slotMedia?: MediaPlayerSlot;
11
+ mediaMetadata?: MediaMetadata;
12
+ }
13
+ declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<IProps & React.RefAttributes<HTMLVideoElement>>>;
14
+ export default _default;
15
+ //# sourceMappingURL=player.video-stream.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"player.video-stream.d.ts","sourceRoot":"","sources":["../../../src/media-player/player.video-stream.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAGxC,OAAwB,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAErE,OAAO,KAAK,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEzE,MAAM,WAAW,qBAAsB,SAAQ,oBAAoB;IACjE,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB;AAED,UAAU,MAAO,SAAQ,oBAAoB;IAC3C,KAAK,CAAC,EAAE,qBAAqB,CAAA;IAC7B,SAAS,CAAC,EAAE,eAAe,CAAA;IAC3B,aAAa,CAAC,EAAE,aAAa,CAAA;CAC9B;;AA0DD,wBAA2C"}
@@ -0,0 +1,29 @@
1
+ import { Component } from 'react';
2
+ import { MediaPlayerClose, MediaPlayerShow } from './types';
3
+ export interface MediaPlayerProps {
4
+ close?: MediaPlayerClose;
5
+ }
6
+ interface IState {
7
+ player: React.ComponentType<MediaPlayerProps> | null;
8
+ title?: string;
9
+ disabledBackdrop?: boolean;
10
+ }
11
+ interface IActions {
12
+ show: MediaPlayerShow<IState>;
13
+ close: MediaPlayerClose;
14
+ }
15
+ interface IProps {
16
+ }
17
+ declare class MediaPlayerPreviewProvider extends Component<IProps, IState> {
18
+ constructor(props: IProps);
19
+ handleShow: MediaPlayerShow<IState>;
20
+ handleClose: MediaPlayerClose;
21
+ componentDidMount(): void;
22
+ render(): import("react/jsx-runtime").JSX.Element;
23
+ }
24
+ export declare const MediaPlayerPreview: {
25
+ Provider: typeof MediaPlayerPreviewProvider;
26
+ Api: IActions;
27
+ };
28
+ export default MediaPlayerPreview;
29
+ //# sourceMappingURL=preview.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"preview.d.ts","sourceRoot":"","sources":["../../../src/media-player/preview.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIjC,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE3D,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,gBAAgB,CAAA;CACzB;AAQD,UAAU,MAAM;IACd,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAA;IACpD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B;AAED,UAAU,QAAQ;IAChB,IAAI,EAAE,eAAe,CAAC,MAAM,CAAC,CAAA;IAC7B,KAAK,EAAE,gBAAgB,CAAA;CACxB;AAWD,UAAU,MAAM;CAAG;AAEnB,cAAM,0BAA2B,SAAQ,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC;gBACpD,KAAK,EAAE,MAAM;IAKzB,UAAU,EAAE,eAAe,CAAC,MAAM,CAAC,CAElC;IAED,WAAW,EAAE,gBAAgB,CAG5B;IAED,iBAAiB;IAKjB,MAAM;CAuBP;AAED,eAAO,MAAM,kBAAkB;;;CAG9B,CAAA;AAED,eAAe,kBAAkB,CAAA"}
@@ -0,0 +1,36 @@
1
+ import { ReactNode } from 'react';
2
+ import { Breakpoint } from '@mui/material';
3
+ type IReason = 'backdropClick' | 'escape' | 'closeButton';
4
+ export type MediaPlayerClose = (reason?: IReason) => void;
5
+ export type MediaPlayerShow<T> = (value: T) => void;
6
+ export interface IMediaStream {
7
+ code: number;
8
+ token: string;
9
+ StreamUrl: string;
10
+ }
11
+ export type FetchDataStream = (resourceId: string, signal?: AbortSignal) => Promise<IMediaStream[]>;
12
+ export interface MediaPlayerBaseProps {
13
+ resourceId: string;
14
+ fetchDataStream: FetchDataStream;
15
+ loading?: boolean;
16
+ }
17
+ export type AspectRatioParams = number | Partial<Record<Breakpoint, number>>;
18
+ export interface MediaPlayerBaseSlots {
19
+ /**
20
+ * Aspect ratio (height / width), used to calculate height based on width.
21
+ * @default 56.25 (%)
22
+ */
23
+ aspectRatio?: AspectRatioParams;
24
+ loading?: ReactNode;
25
+ loadingProps?: {
26
+ disabled?: boolean;
27
+ animationDuration?: string;
28
+ };
29
+ }
30
+ export declare enum EMediaPlayerStatus {
31
+ Loading = "Loading",
32
+ Loaded = "Loaded",
33
+ Error = "Error"
34
+ }
35
+ export {};
36
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/media-player/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,KAAK,OAAO,GAAG,eAAe,GAAG,QAAQ,GAAG,aAAa,CAAA;AAEzD,MAAM,MAAM,gBAAgB,GAAG,CAAC,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;AAEzD,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAA;AAEnD,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,MAAM,CAAA;CAClB;AAED,MAAM,MAAM,eAAe,GAAG,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,WAAW,KAAK,OAAO,CAAC,YAAY,EAAE,CAAC,CAAA;AAEnG,MAAM,WAAW,oBAAoB;IACnC,UAAU,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,eAAe,CAAA;IAChC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC,CAAA;AAE5E,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,YAAY,CAAC,EAAE;QACb,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,iBAAiB,CAAC,EAAE,MAAM,CAAA;KAC3B,CAAA;CACF;AAED,oBAAY,kBAAkB;IAC5B,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dinocollab-shared",
3
- "version": "1.1.17",
3
+ "version": "1.1.18",
4
4
  "description": "DinoCollab shared utilities and components",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -55,6 +55,12 @@
55
55
  ],
56
56
  "./notification": [
57
57
  "./dist/types/notification/index.d.ts"
58
+ ],
59
+ "media-player": [
60
+ "./dist/media-player.d.ts"
61
+ ],
62
+ "./media-player": [
63
+ "./dist/types/media-player/index.d.ts"
58
64
  ]
59
65
  }
60
66
  },
@@ -112,6 +118,14 @@
112
118
  "./notification.js": "./dist/notification.js",
113
119
  "./notification.mjs": "./dist/notification.mjs",
114
120
  "./notification.d.ts": "./dist/notification.d.ts",
121
+ "./media-player": {
122
+ "import": "./dist/media-player/index.js",
123
+ "require": "./dist/media-player/index.js",
124
+ "types": "./dist/types/media-player/index.d.ts"
125
+ },
126
+ "./media-player.js": "./dist/media-player.js",
127
+ "./media-player.mjs": "./dist/media-player.mjs",
128
+ "./media-player.d.ts": "./dist/media-player.d.ts",
115
129
  "./package.json": "./package.json"
116
130
  },
117
131
  "peerDependencies": {