diff --git a/VDSSample.xcodeproj/project.pbxproj b/VDSSample.xcodeproj/project.pbxproj
index 6bb1d06..4d16f0b 100644
--- a/VDSSample.xcodeproj/project.pbxproj
+++ b/VDSSample.xcodeproj/project.pbxproj
@@ -48,6 +48,7 @@
 		EA3C3BB528996775000CA526 /* StoryboardInitable.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3C3BB128996775000CA526 /* StoryboardInitable.swift */; };
 		EA3C3BB628996775000CA526 /* MenuViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3C3BB228996775000CA526 /* MenuViewController.swift */; };
 		EA3C3BB728996775000CA526 /* ToggleViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA3C3BB328996775000CA526 /* ToggleViewController.swift */; };
+		EA471F402A97BEAA00CE9E58 /* CustomRotorable.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA471F3F2A97BEAA00CE9E58 /* CustomRotorable.swift */; };
 		EA4DB30428DCD25B00103EE3 /* BadgeViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA4DB30328DCD25B00103EE3 /* BadgeViewController.swift */; };
 		EA596ABA2A16B2ED00300C4B /* TabsViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA596AB92A16B2ED00300C4B /* TabsViewController.swift */; };
 		EA5E3050294D11540082B959 /* TileContainerViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA5E304F294D11540082B959 /* TileContainerViewController.swift */; };
@@ -144,6 +145,7 @@
 		EA3C3BB128996775000CA526 /* StoryboardInitable.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = StoryboardInitable.swift; sourceTree = "<group>"; };
 		EA3C3BB228996775000CA526 /* MenuViewController.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = MenuViewController.swift; sourceTree = "<group>"; };
 		EA3C3BB328996775000CA526 /* ToggleViewController.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ToggleViewController.swift; sourceTree = "<group>"; };
+		EA471F3F2A97BEAA00CE9E58 /* CustomRotorable.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = CustomRotorable.swift; sourceTree = "<group>"; };
 		EA4DB30328DCD25B00103EE3 /* BadgeViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = BadgeViewController.swift; sourceTree = "<group>"; };
 		EA596AB92A16B2ED00300C4B /* TabsViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TabsViewController.swift; sourceTree = "<group>"; };
 		EA5E304F294D11540082B959 /* TileContainerViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TileContainerViewController.swift; sourceTree = "<group>"; };
@@ -294,6 +296,7 @@
 		EAF7F07E28996A0700B287F5 /* Protocols */ = {
 			isa = PBXGroup;
 			children = (
+				EA471F3F2A97BEAA00CE9E58 /* CustomRotorable.swift */,
 				EA3C3BB028996775000CA526 /* PickerBase.swift */,
 				EA3C3BB128996775000CA526 /* StoryboardInitable.swift */,
 			);
@@ -498,6 +501,7 @@
 				445BA07A29C088470036A7C5 /* NotificationViewController.swift in Sources */,
 				EAF7F11A28A14A0E00B287F5 /* RadioButtonGroupViewController.swift in Sources */,
 				EA89204628B66CE2006B9984 /* ScrollViewController.swift in Sources */,
+				EA471F402A97BEAA00CE9E58 /* CustomRotorable.swift in Sources */,
 				EA3C3B9F289966EF000CA526 /* SceneDelegate.swift in Sources */,
 				EA0D1C332A673FD400E5C127 /* RadioButtonItemViewController.swift in Sources */,
 				5FC35BE928D5235A004EBEAC /* ButtonViewController.swift in Sources */,
@@ -679,7 +683,7 @@
 				ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = NO;
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 39;
+				CURRENT_PROJECT_VERSION = 40;
 				DEVELOPMENT_TEAM = FCMA4QKS77;
 				GENERATE_INFOPLIST_FILE = YES;
 				INFOPLIST_FILE = VDSSample/Info.plist;
@@ -711,7 +715,7 @@
 				ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = NO;
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 39;
+				CURRENT_PROJECT_VERSION = 40;
 				DEVELOPMENT_TEAM = FCMA4QKS77;
 				GENERATE_INFOPLIST_FILE = YES;
 				INFOPLIST_FILE = VDSSample/Info.plist;
diff --git a/VDSSample/Protocols/CustomRotorable.swift b/VDSSample/Protocols/CustomRotorable.swift
new file mode 100644
index 0000000..66c64e8
--- /dev/null
+++ b/VDSSample/Protocols/CustomRotorable.swift
@@ -0,0 +1,101 @@
+//
+//  AccessibilityCustomRotorable.swift
+//  VDS
+//
+//  Created by Matt Bruce on 8/24/23.
+//
+
+import Foundation
+import UIKit
+
+public protocol CustomRotorable: UIViewController {
+    var customRotors: [CustomRotorType] { get set }
+}
+
+extension CustomRotorable {
+    
+    /// Adds CustomRotor to the accessibilityCustomRotors array.
+    /// - Parameters:
+    ///   - name: Name that will show up in the Rotor picker.
+    ///   - trait: Any UIView that has this traits will be added to this Name.
+    internal func addCustomRotor(with name: String, for trait: UIAccessibilityTraits) {
+        //filter out old rotors with same name
+        accessibilityCustomRotors = (accessibilityCustomRotors ?? []).filter { $0.name != name }
+        
+        //create new rotor
+        let newRotor = UIAccessibilityCustomRotor(name: name) { [weak self] predicate in
+            guard let self else { return nil }
+            
+            let views = self.view.accessibleElements(with: trait)
+            
+            guard !views.isEmpty else { return nil }
+
+            let currentIndex = views.firstIndex(where: { $0 === predicate.currentItem.targetElement })
+            let count = views.count
+            
+            //find the nextIndex
+            let nextIndex: Int
+            switch predicate.searchDirection {
+            case .next:
+                if let currentIndex, currentIndex != count - 1{
+                    //go forwards
+                    nextIndex = currentIndex + 1
+                } else {
+                    //get the first
+                    nextIndex = 0
+                }
+            case .previous:
+                if let currentIndex, currentIndex != 0 {
+                    //go backwards
+                    nextIndex = currentIndex - 1
+                } else {
+                    //get the last
+                    nextIndex = count - 1
+                }
+            @unknown default:
+                //get the first
+                nextIndex = 0
+            }
+            
+            return UIAccessibilityCustomRotorItemResult(targetElement: views[nextIndex], targetRange: nil)
+        }
+        
+        //append rotor
+        accessibilityCustomRotors?.append(newRotor)
+    }
+        
+    /// Loads all of the custom rotors for the screen.
+    public func loadCustomRotors() {
+        customRotors.forEach { addCustomRotor(with: $0.name, for: $0.trait) }
+    }
+}
+
+public extension UIView {
+    
+    /// Gets all of the Views that has the matching accessibilityTrait.
+    /// - Parameter trait: This is the trailt for the accessibilityTrait property of a view.
+    /// - Returns: An array of RotorItemResult
+    func accessibleElements(with trait: UIAccessibilityTraits) -> [UIView] {
+        var elements: [UIView] = []
+        
+        //add your self if you meet the requirements
+        if isAccessibilityElement, accessibilityTraits.contains(trait) {
+            elements.append(self)
+        }
+        
+        //loop through your subviews
+        subviews.forEach { elements.append(contentsOf: $0.accessibleElements(with: trait)) }
+        
+        return elements
+    }
+}
+
+public struct CustomRotorType {
+    public var name: String
+    public var trait: UIAccessibilityTraits
+
+    public init(name: String, trait: UIAccessibilityTraits) {
+        self.name = name
+        self.trait = trait
+    }
+}
diff --git a/VDSSample/ViewControllers/BadgeIndicatorViewController.swift b/VDSSample/ViewControllers/BadgeIndicatorViewController.swift
index 20ef79c..b9336a5 100644
--- a/VDSSample/ViewControllers/BadgeIndicatorViewController.swift
+++ b/VDSSample/ViewControllers/BadgeIndicatorViewController.swift
@@ -211,3 +211,14 @@ class  BadgeIndicatorViewController: BaseViewController<BadgeIndicator> {
         }
     }
 }
+
+extension BadgeIndicatorViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.fillColor = .red
+        component.number = 23
+        component.kind = .simple
+        component.size = .medium
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/BadgeViewController.swift b/VDSSample/ViewControllers/BadgeViewController.swift
index 7025673..3e37bd9 100644
--- a/VDSSample/ViewControllers/BadgeViewController.swift
+++ b/VDSSample/ViewControllers/BadgeViewController.swift
@@ -108,13 +108,13 @@ class  BadgeViewController: BaseViewController<Badge> {
     }
 }
 
-extension BadgeViewController: Componentable {
-    static func getComponent() -> TestViewWrapper {
+extension BadgeViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
         let component = Self.makeComponent()
         component.fillColor = .red
         component.text = "Terms and conditions"
         component.maxWidth = 70
         component.numberOfLines = 3
-        return TestViewWrapper(component: component, isTrailing: true)
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
     }
 }
diff --git a/VDSSample/ViewControllers/BaseViewController.swift b/VDSSample/ViewControllers/BaseViewController.swift
index 3aadef4..1449e03 100644
--- a/VDSSample/ViewControllers/BaseViewController.swift
+++ b/VDSSample/ViewControllers/BaseViewController.swift
@@ -66,7 +66,7 @@ public class FormSection: UIStackView {
     }
 }
 
-public class BaseViewController<Component: UIView>: UIViewController, Initable {
+public class BaseViewController<Component: UIView>: UIViewController, Initable , CustomRotorable {
     deinit {
         print("\(Self.self) deinit")
     }
@@ -81,6 +81,11 @@ public class BaseViewController<Component: UIView>: UIViewController, Initable {
     // MARK: - Combine Properties
     //--------------------------------------------------
     public var subscribers = Set<AnyCancellable>()
+    
+    public var customRotors: [CustomRotorType] = [
+        CustomRotorType(name: "Links", trait: .link),
+        CustomRotorType(name: "Buttons", trait: .button)
+    ]
 
     //--------------------------------------------------
     // MARK: - Properties
@@ -117,6 +122,7 @@ public class BaseViewController<Component: UIView>: UIViewController, Initable {
             setup()
             contentTopView.backgroundColor = Surface.light.color
         }
+        
     }
     
     public lazy var surfacePickerSelectorView = {
@@ -229,6 +235,8 @@ public class BaseViewController<Component: UIView>: UIViewController, Initable {
                 self?.activeTextField?.resignFirstResponder()
                 self?.activeTextField = nil
         }.store(in: &subscribers)
+        
+        loadCustomRotors()
     }
     
     func isViewHiddenByKeyboard(view: UIView, keyboardFrame: CGRect) -> Bool {
diff --git a/VDSSample/ViewControllers/ButtonGroupViewController.swift b/VDSSample/ViewControllers/ButtonGroupViewController.swift
index 7a63b3f..ce8325e 100644
--- a/VDSSample/ViewControllers/ButtonGroupViewController.swift
+++ b/VDSSample/ViewControllers/ButtonGroupViewController.swift
@@ -118,10 +118,10 @@ class ButtonGroupViewController: BaseViewController<ButtonGroup> {
         addFormRow(label: "Percentage (1-100)", view: percentageTextField)
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.largeLabel.disabled = sender.isOn
-            self?.smallLabel.disabled = sender.isOn
-            self?.component.disabled = sender.isOn
-            self?.smallButtonGroup.disabled = sender.isOn
+            self?.largeLabel.isEnabled = !sender.isOn
+            self?.smallLabel.isEnabled = !sender.isOn
+            self?.component.isEnabled = !sender.isOn
+            self?.smallButtonGroup.isEnabled = !sender.isOn
         }
 
         widthTextField
@@ -156,7 +156,7 @@ class ButtonGroupViewController: BaseViewController<ButtonGroup> {
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
         buttonPositionSelectorView.text = component.buttonPosition.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         rowQuantitySelectorView.text = RowQuantity(quantity: component.rowQuantity).rawValue
         widthTextField.text = ""
     }
@@ -198,3 +198,19 @@ class ButtonGroupViewController: BaseViewController<ButtonGroup> {
         }
     }
 }
+
+extension ButtonGroupViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        let onClick: (ButtonBase) -> Void = { button in print("\(button.text!) clicked")}
+        component.buttons = [
+            Button().with{ $0.use = .secondary; $0.text = "Secondary"; $0.onClick =  onClick},
+            Button().with{ $0.use = .primary; $0.text = "Primary"; $0.onClick =  onClick },
+            TextLink().with { $0.size = .large; $0.text = "Large Text Link"; $0.onClick =  onClick },
+            TextLink().with { $0.text = "Widge Label Button"; $0.onClick =  onClick },
+            TextLinkCaret().with { $0.text = "Text Link Caret"; $0.onClick =  onClick}
+        ]
+
+        return ComponentSample(component: component)
+    }
+}
diff --git a/VDSSample/ViewControllers/ButtonIconViewController.swift b/VDSSample/ViewControllers/ButtonIconViewController.swift
index 6f31c6b..e055285 100644
--- a/VDSSample/ViewControllers/ButtonIconViewController.swift
+++ b/VDSSample/ViewControllers/ButtonIconViewController.swift
@@ -75,7 +75,7 @@ class ButtonIconViewController: BaseViewController<ButtonIcon> {
         addFormRow(label: "Y Offset", view: centerY)
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         component.onClickActionPublisher("ButtonIcon", label: actionLabel)
@@ -121,7 +121,7 @@ class ButtonIconViewController: BaseViewController<ButtonIcon> {
         kindPickerSelectorView.text = component.kind.rawValue
         sizePickerSelectorView.text = component.size.rawValue
         namePickerSelectorView.text = name.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
     }
     
     func updateOffset() {
@@ -169,3 +169,12 @@ extension UITextField {
         return CGFloat(double)
     }
 }
+
+extension ButtonIconViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.iconName = .addToFavorite
+        component.size = .large
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/ButtonViewController.swift b/VDSSample/ViewControllers/ButtonViewController.swift
index e6ba980..d43f9ec 100644
--- a/VDSSample/ViewControllers/ButtonViewController.swift
+++ b/VDSSample/ViewControllers/ButtonViewController.swift
@@ -49,7 +49,7 @@ class ButtonViewController: BaseViewController<Button> {
         
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         textField
@@ -73,7 +73,7 @@ class ButtonViewController: BaseViewController<Button> {
         component.labelPublisher(label)
         
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         textField.text = component.text
         usePickerSelectorView.text = component.use.rawValue
         widthTextField.text = ""
@@ -98,3 +98,14 @@ class ButtonViewController: BaseViewController<Button> {
         }
     }
 }
+
+extension ButtonViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.text = "Try me"
+        component.onClick = { c in print("\(c.text!) Click")}
+        component.use = .primary
+        component.size = .large
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/CheckBoxGroupViewController.swift b/VDSSample/ViewControllers/CheckBoxGroupViewController.swift
index 10245e5..4255972 100644
--- a/VDSSample/ViewControllers/CheckBoxGroupViewController.swift
+++ b/VDSSample/ViewControllers/CheckBoxGroupViewController.swift
@@ -42,7 +42,7 @@ class  CheckboxGroupViewController: BaseViewController<CheckboxGroup> {
         }
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         labelTextField
@@ -96,7 +96,7 @@ class  CheckboxGroupViewController: BaseViewController<CheckboxGroup> {
 
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         labelTextField.text = checkbox1.labelText
         childTextField.text = checkbox1.childText
         showErrorSwitch.isOn = component.showError
@@ -115,4 +115,29 @@ class  CheckboxGroupViewController: BaseViewController<CheckboxGroup> {
         }
     }
 
+    
+}
+
+extension CheckboxGroupViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+
+        var checkbox1 = CheckboxGroup.CheckboxModel()
+        checkbox1.inputId = "model1"
+        checkbox1.value = "model 1 Value"
+        checkbox1.labelText = "iPhone 11 Bundle 1"
+        checkbox1.childText = "Apple iPhone 11 - 64 GB\nOtterbox Case Red\nScreen Protector"
+        checkbox1.errorText = "Please Choose 1"
+
+        var checkbox2 = CheckboxGroup.CheckboxModel()
+        checkbox2.inputId = "model2"
+        checkbox2.value = "model 2 Value"
+        checkbox2.labelText = "iPhone 11 Bundle 2"
+        checkbox2.childText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
+        checkbox2.errorText = "Please Choose 2"
+
+        component.selectorModels = [checkbox1, checkbox2]
+
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
 }
diff --git a/VDSSample/ViewControllers/CheckboxItemViewController.swift b/VDSSample/ViewControllers/CheckboxItemViewController.swift
index 58b45f9..a25c6f3 100644
--- a/VDSSample/ViewControllers/CheckboxItemViewController.swift
+++ b/VDSSample/ViewControllers/CheckboxItemViewController.swift
@@ -46,7 +46,7 @@ class  CheckboxItemViewController: BaseViewController<CheckboxItem> {
         }
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         labelTextField
@@ -77,7 +77,7 @@ class  CheckboxItemViewController: BaseViewController<CheckboxItem> {
                 
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         labelTextField.text = component.labelText
         childTextField.text = component.childText
         showErrorSwitch.isOn = component.showError
@@ -94,3 +94,13 @@ class  CheckboxItemViewController: BaseViewController<CheckboxItem> {
     }
 }
 
+extension CheckboxItemViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.labelText = "Terms and conditions"
+        component.childText = "I agree to Verizon's terms and conditions click here"
+        component.errorText = "Error Text"
+
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/CheckboxViewController.swift b/VDSSample/ViewControllers/CheckboxViewController.swift
index f61bcf1..f11f4c1 100644
--- a/VDSSample/ViewControllers/CheckboxViewController.swift
+++ b/VDSSample/ViewControllers/CheckboxViewController.swift
@@ -39,7 +39,7 @@ class  CheckboxViewController: BaseViewController<Checkbox> {
         }
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         component.onChangeActionPublisher("Checkbox", label: actionLabel)
@@ -48,7 +48,7 @@ class  CheckboxViewController: BaseViewController<Checkbox> {
     func setupModel() {
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         showErrorSwitch.isOn = component.showError
         
     }
@@ -61,3 +61,10 @@ class  CheckboxViewController: BaseViewController<Checkbox> {
         }
     }
 }
+
+extension CheckboxViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/IconViewController.swift b/VDSSample/ViewControllers/IconViewController.swift
index 9b4387b..692663c 100644
--- a/VDSSample/ViewControllers/IconViewController.swift
+++ b/VDSSample/ViewControllers/IconViewController.swift
@@ -87,3 +87,15 @@ class IconViewController: BaseViewController<Icon> {
         }
     }
 }
+
+extension IconViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        let name = Icon.Name.accessibility
+        let color = UIColor.VDSColor.paletteBlack
+        component.color = color.uiColor
+        component.name = name
+        component.customSize = 50
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual, bottomPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/InputFieldViewController.swift b/VDSSample/ViewControllers/InputFieldViewController.swift
index b96cc2d..e1e81b7 100644
--- a/VDSSample/ViewControllers/InputFieldViewController.swift
+++ b/VDSSample/ViewControllers/InputFieldViewController.swift
@@ -75,7 +75,7 @@ class  InputFieldViewController: BaseViewController<InputField> {
         }
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         labelTextField
@@ -139,7 +139,7 @@ class  InputFieldViewController: BaseViewController<InputField> {
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
         helperTextPlacementPickerSelectorView.text = component.helperTextPlacement.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         requiredSwitch.isOn = component.required
         labelTextField.text = component.labelText
         helperTextField.text = component.helperText
@@ -167,3 +167,18 @@ class  InputFieldViewController: BaseViewController<InputField> {
     }
 }
 
+
+extension InputFieldViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.type = .text
+        component.width = 328
+        component.labelText = "Street Address"
+        component.helperText = "For example: 123 Verizon St"
+        component.errorText = "Enter a valid address."
+        component.successText = "Good job entering a valid address!"
+        component.tooltipTitle = "Check the formatting of your address"
+        component.tooltipContent = "House/Building number then street name"
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/LabelViewController.swift b/VDSSample/ViewControllers/LabelViewController.swift
index 1910a2e..adcc1d9 100644
--- a/VDSSample/ViewControllers/LabelViewController.swift
+++ b/VDSSample/ViewControllers/LabelViewController.swift
@@ -52,35 +52,12 @@ class LabelViewController: BaseViewController<Label> {
     var scaledMode: Bool { component.useScaledFont && TextStyle.canScaleFonts }
     var baseStyle: TextStyle! {
         didSet {
-            baseStyleLabel.text = descriptionFor(style: baseStyle)
+            baseStyleLabel.text = descriptionFor(style: baseStyle,
+                                                 useScaledLineHeight: useScaledLineHeight.isOn,
+                                                 scaledMode: scaledMode)
         }
     }
-    
-    func descriptionFor(style: TextStyle) -> String {
-        let scaledFont = style.font.scaledFont
-        var customizedDesc: String = "Name: \(style.rawValue) \nFont Face-Weight: \(style.font.fontName)"
-        customizedDesc += "\nVDS LetterSpacing: \(style.letterSpacing)"
-        if scaledMode {
-            customizedDesc += "\nVDS PointSize: \(style.pointSize.rounded())"
-            customizedDesc += "\n* iOS PointSize: \(scaledFont.pointSize.rounded())"
-        } else {
-            customizedDesc += "\n* VDS PointSize: \(style.pointSize.rounded())"
-        }
-        if scaledMode {
-            if useScaledLineHeight.isOn {
-                customizedDesc += "\nVDS LineHeight: \(style.lineHeight)"
-                customizedDesc += "\n* VDS Ratio LineHeight: \(style.scaledLineHeight)"
-            } else {
-                customizedDesc += "\n* VDS LineHeight: \(style.lineHeight)"
-            }
-            customizedDesc += "\niOS LineHeight: \(scaledFont.lineHeight.rounded())"
-        } else {
-            customizedDesc += "\n* VDS LineHeight: \(style.lineHeight)"
-            customizedDesc += "\niOS LineHeight: \(style.font.lineHeight.rounded())"
-        }
-        return customizedDesc
-    }
-        
+            
     var currentStyle: TextStyle! {
         didSet {
             //--------------------------------------------------------------
@@ -106,8 +83,13 @@ class LabelViewController: BaseViewController<Label> {
     private var isBold: Bool = false
     
     fileprivate func updateStyleLabel() {
-        baseStyleLabel.text = descriptionFor(style: baseStyle)
-        currentStyleLabel.text = descriptionFor(style: currentStyle)
+        baseStyleLabel.text = descriptionFor(style: baseStyle,
+                                             useScaledLineHeight: useScaledLineHeight.isOn,
+                                             scaledMode: scaledMode)
+                                             
+        currentStyleLabel.text = descriptionFor(style: currentStyle,
+                                                useScaledLineHeight: useScaledLineHeight.isOn,
+                                                scaledMode: scaledMode)
     }
 
     override func setup() {
@@ -122,7 +104,29 @@ class LabelViewController: BaseViewController<Label> {
     
     override func viewDidLoad() {
         super.viewDidLoad()
-        addContentTopView(view: component)
+        
+
+        let fullText = "Here is a sample of text that has an inline text link that you can click on!"
+        let linkText = "inline text link"
+
+        let sampleLabel = Label()
+        sampleLabel.textStyle = .titleLarge
+        sampleLabel.text = fullText
+        
+        if let link = ActionLabelAttribute(text: fullText, linkText: linkText) {
+            link.action.sink { [weak self] in
+                print("Clicked \(linkText)")
+                self?.present(UIAlertController(title: "TextLink", message: "Clicked \(linkText)", preferredStyle: .alert).with{ $0.addAction(.init(title: "OK", style: .default)) }, animated: true)
+            }.store(in: &subscribers)
+            sampleLabel.attributes = [link]
+        }
+        
+        let stack = UIStackView(arrangedSubviews: [component, sampleLabel])
+        stack.spacing = 10
+        stack.axis = .vertical
+        
+        
+        addContentTopView(view: stack)
         setupPicker()
         setupModel()
     }
@@ -154,8 +158,9 @@ class LabelViewController: BaseViewController<Label> {
         addFormRow(label: "Text Size", view: textSizePickerSelectorView)
         addFormRow(label: "Text", view: textField)
         
+        
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         boldSwitch
@@ -253,6 +258,7 @@ class LabelViewController: BaseViewController<Label> {
             self?.calculatedLabel.text = "Actual height (* LineHeight x Text Lines): \(rect.height)"
         }.store(in: &subscribers)
         
+    
         //------------------------------------
     }
         
@@ -261,7 +267,7 @@ class LabelViewController: BaseViewController<Label> {
         
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         boldSwitch.isOn = isBold
         textField.text = component.text
         
@@ -340,3 +346,40 @@ extension Slider {
         CGFloat((value * 100).rounded() / 100)
     }
 }
+
+
+extension LabelViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.text = "Helg¹ worldg Hell¹ worldg"
+        return ComponentSample(component: component)
+    }
+}
+
+extension BaseViewController {
+    func descriptionFor(style: TextStyle, useScaledLineHeight: Bool = false, scaledMode: Bool = false) -> String {
+        let scaledFont = style.font.scaledFont
+        var customizedDesc: String = "Name: \(style.rawValue) \nFont Face-Weight: \(style.font.fontName)"
+        customizedDesc += "\nVDS LetterSpacing: \(style.letterSpacing)"
+        if scaledMode {
+            customizedDesc += "\nVDS PointSize: \(style.pointSize.rounded())"
+            customizedDesc += "\n* iOS PointSize: \(scaledFont.pointSize.rounded())"
+        } else {
+            customizedDesc += "\n* VDS PointSize: \(style.pointSize.rounded())"
+        }
+        if scaledMode {
+            if useScaledLineHeight {
+                customizedDesc += "\nVDS LineHeight: \(style.lineHeight)"
+                customizedDesc += "\n* VDS Ratio LineHeight: \(style.scaledLineHeight)"
+            } else {
+                customizedDesc += "\n* VDS LineHeight: \(style.lineHeight)"
+            }
+            customizedDesc += "\niOS LineHeight: \(scaledFont.lineHeight.rounded())"
+        } else {
+            customizedDesc += "\n* VDS LineHeight: \(style.lineHeight)"
+            customizedDesc += "\niOS LineHeight: \(style.font.lineHeight.rounded())"
+        }
+        return customizedDesc
+    }
+
+}
diff --git a/VDSSample/ViewControllers/LineViewController.swift b/VDSSample/ViewControllers/LineViewController.swift
index 5444fe7..d98c44a 100644
--- a/VDSSample/ViewControllers/LineViewController.swift
+++ b/VDSSample/ViewControllers/LineViewController.swift
@@ -40,3 +40,10 @@ class LineViewController: BaseViewController<Line> {
         }
     }
 }
+
+extension LineViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        return ComponentSample(component: component)
+    }
+}
diff --git a/VDSSample/ViewControllers/LoaderViewController.swift b/VDSSample/ViewControllers/LoaderViewController.swift
index 4fa488c..840b337 100644
--- a/VDSSample/ViewControllers/LoaderViewController.swift
+++ b/VDSSample/ViewControllers/LoaderViewController.swift
@@ -82,3 +82,10 @@ class LoaderViewController: BaseViewController<Loader>, LoaderLaunchable {
         }
     }
 }
+
+extension LoaderViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        return ComponentSample(component: component)
+    }
+}
diff --git a/VDSSample/ViewControllers/NotificationViewController.swift b/VDSSample/ViewControllers/NotificationViewController.swift
index f80e5c0..3c8737e 100644
--- a/VDSSample/ViewControllers/NotificationViewController.swift
+++ b/VDSSample/ViewControllers/NotificationViewController.swift
@@ -145,3 +145,21 @@ class NotificationViewController: BaseViewController<VDS.Notification> {
         }
     }
 }
+
+extension NotificationViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        
+        let titleDefaultText =  "This is title"
+        let subtitleDefaultText = "This is subtitle"
+        let firstButtonDefaultText = "Button 1"
+        let secondButtonDefaultText = "Button 2"
+
+        component.title = titleDefaultText
+        component.subTitle = subtitleDefaultText
+        component.primaryButtonModel = .init(text: firstButtonDefaultText, onClick: {b in print("\(b.text!) click")})
+        component.secondaryButtonModel = .init(text: secondButtonDefaultText, onClick: {b in print("\(b.text!) click")})
+        component.onCloseClick = {_ in print("notification on close click")}
+        return ComponentSample(component: component)
+    }
+}
diff --git a/VDSSample/ViewControllers/RadioBoxGroupViewController.swift b/VDSSample/ViewControllers/RadioBoxGroupViewController.swift
index 0307fbc..1c0b939 100644
--- a/VDSSample/ViewControllers/RadioBoxGroupViewController.swift
+++ b/VDSSample/ViewControllers/RadioBoxGroupViewController.swift
@@ -39,7 +39,7 @@ class  RadioBoxGroupViewController: BaseViewController<RadioBoxGroup>{
         addFormRow(label: "Sub Text Right", view: subTextRightField)
 
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         strikeThroughSwitch.onChange = { [weak self] sender in
@@ -90,7 +90,7 @@ class  RadioBoxGroupViewController: BaseViewController<RadioBoxGroup>{
         
         //set UI values
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         textField.text = radioBox1.text
         subTextField.text = radioBox1.subText
         subTextRightField.text = radioBox1.subTextRight
@@ -110,3 +110,27 @@ class  RadioBoxGroupViewController: BaseViewController<RadioBoxGroup>{
         
     }
 }
+
+extension RadioBoxGroupViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+
+        var radioBox1 = RadioBoxGroup.RadioBoxModel()
+        radioBox1.inputId = "model1"
+        radioBox1.selected = true
+        radioBox1.value = "model 1 Value"
+        radioBox1.text = "iPhone 11 Bundle 1"
+        radioBox1.subText = "Apple iPhone 11 - 64 GB\nOtterbox Case Red\nScreen Protector"
+        radioBox1.subTextRight = "Right Text"
+
+        var radioBox2 = RadioBoxGroup.RadioBoxModel()
+        radioBox2.inputId = "model2"
+        radioBox2.value = "model 2 Value"
+        radioBox2.text = "iPhone 11 Bundle 2"
+        radioBox2.subText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
+
+        component.selectorModels = [radioBox1, radioBox2]
+
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/RadioButtonGroupViewController.swift b/VDSSample/ViewControllers/RadioButtonGroupViewController.swift
index 52c7c17..c1131ba 100644
--- a/VDSSample/ViewControllers/RadioButtonGroupViewController.swift
+++ b/VDSSample/ViewControllers/RadioButtonGroupViewController.swift
@@ -40,7 +40,7 @@ class  RadioButtonGroupViewController: BaseViewController<RadioButtonGroup> {
         }
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
         
         labelTextField
@@ -86,7 +86,7 @@ class  RadioButtonGroupViewController: BaseViewController<RadioButtonGroup> {
 
         //set UI values
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         showErrorSwitch.isOn = component.showError
         labelTextField.text = radioButton1.labelText
         childTextField.text = radioButton1.childText
@@ -107,3 +107,32 @@ class  RadioButtonGroupViewController: BaseViewController<RadioButtonGroup> {
 
     }
 }
+
+
+extension RadioButtonGroupViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+
+        var radioButton1 = RadioButtonGroup.RadioButtonModel()
+        radioButton1.inputId = "model1"
+        radioButton1.value = "model 1 Value"
+        radioButton1.labelText = "iPhone 11 Bundle 1"
+        radioButton1.childText = "Apple iPhone 11 - 64 GB\nOtterbox Case Red\nScreen Protector"
+        
+        var radioButton2 = RadioButtonGroup.RadioButtonModel()
+        radioButton2.inputId = "model2"
+        radioButton2.value = "model 2 Value"
+        radioButton2.labelText = "iPhone 11 Bundle 2"
+        radioButton2.childText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
+        
+        var radioButton3 = RadioButtonGroup.RadioButtonModel()
+        radioButton3.inputId = "model3"
+        radioButton3.value = "model 3 Value"
+        radioButton3.labelText = "iPhone 11 Bundle 3"
+        radioButton3.childText = "Apple iPhone 11 - 256 GB\nOtterbox Case Black\nScreen Protector"
+        
+        component.selectorModels = [radioButton1, radioButton2, radioButton3]
+        
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/RadioButtonItemViewController.swift b/VDSSample/ViewControllers/RadioButtonItemViewController.swift
index 35c603d..e7620fd 100644
--- a/VDSSample/ViewControllers/RadioButtonItemViewController.swift
+++ b/VDSSample/ViewControllers/RadioButtonItemViewController.swift
@@ -46,7 +46,7 @@ class  RadioButtonItemViewController: BaseViewController<RadioButtonItem> {
         }
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         labelTextField
@@ -81,7 +81,7 @@ class  RadioButtonItemViewController: BaseViewController<RadioButtonItem> {
         
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         labelTextField.text = component.labelText
         childTextField.text = component.childText
         showErrorSwitch.isOn = component.showError
@@ -98,3 +98,13 @@ class  RadioButtonItemViewController: BaseViewController<RadioButtonItem> {
     }
 }
 
+extension RadioButtonItemViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.labelText = "Terms and conditions"
+        component.childText = "I agree to Verizon's terms and conditions click here"
+        component.errorText = "Error Text"
+
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/RadioButtonViewController.swift b/VDSSample/ViewControllers/RadioButtonViewController.swift
index 9b74a3c..55aa4ae 100644
--- a/VDSSample/ViewControllers/RadioButtonViewController.swift
+++ b/VDSSample/ViewControllers/RadioButtonViewController.swift
@@ -38,7 +38,7 @@ class  RadioButtonViewController: BaseViewController<RadioButton> {
         }
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
     }
@@ -52,7 +52,7 @@ class  RadioButtonViewController: BaseViewController<RadioButton> {
         
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         showErrorSwitch.isOn = component.showError
         
     }
@@ -65,3 +65,10 @@ class  RadioButtonViewController: BaseViewController<RadioButton> {
         }
     }
 }
+
+extension RadioButtonViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/RadioSwatchGroupViewController.swift b/VDSSample/ViewControllers/RadioSwatchGroupViewController.swift
index 796c4c0..2158657 100644
--- a/VDSSample/ViewControllers/RadioSwatchGroupViewController.swift
+++ b/VDSSample/ViewControllers/RadioSwatchGroupViewController.swift
@@ -31,7 +31,7 @@ class  RadioSwatchGroupViewController: BaseViewController<RadioSwatchGroup> {
         addFormRow(label: "Strikethrough", view: strikeThroughSwitch)
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
         
         strikeThroughSwitch.onChange = { [weak self] sender in
@@ -91,7 +91,7 @@ class  RadioSwatchGroupViewController: BaseViewController<RadioSwatchGroup> {
         
         //set UI values
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
     }
     
     //Picker
@@ -104,3 +104,55 @@ class  RadioSwatchGroupViewController: BaseViewController<RadioSwatchGroup> {
         
     }
 }
+
+extension RadioSwatchGroupViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+
+        var radioSwatch1 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch1.fillImage = UIImage(named: "imageSwatch")
+        radioSwatch1.text = "Image"
+        radioSwatch1.inputId = "radioSwatch1"
+                
+        var radioSwatch2 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch2.primaryColor = .red
+        radioSwatch2.secondaryColor = .blue
+        radioSwatch2.text = "Red/Blue"
+        radioSwatch2.inputId = "radioSwatch2"
+        
+        var radioSwatch3 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch3.primaryColor = .green
+        radioSwatch3.text = "Green"
+        radioSwatch3.inputId = "radioSwatch3"
+
+        var radioSwatch4 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch4.primaryColor = .orange
+        radioSwatch4.text = "Orange"
+        radioSwatch4.inputId = "radioSwatch4"
+
+        var radioSwatch5 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch5.primaryColor = .brown
+        radioSwatch5.text = "Brown"
+        radioSwatch5.inputId = "radioSwatch5"
+        
+        var radioSwatch6 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch6.primaryColor = .yellow
+        radioSwatch6.text = "Yellow"
+        radioSwatch6.inputId = "radioSwatch6"
+
+        var radioSwatch7 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch7.primaryColor = .purple
+        radioSwatch7.text = "Puple"
+        radioSwatch7.inputId = "radioSwatch7"
+
+        var radioSwatch8 = RadioSwatchGroup.RadioSwatchModel()
+        radioSwatch8.primaryColor = .systemPink
+        radioSwatch8.text = "Pink"
+        radioSwatch8.inputId = "radioSwatch8"
+        
+        component.selectorModels = [radioSwatch1, radioSwatch2, radioSwatch3, radioSwatch4, radioSwatch5, radioSwatch6, radioSwatch7, radioSwatch8]
+        
+        return ComponentSample(component: component)
+
+    }
+}
diff --git a/VDSSample/ViewControllers/TableViewTestController.swift b/VDSSample/ViewControllers/TableViewTestController.swift
index e8be50c..12eef86 100644
--- a/VDSSample/ViewControllers/TableViewTestController.swift
+++ b/VDSSample/ViewControllers/TableViewTestController.swift
@@ -1,4 +1,3 @@
-//
 //  TableViewTestController.swift
 //  VDSSample
 //
@@ -10,100 +9,215 @@ import UIKit
 import VDS
 import VDSColorTokens
 
-public typealias TestView = UIView
-public typealias TestViewWrapper = (component: TestView, isTrailing: Bool)
-protocol Componentable {
-    static func getComponent() -> TestViewWrapper
+public typealias ComponentSampleView = UIView & Surfaceable
+
+public struct ComponentSample {
+    public var component: ComponentSampleView
+    public enum GreaterThanPinningType: String {
+        case none, equalTo, greaterThanOrEqual
+    }
+    
+    public enum LessThanPinningType: String {
+        case none, equalTo, lessThanOrEqual
+    }
+    
+    public var top: GreaterThanPinningType = .equalTo
+    public var leading: GreaterThanPinningType = .equalTo
+    public var trailing: LessThanPinningType = .equalTo
+    public var bottom: LessThanPinningType = .equalTo
+    
+    public init(component: ComponentSampleView,
+                topPinningType: GreaterThanPinningType = .equalTo,
+                leadingPinningType: GreaterThanPinningType = .equalTo,
+                trailingPinningType: LessThanPinningType = .equalTo,
+                bottomPinningType: LessThanPinningType = .equalTo) {
+        
+        self.component = component
+        self.top = topPinningType
+        self.leading = leadingPinningType
+        self.trailing = trailingPinningType
+        self.bottom = bottomPinningType
+    }
+    
+    public func pin(edgeInset: UIEdgeInsets = .zero) {
+        
+        guard let superview = component.superview else { return }
+        switch top {
+        case .equalTo:
+            component.pinTop(anchor: superview.topAnchor, constant: edgeInset.top)
+            
+        case .greaterThanOrEqual:
+            component.pinTopGreaterThanOrEqualTo(anchor: superview.topAnchor, constant: edgeInset.top)
+            
+        case .none: break
+        }
+        
+        switch leading {
+        case .equalTo:
+            component.pinLeading(anchor: superview.leadingAnchor, constant: edgeInset.left)
+            
+        case .greaterThanOrEqual:
+            component.pinLeadingGreaterThanOrEqualTo(anchor: superview.leadingAnchor, constant: edgeInset.left)
+            
+        case .none: break
+
+        }
+        
+        switch trailing {
+        case .equalTo:
+            component.pinTrailing(anchor: superview.trailingAnchor, constant: edgeInset.right)
+            
+        case .lessThanOrEqual:
+            component.pinTrailingLessThanOrEqualTo(anchor: superview.trailingAnchor, constant: edgeInset.right)
+            
+        case .none: break
+        }
+        
+        switch bottom {
+        case .equalTo:
+            component.pinBottom(anchor: superview.bottomAnchor, constant: edgeInset.bottom)
+            
+        case .lessThanOrEqual:
+            component.pinBottomLessThanOrEqualTo(anchor: superview.bottomAnchor, constant: edgeInset.bottom)
+            
+        case .none: break
+        }
+        
+    }
 }
 
-public class TableViewTestController: UITableViewController, Initable {
-
-    var components:[TestViewWrapper] = []
+protocol ComponentSampleable {
+    static func makeSample() -> ComponentSample
+}
 
+public class TableViewTestController: UIViewController, Initable, Surfaceable {
+    
+    var components:[ComponentSample] = []
+    lazy var tableView = UITableView().with {
+        $0.translatesAutoresizingMaskIntoConstraints = false
+    }
+    
+    public var surface: Surface = .light {
+        didSet {
+            tableView.reloadData()
+        }
+    }
     //--------------------------------------------------
     // MARK: - Initializers
     //--------------------------------------------------
     required public init() {
         super.init(nibName: nil, bundle: nil)
     }
-
+    
     required init?(coder: NSCoder) {
         fatalError("init(coder:) has not been implemented")
     }
-
+    
     public override func viewDidLoad() {
         super.viewDidLoad()
-        MenuViewController.items.forEach { menuItem in
-            if let componentable = menuItem.viewController as? Componentable.Type {
-                components.append(componentable.getComponent())
+        
+        let toggle = Toggle().with {
+            $0.showText = true
+            //$0.textPosition = .right
+            $0.offText = "Light"
+            $0.onText = "Dark"
+            $0.onChange = { [weak self] toggle in
+                self?.surface = toggle.isOn ? .dark : .light
             }
         }
-        tableView.register(VDSCell.self, forCellReuseIdentifier: "cell")
+
+        let toggleSample = ComponentSample(component: toggle, leadingPinningType: .none)
+        let wrapper = UIView().with { $0.translatesAutoresizingMaskIntoConstraints = false }
+        wrapper.addSubview(toggle)
+        toggleSample.pin(edgeInset: .init(top: 5, left: 0, bottom: 5, right: 16))
+        
+        let stackView = UIStackView(arrangedSubviews: [wrapper, tableView]).with {
+            $0.translatesAutoresizingMaskIntoConstraints = false
+            $0.axis = .vertical
+            $0.spacing = 4
+            $0.distribution = .fill
+        }
+        view.backgroundColor = Surface.light.color
+        view.addSubview(stackView)
+        
+        NSLayoutConstraint.activate([
+            stackView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
+            stackView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
+            stackView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
+            stackView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
+        ])
+        
+        items.forEach { menuItem in
+            if let componentable = menuItem.viewController as? ComponentSampleable.Type {
+                components.append(componentable.makeSample())
+            }
+        }
+        
         tableView.allowsSelection = false
-        tableView.estimatedRowHeight = 100
-        tableView.separatorStyle = .none
+        tableView.estimatedRowHeight = 32
         tableView.rowHeight = UITableView.automaticDimension
+        tableView.separatorStyle = .singleLine
+        tableView.delegate = self
+        tableView.dataSource = self
         tableView.reloadData()
     }
+    
+    public func refresh() {
+        DispatchQueue.main.async { [self] in
+            UIView.performWithoutAnimation {
+                tableView.beginUpdates()
+                tableView.endUpdates()
+            }            
+        }
+    }
+    
+    var items: [MenuComponent] {
+        batch1
+    }
+    
+    var all: [MenuComponent] {
+        MenuViewController.items
+    }
+    
+    var batch1: [MenuComponent] {
+        [
+            MenuComponent(title: "Badge", completed: true, viewController: BadgeViewController.self),
+            MenuComponent(title: "Button", completed: true, viewController: ButtonViewController.self),
+            MenuComponent(title: "ButtonGroup", completed: true, viewController: ButtonGroupViewController.self),
+            MenuComponent(title: "Icon", completed: true, viewController: IconViewController.self),
+            MenuComponent(title: "Label", completed: true, viewController: LabelViewController.self),
+            MenuComponent(title: "Line", completed: true, viewController: LineViewController.self),
+            MenuComponent(title: "Loader", completed: true, viewController: LoaderViewController.self),
+            MenuComponent(title: "Tabs", completed: true, viewController: TabsViewController.self),
+            MenuComponent(title: "TextLink", completed: true, viewController: TextLinkViewController.self),
+            MenuComponent(title: "TextLinkCaret", completed: true, viewController: TextLinkCaretViewController.self),
+            MenuComponent(title: "TitleLockup", completed: true, viewController: TitleLockupViewController.self),
+            MenuComponent(title: "Tooltip", completed: true, viewController: TooltipViewController.self),
+        ]
+    }
+}
 
-    public override func numberOfSections(in tableView: UITableView) -> Int {
+extension TableViewTestController : UITableViewDelegate, UITableViewDataSource {
+    
+    public func numberOfSections(in tableView: UITableView) -> Int {
+        1
+    }
+    
+    public func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
         components.count
     }
 
-    public override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
-        let header =  UIView().with { $0.backgroundColor = VDSColor.paletteGray44 }
-        let label = Label().with {
-            $0.text = "\(type(of: components[section].component))"
-            $0.surface = .dark
-            $0.textStyle = .boldTitleSmall
-        }
-        header.addSubview(label)
-        label.pinTrailing(16)
-        label.pinLeading(16)
-        label.centerYAnchor.constraint(equalTo: header.centerYAnchor).activate()
-        return header
-    }
-    
-    public override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
-        40
-    }
-    
-    public override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
-        1
-    }
-
-    public override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
-        guard let cell = tableView.dequeueReusableCell(withIdentifier: "cell") as? VDSCell else { return UITableViewCell() }
-        let wrapper = components[indexPath.row]
-        cell.component = wrapper.component
-        cell.isTrailing = wrapper.isTrailing
+    public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
+        let sample = components[indexPath.row]
+        var component = sample.component
+        component.surface = surface
+        
+        let cell = UITableViewCell()
+        cell.contentView.addSubview(component)
+        sample.pin(edgeInset: .init(top: 16, left: 16, bottom: 16, right: 16))
+        cell.backgroundColor = surface.color
+        cell.layoutIfNeeded()
         return cell
     }
-    
-}
 
-public class VDSCell: UITableViewCell, AppleGuidlinesTouchable {
-    public var isTrailing: Bool = true
-    public var component: TestView? {
-        didSet {
-            guard let component else { return }
-            contentView.addSubview(.makeWrapper(for: component, edgeSpacing: 16, isTrailing: isTrailing))
-        }
-    }
-    
-    override open func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
-        Self.acceptablyOutsideBounds(point: point, bounds: bounds)
-    }
-    
-    public override var intrinsicContentSize: CGSize {
-        guard let component else { return .zero }
-        return component.intrinsicContentSize
-    }
-    
-    public override func prepareForReuse() {
-        super.prepareForReuse()
-        contentView.subviews.forEach { $0.removeFromSuperview() }
-    }
-    
 }
-
diff --git a/VDSSample/ViewControllers/TabsContainerViewController.swift b/VDSSample/ViewControllers/TabsContainerViewController.swift
index f7d6ab4..4809da7 100644
--- a/VDSSample/ViewControllers/TabsContainerViewController.swift
+++ b/VDSSample/ViewControllers/TabsContainerViewController.swift
@@ -80,7 +80,7 @@ class TabsContainerViewController: BaseViewController<TabsContainer> {
         append(section: horizontalOrientationFormStackView)
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
         
         borderlineSwitch.onChange =  { [weak self] sender in
@@ -144,7 +144,7 @@ class TabsContainerViewController: BaseViewController<TabsContainer> {
         orientationPickerSelectorView.text = component.orientation.rawValue
         indicatorPositionPickerSelectorView.text = component.indicatorPosition.rawValue
         overflowPickerSelectorView.text = component.overflow.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         borderlineSwitch.isOn = component.borderLine
         fillContainerSwitch.isOn = component.fillContainer
         sampleSwitch.isOn = true
diff --git a/VDSSample/ViewControllers/TabsViewController.swift b/VDSSample/ViewControllers/TabsViewController.swift
index b06743d..6a13831 100644
--- a/VDSSample/ViewControllers/TabsViewController.swift
+++ b/VDSSample/ViewControllers/TabsViewController.swift
@@ -71,7 +71,7 @@ class TabsViewController: BaseViewController<Tabs> {
         append(section: horizontalOrientationFormStackView)
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
         
         borderlineSwitch.onChange =  { [weak self] sender in
@@ -112,7 +112,7 @@ class TabsViewController: BaseViewController<Tabs> {
         orientationPickerSelectorView.text = component.orientation.rawValue
         indicatorPositionPickerSelectorView.text = component.indicatorPosition.rawValue
         //overflowPickerSelectorView.text = component.overflow.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         borderlineSwitch.isOn = component.borderLine
         fillContainerSwitch.isOn = component.fillContainer
         sampleSwitch.isOn = true
@@ -142,3 +142,17 @@ class TabsViewController: BaseViewController<Tabs> {
 //        }
     }
 }
+
+extension TabsViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.tabModels =  [
+            .init(text: "Accessories"),
+            .init(text: "Internet and TV"),
+            .init(text: "Customer Service"),
+            .init(text: "Contact Us")
+        ]
+        
+        return ComponentSample(component: component)
+    }
+}
diff --git a/VDSSample/ViewControllers/TextAreaViewController.swift b/VDSSample/ViewControllers/TextAreaViewController.swift
index 0c6af3c..a532633 100644
--- a/VDSSample/ViewControllers/TextAreaViewController.swift
+++ b/VDSSample/ViewControllers/TextAreaViewController.swift
@@ -58,7 +58,7 @@ class  TextAreaViewController: BaseViewController<TextArea> {
         }
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         labelTextField
@@ -120,7 +120,7 @@ class  TextAreaViewController: BaseViewController<TextArea> {
  
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         requiredSwitch.isOn = component.required
         labelTextField.text = component.labelText
         helperTextField.text = component.helperText
@@ -139,3 +139,15 @@ class  TextAreaViewController: BaseViewController<TextArea> {
     }
 }
 
+extension TextAreaViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.width = 328
+        component.labelText = "Street Address"
+        component.helperText = "For example: 123 Verizon St"
+        component.errorText = "Enter a valid address."
+        component.tooltipTitle = "Check the formatting of your address"
+        component.tooltipContent = "House/Building number then street name"
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/TextLinkCaretViewController.swift b/VDSSample/ViewControllers/TextLinkCaretViewController.swift
index b7c8159..2e54406 100644
--- a/VDSSample/ViewControllers/TextLinkCaretViewController.swift
+++ b/VDSSample/ViewControllers/TextLinkCaretViewController.swift
@@ -39,7 +39,7 @@ class TextLinkCaretViewController: BaseViewController<TextLinkCaret> {
         addFormRow(label: "Caret Position", view: caretPositionPickerSelectorView)
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         textField
@@ -55,7 +55,7 @@ class TextLinkCaretViewController: BaseViewController<TextLinkCaret> {
         
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         textField.text = component.text
         caretPositionPickerSelectorView.text = component.iconPosition.rawValue
     }
@@ -72,3 +72,12 @@ class TextLinkCaretViewController: BaseViewController<TextLinkCaret> {
         }
     }
 }
+
+extension TextLinkCaretViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.text = "Text Link Caret"
+        component.onClick = { c in print("\(c.text!) Click")}
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/TextLinkViewController.swift b/VDSSample/ViewControllers/TextLinkViewController.swift
index 968da4e..c20f09f 100644
--- a/VDSSample/ViewControllers/TextLinkViewController.swift
+++ b/VDSSample/ViewControllers/TextLinkViewController.swift
@@ -41,7 +41,7 @@ class TextLinkViewController: BaseViewController<TextLink> {
         addFormRow(label: "Size", view: buttonSizePickerSelectorView)
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
         
         textField
@@ -57,7 +57,7 @@ class TextLinkViewController: BaseViewController<TextLink> {
 
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         textField.text = component.text
         buttonSizePickerSelectorView.text = ButtonSize.large.rawValue
     }
@@ -74,3 +74,12 @@ class TextLinkViewController: BaseViewController<TextLink> {
         }
     }
 }
+
+extension TextLinkViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.text = "Text Link"
+        component.onClick = { c in print("\(c.text!) Click")}
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/TileContainerViewController.swift b/VDSSample/ViewControllers/TileContainerViewController.swift
index 921b234..ec374ad 100644
--- a/VDSSample/ViewControllers/TileContainerViewController.swift
+++ b/VDSSample/ViewControllers/TileContainerViewController.swift
@@ -147,3 +147,12 @@ class TileContainerViewController: BaseViewController<TileContainer> {
         }
     }
 }
+
+extension TileContainerViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.width = 150
+        component.color = .black
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/TileletViewController.swift b/VDSSample/ViewControllers/TileletViewController.swift
index 7e75dc8..e6872ac 100644
--- a/VDSSample/ViewControllers/TileletViewController.swift
+++ b/VDSSample/ViewControllers/TileletViewController.swift
@@ -229,3 +229,17 @@ class TileletViewController: BaseViewController<Tilelet> {
         }
     }
 }
+
+extension TileletViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        let titleModel = Tilelet.TitleModel(text: "Save $XX on your monthly bill.")
+        let subTitleModel = Tilelet.SubTitleModel(text: "Enroll in Auto Pay & paper-free billing to save on your monthly bill.")
+        
+        component.surface = .light
+        component.titleModel = titleModel
+        component.subTitleModel = subTitleModel
+        component.width = 250
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
diff --git a/VDSSample/ViewControllers/TitleLockupViewController.swift b/VDSSample/ViewControllers/TitleLockupViewController.swift
index 0162db0..5ef509f 100644
--- a/VDSSample/ViewControllers/TitleLockupViewController.swift
+++ b/VDSSample/ViewControllers/TitleLockupViewController.swift
@@ -113,15 +113,19 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
         titleTextField.text = titleModel.text
         subTitleTextField.text = subTitleModel.text
         
+        setTitleModel()
         updateOtherTextStyles()
     }
 
     func setTitleModel() {
+        var titleTextStyle: TextStyle?
         if let text = titleTextField.text, !text.isEmpty {
             component.titleModel = TitleLockup.TitleModel(text: text, isBold: titleIsBold.isOn, standardStyle: titleStandardStylePickerSelectorView.selectedItem)
+            titleTextStyle = titleIsBold.isOn ? titleStandardStylePickerSelectorView.selectedItem.value.bold : titleStandardStylePickerSelectorView.selectedItem.value.regular
         } else {
             component.titleModel = nil
         }
+        debug(type: "Title", textStyle: titleTextStyle)
     }
     
     func updateOtherTextStyles() {
@@ -136,17 +140,25 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
     
         if let text = subTitleTextField.text, !text.isEmpty {
             component.subTitleModel = TitleLockup.SubTitleModel(text: text, standardStyle: style, textColor: subtitleColorPickerSelectorView.selectedItem)
+            debug(type: "SubTitle", textStyle: style.value.regular)
         } else {
             component.subTitleModel = nil
         }
         
         if let text = eyebrowTextField.text, !text.isEmpty {
             component.eyebrowModel = TitleLockup.EyebrowModel(text: text, isBold: eyebrowIsBold.isOn, standardStyle: style)
+            debug(type: "EyeBrow", textStyle: eyebrowIsBold.isOn ? style.value.bold : style.value.regular)
+
         } else {
             component.eyebrowModel = nil
         }
     }
     
+    func debug(type: String, textStyle: TextStyle?) {
+        guard let textStyle else { return }
+        DebugLog("\n\(type)\n\(descriptionFor(style: textStyle))\n\n")
+    }
+    
     //Picker
     func setupPicker(){
         surfacePickerSelectorView.onPickerDidSelect = {  [weak self] item in
@@ -172,3 +184,18 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
         }
     }
 }
+
+extension TitleLockupViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        let eyebrowModel = TitleLockup.EyebrowModel(text: "Today only.")
+        let titleModel = TitleLockup.TitleModel(text: "Get more of our best")
+        let subTitleModel = TitleLockup.SubTitleModel(text: "Get both of our best and pay less. Pair 5G Home Internet with Verizon mobile to save every month.")
+        
+        component.eyebrowModel = eyebrowModel
+        component.titleModel = titleModel
+        component.subTitleModel = subTitleModel
+        component.debugBorder(show: true)
+        return ComponentSample(component: component)
+    }
+}
diff --git a/VDSSample/ViewControllers/ToggleViewController.swift b/VDSSample/ViewControllers/ToggleViewController.swift
index 7831770..4f0b8e3 100644
--- a/VDSSample/ViewControllers/ToggleViewController.swift
+++ b/VDSSample/ViewControllers/ToggleViewController.swift
@@ -68,7 +68,7 @@ class ToggleViewController: BaseViewController<Toggle> {
         }
         
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
         
         boldSwitch.onChange = { [weak self] sender in
@@ -115,3 +115,12 @@ class ToggleViewController: BaseViewController<Toggle> {
         
     }
 }
+
+extension ToggleViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.showText = true
+        component.textPosition = .right
+        return ComponentSample(component: component)
+    }
+}
diff --git a/VDSSample/ViewControllers/TooltipViewController.swift b/VDSSample/ViewControllers/TooltipViewController.swift
index 0543664..c03a9cf 100644
--- a/VDSSample/ViewControllers/TooltipViewController.swift
+++ b/VDSSample/ViewControllers/TooltipViewController.swift
@@ -49,7 +49,7 @@ class  TooltipViewController: BaseViewController<Tooltip> {
         addFormRow(label: "Close Button Text", view: closeButtonTextField)
         
         disabledSwitch.onChange =  { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         titleTextField
@@ -78,7 +78,7 @@ class  TooltipViewController: BaseViewController<Tooltip> {
         
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         titleTextField.text = component.title
         contentTextField.text = component.content
         closeButtonTextField.text = component.closeButtonText
@@ -100,3 +100,13 @@ class  TooltipViewController: BaseViewController<Tooltip> {
         }
     }
 }
+
+extension TooltipViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.title = "5G Ultra Wideband is available in your area."
+        component.content = "$799.99 (128 GB only) "
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual, bottomPinningType: .lessThanOrEqual)
+    }
+}
+
diff --git a/VDSSample/ViewControllers/TrailingTooltipLabelViewController.swift b/VDSSample/ViewControllers/TrailingTooltipLabelViewController.swift
index 0ffec92..50dbb96 100644
--- a/VDSSample/ViewControllers/TrailingTooltipLabelViewController.swift
+++ b/VDSSample/ViewControllers/TrailingTooltipLabelViewController.swift
@@ -60,7 +60,7 @@ class TrailingTooltipLabelViewController: BaseViewController<TrailingTooltipLabe
         addFormRow(label: "Tooltip Close Button Text", view: closeButtonTextField)
 
         disabledSwitch.onChange = { [weak self] sender in
-            self?.component.disabled = sender.isOn
+            self?.component.isEnabled = !sender.isOn
         }
 
         boldSwitch
@@ -103,7 +103,7 @@ class TrailingTooltipLabelViewController: BaseViewController<TrailingTooltipLabe
 
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         boldSwitch.isOn = isBold
         textField.text = component.labelText
         
@@ -113,7 +113,7 @@ class TrailingTooltipLabelViewController: BaseViewController<TrailingTooltipLabe
         
         //setup UI
         surfacePickerSelectorView.text = component.surface.rawValue
-        disabledSwitch.isOn = component.disabled
+        disabledSwitch.isOn = !component.isEnabled
         titleTextField.text = component.tooltipTitle
         contentTextField.text = component.tooltipContent
         closeButtonTextField.text = component.tooltipCloseButtonText
@@ -165,6 +165,17 @@ class TrailingTooltipLabelViewController: BaseViewController<TrailingTooltipLabe
         fontCategoryPickerSelectorView.onPickerDidSelect = {  [weak self] item in
             self?.fontCategory = item
         }
-        
     }
 }
+
+extension TrailingTooltipLabelViewController: ComponentSampleable {
+    static func makeSample() -> ComponentSample {
+        let component = Self.makeComponent()
+        component.labelText = "5G Ultra Wideband is available in your area"
+        component.tooltipTitle = "5G Ultra Wideband is available in your area."
+        component.tooltipContent = "$799.99 (128 GB only)"
+        return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual)
+    }
+}
+
+