[WIP] tooltip component updates

.github/CONTRIBUTING.md

@@ -2,7 +2,7 @@
 
 [fork]: https://github.com/github/primer/fork
 [pr]: https://github.com/github/primer/compare
-[style]: http://primer.github.io/guidelines/
+[style]: http://primercss.io/guidelines/
 
 Hi there! We're thrilled that you'd like to contribute to this project. Your help is essential for keeping it great.
 
@@ -59,16 +59,16 @@ Good pull requests—patches, improvements, new features—are a fantastic help.
 
 ### Updating Primer modules
 
-Anyone can open a pull request on Primer. You do not need to work at GitHub or be a member of the org to open a pull request. 
+Anyone can open a pull request on Primer CSS. You do not need to work at GitHub or be a member of the org to open a pull request. 
 
-1. Fork and clone [this repository](https://github.com/primer/primer).
+1. Fork and clone [this repository](https://github.com/primer/primer-css).
 2. Configure and install the dependencies: `npm install`
 3. Check out the dev branch `git checkout dev`
 3. Create a new branch from dev `git checkout -b my-branch-name`
 4. Make your changes and commit them.
 5. Push your branch and open a pull request against `dev`. Add a comment describing your proposed changes and request a review from `@primer/ds-core`.
 6. Wait for CI tests to finish.
-   - If the tests pass, you should see a status check telling you which alpha version of primer you can install with npm to test your work in other projects.
+   - If the tests pass, you should see a status check telling you which alpha version of primer-css you can install with npm to test your work in other projects.
    - If the tests fail, review the logs and address any issues.
    - If the builds fail for any other reason (as they occasionally do), they may need to be manually restarted.
 7. When CI tests pass, a new npm alpha release will be posted under the CI checks, you can use this npm version for testing in your project or with a GitHub site if you are staff.

.gitignore

@@ -6,4 +6,3 @@ node_modules
 build
 _site
 *.lerna_backup
-.changelog

.storybook/config.js

@@ -1,11 +1,11 @@
 import React from 'react'
 import { configure, addDecorator } from '@storybook/react'
 import { setOptions } from '@storybook/addon-options'
-import '../modules/primer/index.scss'
+import '../modules/primer-css/index.scss'
 
 setOptions({
   name: 'Primer',
-  url: 'http://primer.github.io/',
+  url: 'http://primercss.io/',
   showDownPanel: false,
 })
 
@@ -16,6 +16,7 @@ addDecorator(story => (
 ))
 
 const contexts = [
+  require.context('.', true, /\.js$/),
   require.context('../modules', true, /stories.*\.js$/),
 ]
 

.storybook/lib/storiesFromMarkdown.js

@@ -4,23 +4,11 @@ import select from 'unist-util-select'
 import findBefore from 'unist-util-find-before'
 import htmlToReact from 'html-to-react'
 import parsePairs from 'parse-pairs'
-import React from 'react'
-import ReactDOMServer from 'react-dom/server'
-import {Octicon} from '../Octicon'
 
 const htmlParser = new htmlToReact.Parser()
 
-const railsOcticonToReact = (html) => {
-  // <%= octicon "tools" %> to <Octicon name="tools" />
-  const octre = /<%= octicon ["']([a-z\-]+)["'][^%]*%>/gi
-  html = html.replace(octre, (match, name) => {
-    return ReactDOMServer.renderToStaticMarkup(<Octicon name={name} />)
-  })
-  return html
-}
-
 const nodeToStory = (node, file) => {
-  const html = railsOcticonToReact(node.value)
+  const html = node.value
   const element = htmlParser.parse(html)
   const pairs = node.lang.replace(/^html\s*/, '')
   const attrs = pairs.length ? parsePairs(pairs) : {}

.travis.yml

@@ -8,17 +8,15 @@ env:
     - secure: "EZewKKWQXmtCwPtYrPZq4OQblv2OyXR61qBIl3pOxGNVG2BCjD6VOgSaiYqkA9Qbt+ihfwQkiiLvTB68gbvRSiBFV9i+XLzKzt4S8CDI5RhTLAxZB3eQFVZRYzldchzWI4sdNhTvYS1kYXmsXQZD6vJmPSnFvOI/ddfzqvnNL4M="
     # github
     - secure: "J+1oWjvvXjyrwkY/4IFWKdN/weFmQcPwlRuFG4R0Gb3rYe4nqtC9l68sJvmS8asc8dQMhOhcUZCH6sjvo7l2WD4NuK4umPSbs+rJNUsfbvH4pZjStQIj/3ll1OfQelGDWAYQWhIfciYY4F3Bp0ZWTfKOppLQ2AVIYu1fPVXDdlo="
-    # github changelog
-    - secure: "KcGydAqL7ryDh2rTJJB4wU8NE5BRtnrRXDEcPBScSscO3zFsHXHBDvvO04B/9hFVatXzGYXmkn+FZ0P9QikhvebzdwwyqUG2SKFiHhMvbX0m0WtAhn5NqDuKU1r5qy5YQ18r/tiLfC9GSAlEpfLAH58pwpcn8srV3Mn/yKvlrfs="
 
 script:
   - npm test
 
 after_success:
   # this will short-circuit the publish step if it fails to interpolate $NPM_API_KEY
   - npm config set "//registry.npmjs.org/:_authToken=\${NPM_API_KEY}"
-  # copy the CHANGELOG.md primer for publishing
-  - cp CHANGELOG.md modules/primer
+  # copy the CHANGELOG.md primer-css for publishing
+  - cp CHANGELOG.md modules/primer-css
   - script/after_success
 
 deploy:

CHANGELOG.md

@@ -1,56 +1,17 @@
-# 10.0.1 (2017-11-14)
-
-#### :bug: Bug Fix
-
-* Fixing `peerDependencies` to be greater than equal to versions. Fixing version mismatch with buttons and box.
-
-# 10.0.0 (2017-11-13)
-
-#### :boom: Breaking Change
-* [#395](https://github.com/primer/primer/pull/395) Renaming primer-css to primer. ([@jonrohan](https://github.com/jonrohan))
-* [#379](https://github.com/primer/primer/pull/379) Deprecating primer-cards and form-cards. ([@jonrohan](https://github.com/jonrohan))
-* [#336](https://github.com/primer/primer/pull/336) Move `primer-breadcrumbs` from marketing to core ([@jonrohan]((https://github.com/jonrohan))
-
-#### :rocket: Enhancement
-* [#371](https://github.com/primer/primer/pull/371) Add .details-reset. ([@muan](https://github.com/muan))
-* [#375](https://github.com/primer/primer/pull/375) New utilities & docs - fade out, hover grow, border white fade, responsive positioning, and circle. ([@sophshep](https://github.com/sophshep))
-* [#383](https://github.com/primer/primer/pull/383) Add 'Popover' component. ([@brandonrosage](https://github.com/brandonrosage))
-* [#377](https://github.com/primer/primer/pull/377) Refactor and add underline nav component. ([@ampinsk](https://github.com/ampinsk))
-* [#337](https://github.com/primer/primer/pull/337) Add marketing buttons to primer-marketing. ([@gladwearefriends](https://github.com/gladwearefriends))
-* [#342](https://github.com/primer/primer/pull/342) Add Subhead component. ([@shawnbot](https://github.com/shawnbot))
-* [#341](https://github.com/primer/primer/pull/341) Add branch-name component from github/github. ([@shawnbot](https://github.com/shawnbot))
-
-#### :bug: Bug Fix
-* [#360](https://github.com/primer/primer/pull/360) Remove ::before ::after padding hack on markdown. ([@jonrohan](https://github.com/jonrohan))
-* [#320](https://github.com/primer/primer/pull/320) Remove -webkit-text-decoration-skip override. ([@antons](https://github.com/antons))
-* [#359](https://github.com/primer/primer/pull/359) Change markdown li break to handle Safari 10.x user stylesheet bug. ([@feministy](https://github.com/feministy))
-* [#388](https://github.com/primer/primer/pull/388) Button border-radius fix to override Chroma 62. ([@broccolini](https://github.com/broccolini))
-* [#307](https://github.com/primer/primer/pull/307) Do not suppress opacity transition for tooltipped-no-delay. ([@astorije](https://github.com/astorije))
-
-#### :house: Internal
-* [#396](https://github.com/primer/primer/pull/396) Use lerna-changelog to generate a changelog. ([@jonrohan](https://github.com/jonrohan))
-* [#382](https://github.com/primer/primer/pull/382) Update Button docs. ([@JasonEtco](https://github.com/JasonEtco))
-* [#390](https://github.com/primer/primer/pull/390) Updating `storiesFromMarkdown` to read in rails Octicons helper and replace with react component. ([@jonrohan](https://github.com/jonrohan))
-* [#389](https://github.com/primer/primer/pull/389) Publish alpha release any time we're not on a release branch or master. ([@jonrohan](https://github.com/jonrohan))
-* [#384](https://github.com/primer/primer/pull/384) Add test to check for the current year in the license and source. ([@jonrohan](https://github.com/jonrohan))
-* [#374](https://github.com/primer/primer/pull/374) Improve Pull Request template. ([@agisilaos](https://github.com/agisilaos))
-
-#### Committers: 13
-- Agisilaos Tsaraboulidis ([agisilaos](https://github.com/agisilaos))
-- Amanda Pinsker ([ampinsk](https://github.com/ampinsk))
-- Anton Sotkov ([antons](https://github.com/antons))
-- Brandon Rosage ([brandonrosage](https://github.com/brandonrosage))
-- Catherine Bui ([gladwearefriends](https://github.com/gladwearefriends))
-- Diana Mounter ([broccolini](https://github.com/broccolini))
-- Jason Etcovitch ([JasonEtco](https://github.com/JasonEtco))
-- Jon Rohan ([jonrohan](https://github.com/jonrohan))
-- Jérémie Astori ([astorije](https://github.com/astorije))
-- Mu-An ✌️ Chiou ([muan](https://github.com/muan))
-- Shawn Allen ([shawnbot](https://github.com/shawnbot))
-- Sophie Shepherd ([sophshep](https://github.com/sophshep))
-- liz abinante! ([feministy](https://github.com/feministy))
-
-**Special thanks to @shaharke for transferring ownership of the Primer npm package to us so that we could make the rename  happen!** :heart:
+# 10.0.0
+
+### Added
+- New module `primer-subhead`. The Subhead is a simple header with a bottom border. It's designed to be used on settings and configuration pages.
+- Importing `.input-group` into `primer-forms` module.
+- New module `primer-branch-name` "A nice, consistent way to display branch names."
+- New module `primer-dropdown` "A lightweight context menu for navigation and actions."
+
+### Removed
+- Removing `primer-cards` module.
+- Removing `.form-cards` styles.
+
+### Changes
+- Moving `primer-breadcrumb` from `primer-marketing` to `primer-core`
 
 # 9.6.0
 
@@ -78,7 +39,7 @@
 - Add deprecation warnings for `primer-cards` and `primer-forms/lib/form-validation.scss` #347 (these will be removed in v10.0.0)
 
 ### Changes
-- Update npm metadata for `primer`, `primer-core`, `primer-product`, and `primer-marketing` #328
+- Update npm metadata for `primer-css`, `primer-core`, `primer-product`, and `primer-marketing` #328
 - Remove `HEAD` heading from the changelog #327
 
 # 9.3.0
@@ -90,7 +51,7 @@
 ## Changes
 - Removes `docs` from `gitignore`
 - Removes the `^` from all dependencies so that we can publish exact versions
-- Consolidates release notes from various sources into one changelog located in `/modules/primer/CHANGELOG.md`
+- Consolidates release notes from various sources into one changelog located in `/modules/primer-css/CHANGELOG.md`
 
 # 9.2.0
 
@@ -101,7 +62,7 @@
 ## Changes
 
 - Remove per-module configurations (`.gitignore`, `.postcss.json`, `.stylelintrc.json`) and `CHANGELOG.md` files in #284
-- Replace most static `font-size`, `font-weight`, and `line-height` CSS property values with their [SCSS variable equivalents](https://github.com/primer/primer/blob/c9ea37316fbb73c4d9931c52b42bc197260c0bf6/modules/primer-support/lib/variables/typography.scss#L12-L33) in #252
+- Replace most static `font-size`, `font-weight`, and `line-height` CSS property values with their [SCSS variable equivalents](https://github.com/primer/primer-css/blob/c9ea37316fbb73c4d9931c52b42bc197260c0bf6/modules/primer-support/lib/variables/typography.scss#L12-L33) in #252
 - Refactor CI scripts to use Travis conditional deployment for release candidate and final release publish steps in #290
 
 # 9.1.1
@@ -148,7 +109,7 @@ This release also includes major improvements to our Travis build scripts to aut
 
 We discovered that `primer-core` specified and outdated version of `primer-base` in it's dependencies. The outdated version did not have `normalize.scss` included which could cause some issues. This has issue occurred during v7.0.0 when creating the new monorepo. Also fixes repo urls in `package.json` for individual packages.
 
-See PR [#243](https://github.com/primer/primer/pull/243)
+See PR [#243](https://github.com/primer/primer-css/pull/243)
 
 ## Changes
 
@@ -193,7 +154,7 @@ See PR [#243](https://github.com/primer/primer/pull/243)
 
 # 8.0.0 - Imports
 
-Fixes issues with the ordering of imports in each of our meta-packages. See PR [#239](https://github.com/primer/primer/pull/239)
+Fixes issues with the ordering of imports in each of our meta-packages. See PR [#239](https://github.com/primer/primer-css/pull/239)
 
 
 ## Changes
@@ -209,7 +170,7 @@ Fixes issues with the ordering of imports in each of our meta-packages. See PR [
 
 # 7.0.0 - Monorepo
 
-In an effort to improve our publishing workflow we turned Primer into a monorepo, made this repo the source of truth for Primer by removing Primer modules from GitHub, and setup Lerna for managing multiple packages and maintaining independent versioning for all our modules.
+In an effort to improve our publishing workflow we turned Primer CSS into a monorepo, made this repo the source of truth for Primer by removing Primer modules from GitHub, and setup Lerna for managing multiple packages and maintaining independent versioning for all our modules.
 
 This is exciting because:
 
@@ -218,7 +179,7 @@ This is exciting because:
 - we no longer have files like package.json, scripts, and readme's in the GitHub app that don't really belong there
 - **we can accept pull requests from external contributors** again!
 
-See PR for more details on this change: https://github.com/primer/primer/pull/230
+See PR for more details on this change: https://github.com/primer/primer-css/pull/230
 
 ## Other changes:
 

README.md

@@ -1,37 +1,37 @@
-# Primer
+# Primer CSS
 
-[![npm version](http://img.shields.io/npm/v/primer.svg)](https://www.npmjs.org/package/primer)
-[![Build Status](https://travis-ci.org/primer/primer.svg?branch=master)](https://travis-ci.org/primer/primer)
+[![npm version](http://img.shields.io/npm/v/primer-css.svg)](https://www.npmjs.org/package/primer-css)
+[![Build Status](https://travis-ci.org/primer/primer-css.svg?branch=master)](https://travis-ci.org/primer/primer-css)
 
-Primer is the design system that powers GitHub. Primer includes 23 packages that are grouped into 3 core meta-packages for easy install. Each package and meta-package is independently versioned and distributed via npm, so it's easy to include all or part of Primer within your own project.
+Primer is the CSS framework that powers GitHub's front-end design. Primer CSS includes 23 packages that are grouped into 3 core meta-packages for easy install. Each package and meta-package is independently versioned and distributed via npm, so it's easy to include all or part of Primer within your own project.
 
 ## Packages
 
-The Primer repo is managed as a monorepo that is composed of many npm packages.
+The Primer CSS repo is managed as a monorepo that is composed of many npm packages.
 
 ### Core Packages
 
 | Package | Version |
 |---|---|
-| **[primer](/modules/primer)** <br />Includes all 23 packages | [![npm](http://img.shields.io/npm/v/primer.svg)](https://www.npmjs.com/package/primer) |
+| **[primer-css](/modules/primer-css)** <br />Includes all 23 packages | [![npm](http://img.shields.io/npm/v/primer-css.svg)](https://www.npmjs.com/package/primer-css) |
 | [primer-core](/modules/primer-core) | [![npm](http://img.shields.io/npm/v/primer-core.svg)](https://www.npmjs.com/package/primer-core) |
 | [primer-product](/modules/primer-product) |  [![npm](http://img.shields.io/npm/v/primer-product.svg)](https://www.npmjs.com/package/primer-product) |
 | [primer-marketing](/modules/primer-marketing) | [![npm](http://img.shields.io/npm/v/primer-marketing.svg)](https://www.npmjs.com/package/primer-marketing) |
 
 ## Install
 
-This repository is distributed with [npm][npm]. After [installing npm][install-npm], you can install `primer` with this command.
+This repository is distributed with [npm][npm]. After [installing npm][install-npm], you can install `primer-css` with this command.
 
 ```sh
-$ npm install --save primer
+$ npm install --save primer-css
 ```
 
 ## Usage
 
 The source files included are written in [Sass][sass] (SCSS). After [installing](#install) with npm, you can add your project's `node_modules` directory to your Sass [include paths](https://github.com/sass/node-sass#includepaths) (AKA [load paths](http://technology.customink.com/blog/2014/10/09/understanding-and-using-sass-load-paths/) in Ruby), then import it like this:
 
 ```scss
-@import "primer/index.scss";
+@import "primer-css/index.scss";
 ```
 
 You can import individual Primer modules by installing them with npm, for instance:
@@ -46,10 +46,10 @@ Then, you would import the module with:
 @import "primer-navigation/index.scss";
 ```
 
-Or, while you're figuring out which modules you need, you can import them directly from the `primer` [`packages` directory](./packages) like so:
+Or, while you're figuring out which modules you need, you can import them directly from the `primer-css` [`packages` directory](./packages) like so:
 
 ```scss
-@import "primer/modules/primer-navigation/index.css";
+@import "primer-css/modules/primer-navigation/index.css";
 ```
 
 
@@ -70,7 +70,7 @@ You can read more about primer in the [docs][docs].
 [MIT](./LICENSE) &copy; [GitHub](https://github.com/)
 
 [primer]: https://github.com/primer/primer
-[docs]: http://primer.github.io/
+[docs]: http://primercss.io/
 [npm]: https://www.npmjs.com/
 [install-npm]: https://docs.npmjs.com/getting-started/installing-node
 [sass]: http://sass-lang.com/

lerna.json

@@ -4,17 +4,5 @@
     "modules/*",
     "tools/*"
   ],
-  "changelog": {
-    "repo": "primer/primer",
-    "labels": {
-      "Tag: Breaking Change": ":boom: Breaking Change",
-      "Tag: Enhancement": ":rocket: Enhancement",
-      "Tag: Bug Fix": ":bug: Bug Fix",
-      "Tag: Polish": ":nail_care: Polish",
-      "Tag: Documentation": ":memo: Documentation",
-      "Tag: Internal": ":house: Internal"
-    },
-    "cacheDir": ".changelog"
-  },
   "version": "independent"
 }

modules/README.md

@@ -1,3 +1,3 @@
 # Primer modules
 
-Primer is monorepo composed of 23 packages which can be installed altogether or individually via npm. We group our packages into 3 meta-packages which you can install individually: [primer-core](primer-core), [primer-product](primer-product), and [primer-marketing](primer-marketing). Install [primer](primer) if you want to install all 23 packages.
+Primer CSS is monorepo composed of 23 packages which can be installed altogether or individually via npm. We group our packages into 3 meta-packages which you can install individually: [primer-core](primer-core), [primer-product](primer-product), and [primer-marketing](primer-marketing). Install [primer-css](primer-css) if you want to install all 23 packages.

modules/primer-alerts/README.md

@@ -1,11 +1,11 @@
-# Primer Alerts
+# Primer CSS Alerts
 
 [![npm version](http://img.shields.io/npm/v/primer-alerts.svg)](https://www.npmjs.org/package/primer-alerts)
-[![Build Status](https://travis-ci.org/primer/primer.svg?branch=master)](https://travis-ci.org/primer/primer)
+[![Build Status](https://travis-ci.org/primer/primer-css.svg?branch=master)](https://travis-ci.org/primer/primer-css)
 
 > Flash messages, or alerts, inform users of successful or pending actions. Use them sparingly. Don’t show more than one at a time.
 
-This repository is a module of the full [primer][primer] repository.
+This repository is a module of the full [primer-css][primer-css] repository.
 
 ## Install
 
@@ -144,8 +144,8 @@ A flash message that is full width and removes border and border radius.
 
 [MIT](./LICENSE) © [GitHub](https://github.com/)
 
-[primer]: https://github.com/primer/primer
-[docs]: http://primer.github.io/
+[primer-css]: https://github.com/primer/primer
+[docs]: http://primercss.io/
 [npm]: https://www.npmjs.com/
 [install-npm]: https://docs.npmjs.com/getting-started/installing-node
 [sass]: http://sass-lang.com/