feat(colorslider): s2 migration

.changeset/serious-clouds-jam.md

@@ -0,0 +1,11 @@
+---
+"@spectrum-css/colorslider": minor
+---
+
+# S2 colorslider migration
+
+This migrates the `colorslider` component to S2. Custom properties have been remapped per the design spec.
+
+| Before                    | After                      |
+| ------------------------- | -------------------------- |
+| `--spectrum-gray-900-rgb` | `--spectrum-gray-1000-rgb` |

components/colorslider/index.css

@@ -1,10 +1,10 @@
 /*!
- * Copyright 2023 Adobe. All rights reserved.
- * 
+ * 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
@@ -16,7 +16,7 @@
 	--spectrum-color-slider-handle-margin-block: var(--spectrum-component-top-to-text-75);
 
 	/* @todo Refactor with --spectrum-color-slider-border-color once gray rgb token is no longer necessary to workaround nested rgb color token value using rgba(). */
-	--spectrum-color-slider-border-color-rgba: rgba(var(--spectrum-gray-900-rgb), var(--spectrum-color-slider-border-opacity));
+	--spectrum-color-slider-border-color-rgba: rgba(var(--spectrum-gray-1000-rgb), var(--spectrum-color-slider-border-opacity));
 
 	/* Checkerboard pattern */
 	--spectrum-color-slider-checkerboard-size: var(--spectrum-opacity-checkerboard-square-size);
@@ -74,11 +74,6 @@
 		inset-inline-start: 50%;
 		inset-block-start: 0;
 	}
-
-	.spectrum-ColorSlider-handle {
-		inset-inline-start: 50%;
-		inset-block-start: 0;
-	}
 }
 
 .spectrum-ColorSlider-handle {