From 9317a95d9fa8a5e1628918f8d091be068cc747bd Mon Sep 17 00:00:00 2001
From: Axel Bocciarelli <axelboc@gmail.com>
Date: Wed, 7 Jun 2023 14:48:44 +0200
Subject: [PATCH] Rename `DomainSlider` to `DomainWidget`

---
 apps/storybook/.storybook/preview.ts                 |  2 +-
 apps/storybook/src/Customization.mdx                 |  2 +-
 ...inSlider.stories.tsx => DomainWidget.stories.tsx} | 10 +++++-----
 apps/storybook/src/Toolbar.stories.tsx               |  4 ++--
 .../{DomainSlider.test.tsx => DomainWidget.test.tsx} |  0
 .../src/vis-packs/core/complex/ComplexToolbar.tsx    |  4 ++--
 .../src/vis-packs/core/heatmap/HeatmapToolbar.tsx    |  4 ++--
 .../src/vis-packs/core/scatter/ScatterToolbar.tsx    |  4 ++--
 .../src/vis-packs/core/surface/SurfaceToolbar.tsx    |  4 ++--
 packages/lib/src/index.ts                            |  4 ++--
 packages/lib/src/toolbar/Toolbar.module.css          |  2 +-
 .../BoundEditor.module.css                           |  0
 .../{DomainSlider => DomainWidget}/BoundEditor.tsx   |  0
 .../DomainTooltip.module.css                         |  0
 .../{DomainSlider => DomainWidget}/DomainTooltip.tsx |  0
 .../DomainWidget.module.css}                         | 12 ------------
 .../DomainWidget.tsx}                                |  8 ++++----
 .../{DomainSlider => DomainWidget}/ErrorMessage.tsx  |  0
 .../controls/DomainWidget/ScaledSlider.module.css    | 11 +++++++++++
 .../{DomainSlider => DomainWidget}/ScaledSlider.tsx  |  2 +-
 .../{DomainSlider => DomainWidget}/Thumb.module.css  |  0
 .../{DomainSlider => DomainWidget}/Thumb.tsx         |  0
 .../{DomainSlider => DomainWidget}/Track.module.css  |  0
 .../{DomainSlider => DomainWidget}/Track.tsx         |  0
 24 files changed, 36 insertions(+), 37 deletions(-)
 rename apps/storybook/src/{DomainSlider.stories.tsx => DomainWidget.stories.tsx} (93%)
 rename packages/app/src/__tests__/{DomainSlider.test.tsx => DomainWidget.test.tsx} (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/BoundEditor.module.css (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/BoundEditor.tsx (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/DomainTooltip.module.css (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/DomainTooltip.tsx (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider/DomainSlider.module.css => DomainWidget/DomainWidget.module.css} (53%)
 rename packages/lib/src/toolbar/controls/{DomainSlider/DomainSlider.tsx => DomainWidget/DomainWidget.tsx} (96%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/ErrorMessage.tsx (100%)
 create mode 100644 packages/lib/src/toolbar/controls/DomainWidget/ScaledSlider.module.css
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/ScaledSlider.tsx (98%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/Thumb.module.css (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/Thumb.tsx (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/Track.module.css (100%)
 rename packages/lib/src/toolbar/controls/{DomainSlider => DomainWidget}/Track.tsx (100%)

diff --git a/apps/storybook/.storybook/preview.ts b/apps/storybook/.storybook/preview.ts
index 775477578..579a92b04 100644
--- a/apps/storybook/.storybook/preview.ts
+++ b/apps/storybook/.storybook/preview.ts
@@ -31,7 +31,7 @@ export const parameters = {
           ],
         ],
         'Toolbar',
-        ['Toolbar', 'DomainSlider', 'Histogram'],
+        ['Toolbar', 'DomainWidget', 'Histogram'],
         'Experimental',
       ],
     },
diff --git a/apps/storybook/src/Customization.mdx b/apps/storybook/src/Customization.mdx
index 898d0b45c..8fc51a056 100644
--- a/apps/storybook/src/Customization.mdx
+++ b/apps/storybook/src/Customization.mdx
@@ -146,7 +146,7 @@ as you see fit. For instance, if you'd like to change the color of the curve of
 | `--h5w-selector-option-focus--outlineColor` | `gray`                                       | Outline color of focused option      |
 | `--h5w-selector-groupLabel--color`          | `gray`                                       | Text color of group labels in menu   |
 
-##### Domain slider
+##### Domain widget
 
 | Name                                                 | Default                    | Description                                    |
 | ---------------------------------------------------- | -------------------------- | ---------------------------------------------- |
diff --git a/apps/storybook/src/DomainSlider.stories.tsx b/apps/storybook/src/DomainWidget.stories.tsx
similarity index 93%
rename from apps/storybook/src/DomainSlider.stories.tsx
rename to apps/storybook/src/DomainWidget.stories.tsx
index 42d91e485..b68cde342 100644
--- a/apps/storybook/src/DomainSlider.stories.tsx
+++ b/apps/storybook/src/DomainWidget.stories.tsx
@@ -1,5 +1,5 @@
 import type { CustomDomain } from '@h5web/lib';
-import { DomainSlider, ScaleType } from '@h5web/lib';
+import { DomainWidget, ScaleType } from '@h5web/lib';
 import { COLOR_SCALE_TYPES } from '@h5web/shared';
 import type { Meta, StoryObj } from '@storybook/react';
 import { useState } from 'react';
@@ -7,8 +7,8 @@ import { useState } from 'react';
 import Center from './decorators/Center';
 
 const meta = {
-  title: 'Toolbar/DomainSlider',
-  component: DomainSlider,
+  title: 'Toolbar/DomainWidget',
+  component: DomainWidget,
   decorators: [Center],
   args: {
     customDomain: undefined,
@@ -20,7 +20,7 @@ const meta = {
       options: COLOR_SCALE_TYPES,
     },
   },
-} satisfies Meta<typeof DomainSlider>;
+} satisfies Meta<typeof DomainWidget>;
 
 export default meta;
 type Story = StoryObj<typeof meta>;
@@ -31,7 +31,7 @@ export const Default = {
     const [domain, setDomain] = useState<CustomDomain>(initialDomain);
 
     return (
-      <DomainSlider
+      <DomainWidget
         {...otherArgs}
         customDomain={domain}
         onCustomDomainChange={setDomain}
diff --git a/apps/storybook/src/Toolbar.stories.tsx b/apps/storybook/src/Toolbar.stories.tsx
index 49e438868..e9a0785b1 100644
--- a/apps/storybook/src/Toolbar.stories.tsx
+++ b/apps/storybook/src/Toolbar.stories.tsx
@@ -2,7 +2,7 @@ import type { ColorMap, CustomDomain } from '@h5web/lib';
 import {
   Btn,
   ColorMapSelector,
-  DomainSlider,
+  DomainWidget,
   GridToggler,
   ScaleSelector,
   ScaleType,
@@ -53,7 +53,7 @@ export const Default = {
     return (
       <>
         <Toolbar {...args}>
-          <DomainSlider
+          <DomainWidget
             dataDomain={[1, 100]}
             customDomain={customDomain}
             scaleType={scaleType}
diff --git a/packages/app/src/__tests__/DomainSlider.test.tsx b/packages/app/src/__tests__/DomainWidget.test.tsx
similarity index 100%
rename from packages/app/src/__tests__/DomainSlider.test.tsx
rename to packages/app/src/__tests__/DomainWidget.test.tsx
diff --git a/packages/app/src/vis-packs/core/complex/ComplexToolbar.tsx b/packages/app/src/vis-packs/core/complex/ComplexToolbar.tsx
index 81311cfbc..3ce6af363 100644
--- a/packages/app/src/vis-packs/core/complex/ComplexToolbar.tsx
+++ b/packages/app/src/vis-packs/core/complex/ComplexToolbar.tsx
@@ -1,7 +1,7 @@
 import type { Domain } from '@h5web/lib';
 import {
   ColorMapSelector,
-  DomainSlider,
+  DomainWidget,
   ScaleSelector,
   Selector,
   Separator,
@@ -44,7 +44,7 @@ function ComplexToolbar(props: Props) {
 
   return (
     <Toolbar interactions={getImageInteractions(keepRatio)}>
-      <DomainSlider
+      <DomainWidget
         dataDomain={dataDomain}
         customDomain={customDomain}
         scaleType={scaleType}
diff --git a/packages/app/src/vis-packs/core/heatmap/HeatmapToolbar.tsx b/packages/app/src/vis-packs/core/heatmap/HeatmapToolbar.tsx
index 0987bf125..64eb2ba80 100644
--- a/packages/app/src/vis-packs/core/heatmap/HeatmapToolbar.tsx
+++ b/packages/app/src/vis-packs/core/heatmap/HeatmapToolbar.tsx
@@ -1,7 +1,7 @@
 import type { Domain } from '@h5web/lib';
 import {
   ColorMapSelector,
-  DomainSlider,
+  DomainWidget,
   ExportMenu,
   FlipYAxisToggler,
   GridToggler,
@@ -48,7 +48,7 @@ function HeatmapToolbar(props: Props) {
 
   return (
     <Toolbar interactions={getImageInteractions(keepRatio)}>
-      <DomainSlider
+      <DomainWidget
         dataDomain={dataDomain}
         customDomain={customDomain}
         scaleType={scaleType}
diff --git a/packages/app/src/vis-packs/core/scatter/ScatterToolbar.tsx b/packages/app/src/vis-packs/core/scatter/ScatterToolbar.tsx
index 3b4f5ee70..8f283295f 100644
--- a/packages/app/src/vis-packs/core/scatter/ScatterToolbar.tsx
+++ b/packages/app/src/vis-packs/core/scatter/ScatterToolbar.tsx
@@ -1,7 +1,7 @@
 import type { Domain } from '@h5web/lib';
 import {
   ColorMapSelector,
-  DomainSlider,
+  DomainWidget,
   GridToggler,
   ScaleSelector,
   Separator,
@@ -53,7 +53,7 @@ function ScatterToolbar(props: Props) {
 
       <Separator />
 
-      <DomainSlider
+      <DomainWidget
         dataDomain={dataDomain}
         customDomain={customDomain}
         scaleType={scaleType}
diff --git a/packages/app/src/vis-packs/core/surface/SurfaceToolbar.tsx b/packages/app/src/vis-packs/core/surface/SurfaceToolbar.tsx
index a1fa5abed..be9646d12 100644
--- a/packages/app/src/vis-packs/core/surface/SurfaceToolbar.tsx
+++ b/packages/app/src/vis-packs/core/surface/SurfaceToolbar.tsx
@@ -1,7 +1,7 @@
 import type { Domain } from '@h5web/lib';
 import {
   ColorMapSelector,
-  DomainSlider,
+  DomainWidget,
   ScaleSelector,
   Separator,
   SnapshotBtn,
@@ -31,7 +31,7 @@ function SurfaceToolbar(props: Props) {
 
   return (
     <Toolbar>
-      <DomainSlider
+      <DomainWidget
         dataDomain={dataDomain}
         customDomain={customDomain}
         scaleType={scaleType}
diff --git a/packages/lib/src/index.ts b/packages/lib/src/index.ts
index 29c4b69bc..edb03d6f0 100644
--- a/packages/lib/src/index.ts
+++ b/packages/lib/src/index.ts
@@ -15,7 +15,7 @@ export { default as Btn } from './toolbar/controls/Btn';
 export { default as LinkBtn } from './toolbar/controls/LinkBtn';
 export { default as ToggleBtn } from './toolbar/controls/ToggleBtn';
 export { default as ToggleGroup } from './toolbar/controls/ToggleGroup';
-export { default as DomainSlider } from './toolbar/controls/DomainSlider/DomainSlider';
+export { default as DomainWidget } from './toolbar/controls/DomainWidget/DomainWidget';
 export { default as ColorMapSelector } from './toolbar/controls/ColorMapSelector/ColorMapSelector';
 export { default as ScaleSelector } from './toolbar/controls/ScaleSelector/ScaleSelector';
 export { default as GridToggler } from './toolbar/controls/GridToggler';
@@ -27,7 +27,7 @@ export { default as ResetZoomButton } from './toolbar/floating/ResetZoomButton';
 export { default as NotationToggleGroup } from './toolbar/controls/NotationToggleGroup';
 export { default as Histogram } from './toolbar/controls/Histogram/Histogram';
 export type { ToolbarProps } from './toolbar/Toolbar';
-export type { DomainSliderProps } from './toolbar/controls/DomainSlider/DomainSlider';
+export type { DomainWidgetProps } from './toolbar/controls/DomainWidget/DomainWidget';
 export type { HistogramProps } from './toolbar/controls/Histogram/Histogram';
 
 // Building blocks
diff --git a/packages/lib/src/toolbar/Toolbar.module.css b/packages/lib/src/toolbar/Toolbar.module.css
index 2ef8b5de2..b157cb23d 100644
--- a/packages/lib/src/toolbar/Toolbar.module.css
+++ b/packages/lib/src/toolbar/Toolbar.module.css
@@ -108,7 +108,7 @@ a.btn {
 
 .btn:active > .btnLike,
 .btn[data-raised]:active > .btnLike,
-.btn[aria-pressed='true'] > .btnLike, /* toggle buttons, domain slider "edit" button */
+.btn[aria-pressed='true'] > .btnLike, /* toggle buttons, domain widget "edit" button */
 .btn[aria-checked='true'] > .btnLike, /* toggle group buttons */
 .btn[aria-haspopup][aria-expanded='true'] > .btnLike  /* selectors and overflow menu buttons */ {
   background-color: var(--h5w-btnPressed--bgColor, white);
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/BoundEditor.module.css b/packages/lib/src/toolbar/controls/DomainWidget/BoundEditor.module.css
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/BoundEditor.module.css
rename to packages/lib/src/toolbar/controls/DomainWidget/BoundEditor.module.css
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/BoundEditor.tsx b/packages/lib/src/toolbar/controls/DomainWidget/BoundEditor.tsx
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/BoundEditor.tsx
rename to packages/lib/src/toolbar/controls/DomainWidget/BoundEditor.tsx
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/DomainTooltip.module.css b/packages/lib/src/toolbar/controls/DomainWidget/DomainTooltip.module.css
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/DomainTooltip.module.css
rename to packages/lib/src/toolbar/controls/DomainWidget/DomainTooltip.module.css
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/DomainTooltip.tsx b/packages/lib/src/toolbar/controls/DomainWidget/DomainTooltip.tsx
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/DomainTooltip.tsx
rename to packages/lib/src/toolbar/controls/DomainWidget/DomainTooltip.tsx
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/DomainSlider.module.css b/packages/lib/src/toolbar/controls/DomainWidget/DomainWidget.module.css
similarity index 53%
rename from packages/lib/src/toolbar/controls/DomainSlider/DomainSlider.module.css
rename to packages/lib/src/toolbar/controls/DomainWidget/DomainWidget.module.css
index 23205197b..e65b3fd26 100644
--- a/packages/lib/src/toolbar/controls/DomainSlider/DomainSlider.module.css
+++ b/packages/lib/src/toolbar/controls/DomainWidget/DomainWidget.module.css
@@ -19,15 +19,3 @@
 .root[data-disabled] > .sliderContainer {
   opacity: 0.5; /* edit button is itself disabled, so don't fade it more */
 }
-
-.slider {
-  display: flex;
-  margin-right: -0.25rem;
-  font-size: 0.75rem;
-  cursor: pointer;
-
-  --track-width: var(--h5w-domainSlider-track--width, 8rem);
-  --track-height: var(--h5w-domainSlider-track--height, 0.625rem);
-  --thumb-size: calc(var(--track-height) * 2.5);
-  --thumb-size-auto: calc(var(--thumb-size) * 0.9);
-}
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/DomainSlider.tsx b/packages/lib/src/toolbar/controls/DomainWidget/DomainWidget.tsx
similarity index 96%
rename from packages/lib/src/toolbar/controls/DomainSlider/DomainSlider.tsx
rename to packages/lib/src/toolbar/controls/DomainWidget/DomainWidget.tsx
index fbcbe974a..b66372b41 100644
--- a/packages/lib/src/toolbar/controls/DomainSlider/DomainSlider.tsx
+++ b/packages/lib/src/toolbar/controls/DomainWidget/DomainWidget.tsx
@@ -7,9 +7,9 @@ import { useSafeDomain, useVisDomain } from '../../../vis/heatmap/hooks';
 import type { CustomDomain, HistogramParams } from '../../../vis/models';
 import Histogram from '../Histogram/Histogram';
 import ToggleBtn from '../ToggleBtn';
-import styles from './DomainSlider.module.css';
 import type { DomainTooltipHandle } from './DomainTooltip';
 import DomainTooltip from './DomainTooltip';
+import styles from './DomainWidget.module.css';
 import ScaledSlider from './ScaledSlider';
 
 const TOOLTIP_ID = 'domain-tooltip';
@@ -23,7 +23,7 @@ interface Props {
   disabled?: boolean;
 }
 
-function DomainSlider(props: Props) {
+function DomainWidget(props: Props) {
   const { dataDomain, customDomain, scaleType, disabled = false } = props;
   const { onCustomDomainChange, histogram } = props;
 
@@ -152,5 +152,5 @@ function DomainSlider(props: Props) {
   );
 }
 
-export type { Props as DomainSliderProps };
-export default DomainSlider;
+export type { Props as DomainWidgetProps };
+export default DomainWidget;
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/ErrorMessage.tsx b/packages/lib/src/toolbar/controls/DomainWidget/ErrorMessage.tsx
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/ErrorMessage.tsx
rename to packages/lib/src/toolbar/controls/DomainWidget/ErrorMessage.tsx
diff --git a/packages/lib/src/toolbar/controls/DomainWidget/ScaledSlider.module.css b/packages/lib/src/toolbar/controls/DomainWidget/ScaledSlider.module.css
new file mode 100644
index 000000000..e86f99fef
--- /dev/null
+++ b/packages/lib/src/toolbar/controls/DomainWidget/ScaledSlider.module.css
@@ -0,0 +1,11 @@
+.slider {
+  display: flex;
+  margin-right: -0.25rem;
+  font-size: 0.75rem;
+  cursor: pointer;
+
+  --track-width: var(--h5w-domainSlider-track--width, 8rem);
+  --track-height: var(--h5w-domainSlider-track--height, 0.625rem);
+  --thumb-size: calc(var(--track-height) * 2.5);
+  --thumb-size-auto: calc(var(--thumb-size) * 0.9);
+}
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/ScaledSlider.tsx b/packages/lib/src/toolbar/controls/DomainWidget/ScaledSlider.tsx
similarity index 98%
rename from packages/lib/src/toolbar/controls/DomainSlider/ScaledSlider.tsx
rename to packages/lib/src/toolbar/controls/DomainWidget/ScaledSlider.tsx
index d3d9f9b40..076b85dac 100644
--- a/packages/lib/src/toolbar/controls/DomainSlider/ScaledSlider.tsx
+++ b/packages/lib/src/toolbar/controls/DomainWidget/ScaledSlider.tsx
@@ -7,7 +7,7 @@ import { getSafeDomain } from '../../../vis/heatmap/utils';
 import { useCombinedDomain } from '../../../vis/hooks';
 import type { DomainErrors } from '../../../vis/models';
 import { clampBound, createScale, extendDomain } from '../../../vis/utils';
-import styles from './DomainSlider.module.css';
+import styles from './ScaledSlider.module.css';
 import Thumb from './Thumb';
 import Track from './Track';
 
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/Thumb.module.css b/packages/lib/src/toolbar/controls/DomainWidget/Thumb.module.css
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/Thumb.module.css
rename to packages/lib/src/toolbar/controls/DomainWidget/Thumb.module.css
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/Thumb.tsx b/packages/lib/src/toolbar/controls/DomainWidget/Thumb.tsx
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/Thumb.tsx
rename to packages/lib/src/toolbar/controls/DomainWidget/Thumb.tsx
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/Track.module.css b/packages/lib/src/toolbar/controls/DomainWidget/Track.module.css
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/Track.module.css
rename to packages/lib/src/toolbar/controls/DomainWidget/Track.module.css
diff --git a/packages/lib/src/toolbar/controls/DomainSlider/Track.tsx b/packages/lib/src/toolbar/controls/DomainWidget/Track.tsx
similarity index 100%
rename from packages/lib/src/toolbar/controls/DomainSlider/Track.tsx
rename to packages/lib/src/toolbar/controls/DomainWidget/Track.tsx