@papillonarts/components 0.35.0 → 0.36.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/build/Legacy/Blankslate/__tests__/Blankslate.doc.md +57 -0
  2. package/build/Legacy/Breadcrumb/__tests__/Breadcrumb.doc.md +33 -0
  3. package/build/Legacy/Markdown/__tests__/Markdown.doc.md +3 -3
  4. package/build/Legacy/SyntaxHighlighter/__tests__/SyntaxHighlighter.doc.md +3 -3
  5. package/build/Modern/Flash/Flash.d.ts +1 -2
  6. package/build/Modern/Flash/Flash.d.ts.map +1 -1
  7. package/build/Modern/Flash/Flash.js +3 -4
  8. package/build/Modern/Flash/__tests__/Flash.doc.md +0 -1
  9. package/build/Modern/Flash/index.d.ts +1 -1
  10. package/build/Modern/Flash/index.d.ts.map +1 -1
  11. package/build/Modern/Flash/index.js +3 -4
  12. package/build/Modern/Link/Link.d.ts +19 -0
  13. package/build/Modern/Link/Link.d.ts.map +1 -0
  14. package/build/Modern/Link/Link.docs.json +61 -0
  15. package/build/Modern/Link/Link.js +57 -0
  16. package/build/Modern/Link/Link.module.scss +39 -0
  17. package/build/Modern/Link/__tests__/Link.doc.md +10 -0
  18. package/build/Modern/Link/index.d.ts +3 -0
  19. package/build/Modern/Link/index.d.ts.map +1 -0
  20. package/build/Modern/Link/index.js +12 -0
  21. package/build/Modern/Pagination/Pagination.d.ts +22 -0
  22. package/build/Modern/Pagination/Pagination.d.ts.map +1 -0
  23. package/build/Modern/Pagination/Pagination.docs.json +77 -0
  24. package/build/Modern/Pagination/Pagination.js +132 -0
  25. package/build/Modern/Pagination/Pagination.model.d.ts +26 -0
  26. package/build/Modern/Pagination/Pagination.model.d.ts.map +1 -0
  27. package/build/Modern/Pagination/Pagination.model.js +211 -0
  28. package/build/Modern/Pagination/Pagination.module.scss +141 -0
  29. package/build/Modern/Pagination/__tests__/Pagination.doc.md +12 -0
  30. package/build/Modern/Pagination/index.d.ts +3 -0
  31. package/build/Modern/Pagination/index.d.ts.map +1 -0
  32. package/build/Modern/Pagination/index.js +12 -0
  33. package/build/Modern/hooks/index.d.ts +3 -0
  34. package/build/Modern/hooks/index.d.ts.map +1 -0
  35. package/build/Modern/hooks/index.js +19 -0
  36. package/build/Modern/hooks/useMedia.d.ts +37 -0
  37. package/build/Modern/hooks/useMedia.d.ts.map +1 -0
  38. package/build/Modern/hooks/useMedia.js +141 -0
  39. package/build/Modern/hooks/useRefObjectAsForwardedRef.d.ts +10 -0
  40. package/build/Modern/hooks/useRefObjectAsForwardedRef.d.ts.map +1 -0
  41. package/build/Modern/hooks/useRefObjectAsForwardedRef.hookDocs.json +22 -0
  42. package/build/Modern/hooks/useRefObjectAsForwardedRef.js +19 -0
  43. package/build/Modern/hooks/useResponsiveValue.d.ts +31 -0
  44. package/build/Modern/hooks/useResponsiveValue.d.ts.map +1 -0
  45. package/build/Modern/hooks/useResponsiveValue.js +73 -0
  46. package/build/Modern/index.d.ts +24 -0
  47. package/build/Modern/index.d.ts.map +1 -1
  48. package/build/Modern/index.js +11 -3
  49. package/build/Modern/type.d.ts +4 -0
  50. package/build/Modern/type.d.ts.map +1 -0
  51. package/build/Modern/type.js +5 -0
  52. package/build/Modern/utils/environment.d.ts +11 -0
  53. package/build/Modern/utils/environment.d.ts.map +1 -0
  54. package/build/Modern/utils/environment.js +13 -0
  55. package/build/Modern/utils/modern-polymorphic.d.ts +22 -0
  56. package/build/Modern/utils/modern-polymorphic.d.ts.map +1 -0
  57. package/build/Modern/utils/modern-polymorphic.js +28 -0
  58. package/build/Modern/utils/types/ComponentProps.d.ts +9 -0
  59. package/build/Modern/utils/types/ComponentProps.d.ts.map +1 -0
  60. package/build/Modern/utils/types/ComponentProps.js +5 -0
  61. package/build/Modern/utils/types/index.d.ts +3 -0
  62. package/build/Modern/utils/types/index.d.ts.map +1 -0
  63. package/build/Modern/utils/types/index.js +27 -0
  64. package/build/Modern/utils/warning.d.ts +4 -0
  65. package/build/Modern/utils/warning.d.ts.map +1 -0
  66. package/build/Modern/utils/warning.js +25 -0
  67. package/build/index.d.ts +1 -0
  68. package/build/index.d.ts.map +1 -1
  69. package/package.json +4 -4
  70. package/build/Modern/Typing/index.d.js +0 -1
  71. package/build/Modern/global.d.js +0 -1
  72. /package/build/{Legacy/Typing → Typing}/index.d.js +0 -0
@@ -0,0 +1,57 @@
1
+ # Blankslate
2
+
3
+ > Blankslate component all features
4
+
5
+ ```
6
+ # Featues
7
+
8
+ > Default, Narrow, Capped, Spacious, Large, CleanBackground
9
+ ```
10
+
11
+ ## Default
12
+
13
+ > Blankslate component default feature
14
+
15
+ ```jsx
16
+ <Blankslate variant={BlankslateVariant.Default} heading={heading} text={text} />
17
+ ```
18
+
19
+ ## Narrow
20
+
21
+ > Blankslate component narrow feature
22
+
23
+ ```jsx
24
+ <Blankslate variant={BlankslateVariant.Narrow} heading={heading} text={text} />
25
+ ```
26
+
27
+ ## Capped
28
+
29
+ > Blankslate component capped feature
30
+
31
+ ```jsx
32
+ <Blankslate variant={BlankslateVariant.Capped} heading={heading} text={text} />
33
+ ```
34
+
35
+ ## Spacious
36
+
37
+ > Blankslate component spacious feature
38
+
39
+ ```jsx
40
+ <Blankslate variant={BlankslateVariant.Spacious} heading={heading} text={text} />
41
+ ```
42
+
43
+ ## Large
44
+
45
+ > Blankslate component large feature
46
+
47
+ ```jsx
48
+ <Blankslate variant={BlankslateVariant.Large} heading={heading} text={text} />
49
+ ```
50
+
51
+ ## CleanBackground
52
+
53
+ > Blankslate component cleanBackground feature
54
+
55
+ ```jsx
56
+ <Blankslate hasCleanBackground={true} heading={heading} text={text} />
57
+ ```
@@ -0,0 +1,33 @@
1
+ # Breadcrumb
2
+
3
+ > Breadcrumb component all features
4
+
5
+ ```
6
+ # Featues
7
+
8
+ > Default, Active, Inactive
9
+ ```
10
+
11
+ ## Default
12
+
13
+ > Breadcrumb component default feature
14
+
15
+ ```jsx
16
+ <Breadcrumb ariaAttr={ariaAttr} items={items} onClick={action('onClick')} />
17
+ ```
18
+
19
+ ## Active
20
+
21
+ > Breadcrumb component active feature
22
+
23
+ ```jsx
24
+ <Breadcrumb ariaAttr={ariaAttr} items={items} onClick={action('onClick')} state={BreadcrumbState.Active} />
25
+ ```
26
+
27
+ ## Inactive
28
+
29
+ > Breadcrumb component inactive feature
30
+
31
+ ```jsx
32
+ <Breadcrumb ariaAttr={ariaAttr} items={items} onClick={action('onClick')} state={BreadcrumbState.Inactive} />
33
+ ```
@@ -13,7 +13,7 @@
13
13
  > Markdown component default feature
14
14
 
15
15
  ```jsx
16
- <Markdown>{MarkdownUnformattedCode}</Markdown>
16
+ <Markdown>{MarkdownCode}</Markdown>
17
17
  ```
18
18
 
19
19
  ## HLJS
@@ -21,7 +21,7 @@
21
21
  > Markdown component hljs feature
22
22
 
23
23
  ```jsx
24
- <Markdown highlighter={MarkdownHighlighter.HLJS}>{MarkdownUnformattedCode}</Markdown>
24
+ <Markdown highlighter={MarkdownHighlighter.HLJS}>{MarkdownCode}</Markdown>
25
25
  ```
26
26
 
27
27
  ## Prism
@@ -29,5 +29,5 @@
29
29
  > Markdown component prism feature
30
30
 
31
31
  ```jsx
32
- <Markdown highlighter={MarkdownHighlighter.PRISM}>{MarkdownUnformattedCode}</Markdown>
32
+ <Markdown highlighter={MarkdownHighlighter.PRISM}>{MarkdownCode}</Markdown>
33
33
  ```
@@ -13,7 +13,7 @@
13
13
  > Markdown component default feature
14
14
 
15
15
  ```jsx
16
- <SyntaxHighlighter>{TypeScriptUnformattedCode}</SyntaxHighlighter>
16
+ <SyntaxHighlighter>{TypeScriptCode}</SyntaxHighlighter>
17
17
  ```
18
18
 
19
19
  ## HLJS TypeScript
@@ -26,7 +26,7 @@
26
26
  language={SyntaxHighlighterLanguage.TypeScript}
27
27
  style={SyntaxHighlighterStyle.Ocean}
28
28
  >
29
- {TypeScriptUnformattedCode}
29
+ {TypeScriptCode}
30
30
  </SyntaxHighlighter>
31
31
  ```
32
32
 
@@ -48,7 +48,7 @@
48
48
  language={SyntaxHighlighterLanguage.TypeScript}
49
49
  style={SyntaxHighlighterStyle.Nord}
50
50
  >
51
- {TypeScriptUnformattedCode}
51
+ {TypeScriptCode}
52
52
  </SyntaxHighlighter>
53
53
  ```
54
54
 
@@ -5,6 +5,5 @@ export type FlashProps = ComponentPropsWithoutRef<'div'> & {
5
5
  variant?: 'default' | 'warning' | 'success' | 'danger';
6
6
  full?: boolean;
7
7
  };
8
- declare const Flash: PolymorphicForwardRefComponent<"div", FlashProps>;
9
- export default Flash;
8
+ export declare const Flash: PolymorphicForwardRefComponent<"div", FlashProps>;
10
9
  //# sourceMappingURL=Flash.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Flash.d.ts","sourceRoot":"","sources":["../../../src/Modern/Flash/Flash.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,wBAAwB,EAAc,MAAM,OAAO,CAAA;AAC5D,OAAO,KAAK,EAAE,mBAAmB,IAAI,8BAA8B,EAAE,MAAM,sBAAsB,CAAA;AAGjG,MAAM,MAAM,UAAU,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IACzD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACtD,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,QAAA,MAAM,KAAK,EAUL,8BAA8B,CAAC,KAAK,EAAE,UAAU,CAAC,CAAA;AAMvD,eAAe,KAAK,CAAA"}
1
+ {"version":3,"file":"Flash.d.ts","sourceRoot":"","sources":["../../../src/Modern/Flash/Flash.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,wBAAwB,EAAc,MAAM,OAAO,CAAA;AAC5D,OAAO,KAAK,EAAE,mBAAmB,IAAI,8BAA8B,EAAE,MAAM,sBAAsB,CAAA;AAGjG,MAAM,MAAM,UAAU,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IACzD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACtD,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,eAAO,MAAM,KAAK,EAUZ,8BAA8B,CAAC,KAAK,EAAE,UAAU,CAAC,CAAA"}
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports["default"] = void 0;
7
+ exports.Flash = void 0;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
10
  var _clsx = require("clsx");
@@ -15,7 +15,7 @@ var _excluded = ["as", "className", "variant", "full"];
15
15
  /* eslint-disable react/prop-types */
16
16
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
17
17
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
18
- var Flash = /*#__PURE__*/(0, _react.forwardRef)(function Flash(_ref, ref) {
18
+ var Flash = exports.Flash = /*#__PURE__*/(0, _react.forwardRef)(function Flash(_ref, ref) {
19
19
  var _ref$as = _ref.as,
20
20
  BaseComponent = _ref$as === void 0 ? 'div' : _ref$as,
21
21
  className = _ref.className,
@@ -32,5 +32,4 @@ var Flash = /*#__PURE__*/(0, _react.forwardRef)(function Flash(_ref, ref) {
32
32
  });
33
33
  if (process.env.NODE_ENV !== 'production') {
34
34
  Flash.displayName = 'Flash';
35
- }
36
- var _default = exports["default"] = Flash;
35
+ }
@@ -8,5 +8,4 @@
8
8
  > Default
9
9
  > Success, Danger, Warning, Full
10
10
  > WithIconAndAction, WithIconActionDismiss
11
-
12
11
  ```
@@ -1,3 +1,3 @@
1
- export { default } from './Flash';
1
+ export { Flash } from './Flash';
2
2
  export type { FlashProps } from './Flash';
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Modern/Flash/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AACjC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Modern/Flash/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA"}
@@ -1,13 +1,12 @@
1
1
  "use strict";
2
2
 
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
3
  Object.defineProperty(exports, "__esModule", {
5
4
  value: true
6
5
  });
7
- Object.defineProperty(exports, "default", {
6
+ Object.defineProperty(exports, "Flash", {
8
7
  enumerable: true,
9
8
  get: function get() {
10
- return _Flash["default"];
9
+ return _Flash.Flash;
11
10
  }
12
11
  });
13
- var _Flash = _interopRequireDefault(require("./Flash"));
12
+ var _Flash = require("./Flash");
@@ -0,0 +1,19 @@
1
+ import React, { ElementType, type ForwardedRef } from 'react';
2
+ import { type PolymorphicProps } from '../utils/modern-polymorphic';
3
+ import type { ComponentProps } from '../utils/types';
4
+ type StyledLinkProps<As extends ElementType = 'a'> = {
5
+ as?: As;
6
+ /** @deprecated use CSS modules to style hover color */
7
+ hoverColor?: string;
8
+ muted?: boolean;
9
+ inline?: boolean;
10
+ };
11
+ export declare const UnwrappedLink: <As extends ElementType = "a">(props: PolymorphicProps<As, "a", StyledLinkProps>, ref: ForwardedRef<unknown>) => import("react/jsx-runtime").JSX.Element;
12
+ export declare const Link: (<As extends ElementType = "a">(props: (React.ComponentPropsWithRef<React.ElementType extends As ? "a" : As> & StyledLinkProps<"a"> extends infer T ? T extends React.ComponentPropsWithRef<React.ElementType extends As ? "a" : As> & StyledLinkProps<"a"> ? T extends unknown ? Omit<T, "as"> : never : never : never) & {
13
+ as?: As;
14
+ } & React.RefAttributes<unknown>) => React.ReactNode) & {
15
+ displayName: string;
16
+ };
17
+ export type LinkProps = ComponentProps<typeof Link>;
18
+ export {};
19
+ //# sourceMappingURL=Link.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/Modern/Link/Link.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAmB,WAAW,EAAE,KAAK,YAAY,EAAqB,MAAM,OAAO,CAAA;AAEjG,OAAO,EAAE,KAAK,gBAAgB,EAAmB,MAAM,6BAA6B,CAAA;AAEpF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAGpD,KAAK,eAAe,CAAC,EAAE,SAAS,WAAW,GAAG,GAAG,IAAI;IACnD,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,uDAAuD;IACvD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,OAAO,CAAA;IAEf,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,EAAE,SAAS,WAAW,GAAG,GAAG,EACxD,OAAO,gBAAgB,CAAC,EAAE,EAAE,GAAG,EAAE,eAAe,CAAC,EACjD,KAAK,YAAY,CAAC,OAAO,CAAC,4CAmC3B,CAAA;AAID,eAAO,MAAM,IAAI,IAzCa,EAAE,SAAS,WAAW;;;;CAyCqB,CAAA;AAEzE,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,OAAO,IAAI,CAAC,CAAA"}
@@ -0,0 +1,61 @@
1
+ {
2
+ "id": "link",
3
+ "name": "Link",
4
+ "status": "alpha",
5
+ "a11yReviewed": "2025-01-08",
6
+ "stories": [
7
+ {
8
+ "id": "components-link--default"
9
+ },
10
+ {
11
+ "id": "components-link-features--muted"
12
+ },
13
+ {
14
+ "id": "components-link-features--inline"
15
+ }
16
+ ],
17
+ "importPath": "@primer/react",
18
+ "props": [
19
+ {
20
+ "name": "href",
21
+ "type": "string",
22
+ "defaultValue": "",
23
+ "description": "URL to be used for the Link. (The `href` is passed to the underlying `<a>` element. If `as` is specified, the link behavior may need different props)."
24
+ },
25
+ {
26
+ "name": "muted",
27
+ "type": "boolean",
28
+ "defaultValue": "false",
29
+ "description": "Uses a less prominent shade for Link color, and the default link shade on hover."
30
+ },
31
+ {
32
+ "name": "inline",
33
+ "type": "boolean",
34
+ "defaultValue": "false",
35
+ "description": "Set to true for links adjacent to text, underlining them for clear visibility and improved accessibility."
36
+ },
37
+ {
38
+ "name": "underline",
39
+ "type": "boolean",
40
+ "defaultValue": "false",
41
+ "description": "Use `inline` instead.",
42
+ "deprecated": true
43
+ },
44
+ {
45
+ "name": "hoverColor",
46
+ "type": "string",
47
+ "defaultValue": "",
48
+ "description": "Color used when hovering over the link."
49
+ },
50
+ {
51
+ "name": "ref",
52
+ "type": "React.RefObject<HTMLAnchorElement>"
53
+ },
54
+ {
55
+ "name": "as",
56
+ "type": "React.ElementType",
57
+ "defaultValue": "\"a\""
58
+ }
59
+ ],
60
+ "subcomponents": []
61
+ }
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.UnwrappedLink = exports.Link = void 0;
9
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
11
+ var _clsx = require("clsx");
12
+ var _react = _interopRequireWildcard(require("react"));
13
+ var _hooks = require("../hooks");
14
+ var _modernPolymorphic = require("../utils/modern-polymorphic");
15
+ var _LinkModule = _interopRequireDefault(require("./Link.module.scss"));
16
+ var _jsxRuntime = require("react/jsx-runtime");
17
+ var _excluded = ["as", "className", "inline", "hoverColor"];
18
+ /* eslint-disable @typescript-eslint/consistent-type-definitions */
19
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
20
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
21
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
22
+ var UnwrappedLink = exports.UnwrappedLink = function UnwrappedLink(props, ref) {
23
+ var _props$as = props.as,
24
+ Component = _props$as === void 0 ? 'a' : _props$as,
25
+ className = props.className,
26
+ inline = props.inline,
27
+ hoverColor = props.hoverColor,
28
+ restProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
29
+ var innerRef = (0, _react.useRef)(null);
30
+ (0, _hooks.useRefObjectAsForwardedRef)(ref, innerRef);
31
+ if (process.env.NODE_ENV !== 'production') {
32
+ /**
33
+ * The Linter yells because it thinks this conditionally calls an effect,
34
+ * but since this is a compile-time flag and not a runtime conditional
35
+ * this is safe, and ensures the entire effect is kept out of prod builds
36
+ * shaving precious bytes from the output, and avoiding mounting a noop effect
37
+ */
38
+ // eslint-disable-next-line react-hooks/rules-of-hooks
39
+ (0, _react.useEffect)(function () {
40
+ if (innerRef.current && !(innerRef.current instanceof HTMLButtonElement) && !(innerRef.current instanceof HTMLAnchorElement)) {
41
+ console.error('Error: Found `Link` component that renders an inaccessible element', innerRef.current, 'Please ensure `Link` always renders as <a> or <button>');
42
+ }
43
+ }, [innerRef]);
44
+ }
45
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread(_objectSpread({
46
+ className: (0, _clsx.clsx)(className, _LinkModule["default"].Link),
47
+ "data-muted": restProps.muted,
48
+ "data-inline": inline,
49
+ "data-hover-color": hoverColor
50
+ }, restProps), {}, {
51
+ ref: innerRef
52
+ }));
53
+ };
54
+ var LinkComponent = (0, _modernPolymorphic.fixedForwardRef)(UnwrappedLink);
55
+ var Link = exports.Link = Object.assign(LinkComponent, {
56
+ displayName: 'Link'
57
+ });
@@ -0,0 +1,39 @@
1
+ /* stylelint-disable custom-property-pattern */
2
+ :where(.Link) {
3
+ color: var(--fgColor-accent);
4
+ text-decoration: none;
5
+ text-underline-offset: 0.05rem;
6
+
7
+ /* Reset for button tags */
8
+ &:is(button) {
9
+ display: inline-block;
10
+ padding: 0;
11
+ font-size: inherit;
12
+ white-space: nowrap;
13
+ cursor: pointer;
14
+ user-select: none;
15
+ background-color: transparent;
16
+ border: 0;
17
+ appearance: none;
18
+ }
19
+
20
+ &:hover {
21
+ text-decoration: underline;
22
+ }
23
+
24
+ /*
25
+ Inline links (inside a text block) should have underline based on accessibility setting set in data-attribute
26
+ */
27
+ [data-a11y-link-underlines='true'] &:where([data-inline='true']) {
28
+ text-decoration: underline;
29
+ }
30
+
31
+ &:where([data-muted='true']) {
32
+ color: var(--fgColor-muted);
33
+
34
+ &:hover {
35
+ color: var(--fgColor-accent);
36
+ text-decoration: none;
37
+ }
38
+ }
39
+ }
@@ -0,0 +1,10 @@
1
+ # Link
2
+
3
+ > Link component all features
4
+
5
+ ```
6
+ # Featues
7
+
8
+ > Default
9
+ > Muted, Inline1, Inline2
10
+ ```
@@ -0,0 +1,3 @@
1
+ export { Link } from './Link';
2
+ export type { LinkProps } from './Link';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Modern/Link/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA"}
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "Link", {
7
+ enumerable: true,
8
+ get: function get() {
9
+ return _Link.Link;
10
+ }
11
+ });
12
+ var _Link = require("./Link");
@@ -0,0 +1,22 @@
1
+ import React from 'react';
2
+ import type { ResponsiveValue } from '../hooks/useResponsiveValue';
3
+ import { type PageDataProps } from './Pagination.model';
4
+ export type PageProps = {
5
+ key: string;
6
+ children: React.ReactNode;
7
+ number: number;
8
+ className: string;
9
+ } & Omit<PageDataProps['props'], 'as' | 'role'>;
10
+ export type PaginationProps = {
11
+ className?: string;
12
+ pageCount: number;
13
+ currentPage: number;
14
+ onPageChange?: (e: React.MouseEvent, n: number) => void;
15
+ hrefBuilder?: (n: number) => string;
16
+ marginPageCount?: number;
17
+ showPages?: boolean | ResponsiveValue<boolean>;
18
+ surroundingPageCount?: number;
19
+ renderPage?: (props: PageProps) => React.ReactNode;
20
+ };
21
+ export declare function Pagination({ className, pageCount, currentPage, onPageChange, hrefBuilder, marginPageCount, showPages, surroundingPageCount, renderPage, ...rest }: PaginationProps): import("react/jsx-runtime").JSX.Element;
22
+ //# sourceMappingURL=Pagination.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/Modern/Pagination/Pagination.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA+B,MAAM,OAAO,CAAA;AACnD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAElE,OAAO,EAAE,KAAK,aAAa,EAA4C,MAAM,oBAAoB,CAAA;AAejG,MAAM,MAAM,SAAS,GAAG;IAEtB,GAAG,EAAE,MAAM,CAAA;IAEX,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IAEzB,MAAM,EAAE,MAAM,CAAA;IAEd,SAAS,EAAE,MAAM,CAAA;CAClB,GAAG,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC,CAAA;AAoE/C,MAAM,MAAM,eAAe,GAAG;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACvD,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;IACnC,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC,OAAO,CAAC,CAAA;IAC9C,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,KAAK,CAAC,SAAS,CAAA;CACnD,CAAA;AAED,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,SAAS,EACT,WAAW,EACX,YAAmB,EACnB,WAAgC,EAChC,eAAmB,EACnB,SAAgB,EAChB,oBAAwB,EACxB,UAAU,EACV,GAAG,IAAI,EACR,EAAE,eAAe,2CAmBjB"}
@@ -0,0 +1,77 @@
1
+ {
2
+ "id": "pagination",
3
+ "name": "Pagination",
4
+ "status": "alpha",
5
+ "a11yReviewed": "2025-01-08",
6
+ "stories": [
7
+ {
8
+ "id": "components-pagination--default"
9
+ },
10
+ {
11
+ "id": "components-pagination-features--larger-page-count-margin"
12
+ },
13
+ {
14
+ "id": "components-pagination-features--hide-page-numbers"
15
+ },
16
+ {
17
+ "id": "components-pagination-features--hide-page-numbers-by-viewport"
18
+ },
19
+ {
20
+ "id": "components-pagination-features--higher-surrounding-page-count"
21
+ }
22
+ ],
23
+ "importPath": "@primer/react",
24
+ "props": [
25
+ {
26
+ "name": "currentPage",
27
+ "type": "number",
28
+ "defaultValue": "",
29
+ "required": true,
30
+ "description": "The currently selected page."
31
+ },
32
+ {
33
+ "name": "pageCount",
34
+ "type": "number",
35
+ "defaultValue": "",
36
+ "required": true,
37
+ "description": "The total number of pages."
38
+ },
39
+ {
40
+ "name": "hrefBuilder",
41
+ "type": "function",
42
+ "defaultValue": "",
43
+ "description": "A function to generate links based on page number."
44
+ },
45
+ {
46
+ "name": "marginPageCount",
47
+ "type": "number",
48
+ "defaultValue": "1",
49
+ "description": "How many pages to always show at the left and right of the component."
50
+ },
51
+ {
52
+ "name": "onPageChange",
53
+ "type": "function",
54
+ "defaultValue": "(e: MouseEvent<Element, MouseEvent>, n: number) => void",
55
+ "description": "Called with event and page number when a page is clicked."
56
+ },
57
+ {
58
+ "name": "showPages",
59
+ "type": "boolean | { narrow?: boolean, regular?: boolean, wide?: boolean }",
60
+ "defaultValue": "true",
61
+ "description": "Whether or not to show the individual page links."
62
+ },
63
+ {
64
+ "name": "surroundingPageCount",
65
+ "type": "number",
66
+ "defaultValue": "2",
67
+ "description": "How many pages to display on each side of the currently selected page."
68
+ },
69
+ {
70
+ "name": "renderPage",
71
+ "type": "function",
72
+ "defaultValue": "(props: PageProps) => ReactNode",
73
+ "description": "Provide a custom component or render prop to render each page link within the component."
74
+ }
75
+ ],
76
+ "subcomponents": []
77
+ }