Skip to content

Commit fdd6ce7

Browse files
authored
docs: fix ui shell story labels and links (#22343)
1 parent c9d2c7e commit fdd6ce7

3 files changed

Lines changed: 53 additions & 53 deletions

File tree

packages/react/src/components/UIShell/UIShell.HeaderBase.stories.js

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* Copyright IBM Corp. 2016, 2023
2+
* Copyright IBM Corp. 2016, 2026
33
*
44
* This source code is licensed under the Apache-2.0 license found in the
55
* LICENSE file in the root directory of this source tree.
@@ -56,13 +56,13 @@ const StoryContent = ({ useResponsiveOffset = true }) => {
5656
<div className={classNameFirstColumn}>
5757
<h2 style={{ margin: '0 0 30px' }}>Purpose and function</h2>
5858
<p>
59-
The shell is perhaps the most crucial piece of any UI built with
60-
<a href="www.carbondesignsystem.com"> Carbon</a>. It contains the
61-
shared navigation framework for the entire design system and ties
62-
the products in IBM’s portfolio together in a cohesive and elegant
63-
way. The shell is the home of the topmost navigation, where users
64-
can quickly and dependably gain their bearings and move between
65-
pages.
59+
The shell is perhaps the most crucial piece of any UI built with{' '}
60+
<a href="https://www.carbondesignsystem.com/">Carbon</a>. It
61+
contains the shared navigation framework for the entire design
62+
system and ties the products in IBM’s portfolio together in a
63+
cohesive and elegant way. The shell is the home of the topmost
64+
navigation, where users can quickly and dependably gain their
65+
bearings and move between pages.
6666
<br />
6767
<br />
6868
The shell was designed with maximum flexibility built in, to serve
@@ -220,7 +220,7 @@ export const HeaderWNavigation = () => (
220220
/>
221221
);
222222

223-
HeaderWNavigation.storyName = 'Header w/ Navigation';
223+
HeaderWNavigation.storyName = 'Header with Navigation';
224224

225225
export const HeaderWNavigationAndActions = () => (
226226
<HeaderContainer
@@ -290,7 +290,7 @@ export const HeaderWNavigationAndActions = () => (
290290
/>
291291
);
292292

293-
HeaderWNavigationAndActions.storyName = 'Header w/ Navigation and Actions';
293+
HeaderWNavigationAndActions.storyName = 'Header with Navigation and Actions';
294294

295295
export const HeaderWNavigationActionsAndSideNav = () => (
296296
<HeaderContainer
@@ -417,7 +417,7 @@ export const HeaderWNavigationActionsAndSideNav = () => (
417417
);
418418

419419
HeaderWNavigationActionsAndSideNav.storyName =
420-
'Header w/ Navigation, Actions and SideNav';
420+
'Header with Navigation, Actions and Side Nav';
421421

422422
export const HeaderWSideNav = () => (
423423
<HeaderContainer
@@ -497,7 +497,7 @@ export const HeaderWSideNav = () => (
497497
/>
498498
);
499499

500-
HeaderWSideNav.storyName = 'Header w/ SideNav';
500+
HeaderWSideNav.storyName = 'Header with Side Nav';
501501

502502
export const HeaderWActionsAndRightPanel = (args) => {
503503
// Add state to control panel expansion
@@ -559,7 +559,7 @@ export const HeaderWActionsAndRightPanel = (args) => {
559559
);
560560
};
561561

562-
HeaderWActionsAndRightPanel.storyName = 'Header w/ Actions and Right Panel';
562+
HeaderWActionsAndRightPanel.storyName = 'Header with Actions and Right Panel';
563563

564564
HeaderWActionsAndRightPanel.argTypes = {
565565
badgeCount: {
@@ -642,4 +642,4 @@ export const HeaderWActionsAndSwitcher = () => (
642642
/>
643643
);
644644

645-
HeaderWActionsAndSwitcher.storyName = 'Header w/ Actions and Switcher';
645+
HeaderWActionsAndSwitcher.storyName = 'Header with Actions and Switcher';

packages/react/src/components/UIShell/UIShell.SideNav.stories.js

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* Copyright IBM Corp. 2016, 2023
2+
* Copyright IBM Corp. 2016, 2026
33
*
44
* This source code is licensed under the Apache-2.0 license found in the
55
* LICENSE file in the root directory of this source tree.
@@ -56,13 +56,13 @@ const StoryContent = ({ useResponsiveOffset = true }) => {
5656
<div className={classNameFirstColumn}>
5757
<h2 style={{ margin: '0 0 30px' }}>Purpose and function</h2>
5858
<p>
59-
The shell is perhaps the most crucial piece of any UI built with
60-
<a href="www.carbondesignsystem.com"> Carbon</a>. It contains the
61-
shared navigation framework for the entire design system and ties
62-
the products in IBM’s portfolio together in a cohesive and elegant
63-
way. The shell is the home of the topmost navigation, where users
64-
can quickly and dependably gain their bearings and move between
65-
pages.
59+
The shell is perhaps the most crucial piece of any UI built with{' '}
60+
<a href="https://www.carbondesignsystem.com/">Carbon</a>. It
61+
contains the shared navigation framework for the entire design
62+
system and ties the products in IBM’s portfolio together in a
63+
cohesive and elegant way. The shell is the home of the topmost
64+
navigation, where users can quickly and dependably gain their
65+
bearings and move between pages.
6666
<br />
6767
<br />
6868
The shell was designed with maximum flexibility built in, to serve
@@ -227,7 +227,7 @@ export const FixedSideNav = () => (
227227
</>
228228
);
229229

230-
FixedSideNav.storyName = 'Fixed SideNav';
230+
FixedSideNav.storyName = 'Fixed Side Nav';
231231

232232
export const FixedSideNavWIcons = () => (
233233
<>
@@ -294,7 +294,7 @@ export const FixedSideNavWIcons = () => (
294294
</>
295295
);
296296

297-
FixedSideNavWIcons.storyName = 'Fixed SideNav w/ Icons';
297+
FixedSideNavWIcons.storyName = 'Fixed Side Nav with Icons';
298298

299299
export const FixedSideNavWDivider = () => (
300300
<>
@@ -358,7 +358,7 @@ export const FixedSideNavWDivider = () => (
358358
</>
359359
);
360360

361-
FixedSideNavWDivider.storyName = 'Fixed SideNav w/ Divider';
361+
FixedSideNavWDivider.storyName = 'Fixed Side Nav with Divider';
362362

363363
export const SideNavRailWHeader = (args) => (
364364
<HeaderContainer
@@ -514,7 +514,7 @@ SideNavRailWHeader.argTypes = {
514514
},
515515
};
516516

517-
SideNavRailWHeader.storyName = 'SideNav Rail w/Header';
517+
SideNavRailWHeader.storyName = 'Side Nav Rail with Header';
518518

519519
export const SideNavWLargeSideNavItems = () => (
520520
<>
@@ -543,7 +543,7 @@ export const SideNavWLargeSideNavItems = () => (
543543
<SideNavLink href="https://www.carbondesignsystem.com/" large>
544544
Large link
545545
</SideNavLink>
546-
<SideNavMenu renderIcon={Fade} title="Large menu w/icon" large>
546+
<SideNavMenu renderIcon={Fade} title="Large menu with icon" large>
547547
<SideNavMenuItem href="https://www.carbondesignsystem.com/">
548548
Menu 1
549549
</SideNavMenuItem>
@@ -558,12 +558,12 @@ export const SideNavWLargeSideNavItems = () => (
558558
renderIcon={Fade}
559559
href="https://www.carbondesignsystem.com/"
560560
large>
561-
Large link w/icon
561+
Large link with icon
562562
</SideNavLink>
563563
</SideNavItems>
564564
</SideNav>
565565
<StoryContent />
566566
</>
567567
);
568568

569-
SideNavWLargeSideNavItems.storyName = 'SideNav w/ large side nav items';
569+
SideNavWLargeSideNavItems.storyName = 'Side Nav with Large Side Nav Items';

packages/web-components/src/components/ui-shell/ui-shell.stories.ts

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* Copyright IBM Corp. 2019, 2024
2+
* Copyright IBM Corp. 2019, 2026
33
*
44
* This source code is licensed under the Apache-2.0 license found in the
55
* LICENSE file in the root directory of this source tree.
@@ -48,12 +48,12 @@ const StoryContent = ({ useResponsiveOffset = true }) => {
4848
<h2 style="margin: 0 0 30px">Purpose and function</h2>
4949
<p>
5050
The shell is perhaps the most crucial piece of any UI built with
51-
<a href="www.carbondesignsystem.com"> Carbon</a>. It contains the
52-
shared navigation framework for the entire design system and ties
53-
the products in IBM’s portfolio together in a cohesive and elegant
54-
way. The shell is the home of the topmost navigation, where users
55-
can quickly and dependably gain their bearings and move between
56-
pages.
51+
<a href="https://www.carbondesignsystem.com/">Carbon</a>. It
52+
contains the shared navigation framework for the entire design
53+
system and ties the products in IBM’s portfolio together in a
54+
cohesive and elegant way. The shell is the home of the topmost
55+
navigation, where users can quickly and dependably gain their
56+
bearings and move between pages.
5757
<br />
5858
<br />
5959
The shell was designed with maximum flexibility built in, to serve
@@ -120,7 +120,7 @@ const StoryContent = ({ useResponsiveOffset = true }) => {
120120
};
121121

122122
export const FixedSideNav = {
123-
name: 'Fixed SideNav',
123+
name: 'Fixed Side Nav',
124124
render: () => {
125125
const result = html`
126126
<style>
@@ -187,7 +187,7 @@ export const FixedSideNav = {
187187
};
188188

189189
export const FixedSideNavDivider = {
190-
name: 'Fixed SideNav w/Divider',
190+
name: 'Fixed Side Nav with Divider',
191191
render: () => {
192192
const result = html`
193193
<style>
@@ -253,7 +253,7 @@ export const FixedSideNavDivider = {
253253
};
254254

255255
export const FixedSideNavIcons = {
256-
name: 'Fixed SideNav w/ Icons',
256+
name: 'Fixed Side Nav with Icons',
257257
render: () => {
258258
const result = html`
259259
<style>
@@ -335,7 +335,7 @@ export const HeaderBase = {
335335
};
336336

337337
export const HeaderBaseWActions = {
338-
name: 'Header Base w/ Actions',
338+
name: 'Header Base with Actions',
339339
render: () =>
340340
html` <style>
341341
${styles}
@@ -364,7 +364,7 @@ export const HeaderBaseWActions = {
364364
};
365365

366366
export const HeaderBaseWActionsRightPanel = {
367-
name: 'Header Base w/ Actions and Right Panel',
367+
name: 'Header Base with Actions and Right Panel',
368368
argTypes: {
369369
badgeCount: {
370370
control: 'number',
@@ -411,7 +411,7 @@ export const HeaderBaseWActionsRightPanel = {
411411
};
412412

413413
export const HeaderBaseWActionsSwitcher = {
414-
name: 'Header Base w/ Actions and Switcher',
414+
name: 'Header Base with Actions and Switcher',
415415
render: () =>
416416
html` <style>
417417
${styles}
@@ -467,7 +467,7 @@ export const HeaderBaseWActionsSwitcher = {
467467
};
468468

469469
export const HeaderBaseWNavigationActionsAndSideNav = {
470-
name: 'Header Base w/ Navigation, Actions and SideNav',
470+
name: 'Header Base with Navigation, Actions and Side Nav',
471471
render: () =>
472472
html` <style>
473473
${styles}
@@ -594,7 +594,7 @@ export const HeaderBaseWNavigationActionsAndSideNav = {
594594
};
595595

596596
export const HeaderBaseWNavigationActions = {
597-
name: 'Header Base w/ Navigation and Actions',
597+
name: 'Header Base with Navigation and Actions',
598598
render: () =>
599599
html` <style>
600600
${styles}
@@ -678,7 +678,7 @@ export const HeaderBaseWNavigationActions = {
678678
};
679679

680680
export const HeaderBaseWNavigation = {
681-
name: 'Header Base w/ Navigation',
681+
name: 'Header Base with Navigation',
682682
render: () =>
683683
html` <style>
684684
${styles}
@@ -743,7 +743,7 @@ export const HeaderBaseWNavigation = {
743743
};
744744

745745
export const HeaderBaseWSideNav = {
746-
name: 'Header Base w/ SideNav',
746+
name: 'Header Base with Side Nav',
747747
render: () => {
748748
const result = html`
749749
<style>
@@ -821,7 +821,7 @@ export const HeaderBaseWSideNav = {
821821
};
822822

823823
export const HeaderBaseWSkipToContent = {
824-
name: 'Header Base w/ SkipToContent',
824+
name: 'Header Base with SkipToContent',
825825
render: () =>
826826
html` <style>
827827
${styles}
@@ -852,7 +852,7 @@ export const HeaderBaseWSkipToContent = {
852852
};
853853

854854
export const SideNavRail = {
855-
name: 'SideNav Rail',
855+
name: 'Side Nav Rail',
856856
render: () =>
857857
html` <style>
858858
${styles}
@@ -916,7 +916,7 @@ export const SideNavRail = {
916916
};
917917

918918
export const SideNavRailWHeader = {
919-
name: 'SideNav Rail w/ Header',
919+
name: 'Side Nav Rail with Header',
920920
render: () =>
921921
html` <style>
922922
${styles}
@@ -1026,7 +1026,7 @@ export const SideNavRailWHeader = {
10261026
};
10271027

10281028
export const SideNavWLargeSideNavItems = {
1029-
name: 'SideNav w/ large side nav items',
1029+
name: 'Side Nav with Large Side Nav Items',
10301030
render: () => {
10311031
const result = html`
10321032
<style>
@@ -1052,7 +1052,7 @@ export const SideNavWLargeSideNavItems = {
10521052
<cds-side-nav-link large href="javascript:void(0)"
10531053
>Large link</cds-side-nav-link
10541054
>
1055-
<cds-side-nav-menu large title="Large menu w/icon"
1055+
<cds-side-nav-menu large title="Large menu with icon"
10561056
>${iconLoader(Fade16, { slot: 'title-icon' })}
10571057
<cds-side-nav-menu-item href="${linksHref}">
10581058
Menu 1
@@ -1065,8 +1065,8 @@ export const SideNavWLargeSideNavItems = {
10651065
</cds-side-nav-menu-item>
10661066
</cds-side-nav-menu>
10671067
<cds-side-nav-link large href="javascript:void(0)">
1068-
${iconLoader(Fade16, { slot: 'title-icon' })} Large link
1069-
w/icon</cds-side-nav-link
1068+
${iconLoader(Fade16, { slot: 'title-icon' })} Large link with
1069+
icon</cds-side-nav-link
10701070
>
10711071
</cds-side-nav-items>
10721072
</cds-side-nav>

0 commit comments

Comments
 (0)