@telus-uds/theme-koodo 5.3.0 → 5.5.0

package/build/rn/VideoMenu.js

@@ -0,0 +1,24 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+const PaletteIconCheck = require('@telus-uds/palette-koodo/build/rn/icons/Check')
+
+module.exports = {
+  appearances: {},
+  rules: [],
+  tokens: {
+    background: '#000000',
+    checkMarkFocusColor: '#016b6a',
+    checkMarkHeight: 24,
+    checkMarkHoverColor: '#016b6a',
+    checkMarkIcon: PaletteIconCheck,
+    checkMarkSelectedColor: '#000000',
+    checkMarkUnselectedColor: 'rgba(0, 0, 0, 0)',
+    checkMarkWidth: 24,
+    padding: 16
+  }
+}

package/build/rn/VideoMiddleControlButton.js

@@ -0,0 +1,19 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+
+
+module.exports = {
+  appearances: {},
+  rules: [],
+  tokens: {
+    background: '#000000',
+    height: 64,
+    iconColor: '#ffffff',
+    width: 64
+  }
+}

package/build/rn/VideoPicker.js

@@ -0,0 +1,22 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+
+
+module.exports = {
+  appearances: {},
+  rules: [],
+  tokens: {
+    framedContainerBackgroundColor: '#fafafa',
+    framedContainerBorderColor: '#c9c8c8',
+    framedContainerBorderRadius: 4,
+    framedContainerBorderWidth: 1,
+    framedContainerPadding: 24,
+    framedMaxHeight: 640,
+    stackViewDividerColor: '#c9c8c8'
+  }
+}

package/build/rn/VideoPickerSlider.js

@@ -0,0 +1,18 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+const PaletteIconArrowRight = require('@telus-uds/palette-koodo/build/rn/icons/ArrowRight')
+const PaletteIconArrowLeft = require('@telus-uds/palette-koodo/build/rn/icons/ArrowLeft')
+
+module.exports = {
+  appearances: {},
+  rules: [],
+  tokens: {
+    nextIcon: PaletteIconArrowRight,
+    previousIcon: PaletteIconArrowLeft
+  }
+}

package/build/rn/VideoPickerThumbnail.js

@@ -0,0 +1,78 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+
+
+module.exports = {
+  appearances: {
+    focus: {
+      description: "Currently only web has good support for this. Applies when an interactive component's focus handler is triggered, such as keyboard tabbing or selection.",
+      platforms: [ 'rn' ],
+      type: 'state',
+      values: [ true, false ]
+    },
+    hover: {
+      description: "Currently web only. Applies when an interactive component's hover handler is triggered, such as on mouseover.",
+      platforms: [ 'rn' ],
+      type: 'state',
+      values: [ true, false ]
+    },
+    pressed: {
+      description: 'Applies while an interactive component is being physically pressed. Most visible on touchscreen taps; in React Native Web, this is visible on web mouse clicks only if the pressable is held down.',
+      type: 'state',
+      values: [ true, false ]
+    },
+    selected: {
+      description: 'Applies while an interactive component is the currently selected one in a set of states or components, for example a button in a `ButtonGroup`.',
+      type: 'state',
+      values: [ true ]
+    }
+  },
+  rules: [
+    {
+      if: { focus: true },
+      tokens: {
+        borderColor: '#595959',
+        borderWidth: 1,
+        outerBorderColor: '#000000'
+      }
+    },
+    {
+      if: { hover: true },
+      tokens: { borderColor: '#c9c8c8', borderWidth: 3 }
+    },
+    {
+      if: { pressed: true },
+      tokens: {
+        borderColor: '#595959',
+        borderWidth: 3,
+        outerBorderColor: 'rgba(0, 0, 0, 0)'
+      }
+    },
+    {
+      if: { selected: true },
+      tokens: { borderColor: '#7a3dfc', titleColor: '#7a3dfc' }
+    }
+  ],
+  tokens: {
+    borderColor: '#c9c8c8',
+    borderRadius: 4,
+    borderWidth: 2,
+    outerBorderColor: 'rgba(0, 0, 0, 0)',
+    outerBorderGap: 2,
+    outerBorderRadius: 8,
+    outerBorderWidth: 2,
+    pressableBorderTopColor: '#c9c8c8',
+    pressableBorderTopWidth: 1,
+    pressablePaddingBottom: 16,
+    pressablePaddingHorizontal: 24,
+    pressablePaddingVertical: 16,
+    splashButtonRadius: 4,
+    subTitleColor: '#595959',
+    titleColor: '#000000'
+  }
+}

package/build/rn/VideoProgressBar.js

@@ -0,0 +1,23 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+
+
+module.exports = {
+  appearances: {},
+  rules: [],
+  tokens: {
+    rangeBackground: 'rgba(0, 0, 0, 0)',
+    thumbBackground: '#ffffff',
+    thumbHeight: 8,
+    thumbWidth: 8,
+    timestampMarginLeft: 8,
+    timestampMarginRight: 8,
+    trackGradientEnd: '#7a3dfc',
+    trackGradientStart: '#7a3dfc'
+  }
+}

package/build/rn/VideoVolumeSlider.js

@@ -0,0 +1,26 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+const PaletteIconMuted = require('@telus-uds/palette-koodo/build/rn/icons/Muted')
+const PaletteIconUnmuted = require('@telus-uds/palette-koodo/build/rn/icons/Unmuted')
+
+module.exports = {
+  appearances: {},
+  rules: [],
+  tokens: {
+    marginLeft: 16,
+    marginRight: 16,
+    mutedIcon: PaletteIconMuted,
+    rangeBackground: 'rgba(0, 0, 0, 0)',
+    thumbBackground: '#ffffff',
+    thumbHeight: 8,
+    thumbWidth: 8,
+    trackGradientEnd: '#ffffff',
+    trackGradientStart: '#ffffff',
+    unmutedIcon: PaletteIconUnmuted
+  }
+}

package/build/rn/WaffleGrid.js

@@ -0,0 +1,29 @@
+/*
+ *
+ * Do not edit directly
+ * Generated on Thu, 18 Jan 2024 22:40:58 GMT
+ *
+ */
+
+
+
+module.exports = {
+  appearances: {
+    viewport: {
+      description: 'The size label for the current screen viewport based on the current screen width',
+      type: 'state',
+      values: [ 'xs', 'sm', 'md', 'lg', 'xl' ]
+    }
+  },
+  rules: [
+    { if: { viewport: [ 'xs' ] }, tokens: { rowSize: 2 } },
+    { if: { viewport: [ 'sm', 'md' ] }, tokens: { rowSize: 3 } },
+    { if: { viewport: [ 'lg', 'xl' ] }, tokens: { rowSize: 6 } }
+  ],
+  tokens: {
+    itemBorderColor: '#c9c8c8',
+    itemPadding: 16,
+    rowBorderWidth: 1,
+    rowSize: 6
+  }
+}