@nypl/design-system-react-components 2.0.0 → 2.0.1

package/dist/src/theme/components/skipNavigation.d.ts

@@ -0,0 +1,28 @@
+declare const SkipNavigation: {
+    baseStyle: {
+        ul: {
+            margin: string;
+        };
+        a: {
+            backgroundColor: string;
+            height: string;
+            left: string;
+            overflow: string;
+            position: string;
+            top: string;
+            width: string;
+            _focus: {
+                height: string;
+                left: string;
+                paddingX: string;
+                paddingY: string;
+                top: string;
+                width: string;
+            };
+            _dark: {
+                backgroundColor: string;
+            };
+        };
+    };
+};
+export default SkipNavigation;

package/dist/src/theme/components/slider.d.ts

@@ -0,0 +1,78 @@
+interface CustomSliderBaseStyle {
+    isDarkMode: boolean;
+    isDisabled: boolean;
+    isInvalid: boolean;
+    showBoxes: boolean;
+    showValues: boolean;
+}
+declare const CustomSlider: {
+    parts: string[];
+    baseStyle: ({ isDarkMode, isDisabled, isInvalid, showBoxes, showValues, }: CustomSliderBaseStyle) => {
+        container: {
+            display: string;
+            alignItems: string;
+        };
+        leftValue: {
+            color: string;
+            _dark: {
+                color: string;
+            };
+            marginTop: string;
+            marginBottom: string;
+            marginEnd: string;
+            marginStart: string;
+        };
+        rightValue: {
+            marginStart: string;
+            marginEnd: string;
+            color: string;
+            _dark: {
+                color: string;
+            };
+            marginTop: string;
+            marginBottom: string;
+        };
+        textInput: {
+            minWidth: string;
+        };
+        sliderContainer: {
+            marginStart: string;
+            marginEnd: string;
+        };
+        filledTrack: {
+            bgColor: string;
+        };
+        track: {
+            bgColor: string;
+            _disabled: {
+                bgColor: string;
+            };
+            _dark: {
+                bgColor: string;
+                _disabled: {
+                    bgColor: string;
+                };
+            };
+        };
+        thumb: {
+            border: string;
+            borderColor: string;
+            boxShadow: string;
+            _active: {
+                transform: string;
+            };
+            _disabled: {
+                bgColor: string;
+                borderColor: string;
+            };
+            _dark: {
+                bgColor: string;
+                _disabled: {
+                    bgColor: string;
+                    borderColor: string;
+                };
+            };
+        };
+    };
+};
+export default CustomSlider;

package/dist/src/theme/components/socialmedialinks.d.ts

@@ -0,0 +1,192 @@
+import { StyleFunctionProps } from "@chakra-ui/theme-tools";
+declare const SocialMediaLinks: {
+    baseStyle: {
+        display: string;
+        alignItems: string;
+        gap: string;
+        width: {
+            base: string;
+            md: string;
+        };
+        marginBottom: string;
+        li: {
+            marginInlineEnd: string;
+            marginTop: string;
+            width: {
+                base: string;
+                md: string;
+            };
+            _notFirst: {
+                marginTop: string;
+            };
+        };
+        a: {
+            display: string;
+            justifyContent: string;
+            alignContent: string;
+            flexWrap: string;
+            minWidth: {
+                base: string;
+                md: string;
+            };
+            minHeight: {
+                base: string;
+                md: string;
+            };
+            fontStyle: string;
+            fontSize: string;
+            textDecoration: string;
+            color: string;
+            _hover: {
+                color: string;
+            };
+            _visited: {
+                color: string;
+            };
+            _dark: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+            };
+        };
+        div: {
+            display: string;
+            alignItems: string;
+            gap: string;
+            alignSelf: string;
+            justifyContent: string;
+            width: string;
+            height: string;
+        };
+        svg: {
+            fill: string;
+            _dark: {
+                fill: string;
+            };
+        };
+    };
+    variants: {
+        straight(props: StyleFunctionProps): {
+            flexDirection: {
+                base: string;
+                md: any;
+            };
+            gap: string;
+            a: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+                _dark: {
+                    borderColor: string;
+                    color: string;
+                    _hover: {
+                        color: string;
+                    };
+                    _visited: {
+                        color: string;
+                    };
+                };
+            };
+            div: {
+                padding: string;
+                borderRadius: string;
+                borderWidth: string;
+                borderStyle: string;
+                borderColor: string;
+                _dark: {
+                    borderColor: string;
+                };
+            };
+            svg: {
+                fill: string;
+                _dark: {
+                    fill: string;
+                    borderColor: string;
+                };
+            };
+        };
+        circular(props: StyleFunctionProps): {
+            flexDirection: {
+                base: string;
+                md: any;
+            };
+            gap: string;
+            a: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+                _dark: {
+                    color: string;
+                    _hover: {
+                        color: string;
+                    };
+                    _visited: {
+                        color: string;
+                    };
+                };
+            };
+            div: {
+                padding: string;
+                borderRadius: string;
+                borderColor: string;
+                borderWidth: string;
+                borderStyle: string;
+                _dark: {
+                    borderColor: string;
+                };
+            };
+            svg: {
+                fill: string;
+                _dark: {
+                    fill: string;
+                };
+            };
+        };
+        none(props: StyleFunctionProps): {
+            flexDirection: {
+                base: string;
+                md: any;
+            };
+            a: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+                _dark: {
+                    color: string;
+                    _hover: {
+                        color: string;
+                    };
+                    _visited: {
+                        color: string;
+                    };
+                };
+            };
+            svg: {
+                fill: string;
+                _dark: {
+                    fill: string;
+                };
+            };
+        };
+    };
+    defaultProps: {
+        variant: string;
+    };
+};
+export default SocialMediaLinks;

package/dist/src/theme/components/statusBadge.d.ts

@@ -0,0 +1,37 @@
+declare const StatusBadge: {
+    baseStyle: {
+        borderRadius: string;
+        color: string;
+        display: string;
+        fontSize: string;
+        fontStyle: string;
+        py: string;
+        px: string;
+        textAlign: string;
+        width: string;
+        _dark: {
+            backgroundColor: string;
+            borderLeft: string;
+            borderColor: string;
+            color: string;
+        };
+    };
+    variants: {
+        low: {
+            bg: string;
+        };
+        medium: {
+            bg: string;
+            _dark: {
+                borderColor: string;
+            };
+        };
+        high: {
+            bg: string;
+            _dark: {
+                borderColor: string;
+            };
+        };
+    };
+};
+export default StatusBadge;