Merge branch 'develop' into feat/mandatory-tags-v2

Author: shivani170

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.2.7-beta-2",
+    "version": "1.2.9",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",
@@ -66,6 +66,8 @@
         "react-toastify": "9.1.3",
         "sharp": "^0.33.5",
         "svgo": "^3.3.2",
+        "monaco-editor": "0.44.0",
+        "monaco-yaml": "5.1.1",
         "typescript": "5.5.4",
         "vite": "5.4.11",
         "vite-plugin-dts": "4.0.3",
@@ -80,8 +82,6 @@
         "@rjsf/validator-ajv8": "^5.13.3",
         "@typeform/embed-react": "2.20.0",
         "dompurify": "^3.0.2",
-        "monaco-editor": "0.44.0",
-        "monaco-yaml": "5.1.1",
         "react": "^17.0.2",
         "react-dom": "^17.0.2",
         "react-draggable": "^4.4.5",

package.json

@@ -0,0 +1,53 @@
+/*
+ * Copyright (c) 2024. Devtron Inc.
+ *
+ * Licensed 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 CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { OptionType } from '@Common/Types'
+import StyledRadioGroup from '../RadioGroup/RadioGroup'
+import { SegmentedControlProps, SegmentedControlVariant } from './types'
+
+const SegmentedControl = ({
+    tabs,
+    initialTab,
+    onChange,
+    tooltips,
+    disabled = false,
+    rootClassName = '',
+    name,
+    variant = SegmentedControlVariant.WHITE_ON_GRAY,
+}: SegmentedControlProps) => (
+    <StyledRadioGroup
+        className={`${variant} ${rootClassName}`}
+        onChange={onChange}
+        initialTab={initialTab}
+        name={name}
+        disabled={disabled}
+    >
+        {tabs.map((tab: OptionType, index) => (
+            <StyledRadioGroup.Radio
+                value={tab.value}
+                key={tab.value}
+                className="fs-12 cn-7 fw-6 lh-20"
+                showTippy={!!tooltips?.[index]}
+                tippyContent={tooltips?.[index] ?? ''}
+                dataTestId={`${name}-${tab.value}`}
+            >
+                {tab.label}
+            </StyledRadioGroup.Radio>
+        ))}
+    </StyledRadioGroup>
+)
+
+export default SegmentedControl

src/Common/SegmentedControl/SegmentedControl.component.tsx

@@ -0,0 +1,2 @@
+export { type SegmentedControlProps, SegmentedControlVariant } from './types'
+export { default as SegmentedControl } from './SegmentedControl.component'