NicholasBoll

import * as React from 'react';
import {createModelHook, ModelExtras, ToEventConfig} from '@workday/canvas-kit-react/common';

import {useDisclosureModel} from '@workday/canvas-kit-react/disclosure';
import {Placement} from '@workday/canvas-kit-react/popup';

// eslint-disable-next-line no-empty-function
const noop = () => {};

export const _usePopupModel = createModelHook({

NicholasBoll

Release Branching

Canvas Kit supports three branch lines for a current major release, previous major release, and the next upcoming major release. Example release numbers will assume a current major release of 2.0.

• support: The last major support branch (i.e. 1.0). This branch only accepts fixes and will release patch versions with every commit.
• master: The current major support branch (i.e. 2.0). This branch only accepts fixes and will release patch versions with every commit.
• prerelease/minor: The current major feature branch (i.e. 2.1). This branch accepts features and fixes and will release minor versions every 3 weeks.
• prerelease/major: The next major branch (i.e. 3.0). This branch accepts breaking changes, features, and fixes and will release major versions every 6 months. In addition, a release of this branch will advance the "major" of other branches by +1.

Major releases

NicholasBoll

Typescript has conditionals like JavaScript does, but they are different.

In JavaScript, conditionals can compare values:

if (a > 1) {
  return true
} else {
  return false
}

NicholasBoll

Canvas Kit releases major changes every 6 months. Releases are done by a maintainer. The process is similar to minor releases, except the addition of the support branch. All branches have to be forward merged. Check out all of the following to make sure there are no commits listed:

• https://github.com/Workday/canvas-kit/compare/master...support
• https://github.com/Workday/canvas-kit/compare/prerelease/minor...master
• https://github.com/Workday/canvas-kit/compare/prerelease/major...prerelease/minor

If there are any commits listed, run the forward merge for the branch that isn't merged forward (support, master, or prerelease/minor). It is safe to run this job even if there are no changes since the job will recognize no change and bail.

We'll be using the terms previous major, current major, and next major in the context of versions before the release process is complete. For example, if support is pointing to v4, `ma

NicholasBoll

Session 3

Today we'll be covering creating compound components using models, behaviors, and utility functions in Canvas Kit that make composability easier. Please refer to the Create Compound Component docs for reference later.

Get the latest changes:

git fetch --all

NicholasBoll

Session 2

fetch latest:

git fetch --all

NicholasBoll

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

NicholasBoll

const tooltipMachine = Machine({
  id: "tooltip",
  initial: "closed",
  states: {
    closing: { on: { CLOSE: "closed", OPEN: "opened" } },
    closed: { on: { OPEN: "opened" } },
    opened: { on: { CLOSING: "closing", CLOSE: "closed" } }
  }
});

NicholasBoll

const compareColor = (color, property) => (targetElement) => {
    const tempElement = document.createElement('div');
    tempElement.style.color = color;
    tempElement.style.display = 'none'; // make sure it doesn't actually render
    document.body.appendChild(tempElement); // append so that `getComputedStyle` actually works
  
    const tempColor = getComputedStyle(tempElement).color;
    const targetColor = getComputedStyle(targetElement[0])[property];
  
    document.body.removeChild(tempElement); // remove it because we're done with it

NicholasBoll

export const getByName = (name: string) => function getAlarmByName($container: JQuery): JQuery {
  return $container.find(`.alarm-card:contains("${name}")`)
}