add(name, decl, ruleOptions) {
    const {parent, sheet, jss, Renderer, generateId, scoped} = this.options
    const options = {
      classes: this.classes,
      parent,
      sheet,
      jss,
      Renderer,
      generateId,
      scoped,
      name,
      keyframes: this.keyframes,
      selector: undefined,
      ...ruleOptions
    }

    // When user uses .createStyleSheet(), duplicate names are not possible, but
    // `sheet.addRule()` opens the door for any duplicate rule name. When this happens
    // we need to make the key unique within this RuleList instance scope.
    let key = name
    if (name in this.raw) {
      key = `${name}-d${this.counter++}`
    }

    // We need to save the original decl before creating the rule
    // because cache plugin needs to use it as a key to return a cached rule.
    this.raw[key] = decl

    if (key in this.classes) {
      // E.g. rules inside of @media container
      options.selector = `.${escape(this.classes[key])}`
    }

    const rule = createRule(key, decl, options)

    if (!rule) return null

    this.register(rule)

    const index = options.index === undefined ? this.index.length : options.index
    this.index.splice(index, 0, rule)

    return rule
  }
Create and register rule.

Will not render after Style Sheet was rendered the first time.