Add files

src/renderer/components/segmented-control/index.tsx

@@ -0,0 +1,38 @@
+import { forwardRef } from 'react';
+import type { SegmentedControlProps as MantineSegmentedControlProps } from '@mantine/core';
+import { SegmentedControl as MantineSegmentedControl } from '@mantine/core';
+import styled from 'styled-components';
+
+type SegmentedControlProps = MantineSegmentedControlProps;
+
+const StyledSegmentedControl = styled(MantineSegmentedControl)<MantineSegmentedControlProps>`
+  & .mantine-SegmentedControl-label {
+    color: var(--input-fg);
+    font-family: var(--content-font-family);
+  }
+
+  background-color: var(--input-bg);
+
+  & .mantine-SegmentedControl-disabled {
+    opacity: 0.6;
+  }
+
+  & .mantine-SegmentedControl-active {
+    color: var(--input-active-fg);
+    background-color: var(--input-active-bg);
+  }
+`;
+
+export const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(
+  ({ ...props }: SegmentedControlProps, ref) => {
+    return (
+      <StyledSegmentedControl
+        ref={ref}
+        styles={{}}
+        transitionDuration={250}
+        transitionTimingFunction="linear"
+        {...props}
+      />
+    );
+  },
+);