@simpli-route/apollo-ds 0.1.83 → 0.1.85

package/dist/stories/ColorSwatchPicker.stories.d.ts

@@ -0,0 +1,23 @@
+import { ColorSwatchPicker } from '../components';
+import { Meta, StoryObj } from '@storybook/react';
+
+declare const meta: Meta<typeof ColorSwatchPicker>;
+export default meta;
+type Story = StoryObj<typeof ColorSwatchPicker>;
+export declare const Default: Story;
+export declare const WithNames: Story;
+export declare const Controlled: Story;
+export declare const Disabled: Story;
+export declare const SizeSmall: Story;
+export declare const SizeMedium: Story;
+export declare const SizeLarge: Story;
+export declare const ShapeCircle: Story;
+export declare const ShapeSquare: Story;
+export declare const LayoutGrid: Story;
+export declare const LayoutStack: Story;
+export declare const WithTooltip: Story;
+export declare const LightColorsContrast: Story;
+export declare const WithTransparent: Story;
+export declare const LargePaletteWraps: Story;
+export declare const CompositionalAPI: Story;
+export declare const FormIntegration: Story;

package/dist/stories/Icons.stories.d.ts

@@ -0,0 +1,12 @@
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: () => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Gallery: Story;

package/dist/style.css

@@ -749,6 +749,9 @@ select {
 .pointer-events-none {
   pointer-events: none;
 }
+.pointer-events-auto {
+  pointer-events: auto;
+}
 .\!visible {
   visibility: visible !important;
 }
@@ -773,13 +776,23 @@ select {
 .relative {
   position: relative;
 }
+.sticky {
+  position: sticky;
+}
 .inset-0 {
   inset: 0px;
 }
+.inset-x-0 {
+  left: 0px;
+  right: 0px;
+}
 .inset-y-0 {
   top: 0px;
   bottom: 0px;
 }
+.bottom-4 {
+  bottom: 1rem;
+}
 .bottom-full {
   bottom: 100%;
 }
@@ -804,6 +817,9 @@ select {
 .top-1\/2 {
   top: 50%;
 }
+.top-2 {
+  top: 0.5rem;
+}
 .top-4 {
   top: 1rem;
 }
@@ -960,6 +976,9 @@ select {
 .block {
   display: block;
 }
+.inline-block {
+  display: inline-block;
+}
 .flex {
   display: flex;
 }
@@ -990,6 +1009,10 @@ select {
   width: 0.875rem;
   height: 0.875rem;
 }
+.size-32 {
+  width: 8rem;
+  height: 8rem;
+}
 .size-4 {
   width: 1rem;
   height: 1rem;
@@ -1014,6 +1037,10 @@ select {
   width: 50px;
   height: 50px;
 }
+.size-\[72px\] {
+  width: 72px;
+  height: 72px;
+}
 .size-full {
   width: 100%;
   height: 100%;
@@ -1075,6 +1102,10 @@ select {
 .h-\[34px\] {
   height: 34px;
 }
+.h-fit {
+  height: -moz-fit-content;
+  height: fit-content;
+}
 .h-full {
   height: 100%;
 }
@@ -1117,6 +1148,9 @@ select {
 .min-h-\[58px\] {
   min-height: 58px;
 }
+.min-h-\[calc\(100vh-2rem\)\] {
+  min-height: calc(100vh - 2rem);
+}
 .min-h-full {
   min-height: 100%;
 }
@@ -1159,9 +1193,6 @@ select {
 .w-8 {
   width: 2rem;
 }
-.w-80 {
-  width: 20rem;
-}
 .w-\[--trigger-width\] {
   width: var(--trigger-width);
 }
@@ -1198,6 +1229,9 @@ select {
 .w-\[56px\] {
   width: 56px;
 }
+.w-\[72px\] {
+  width: 72px;
+}
 .w-fit {
   width: -moz-fit-content;
   width: fit-content;
@@ -1236,6 +1270,9 @@ select {
 .max-w-\[280px\] {
   max-width: 280px;
 }
+.max-w-\[720px\] {
+  max-width: 720px;
+}
 .flex-1 {
   flex: 1 1 0%;
 }
@@ -1375,6 +1412,10 @@ select {
   -moz-column-gap: 0.5rem;
        column-gap: 0.5rem;
 }
+.gap-x-3 {
+  -moz-column-gap: 0.75rem;
+       column-gap: 0.75rem;
+}
 .gap-x-4 {
   -moz-column-gap: 1rem;
        column-gap: 1rem;
@@ -1456,6 +1497,9 @@ select {
 .rounded {
   border-radius: 0.25rem;
 }
+.rounded-\[inherit\] {
+  border-radius: inherit;
+}
 .rounded-full {
   border-radius: 9999px;
 }
@@ -1468,6 +1512,9 @@ select {
 .rounded-sm {
   border-radius: 0.125rem;
 }
+.rounded-xl {
+  border-radius: 0.75rem;
+}
 .rounded-l-full {
   border-top-left-radius: 9999px;
   border-bottom-left-radius: 9999px;
@@ -2040,6 +2087,10 @@ select {
   padding-top: 1.5rem;
   padding-bottom: 1.5rem;
 }
+.py-8 {
+  padding-top: 2rem;
+  padding-bottom: 2rem;
+}
 .py-\[2px\] {
   padding-top: 2px;
   padding-bottom: 2px;
@@ -2050,6 +2101,9 @@ select {
 .pb-4 {
   padding-bottom: 1rem;
 }
+.pb-\[280px\] {
+  padding-bottom: 280px;
+}
 .pl-1 {
   padding-left: 0.25rem;
 }
@@ -2059,6 +2113,9 @@ select {
 .pr-10 {
   padding-right: 2.5rem;
 }
+.pr-12 {
+  padding-right: 3rem;
+}
 .pr-2 {
   padding-right: 0.5rem;
 }
@@ -2101,6 +2158,9 @@ select {
 .text-\[10px\] {
   font-size: 10px;
 }
+.text-\[11px\] {
+  font-size: 11px;
+}
 .text-\[16px\] {
   font-size: 16px;
 }
@@ -2179,6 +2239,9 @@ select {
 .leading-\[19\.07px\] {
   line-height: 19.07px;
 }
+.leading-tight {
+  line-height: 1.25;
+}
 .tracking-wide {
   letter-spacing: 0.025em;
 }
@@ -2596,6 +2659,14 @@ select {
 .first-letter\:uppercase::first-letter {
   text-transform: uppercase;
 }
+.placeholder\:text-neutral-600::-moz-placeholder {
+  --tw-text-opacity: 1;
+  color: rgb(151 155 180 / var(--tw-text-opacity));
+}
+.placeholder\:text-neutral-600::placeholder {
+  --tw-text-opacity: 1;
+  color: rgb(151 155 180 / var(--tw-text-opacity));
+}
 .placeholder\:text-neutral-700::-moz-placeholder {
   --tw-text-opacity: 1;
   color: rgb(115 118 140 / var(--tw-text-opacity));
@@ -2796,6 +2867,11 @@ select {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(31 181 118 / var(--tw-ring-opacity));
 }
+.hover\:scale-110:hover {
+  --tw-scale-x: 1.1;
+  --tw-scale-y: 1.1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .hover\:border-primary-500:hover {
   --tw-border-opacity: 1;
   border-color: rgb(76 59 239 / var(--tw-border-opacity));
@@ -2982,6 +3058,10 @@ select {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(80 108 251 / var(--tw-ring-opacity));
 }
+.focus-visible\:ring-primary-400:focus-visible {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(121 108 250 / var(--tw-ring-opacity));
+}
 .focus-visible\:ring-primary-500:focus-visible {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(76 59 239 / var(--tw-ring-opacity));
@@ -3025,10 +3105,43 @@ select {
   --tw-bg-opacity: 1;
   background-color: rgb(42 22 218 / var(--tw-bg-opacity));
 }
+.data-\[disabled\]\:pointer-events-none[data-disabled] {
+  pointer-events: none;
+}
 .data-\[focus-visible\]\:size-6[data-focus-visible] {
   width: 1.5rem;
   height: 1.5rem;
 }
+.data-\[disabled\]\:cursor-not-allowed[data-disabled] {
+  cursor: not-allowed;
+}
+.data-\[disabled\]\:opacity-50[data-disabled] {
+  opacity: 0.5;
+}
+.data-\[focus-visible\]\:ring-2[data-focus-visible] {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.data-\[selected\]\:ring-2[data-selected] {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.data-\[focus-visible\]\:ring-black[data-focus-visible] {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));
+}
+.data-\[selected\]\:ring-primary-500[data-selected] {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(76 59 239 / var(--tw-ring-opacity));
+}
+.data-\[focus-visible\]\:ring-offset-1[data-focus-visible] {
+  --tw-ring-offset-width: 1px;
+}
+.data-\[selected\]\:ring-offset-2[data-selected] {
+  --tw-ring-offset-width: 2px;
+}
 .group[data-empty] .group-data-\[empty\]\:invisible {
   visibility: hidden;
 }
@@ -3041,6 +3154,14 @@ select {
   .sm\:block {
     display: block;
   }
+
+  .sm\:flex-row {
+    flex-direction: row;
+  }
+
+  .sm\:items-center {
+    align-items: center;
+  }
 }
 @media (min-width: 768px) {
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simpli-route/apollo-ds",
-  "version": "0.1.83",
+  "version": "0.1.85",
   "type": "module",
   "files": [
     "dist"
@@ -31,7 +31,8 @@
   "dependencies": {
     "@internationalized/date": "^3.10.0",
     "@react-stately/color": "^3.9.2",
-    "@simpli-route/react-icons": "^1.0.19",
+    "@simpli-route/icons": "^1.0.20",
+    "@simpli-route/react-icons": "^1.0.20",
     "@simpli-route/tailwind-preset": "^0.0.3",
     "@testing-library/user-event": "^14.5.2",
     "class-variance-authority": "^0.7.1",