Merge pull request #55 from adobe/donut

Donut chart

Author: marshallpete

package.json

@@ -3,9 +3,21 @@
 	"version": "v1.0.1",
 	"description": "Declarative library for composing Spectrum visualizations in React.",
 	"browser": "./dist/index.js",
-	"main": "./dist/index.js",
 	"module": "./dist/index.js",
-	"types": "./dist/@types/index.d.ts",
+	"exports": {
+		".": "./dist/index.js",
+		"./alpha": "./dist/alpha.js"
+	},
+	"typesVersions": {
+		"*": {
+			"*": [
+				"./dist/@types/index.d.ts"
+			],
+			"alpha": [
+				"./dist/@types/alpha/index.d.ts"
+			]
+		}
+	},
 	"files": [
 		"/dist"
 	],
@@ -28,7 +40,7 @@
 		"ts": "yarn tsc",
 		"tsc": "tsc --noEmit --skipLibCheck",
 		"prepack": "yarn build",
-		"pack-test": "rm -rf dist & npm pack",
+		"pack-test": "rm -rf dist & cross-env NODE_ENV=development npm pack",
 		"start": "yarn storybook",
 		"storybook": "cross-env NODE_OPTIONS=--openssl-legacy-provider && storybook dev -p 6009",
 		"test": "cross-env BABEL_ENV=test jest",

src/alpha/components/Donut/Donut.tsx

@@ -0,0 +1,39 @@
+/*
+ * Copyright 2023 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { FC } from 'react';
+
+import { DEFAULT_COLOR, DEFAULT_METRIC } from '@constants';
+
+import { DonutProps } from '../../../types';
+
+// destructure props here and set defaults so that storybook can pick them up
+const Donut: FC<DonutProps> = ({
+	children,
+	color = DEFAULT_COLOR,
+	hasDirectLabels = false,
+	holeRatio = 0.85,
+	isBoolean = false,
+	metric = DEFAULT_METRIC,
+	metricLabel,
+	name,
+	segment,
+	startAngle = 0,
+}) => {
+	return null;
+};
+
+// displayName is used to validate the component type in the spec builder
+Donut.displayName = 'Donut';
+
+export { Donut };

src/alpha/components/Donut/index.ts

@@ -0,0 +1,13 @@
+/*
+ * Copyright 2023 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+export * from './Donut';

src/alpha/components/index.ts

@@ -0,0 +1,13 @@
+/*
+ * Copyright 2024 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+export * from './Donut';

src/alpha/index.ts

@@ -0,0 +1,13 @@
+/*
+ * Copyright 2024 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+export * from './components';

src/components/Annotation/Annotation.tsx

@@ -11,8 +11,15 @@
  */
 
 /* eslint-disable @typescript-eslint/no-unused-vars */
+import { FC } from 'react';
+
 import { AnnotationProps } from '../../types';
 
-export function Annotation({ textKey = 'annotation', style }: AnnotationProps) {
+const Annotation: FC<AnnotationProps> = ({ textKey = 'annotation', style }) => {
 	return null;
-}
+};
+
+// displayName is used to validate the component type in the spec builder
+Annotation.displayName = 'Annotation';
+
+export { Annotation };

src/components/Area/Area.tsx

@@ -11,12 +11,14 @@
  */
 
 /* eslint-disable @typescript-eslint/no-unused-vars */
+import { FC } from 'react';
+
 import { DEFAULT_COLOR, DEFAULT_METRIC, DEFAULT_TIME_DIMENSION } from '@constants';
 
 import { AreaProps } from '../../types';
 
 // destructure props here and set defaults so that storybook can pick them up
-export function Area({
+const Area: FC<AreaProps> = ({
 	children,
 	name,
 	opacity = 0.8,
@@ -28,6 +30,11 @@ export function Area({
 	metricEnd,
 	metricStart,
 	padding,
-}: AreaProps) {
+}) => {
 	return null;
-}
+};
+
+// displayName is used to validate the component type in the spec builder
+Area.displayName = 'Area';
+
+export { Area };

src/components/Axis/Axis.tsx

@@ -11,6 +11,8 @@
  */
 
 /* eslint-disable @typescript-eslint/no-unused-vars */
+import { FC } from 'react';
+
 import {
 	DEFAULT_GRANULARITY,
 	DEFAULT_LABEL_ALIGN,
@@ -20,7 +22,7 @@ import {
 
 import { AxisProps } from '../../types';
 
-export function Axis({
+const Axis: FC<AxisProps> = ({
 	position,
 	baseline = false,
 	baselineOffset = 0,
@@ -38,6 +40,11 @@ export function Axis({
 	ticks = false,
 	tickMinStep = undefined,
 	title = undefined,
-}: AxisProps) {
+}) => {
 	return null;
-}
+};
+
+// displayName is used to validate the component type in the spec builder
+Axis.displayName = 'Axis';
+
+export { Axis };

src/components/AxisAnnotation/AxisAnnotation.tsx

@@ -11,14 +11,21 @@
  */
 
 /* eslint-disable @typescript-eslint/no-unused-vars */
+import { FC } from 'react';
+
 import { DEFAULT_AXIS_ANNOTATION_COLOR, DEFAULT_AXIS_ANNOTATION_OFFSET } from '@constants';
 
 import { AxisAnnotationProps } from '../../types';
 
-export function AxisAnnotation({
+const AxisAnnotation: FC<AxisAnnotationProps> = ({
 	dataKey = 'annotations',
 	color = DEFAULT_AXIS_ANNOTATION_COLOR,
 	offset = DEFAULT_AXIS_ANNOTATION_OFFSET,
-}: AxisAnnotationProps) {
+}) => {
 	return null;
-}
+};
+
+// displayName is used to validate the component type in the spec builder
+AxisAnnotation.displayName = 'AxisAnnotation';
+
+export { AxisAnnotation };

src/components/Bar/Bar.tsx

@@ -11,11 +11,13 @@
  */
 
 /* eslint-disable @typescript-eslint/no-unused-vars */
+import { FC } from 'react';
+
 import { DEFAULT_CATEGORICAL_DIMENSION, DEFAULT_METRIC, PADDING_RATIO, TRELLIS_PADDING } from '@constants';
 
 import { BarProps } from '../../types';
 
-export function Bar({
+const Bar: FC<BarProps> = ({
 	dimension = DEFAULT_CATEGORICAL_DIMENSION,
 	color = { value: 'categorical-100' },
 	metric = DEFAULT_METRIC,
@@ -27,6 +29,11 @@ export function Bar({
 	trellisPadding = TRELLIS_PADDING,
 	paddingRatio = PADDING_RATIO,
 	paddingOuter,
-}: BarProps) {
+}) => {
 	return null;
-}
+};
+
+// displayName is used to validate the component type in the spec builder
+Bar.displayName = 'Bar';
+
+export { Bar };