mirror of
https://github.com/NoRedInk/noredink-ui.git
synced 2024-09-21 12:19:03 +03:00
Merge pull request #1607 from NoRedInk/tessa/add-clickable-text-menu-trigger-examples
Adds example view illustrating Menu regression
This commit is contained in:
commit
fb4ee33140
@ -388,6 +388,77 @@ view ellieLinkConfig state =
|
||||
]
|
||||
}
|
||||
]
|
||||
, Heading.h2
|
||||
[ Heading.plaintext "Menu trigger base styles"
|
||||
, Heading.css [ Css.margin2 Spacing.verticalSpacerPx Css.zero ]
|
||||
]
|
||||
, Table.view []
|
||||
[ Table.string
|
||||
{ header = "Trigger type"
|
||||
, value = .menu
|
||||
, width = Css.pct 30
|
||||
, cellStyles = always [ Css.padding2 (Css.px 14) (Css.px 7), Css.verticalAlign Css.middle, Css.fontWeight Css.bold ]
|
||||
, sort = Nothing
|
||||
}
|
||||
, Table.custom
|
||||
{ header = text "Example"
|
||||
, view = .example
|
||||
, width = Css.px 300
|
||||
, cellStyles = always [ Css.padding2 (Css.px 14) (Css.px 7), Css.verticalAlign Css.middle ]
|
||||
, sort = Nothing
|
||||
}
|
||||
]
|
||||
[ { menu = "Menu.defaultTrigger"
|
||||
, example =
|
||||
Menu.view (FocusAndToggle "defaultTrigger")
|
||||
[ Menu.defaultTrigger "Log in" []
|
||||
, Menu.isOpen (isOpen "defaultTrigger")
|
||||
, Menu.buttonId "defaultTrigger"
|
||||
, Menu.menuId "defaultTrigger"
|
||||
]
|
||||
[]
|
||||
}
|
||||
, { menu = "Menu.button"
|
||||
, example =
|
||||
Menu.view (FocusAndToggle "button")
|
||||
[ Menu.button "Log in" []
|
||||
, Menu.isOpen (isOpen "button")
|
||||
, Menu.buttonId "button"
|
||||
, Menu.menuId "button"
|
||||
]
|
||||
[]
|
||||
}
|
||||
, { menu = "Menu.clickableText"
|
||||
, example =
|
||||
Menu.view (FocusAndToggle "clickableText")
|
||||
[ Menu.clickableText "Log in" []
|
||||
, Menu.isOpen (isOpen "clickableText")
|
||||
, Menu.buttonId "clickableText"
|
||||
, Menu.menuId "clickableText"
|
||||
]
|
||||
[]
|
||||
}
|
||||
, { menu = "Menu.clickableSvg with UiIcon.gear"
|
||||
, example =
|
||||
Menu.view (FocusAndToggle "clickableSvg")
|
||||
[ Menu.clickableSvg "Log in" UiIcon.gear []
|
||||
, Menu.isOpen (isOpen "clickableSvg")
|
||||
, Menu.buttonId "clickableSvg"
|
||||
, Menu.menuId "clickableSvg"
|
||||
]
|
||||
[]
|
||||
}
|
||||
, { menu = "Menu.clickableSvgWithoutIndicator with UiIcon.gear"
|
||||
, example =
|
||||
Menu.view (FocusAndToggle "clickableSvgWithoutIndicator")
|
||||
[ Menu.clickableSvgWithoutIndicator "Log in" UiIcon.gear []
|
||||
, Menu.isOpen (isOpen "clickableSvgWithoutIndicator")
|
||||
, Menu.buttonId "clickableSvgWithoutIndicator"
|
||||
, Menu.menuId "clickableSvgWithoutIndicator"
|
||||
]
|
||||
[]
|
||||
}
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
|
@ -2,6 +2,7 @@ Nri.Ui.Accordion.V3,upgrade to V4
|
||||
Nri.Ui.Block.V4,upgrade to V6
|
||||
Nri.Ui.Block.V5,upgrade to V6
|
||||
Nri.Ui.Carousel.V1,upgrade to V2
|
||||
Nri.Ui.ClickableText.V3,upgrade to V4
|
||||
Nri.Ui.WhenFocusLeaves.V1,upgrade to V2
|
||||
Nri.Ui.Highlighter.V4,upgrade to V5
|
||||
Nri.Ui.Mark.V2,upgrade to V5
|
||||
|
|
@ -88,6 +88,9 @@ hint = 'upgrade to V7'
|
||||
hint = 'upgrade to V2'
|
||||
usages = ['component-catalog-app/Examples/Tooltip.elm']
|
||||
|
||||
[forbidden."Nri.Ui.ClickableText.V3"]
|
||||
hint = 'upgrade to V4'
|
||||
|
||||
[forbidden."Nri.Ui.Container.V1"]
|
||||
hint = 'upgrade to V2'
|
||||
|
||||
|
12
package-lock.json
generated
12
package-lock.json
generated
@ -728,9 +728,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/axe-core": {
|
||||
"version": "4.7.0",
|
||||
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.7.0.tgz",
|
||||
"integrity": "sha512-M0JtH+hlOL5pLQwHOLNYZaXuhqmvS8oExsqB1SBYgA4Dk7u/xx+YdGHXaK5pyUfed5mYXdlYiphWq3G8cRi5JQ==",
|
||||
"version": "4.8.3",
|
||||
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.8.3.tgz",
|
||||
"integrity": "sha512-d5ZQHPSPkF9Tw+yfyDcRoUOc4g/8UloJJe5J8m4L5+c7AtDdjDLRxew/knnI4CxvtdxEUVgWz4x3OIQUIFiMfw==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
@ -5351,9 +5351,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"axe-core": {
|
||||
"version": "4.7.0",
|
||||
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.7.0.tgz",
|
||||
"integrity": "sha512-M0JtH+hlOL5pLQwHOLNYZaXuhqmvS8oExsqB1SBYgA4Dk7u/xx+YdGHXaK5pyUfed5mYXdlYiphWq3G8cRi5JQ==",
|
||||
"version": "4.8.3",
|
||||
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.8.3.tgz",
|
||||
"integrity": "sha512-d5ZQHPSPkF9Tw+yfyDcRoUOc4g/8UloJJe5J8m4L5+c7AtDdjDLRxew/knnI4CxvtdxEUVgWz4x3OIQUIFiMfw==",
|
||||
"dev": true
|
||||
},
|
||||
"balanced-match": {
|
||||
|
@ -30,7 +30,7 @@
|
||||
"@axe-core/puppeteer": "^4.4.3",
|
||||
"@percy/cli": "^1.4.0",
|
||||
"@percy/puppeteer": "^2.0.2",
|
||||
"axe-core": "^4.7.0",
|
||||
"axe-core": "^4.8.3",
|
||||
"browserify": "^17.0.0",
|
||||
"elm-test": "0.19.1-revision12",
|
||||
"expect": "29.5.0",
|
||||
|
@ -230,6 +230,7 @@ describe("UI tests", function () {
|
||||
};
|
||||
|
||||
const skippedRules = {
|
||||
Block: ["scrollable-region-focusable"],
|
||||
// Loading's color contrast check seems to change behavior depending on whether Percy snapshots are taken or not
|
||||
Loading: ["color-contrast"],
|
||||
Outline: ["color-contrast"],
|
||||
|
Loading…
Reference in New Issue
Block a user