@pega/custom-dx-components 0.0.1 → 0.23.2

package/src/tasks/init/template/src/components/Organization_Library_MediaURL/MediaURL.stories.tsx

@@ -1,19 +0,0 @@
-import type { Meta, Story } from '@storybook/react';
-
-import MediaURLInput from './MediaURLInput';
-import MediaURLDisplay from './MediaURLDisplay';
-
-export default {
-  title: 'MediaURL',
-  parameters: {
-    layout: 'centered'
-  }
-} as Meta;
-
-export const InputMode: Story = () => {
-  return <MediaURLInput label='Media src url' />;
-};
-
-export const DisplayMode: Story = () => {
-  return <MediaURLDisplay value='https://youtu.be/BxogmCLpy0w' />;
-};

package/src/tasks/init/template/src/components/Organization_Library_MediaURL/MediaURL.types.ts

@@ -1,10 +0,0 @@
-import type { FormControlProps, OmitStrict, URLDisplayProps } from '@pega/cosmos-react-core';
-
-export interface MediaURLInputProps extends OmitStrict<FormControlProps, 'defaultValue'> {
-  testId?: string;
-}
-
-export interface MediaURLDisplayProps extends OmitStrict<URLDisplayProps, 'variant' | 'ref'> {
-  variant?: 'player' | URLDisplayProps['variant'];
-  testId?: string;
-}

package/src/tasks/init/template/src/components/Organization_Library_MediaURL/MediaURLDisplay.tsx

@@ -1,25 +0,0 @@
-import type { FunctionComponent } from 'react';
-import { URLDisplay } from '@pega/cosmos-react-core';
-import ReactPlayer from 'react-player';
-
-import StyledMediaURLDisplay from './MediaURL.styles';
-import type { MediaURLDisplayProps } from './MediaURL.types';
-
-const MediaURLDisplay: FunctionComponent<MediaURLDisplayProps> = ({
-  value,
-  variant = 'player',
-  testId,
-  ...restProps
-}) => {
-  if ((!value && variant !== 'player') || variant !== 'player') {
-    return <URLDisplay value={value} variant={variant} {...restProps} />;
-  }
-
-  return (
-    <StyledMediaURLDisplay data-testid={testId}>
-      <ReactPlayer url={value} />
-    </StyledMediaURLDisplay>
-  );
-};
-
-export default MediaURLDisplay;

package/src/tasks/init/template/src/components/Organization_Library_MediaURL/MediaURLInput.tsx

@@ -1,24 +0,0 @@
-import { ChangeEvent, FunctionComponent, useState } from 'react';
-import { Input } from '@pega/cosmos-react-core';
-
-import type { MediaURLInputProps } from './MediaURL.types';
-
-const MediaURLInput: FunctionComponent<MediaURLInputProps> = ({
-  value,
-  ...restProps
-}: MediaURLInputProps) => {
-  const [url, setURL] = useState(value);
-
-  return (
-    <Input
-      {...restProps}
-      type='url'
-      value={url}
-      onChange={(e: ChangeEvent<HTMLInputElement>) => {
-        setURL(e.target.value);
-      }}
-    />
-  );
-};
-
-export default MediaURLInput;

package/src/tasks/init/template/src/components/Organization_Library_MediaURL/config.json

@@ -1,13 +0,0 @@
-{
-  "name": "Organization_Library_MediaURL",
-  "label": "MediaURL",
-  "description": "A pair of components for taking input and displaying teh value of a video or audio url.",
-  "organization": "TBD",
-  "version": "0.0.1",
-  "library": "TBD",
-  "componentKey": "Organization_Library_MediaURL",
-  "type": "Field",
-  "subtype": "Text",
-  "icon": "TBD",
-  "properties": ["TBD"]
-}

package/src/tasks/init/template/src/components/Organization_Library_MediaURL/index.ts

@@ -1,2 +0,0 @@
-export { default as MediaURLInput } from './MediaURLInput';
-export { default as MediaURLDisplay } from './MediaURLDisplay';

package/src/tasks/init/template/src/components/Organization_Library_VideoPlayer/config.json

@@ -1,44 +0,0 @@
-{
-  "name": "Organization_Library_VideoPlayer",
-  "label": "Video Player",
-  "description": "video player",
-  "organization": "apple",
-  "version": "0.0.1",
-  "library": "basic",
-  "componentKey": "Organization_Library_VideoPlayer",
-  "type": "Field",
-  "subtype": "Text",
-  "icon": "images/pz-text-input-active.svg",
-  "properties": [
-    {
-      "name": "value",
-      "label": "Property",
-      "format": "PROPERTY"
-    },
-    {
-      "name": "label",
-      "label": "Label value",
-      "format": "TEXT"
-    },
-    {
-      "name": "placeholder",
-      "label": "Placeholder",
-      "format": "TEXT"
-    },
-    {
-      "name": "visibility",
-      "label": "Visible",
-      "format": "VISIBILITY"
-    },
-    {
-      "name": "disabled",
-      "label": "Disabled",
-      "format": "DISABLED"
-    },
-    {
-      "name": "required",
-      "label": "Required",
-      "format": "REQUIRED"
-    }
-  ]
-}

package/src/tasks/init/template/src/components/Organization_Library_VideoPlayer/demo.stories.jsx

@@ -1,40 +0,0 @@
-import React, { useState } from 'react';
-import { withKnobs, text, boolean } from '@storybook/addon-knobs';
-
-import VideoPlayer from './index';
-
-export default {
-  title: 'VideoPlayer',
-  decorators: [withKnobs],
-  component: VideoPlayer
-};
-
-export const baseVideoPlayer = () => {
-  const [value, setValue] = useState('test value');
-
-  const props = {
-    getPConnect: () => {
-      return {
-        getActionsApi: () => {
-          return {
-            updateFieldValue: (propName, value) => {
-              setValue(value);
-            }
-          };
-        },
-        getStateProps: () => {
-          return { value: '.name' };
-        }
-      };
-    },
-    value: text('src', 'https://www.youtube.com/watch?v=EtG5IuNGYSk'),
-    placeholder: text('Placeholder', 'Test placeholder'),
-    disabled: boolean('Disabled', false),
-    readOnly: boolean('Disabled', false),
-    required: boolean('Disabled', false),
-    label: text('Label', 'Video player label'),
-    testId: text('Test id', 'video-12344566')
-  };
-
-  return <VideoPlayer {...props} />;
-};

package/src/tasks/init/template/src/components/Organization_Library_VideoPlayer/index.jsx

@@ -1,42 +0,0 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-import { Label } from '@pega/cosmos-react-core';
-import ReactPlayer from 'react-player';
-
-import StyledVideoPlayerWrapper from './styles';
-
-const VideoPlayer = props => {
-  const { getPConnect, value, placeholder, disabled, readOnly, required, label } = props;
-
-  const pConn = getPConnect();
-  const actions = pConn.getActionsApi();
-  const propName = pConn?.getStateProps()?.value;
-
-  return (
-    <StyledVideoPlayerWrapper>
-      <Label>{label}</Label>
-      <ReactPlayer url={value} />
-    </StyledVideoPlayerWrapper>
-  );
-};
-
-VideoPlayer.defaultProps = {
-  value: '',
-  placeholder: '',
-  disabled: false,
-  readOnly: false,
-  required: false,
-  testId: null
-};
-VideoPlayer.propTypes = {
-  label: PropTypes.string,
-  value: PropTypes.string.isRequired,
-  placeholder: PropTypes.string,
-  getPConnect: PropTypes.func.isRequired,
-  disabled: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  readOnly: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  required: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  testId: PropTypes.string
-};
-
-export default VideoPlayer;