@fluentui/react-divider 0.0.0-nightly-20221228-0425.1 → 0.0.0-nightly-20221229-0425.1

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.
package/CHANGELOG.json CHANGED
@@ -2,9 +2,9 @@
2
2
  "name": "@fluentui/react-divider",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 28 Dec 2022 04:33:25 GMT",
6
- "tag": "@fluentui/react-divider_v0.0.0-nightly-20221228-0425.1",
7
- "version": "0.0.0-nightly-20221228-0425.1",
5
+ "date": "Thu, 29 Dec 2022 04:34:18 GMT",
6
+ "tag": "@fluentui/react-divider_v0.0.0-nightly-20221229-0425.1",
7
+ "version": "0.0.0-nightly-20221229-0425.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
@@ -16,20 +16,20 @@
16
16
  {
17
17
  "author": "beachball",
18
18
  "package": "@fluentui/react-divider",
19
- "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20221228-0425.1",
20
- "commit": "3ee907a253f14ff8e15878e0ec1355e2fbfcef69"
19
+ "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20221229-0425.1",
20
+ "commit": "f91b275fd9b1829634e1dc1de59d8fbf68359edc"
21
21
  },
22
22
  {
23
23
  "author": "beachball",
24
24
  "package": "@fluentui/react-divider",
25
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20221228-0425.1",
26
- "commit": "3ee907a253f14ff8e15878e0ec1355e2fbfcef69"
25
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20221229-0425.1",
26
+ "commit": "f91b275fd9b1829634e1dc1de59d8fbf68359edc"
27
27
  },
28
28
  {
29
29
  "author": "beachball",
30
30
  "package": "@fluentui/react-divider",
31
- "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221228-0425.1",
32
- "commit": "3ee907a253f14ff8e15878e0ec1355e2fbfcef69"
31
+ "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221229-0425.1",
32
+ "commit": "f91b275fd9b1829634e1dc1de59d8fbf68359edc"
33
33
  }
34
34
  ]
35
35
  }
package/CHANGELOG.md CHANGED
@@ -1,20 +1,20 @@
1
1
  # Change Log - @fluentui/react-divider
2
2
 
3
- This log was last generated on Wed, 28 Dec 2022 04:33:25 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 29 Dec 2022 04:34:18 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20221228-0425.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v0.0.0-nightly-20221228-0425.1)
7
+ ## [0.0.0-nightly-20221229-0425.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v0.0.0-nightly-20221229-0425.1)
8
8
 
9
- Wed, 28 Dec 2022 04:33:25 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.1.8..@fluentui/react-divider_v0.0.0-nightly-20221228-0425.1)
9
+ Thu, 29 Dec 2022 04:34:18 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.1.8..@fluentui/react-divider_v0.0.0-nightly-20221229-0425.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
15
- - Bump @fluentui/react-theme to v0.0.0-nightly-20221228-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/3ee907a253f14ff8e15878e0ec1355e2fbfcef69) by beachball)
16
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20221228-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/3ee907a253f14ff8e15878e0ec1355e2fbfcef69) by beachball)
17
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221228-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/3ee907a253f14ff8e15878e0ec1355e2fbfcef69) by beachball)
15
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20221229-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/f91b275fd9b1829634e1dc1de59d8fbf68359edc) by beachball)
16
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20221229-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/f91b275fd9b1829634e1dc1de59d8fbf68359edc) by beachball)
17
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221229-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/f91b275fd9b1829634e1dc1de59d8fbf68359edc) by beachball)
18
18
 
19
19
  ## [9.1.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.1.8)
20
20
 
@@ -5,7 +5,6 @@ import { useDividerStyles_unstable } from './useDividerStyles';
5
5
  /**
6
6
  * A divider visually segments content into groups.
7
7
  */
8
-
9
8
  export const Divider = /*#__PURE__*/React.forwardRef((props, ref) => {
10
9
  const state = useDivider_unstable(props, ref);
11
10
  useDividerStyles_unstable(state);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/Divider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,mBAAT,QAAoC,cAApC;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AAIA;;AAEG;;AACH,OAAO,MAAM,OAAO,gBAAsC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxF,MAAM,KAAK,GAAG,mBAAmB,CAAC,KAAD,EAAQ,GAAR,CAAjC;EAEA,yBAAyB,CAAC,KAAD,CAAzB;EAEA,OAAO,sBAAsB,CAAC,KAAD,CAA7B;AACD,CANyD,CAAnD;AAQP,OAAO,CAAC,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\n\n/**\n * A divider visually segments content into groups.\n */\nexport const Divider: ForwardRefComponent<DividerProps> = React.forwardRef((props, ref) => {\n const state = useDivider_unstable(props, ref);\n\n useDividerStyles_unstable(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,sBAAsB,QAAQ,iBAAiB;AACxD,SAASC,mBAAmB,QAAQ,cAAc;AAClD,SAASC,yBAAyB,QAAQ,oBAAoB;AAI9D;;;AAGA,OAAO,MAAMC,OAAO,gBAAsCJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGN,mBAAmB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAE7CJ,yBAAyB,CAACK,KAAK,CAAC;EAEhC,OAAOP,sBAAsB,CAACO,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFJ,OAAO,CAACK,WAAW,GAAG,SAAS","names":["React","renderDivider_unstable","useDivider_unstable","useDividerStyles_unstable","Divider","forwardRef","props","ref","state","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/Divider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\n\n/**\n * A divider visually segments content into groups.\n */\nexport const Divider: ForwardRefComponent<DividerProps> = React.forwardRef((props, ref) => {\n const state = useDivider_unstable(props, ref);\n\n useDividerStyles_unstable(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"]}
@@ -3,14 +3,15 @@ import { getSlots } from '@fluentui/react-utilities';
3
3
  /**
4
4
  * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
5
5
  */
6
-
7
6
  export const renderDivider_unstable = state => {
8
7
  const {
9
8
  slots,
10
9
  slotProps
11
10
  } = getSlots(state);
12
- return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
13
- }, slotProps.root.children !== undefined && /*#__PURE__*/React.createElement(slots.wrapper, { ...slotProps.wrapper
11
+ return /*#__PURE__*/React.createElement(slots.root, {
12
+ ...slotProps.root
13
+ }, slotProps.root.children !== undefined && /*#__PURE__*/React.createElement(slots.wrapper, {
14
+ ...slotProps.wrapper
14
15
  }, slotProps.root.children));
15
16
  };
16
17
  //# sourceMappingURL=renderDivider.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/renderDivider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,sBAAsB,GAAI,KAAD,IAAwB;EAC5D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAe,KAAf,CAArC;EACA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,SAAS,CAAC,IAAV,CAAe,QAAf,KAA4B,SAA5B,iBACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;EAAf,CAAd,EAAuC,SAAS,CAAC,IAAV,CAAe,QAAtD,CAFJ,CADF;AAOD,CATM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from './Divider.types';\n\n/**\n * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.\n */\nexport const renderDivider_unstable = (state: DividerState) => {\n const { slots, slotProps } = getSlots<DividerSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slotProps.root.children !== undefined && (\n <slots.wrapper {...slotProps.wrapper}>{slotProps.root.children}</slots.wrapper>\n )}\n </slots.root>\n );\n};\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAeE,KAAK,CAAC;EAC1D,oBACEH,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,GAC3BD,SAAS,CAACC,IAAI,CAACC,QAAQ,KAAKC,SAAS,iBACpCR,oBAACI,KAAK,CAACK,OAAO;IAAA,GAAKJ,SAAS,CAACI;EAAO,GAAGJ,SAAS,CAACC,IAAI,CAACC,QAAQ,CAC/D,CACU;AAEjB,CAAC","names":["React","getSlots","renderDivider_unstable","state","slots","slotProps","root","children","undefined","wrapper"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/renderDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from './Divider.types';\n\n/**\n * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.\n */\nexport const renderDivider_unstable = (state: DividerState) => {\n const { slots, slotProps } = getSlots<DividerSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slotProps.root.children !== undefined && (\n <slots.wrapper {...slotProps.wrapper}>{slotProps.root.children}</slots.wrapper>\n )}\n </slots.root>\n );\n};\n"]}
@@ -4,7 +4,6 @@ import { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-
4
4
  * @param props - User-provided props to the Divider component.
5
5
  * @param ref - User-provided ref to be passed to the Divider component.
6
6
  */
7
-
8
7
  export const useDivider_unstable = (props, ref) => {
9
8
  const {
10
9
  alignContent = 'center',
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDivider.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AAGA;;;;AAIG;;AACH,OAAO,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;EACpG,MAAM;IAAE,YAAY,GAAG,QAAjB;IAA2B,UAAU,GAAG,SAAxC;IAAmD,KAAK,GAAG,KAA3D;IAAkE,QAAQ,GAAG,KAA7E;IAAoF;EAApF,IAAgG,KAAtG;EACA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAD,CAAvB;EAEA,OAAO;IACL;IACA,YAFK;IAGL,UAHK;IAIL,KAJK;IAKL,QALK;IAOL;IACA,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,OAAO,EAAE;IAFC,CARP;IAaL,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;MACjC,IAAI,EAAE,WAD2B;MAEjC,oBAAoB,QAAQ,GAAG,UAAH,GAAgB,YAFX;MAGjC,mBAAmB,KAAK,CAAC,QAAN,GAAiB,SAAjB,GAA6B,SAHf;MAIjC,GAAG,KAJ8B;MAKjC;IALiC,CAAR,CAbtB;IAoBL,OAAO,EAAE,gBAAgB,CAAC,OAAD,EAAU;MACjC,QAAQ,EAAE,IADuB;MAEjC,YAAY,EAAE;QACZ,EAAE,EAAE,SADQ;QAEZ,QAAQ,EAAE,KAAK,CAAC;MAFJ;IAFmB,CAAV;EApBpB,CAAP;AA4BD,CAhCM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { DividerProps, DividerState } from './Divider.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - User-provided props to the Divider component.\n * @param ref - User-provided ref to be passed to the Divider component.\n */\nexport const useDivider_unstable = (props: DividerProps, ref: React.Ref<HTMLElement>): DividerState => {\n const { alignContent = 'center', appearance = 'default', inset = false, vertical = false, wrapper } = props;\n const dividerId = useId('divider-');\n\n return {\n // Props passed at the top-level\n alignContent,\n appearance,\n inset,\n vertical,\n\n // Slots definition\n components: {\n root: 'div',\n wrapper: 'div',\n },\n\n root: getNativeElementProps('div', {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ...props,\n ref,\n }),\n wrapper: resolveShorthand(wrapper, {\n required: true,\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n }),\n };\n};\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":"AACA,SAASA,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,2BAA2B;AAG1F;;;;;AAKA,OAAO,MAAMC,mBAAmB,GAAG,CAACC,KAAmB,EAAEC,GAA2B,KAAkB;EACpG,MAAM;IAAEC,YAAY,GAAG,QAAQ;IAAEC,UAAU,GAAG,SAAS;IAAEC,KAAK,GAAG,KAAK;IAAEC,QAAQ,GAAG,KAAK;IAAEC;EAAO,CAAE,GAAGN,KAAK;EAC3G,MAAMO,SAAS,GAAGT,KAAK,CAAC,UAAU,CAAC;EAEnC,OAAO;IACL;IACAI,YAAY;IACZC,UAAU;IACVC,KAAK;IACLC,QAAQ;IAER;IACAG,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXH,OAAO,EAAE;KACV;IAEDG,IAAI,EAAEb,qBAAqB,CAAC,KAAK,EAAE;MACjCc,IAAI,EAAE,WAAW;MACjB,kBAAkB,EAAEL,QAAQ,GAAG,UAAU,GAAG,YAAY;MACxD,iBAAiB,EAAEL,KAAK,CAACW,QAAQ,GAAGJ,SAAS,GAAGK,SAAS;MACzD,GAAGZ,KAAK;MACRC;KACD,CAAC;IACFK,OAAO,EAAET,gBAAgB,CAACS,OAAO,EAAE;MACjCO,QAAQ,EAAE,IAAI;MACdC,YAAY,EAAE;QACZC,EAAE,EAAER,SAAS;QACbI,QAAQ,EAAEX,KAAK,CAACW;;KAEnB;GACF;AACH,CAAC","names":["getNativeElementProps","resolveShorthand","useId","useDivider_unstable","props","ref","alignContent","appearance","inset","vertical","wrapper","dividerId","components","root","role","children","undefined","required","defaultProps","id"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDivider.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { DividerProps, DividerState } from './Divider.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - User-provided props to the Divider component.\n * @param ref - User-provided ref to be passed to the Divider component.\n */\nexport const useDivider_unstable = (props: DividerProps, ref: React.Ref<HTMLElement>): DividerState => {\n const { alignContent = 'center', appearance = 'default', inset = false, vertical = false, wrapper } = props;\n const dividerId = useId('divider-');\n\n return {\n // Props passed at the top-level\n alignContent,\n appearance,\n inset,\n vertical,\n\n // Slots definition\n components: {\n root: 'div',\n wrapper: 'div',\n },\n\n root: getNativeElementProps('div', {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ...props,\n ref,\n }),\n wrapper: resolveShorthand(wrapper, {\n required: true,\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n }),\n };\n};\n"]}
@@ -8,7 +8,6 @@ const contentSpacing = '12px';
8
8
  const insetSpacing = '12px';
9
9
  const maxStartEndLength = '8px';
10
10
  const minStartEndLength = '8px;';
11
-
12
11
  const useBaseStyles = /*#__PURE__*/__styles({
13
12
  "base": {
14
13
  "Bt984gj": "f122n59",
@@ -92,7 +91,6 @@ const useBaseStyles = /*#__PURE__*/__styles({
92
91
  }, {
93
92
  "d": [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f10pi13n{position:relative;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f17mccla{text-align:center;}", ".fyl8oag::before{box-sizing:border-box;}", ".f16vkdww::before{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fhsnbul::before{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1gw3sf2::after{box-sizing:border-box;}", ".f1ly5f7u::after{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1s3tz6t::after{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1kyqvp9::before{margin-bottom:0;}", ".fzynn9s::before{margin-right:0;}", ".f1z0ukd1::before{margin-left:0;}", ".fekrn8e::after{margin-left:0;}", ".ftdg338::after{margin-right:0;}", ".fesgyo::after{margin-top:0;}", ".f13zj6fq::after{content:\"\";}", ".f1wl9k8s::before{content:\"\";}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".fcbuu2a::before{border-top-color:var(--colorBrandStroke1);}", ".f1wdw2dr::before{border-right-color:var(--colorBrandStroke1);}", ".f1ttio3w::before{border-left-color:var(--colorBrandStroke1);}", ".f1582fpk::before{border-bottom-color:var(--colorBrandStroke1);}", ".f1ahrvm8::after{border-top-color:var(--colorBrandStroke1);}", ".f1cd3wbc::after{border-right-color:var(--colorBrandStroke1);}", ".f17hbk9y::after{border-left-color:var(--colorBrandStroke1);}", ".fvrapl0::after{border-bottom-color:var(--colorBrandStroke1);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f1vccso1::before{border-top-color:var(--colorNeutralStroke2);}", ".f1geml7w::before{border-right-color:var(--colorNeutralStroke2);}", ".fjml6kk::before{border-left-color:var(--colorNeutralStroke2);}", ".f1r7kh1m::before{border-bottom-color:var(--colorNeutralStroke2);}", ".f16j7guv::after{border-top-color:var(--colorNeutralStroke2);}", ".fx01ahm::after{border-right-color:var(--colorNeutralStroke2);}", ".fj1a37q::after{border-left-color:var(--colorNeutralStroke2);}", ".fl8d8yv::after{border-bottom-color:var(--colorNeutralStroke2);}", ".f5g06un::before{border-top-color:var(--colorNeutralStroke3);}", ".f13sxdku::before{border-right-color:var(--colorNeutralStroke3);}", ".f1n015lb::before{border-left-color:var(--colorNeutralStroke3);}", ".f1x6bl8t::before{border-bottom-color:var(--colorNeutralStroke3);}", ".fvod1wy::after{border-top-color:var(--colorNeutralStroke3);}", ".fwslg65::after{border-right-color:var(--colorNeutralStroke3);}", ".flk0e17::after{border-left-color:var(--colorNeutralStroke3);}", ".f103fvts::after{border-bottom-color:var(--colorNeutralStroke3);}", ".f10tv6oz::before{border-top-color:var(--colorNeutralStroke1);}", ".f16xp3sf::before{border-right-color:var(--colorNeutralStroke1);}", ".f1seuxxq::before{border-left-color:var(--colorNeutralStroke1);}", ".fwrmqbx::before{border-bottom-color:var(--colorNeutralStroke1);}", ".ft83z1f::after{border-top-color:var(--colorNeutralStroke1);}", ".f1g4150c::after{border-right-color:var(--colorNeutralStroke1);}", ".f192dr6e::after{border-left-color:var(--colorNeutralStroke1);}", ".f1qnawh6::after{border-bottom-color:var(--colorNeutralStroke1);}"]
94
93
  });
95
-
96
94
  const useHorizontalStyles = /*#__PURE__*/__styles({
97
95
  "base": {
98
96
  "a9b677": "fly5x3f",
@@ -126,7 +124,6 @@ const useHorizontalStyles = /*#__PURE__*/__styles({
126
124
  }, {
127
125
  "d": [".fly5x3f{width:100%;}", ".f163fonl::before{border-top-style:solid;}", ".f51yk4v::before{border-top-width:var(--strokeWidthThin);}", ".f13rof3u::before{min-width:8px;}", ".f8rth92::after{border-top-style:solid;}", ".f6czdpx::after{border-top-width:var(--strokeWidthThin);}", ".f1iyka9k::after{min-width:8px;}", ".fjlbh76{padding-left:12px;}", ".f11qrl6u{padding-right:12px;}", ".f1wl9k8s::before{content:\"\";}", ".f1ojjlep::before{margin-right:12px;}", ".fk1kexq::before{margin-left:12px;}", ".f1he2m4d::before{max-width:8px;}", ".f12w1bnb::after{margin-left:12px;}", ".f1558wlj::after{margin-right:12px;}", ".f13zj6fq::after{content:\"\";}", ".f1ayce8x::after{max-width:8px;}"]
128
126
  });
129
-
130
127
  const useVerticalStyles = /*#__PURE__*/__styles({
131
128
  "base": {
132
129
  "Beiy3e4": "f1vx9l62",
@@ -164,7 +161,6 @@ const useVerticalStyles = /*#__PURE__*/__styles({
164
161
  }, {
165
162
  "d": [".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f16gbxbe{min-height:20px;}", ".f1yq6w5o::before{border-right-style:solid;}", ".f1jpmc5p::before{border-left-style:solid;}", ".f9sc749::before{border-right-width:var(--strokeWidthThin);}", ".f1x8pvcy::before{border-left-width:var(--strokeWidthThin);}", ".fhkwbjy::before{min-height:8px;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f13hvwk3::after{border-right-width:var(--strokeWidthThin);}", ".f1en4csx::after{border-left-width:var(--strokeWidthThin);}", ".f19onpk6::after{min-height:8px;}", ".f1xdg43u{margin-top:12px;}", ".f1jlhsmd{margin-bottom:12px;}", ".f1tjaq3g{min-height:84px;}", ".f1wl9k8s::before{content:\"\";}", ".fg2pwug::before{margin-bottom:12px;}", ".fkjtzyi::before{max-height:8px;}", ".f8vk40g::after{margin-top:12px;}", ".f13zj6fq::after{content:\"\";}", ".fqg5mu5::after{max-height:8px;}"]
166
163
  });
167
-
168
164
  export const useDividerStyles_unstable = state => {
169
165
  const baseStyles = useBaseStyles();
170
166
  const horizontalStyles = useHorizontalStyles();
@@ -175,17 +171,20 @@ export const useDividerStyles_unstable = state => {
175
171
  inset,
176
172
  vertical
177
173
  } = state;
178
- state.root.className = mergeClasses(dividerClassNames.root, // Base styles
179
- baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles
180
- !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles
181
- vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, // Childless styles
182
- state.root.children === undefined && baseStyles.childless, // User provided class name
174
+ state.root.className = mergeClasses(dividerClassNames.root,
175
+ // Base styles
176
+ baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance],
177
+ // Horizontal styles
178
+ !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent],
179
+ // Vertical styles
180
+ vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren,
181
+ // Childless styles
182
+ state.root.children === undefined && baseStyles.childless,
183
+ // User provided class name
183
184
  state.root.className);
184
-
185
185
  if (state.wrapper) {
186
186
  state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);
187
187
  }
188
-
189
188
  return state;
190
189
  };
191
190
  //# sourceMappingURL=useDividerStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDividerStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\n\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\n\nconst useBaseStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n flexGrow: 1,\n position: 'relative',\n\n fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n },\n\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0,\n },\n\n '::after': {\n marginLeft: 0,\n marginTop: 0,\n },\n },\n\n // Alignment variations\n start: {\n '::after': {\n content: '\"\"',\n },\n },\n center: {\n '::before': {\n content: '\"\"',\n },\n '::after': {\n content: '\"\"',\n },\n },\n end: {\n '::before': {\n content: '\"\"',\n },\n },\n\n // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n },\n default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n});\n\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing,\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n },\n});\n\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing,\n },\n\n // With children styles\n withChildren: {\n minHeight: '84px',\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n\n '::after': {\n marginTop: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n marginTop: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginTop: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n },\n});\n\nexport const useDividerStyles_unstable = (state: DividerState): DividerState => {\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n\n const { alignContent, appearance, inset, vertical } = state;\n\n state.root.className = mergeClasses(\n dividerClassNames.root,\n\n // Base styles\n baseStyles.base,\n baseStyles[alignContent],\n appearance && baseStyles[appearance],\n\n // Horizontal styles\n !vertical && horizontalStyles.base,\n !vertical && inset && horizontalStyles.inset,\n !vertical && horizontalStyles[alignContent],\n\n // Vertical styles\n vertical && verticalStyles.base,\n vertical && inset && verticalStyles.inset,\n vertical && verticalStyles[alignContent],\n vertical && state.root.children !== undefined && verticalStyles.withChildren,\n\n // Childless styles\n state.root.children === undefined && baseStyles.childless,\n\n // User provided class name\n state.root.className,\n );\n\n if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":"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","names":["mergeClasses","shorthands","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","useHorizontalStyles","useVerticalStyles","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","inset","vertical","className","base","children","undefined","withChildren","childless"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDividerStyles.ts"],"sourcesContent":["import { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\n\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\n\nconst useBaseStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n flexGrow: 1,\n position: 'relative',\n\n fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n },\n\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0,\n },\n\n '::after': {\n marginLeft: 0,\n marginTop: 0,\n },\n },\n\n // Alignment variations\n start: {\n '::after': {\n content: '\"\"',\n },\n },\n center: {\n '::before': {\n content: '\"\"',\n },\n '::after': {\n content: '\"\"',\n },\n },\n end: {\n '::before': {\n content: '\"\"',\n },\n },\n\n // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n },\n default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n});\n\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing,\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n },\n});\n\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing,\n },\n\n // With children styles\n withChildren: {\n minHeight: '84px',\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n\n '::after': {\n marginTop: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n marginTop: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginTop: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n },\n});\n\nexport const useDividerStyles_unstable = (state: DividerState): DividerState => {\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n\n const { alignContent, appearance, inset, vertical } = state;\n\n state.root.className = mergeClasses(\n dividerClassNames.root,\n\n // Base styles\n baseStyles.base,\n baseStyles[alignContent],\n appearance && baseStyles[appearance],\n\n // Horizontal styles\n !vertical && horizontalStyles.base,\n !vertical && inset && horizontalStyles.inset,\n !vertical && horizontalStyles[alignContent],\n\n // Vertical styles\n vertical && verticalStyles.base,\n vertical && inset && verticalStyles.inset,\n vertical && verticalStyles[alignContent],\n vertical && state.root.children !== undefined && verticalStyles.withChildren,\n\n // Childless styles\n state.root.children === undefined && baseStyles.childless,\n\n // User provided class name\n state.root.className,\n );\n\n if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"]}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../packages/react-components/react-divider/src/index.ts"],"names":[],"mappings":"AAAA,SACE,OADF,EAEE,iBAFF,EAGE,sBAHF,EAIE,yBAJF,EAKE,mBALF,QAMO,WANP","sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState } from './Divider';\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,yBAAyB,EACzBC,mBAAmB,QACd,WAAW","names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-divider/src/index.ts"],"sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState } from './Divider';\n"]}
@@ -3,8 +3,6 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
-
7
6
  const tslib_1 = /*#__PURE__*/require("tslib");
8
-
9
7
  tslib_1.__exportStar(require("./components/Divider/index"), exports);
10
8
  //# sourceMappingURL=Divider.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../packages/react-components/react-divider/src/Divider.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Divider/index';\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-divider/src/Divider.ts"],"sourcesContent":["export * from './components/Divider/index';\n"]}
@@ -4,19 +4,13 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.Divider = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
-
10
8
  const renderDivider_1 = /*#__PURE__*/require("./renderDivider");
11
-
12
9
  const useDivider_1 = /*#__PURE__*/require("./useDivider");
13
-
14
10
  const useDividerStyles_1 = /*#__PURE__*/require("./useDividerStyles");
15
11
  /**
16
12
  * A divider visually segments content into groups.
17
13
  */
18
-
19
-
20
14
  exports.Divider = /*#__PURE__*/React.forwardRef((props, ref) => {
21
15
  const state = useDivider_1.useDivider_unstable(props, ref);
22
16
  useDividerStyles_1.useDividerStyles_unstable(state);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/Divider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,OAAA,gBAA6C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxF,MAAM,KAAK,GAAG,YAAA,CAAA,mBAAA,CAAoB,KAApB,EAA2B,GAA3B,CAAd;EAEA,kBAAA,CAAA,yBAAA,CAA0B,KAA1B;EAEA,OAAO,eAAA,CAAA,sBAAA,CAAuB,KAAvB,CAAP;AACD,CANyD,CAA7C;AAQb,OAAA,CAAA,OAAA,CAAQ,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\n\n/**\n * A divider visually segments content into groups.\n */\nexport const Divider: ForwardRefComponent<DividerProps> = React.forwardRef((props, ref) => {\n const state = useDivider_unstable(props, ref);\n\n useDividerStyles_unstable(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAIA;;;AAGaA,eAAO,gBAAsCC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGC,gCAAmB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE7CG,4CAAyB,CAACF,KAAK,CAAC;EAEhC,OAAOG,sCAAsB,CAACH,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFL,eAAO,CAACS,WAAW,GAAG,SAAS","names":["exports","React","forwardRef","props","ref","state","useDivider_1","useDividerStyles_1","renderDivider_1","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/Divider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\n\n/**\n * A divider visually segments content into groups.\n */\nexport const Divider: ForwardRefComponent<DividerProps> = React.forwardRef((props, ref) => {\n const state = useDivider_unstable(props, ref);\n\n useDividerStyles_unstable(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
1
+ {"version":3,"mappings":"","names":[],"sourceRoot":"","sources":[],"sourcesContent":[]}
@@ -3,16 +3,10 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
-
7
6
  const tslib_1 = /*#__PURE__*/require("tslib");
8
-
9
7
  tslib_1.__exportStar(require("./Divider"), exports);
10
-
11
8
  tslib_1.__exportStar(require("./Divider.types"), exports);
12
-
13
9
  tslib_1.__exportStar(require("./renderDivider"), exports);
14
-
15
10
  tslib_1.__exportStar(require("./useDivider"), exports);
16
-
17
11
  tslib_1.__exportStar(require("./useDividerStyles"), exports);
18
12
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Divider';\nexport * from './Divider.types';\nexport * from './renderDivider';\nexport * from './useDivider';\nexport * from './useDividerStyles';\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/index.ts"],"sourcesContent":["export * from './Divider';\nexport * from './Divider.types';\nexport * from './renderDivider';\nexport * from './useDivider';\nexport * from './useDividerStyles';\n"]}
@@ -4,24 +4,21 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.renderDivider_unstable = void 0;
7
-
8
7
  const React = /*#__PURE__*/require("react");
9
-
10
8
  const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
11
9
  /**
12
10
  * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
13
11
  */
14
-
15
-
16
12
  const renderDivider_unstable = state => {
17
13
  const {
18
14
  slots,
19
15
  slotProps
20
16
  } = react_utilities_1.getSlots(state);
21
- return React.createElement(slots.root, { ...slotProps.root
22
- }, slotProps.root.children !== undefined && React.createElement(slots.wrapper, { ...slotProps.wrapper
17
+ return React.createElement(slots.root, {
18
+ ...slotProps.root
19
+ }, slotProps.root.children !== undefined && React.createElement(slots.wrapper, {
20
+ ...slotProps.wrapper
23
21
  }, slotProps.root.children));
24
22
  };
25
-
26
23
  exports.renderDivider_unstable = renderDivider_unstable;
27
24
  //# sourceMappingURL=renderDivider.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/renderDivider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,sBAAsB,GAAI,KAAD,IAAwB;EAC5D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAuB,KAAvB,CAA7B;EACA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,SAAS,CAAC,IAAV,CAAe,QAAf,KAA4B,SAA5B,IACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;EAAf,CAAd,EAAuC,SAAS,CAAC,IAAV,CAAe,QAAtD,CAFJ,CADF;AAOD,CATM;;AAAM,OAAA,CAAA,sBAAA,GAAsB,sBAAtB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from './Divider.types';\n\n/**\n * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.\n */\nexport const renderDivider_unstable = (state: DividerState) => {\n const { slots, slotProps } = getSlots<DividerSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slotProps.root.children !== undefined && (\n <slots.wrapper {...slotProps.wrapper}>{slotProps.root.children}</slots.wrapper>\n )}\n </slots.root>\n );\n};\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;AAGO,MAAMA,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAeH,KAAK,CAAC;EAC1D,OACEI,oBAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BH,SAAS,CAACG,IAAI,CAACC,QAAQ,KAAKC,SAAS,IACpCH,oBAACH,KAAK,CAACO,OAAO;IAAA,GAAKN,SAAS,CAACM;EAAO,GAAGN,SAAS,CAACG,IAAI,CAACC,QAAQ,CAC/D,CACU;AAEjB,CAAC;AATYG,8BAAsB","names":["renderDivider_unstable","state","slots","slotProps","react_utilities_1","React","root","children","undefined","wrapper","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/renderDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from './Divider.types';\n\n/**\n * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.\n */\nexport const renderDivider_unstable = (state: DividerState) => {\n const { slots, slotProps } = getSlots<DividerSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slotProps.root.children !== undefined && (\n <slots.wrapper {...slotProps.wrapper}>{slotProps.root.children}</slots.wrapper>\n )}\n </slots.root>\n );\n};\n"]}
@@ -4,15 +4,12 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useDivider_unstable = void 0;
7
-
8
7
  const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
8
  /**
10
9
  * Returns the props and state required to render the component
11
10
  * @param props - User-provided props to the Divider component.
12
11
  * @param ref - User-provided ref to be passed to the Divider component.
13
12
  */
14
-
15
-
16
13
  const useDivider_unstable = (props, ref) => {
17
14
  const {
18
15
  alignContent = 'center',
@@ -49,6 +46,5 @@ const useDivider_unstable = (props, ref) => {
49
46
  })
50
47
  };
51
48
  };
52
-
53
49
  exports.useDivider_unstable = useDivider_unstable;
54
50
  //# sourceMappingURL=useDivider.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDivider.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;;AAIG;;;AACI,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;EACpG,MAAM;IAAE,YAAY,GAAG,QAAjB;IAA2B,UAAU,GAAG,SAAxC;IAAmD,KAAK,GAAG,KAA3D;IAAkE,QAAQ,GAAG,KAA7E;IAAoF;EAApF,IAAgG,KAAtG;EACA,MAAM,SAAS,GAAG,iBAAA,CAAA,KAAA,CAAM,UAAN,CAAlB;EAEA,OAAO;IACL;IACA,YAFK;IAGL,UAHK;IAIL,KAJK;IAKL,QALK;IAOL;IACA,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,OAAO,EAAE;IAFC,CARP;IAaL,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;MACjC,IAAI,EAAE,WAD2B;MAEjC,oBAAoB,QAAQ,GAAG,UAAH,GAAgB,YAFX;MAGjC,mBAAmB,KAAK,CAAC,QAAN,GAAiB,SAAjB,GAA6B,SAHf;MAIjC,GAAG,KAJ8B;MAKjC;IALiC,CAA7B,CAbD;IAoBL,OAAO,EAAE,iBAAA,CAAA,gBAAA,CAAiB,OAAjB,EAA0B;MACjC,QAAQ,EAAE,IADuB;MAEjC,YAAY,EAAE;QACZ,EAAE,EAAE,SADQ;QAEZ,QAAQ,EAAE,KAAK,CAAC;MAFJ;IAFmB,CAA1B;EApBJ,CAAP;AA4BD,CAhCM;;AAAM,OAAA,CAAA,mBAAA,GAAmB,mBAAnB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { DividerProps, DividerState } from './Divider.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - User-provided props to the Divider component.\n * @param ref - User-provided ref to be passed to the Divider component.\n */\nexport const useDivider_unstable = (props: DividerProps, ref: React.Ref<HTMLElement>): DividerState => {\n const { alignContent = 'center', appearance = 'default', inset = false, vertical = false, wrapper } = props;\n const dividerId = useId('divider-');\n\n return {\n // Props passed at the top-level\n alignContent,\n appearance,\n inset,\n vertical,\n\n // Slots definition\n components: {\n root: 'div',\n wrapper: 'div',\n },\n\n root: getNativeElementProps('div', {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ...props,\n ref,\n }),\n wrapper: resolveShorthand(wrapper, {\n required: true,\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n }),\n };\n};\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":";;;;;;AACA;AAGA;;;;;AAKO,MAAMA,mBAAmB,GAAG,CAACC,KAAmB,EAAEC,GAA2B,KAAkB;EACpG,MAAM;IAAEC,YAAY,GAAG,QAAQ;IAAEC,UAAU,GAAG,SAAS;IAAEC,KAAK,GAAG,KAAK;IAAEC,QAAQ,GAAG,KAAK;IAAEC;EAAO,CAAE,GAAGN,KAAK;EAC3G,MAAMO,SAAS,GAAGC,uBAAK,CAAC,UAAU,CAAC;EAEnC,OAAO;IACL;IACAN,YAAY;IACZC,UAAU;IACVC,KAAK;IACLC,QAAQ;IAER;IACAI,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXJ,OAAO,EAAE;KACV;IAEDI,IAAI,EAAEF,uCAAqB,CAAC,KAAK,EAAE;MACjCG,IAAI,EAAE,WAAW;MACjB,kBAAkB,EAAEN,QAAQ,GAAG,UAAU,GAAG,YAAY;MACxD,iBAAiB,EAAEL,KAAK,CAACY,QAAQ,GAAGL,SAAS,GAAGM,SAAS;MACzD,GAAGb,KAAK;MACRC;KACD,CAAC;IACFK,OAAO,EAAEE,kCAAgB,CAACF,OAAO,EAAE;MACjCQ,QAAQ,EAAE,IAAI;MACdC,YAAY,EAAE;QACZC,EAAE,EAAET,SAAS;QACbK,QAAQ,EAAEZ,KAAK,CAACY;;KAEnB;GACF;AACH,CAAC;AAhCYK,2BAAmB","names":["useDivider_unstable","props","ref","alignContent","appearance","inset","vertical","wrapper","dividerId","react_utilities_1","components","root","role","children","undefined","required","defaultProps","id","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDivider.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { DividerProps, DividerState } from './Divider.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - User-provided props to the Divider component.\n * @param ref - User-provided ref to be passed to the Divider component.\n */\nexport const useDivider_unstable = (props: DividerProps, ref: React.Ref<HTMLElement>): DividerState => {\n const { alignContent = 'center', appearance = 'default', inset = false, vertical = false, wrapper } = props;\n const dividerId = useId('divider-');\n\n return {\n // Props passed at the top-level\n alignContent,\n appearance,\n inset,\n vertical,\n\n // Slots definition\n components: {\n root: 'div',\n wrapper: 'div',\n },\n\n root: getNativeElementProps('div', {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ...props,\n ref,\n }),\n wrapper: resolveShorthand(wrapper, {\n required: true,\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n }),\n };\n};\n"]}
@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useDividerStyles_unstable = exports.dividerClassNames = void 0;
7
-
8
7
  const react_1 = /*#__PURE__*/require("@griffel/react");
9
-
10
8
  const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
-
12
9
  exports.dividerClassNames = {
13
10
  root: 'fui-Divider',
14
11
  wrapper: 'fui-Divider__wrapper'
@@ -17,7 +14,6 @@ const contentSpacing = '12px';
17
14
  const insetSpacing = '12px';
18
15
  const maxStartEndLength = '8px';
19
16
  const minStartEndLength = '8px;';
20
-
21
17
  const useBaseStyles = /*#__PURE__*/react_1.__styles({
22
18
  "base": {
23
19
  "Bt984gj": "f122n59",
@@ -101,7 +97,6 @@ const useBaseStyles = /*#__PURE__*/react_1.__styles({
101
97
  }, {
102
98
  "d": [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f10pi13n{position:relative;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f17mccla{text-align:center;}", ".fyl8oag::before{box-sizing:border-box;}", ".f16vkdww::before{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fhsnbul::before{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1gw3sf2::after{box-sizing:border-box;}", ".f1ly5f7u::after{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1s3tz6t::after{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1kyqvp9::before{margin-bottom:0;}", ".fzynn9s::before{margin-right:0;}", ".f1z0ukd1::before{margin-left:0;}", ".fekrn8e::after{margin-left:0;}", ".ftdg338::after{margin-right:0;}", ".fesgyo::after{margin-top:0;}", ".f13zj6fq::after{content:\"\";}", ".f1wl9k8s::before{content:\"\";}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".fcbuu2a::before{border-top-color:var(--colorBrandStroke1);}", ".f1wdw2dr::before{border-right-color:var(--colorBrandStroke1);}", ".f1ttio3w::before{border-left-color:var(--colorBrandStroke1);}", ".f1582fpk::before{border-bottom-color:var(--colorBrandStroke1);}", ".f1ahrvm8::after{border-top-color:var(--colorBrandStroke1);}", ".f1cd3wbc::after{border-right-color:var(--colorBrandStroke1);}", ".f17hbk9y::after{border-left-color:var(--colorBrandStroke1);}", ".fvrapl0::after{border-bottom-color:var(--colorBrandStroke1);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f1vccso1::before{border-top-color:var(--colorNeutralStroke2);}", ".f1geml7w::before{border-right-color:var(--colorNeutralStroke2);}", ".fjml6kk::before{border-left-color:var(--colorNeutralStroke2);}", ".f1r7kh1m::before{border-bottom-color:var(--colorNeutralStroke2);}", ".f16j7guv::after{border-top-color:var(--colorNeutralStroke2);}", ".fx01ahm::after{border-right-color:var(--colorNeutralStroke2);}", ".fj1a37q::after{border-left-color:var(--colorNeutralStroke2);}", ".fl8d8yv::after{border-bottom-color:var(--colorNeutralStroke2);}", ".f5g06un::before{border-top-color:var(--colorNeutralStroke3);}", ".f13sxdku::before{border-right-color:var(--colorNeutralStroke3);}", ".f1n015lb::before{border-left-color:var(--colorNeutralStroke3);}", ".f1x6bl8t::before{border-bottom-color:var(--colorNeutralStroke3);}", ".fvod1wy::after{border-top-color:var(--colorNeutralStroke3);}", ".fwslg65::after{border-right-color:var(--colorNeutralStroke3);}", ".flk0e17::after{border-left-color:var(--colorNeutralStroke3);}", ".f103fvts::after{border-bottom-color:var(--colorNeutralStroke3);}", ".f10tv6oz::before{border-top-color:var(--colorNeutralStroke1);}", ".f16xp3sf::before{border-right-color:var(--colorNeutralStroke1);}", ".f1seuxxq::before{border-left-color:var(--colorNeutralStroke1);}", ".fwrmqbx::before{border-bottom-color:var(--colorNeutralStroke1);}", ".ft83z1f::after{border-top-color:var(--colorNeutralStroke1);}", ".f1g4150c::after{border-right-color:var(--colorNeutralStroke1);}", ".f192dr6e::after{border-left-color:var(--colorNeutralStroke1);}", ".f1qnawh6::after{border-bottom-color:var(--colorNeutralStroke1);}"]
103
99
  });
104
-
105
100
  const useHorizontalStyles = /*#__PURE__*/react_1.__styles({
106
101
  "base": {
107
102
  "a9b677": "fly5x3f",
@@ -135,7 +130,6 @@ const useHorizontalStyles = /*#__PURE__*/react_1.__styles({
135
130
  }, {
136
131
  "d": [".fly5x3f{width:100%;}", ".f163fonl::before{border-top-style:solid;}", ".f51yk4v::before{border-top-width:var(--strokeWidthThin);}", ".f13rof3u::before{min-width:8px;}", ".f8rth92::after{border-top-style:solid;}", ".f6czdpx::after{border-top-width:var(--strokeWidthThin);}", ".f1iyka9k::after{min-width:8px;}", ".fjlbh76{padding-left:12px;}", ".f11qrl6u{padding-right:12px;}", ".f1wl9k8s::before{content:\"\";}", ".f1ojjlep::before{margin-right:12px;}", ".fk1kexq::before{margin-left:12px;}", ".f1he2m4d::before{max-width:8px;}", ".f12w1bnb::after{margin-left:12px;}", ".f1558wlj::after{margin-right:12px;}", ".f13zj6fq::after{content:\"\";}", ".f1ayce8x::after{max-width:8px;}"]
137
132
  });
138
-
139
133
  const useVerticalStyles = /*#__PURE__*/react_1.__styles({
140
134
  "base": {
141
135
  "Beiy3e4": "f1vx9l62",
@@ -173,7 +167,6 @@ const useVerticalStyles = /*#__PURE__*/react_1.__styles({
173
167
  }, {
174
168
  "d": [".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f16gbxbe{min-height:20px;}", ".f1yq6w5o::before{border-right-style:solid;}", ".f1jpmc5p::before{border-left-style:solid;}", ".f9sc749::before{border-right-width:var(--strokeWidthThin);}", ".f1x8pvcy::before{border-left-width:var(--strokeWidthThin);}", ".fhkwbjy::before{min-height:8px;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f13hvwk3::after{border-right-width:var(--strokeWidthThin);}", ".f1en4csx::after{border-left-width:var(--strokeWidthThin);}", ".f19onpk6::after{min-height:8px;}", ".f1xdg43u{margin-top:12px;}", ".f1jlhsmd{margin-bottom:12px;}", ".f1tjaq3g{min-height:84px;}", ".f1wl9k8s::before{content:\"\";}", ".fg2pwug::before{margin-bottom:12px;}", ".fkjtzyi::before{max-height:8px;}", ".f8vk40g::after{margin-top:12px;}", ".f13zj6fq::after{content:\"\";}", ".fqg5mu5::after{max-height:8px;}"]
175
169
  });
176
-
177
170
  const useDividerStyles_unstable = state => {
178
171
  const baseStyles = useBaseStyles();
179
172
  const horizontalStyles = useHorizontalStyles();
@@ -184,19 +177,21 @@ const useDividerStyles_unstable = state => {
184
177
  inset,
185
178
  vertical
186
179
  } = state;
187
- state.root.className = react_1.mergeClasses(exports.dividerClassNames.root, // Base styles
188
- baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles
189
- !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles
190
- vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, // Childless styles
191
- state.root.children === undefined && baseStyles.childless, // User provided class name
180
+ state.root.className = react_1.mergeClasses(exports.dividerClassNames.root,
181
+ // Base styles
182
+ baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance],
183
+ // Horizontal styles
184
+ !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent],
185
+ // Vertical styles
186
+ vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren,
187
+ // Childless styles
188
+ state.root.children === undefined && baseStyles.childless,
189
+ // User provided class name
192
190
  state.root.className);
193
-
194
191
  if (state.wrapper) {
195
192
  state.wrapper.className = react_1.mergeClasses(exports.dividerClassNames.wrapper, state.wrapper.className);
196
193
  }
197
-
198
194
  return state;
199
195
  };
200
-
201
196
  exports.useDividerStyles_unstable = useDividerStyles_unstable;
202
197
  //# sourceMappingURL=useDividerStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDividerStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\n\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\n\nconst useBaseStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n flexGrow: 1,\n position: 'relative',\n\n fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n },\n\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0,\n },\n\n '::after': {\n marginLeft: 0,\n marginTop: 0,\n },\n },\n\n // Alignment variations\n start: {\n '::after': {\n content: '\"\"',\n },\n },\n center: {\n '::before': {\n content: '\"\"',\n },\n '::after': {\n content: '\"\"',\n },\n },\n end: {\n '::before': {\n content: '\"\"',\n },\n },\n\n // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n },\n default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n});\n\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing,\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n },\n});\n\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing,\n },\n\n // With children styles\n withChildren: {\n minHeight: '84px',\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n\n '::after': {\n marginTop: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n marginTop: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginTop: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n },\n});\n\nexport const useDividerStyles_unstable = (state: DividerState): DividerState => {\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n\n const { alignContent, appearance, inset, vertical } = state;\n\n state.root.className = mergeClasses(\n dividerClassNames.root,\n\n // Base styles\n baseStyles.base,\n baseStyles[alignContent],\n appearance && baseStyles[appearance],\n\n // Horizontal styles\n !vertical && horizontalStyles.base,\n !vertical && inset && horizontalStyles.inset,\n !vertical && horizontalStyles[alignContent],\n\n // Vertical styles\n vertical && verticalStyles.base,\n vertical && inset && verticalStyles.inset,\n vertical && verticalStyles[alignContent],\n vertical && state.root.children !== undefined && verticalStyles.withChildren,\n\n // Childless styles\n state.root.children === undefined && baseStyles.childless,\n\n // User provided class name\n state.root.className,\n );\n\n if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":"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","names":["exports","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","react_1","useHorizontalStyles","useVerticalStyles","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","inset","vertical","className","base","children","undefined","withChildren","childless"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-divider/src/components/Divider/useDividerStyles.ts"],"sourcesContent":["import { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\n\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\n\nconst useBaseStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n flexGrow: 1,\n position: 'relative',\n\n fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n },\n\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0,\n },\n\n '::after': {\n marginLeft: 0,\n marginTop: 0,\n },\n },\n\n // Alignment variations\n start: {\n '::after': {\n content: '\"\"',\n },\n },\n center: {\n '::before': {\n content: '\"\"',\n },\n '::after': {\n content: '\"\"',\n },\n },\n end: {\n '::before': {\n content: '\"\"',\n },\n },\n\n // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n },\n default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n});\n\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing,\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n },\n});\n\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing,\n },\n\n // With children styles\n withChildren: {\n minHeight: '84px',\n },\n\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n\n '::after': {\n marginTop: contentSpacing,\n },\n },\n center: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n marginTop: contentSpacing,\n },\n },\n end: {\n '::before': {\n marginBottom: contentSpacing,\n },\n '::after': {\n content: '\"\"',\n marginTop: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n },\n});\n\nexport const useDividerStyles_unstable = (state: DividerState): DividerState => {\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n\n const { alignContent, appearance, inset, vertical } = state;\n\n state.root.className = mergeClasses(\n dividerClassNames.root,\n\n // Base styles\n baseStyles.base,\n baseStyles[alignContent],\n appearance && baseStyles[appearance],\n\n // Horizontal styles\n !vertical && horizontalStyles.base,\n !vertical && inset && horizontalStyles.inset,\n !vertical && horizontalStyles[alignContent],\n\n // Vertical styles\n vertical && verticalStyles.base,\n vertical && inset && verticalStyles.inset,\n vertical && verticalStyles[alignContent],\n vertical && state.root.children !== undefined && verticalStyles.withChildren,\n\n // Childless styles\n state.root.children === undefined && baseStyles.childless,\n\n // User provided class name\n state.root.className,\n );\n\n if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"]}
@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.useDivider_unstable = exports.useDividerStyles_unstable = exports.renderDivider_unstable = exports.dividerClassNames = exports.Divider = void 0;
7
-
8
7
  var Divider_1 = /*#__PURE__*/require("./Divider");
9
-
10
8
  Object.defineProperty(exports, "Divider", {
11
9
  enumerable: true,
12
10
  get: function () {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../../packages/react-components/react-divider/src/index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,SAAA,gBAAA,OAAA,CAAA,WAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,SAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,OAAA;EAAO;AAAP,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,wBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,sBAAA;EAAsB;AAAtB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,qBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,mBAAA;EAAmB;AAAnB,CAAA","sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState } from './Divider';\n"],"sourceRoot":""}
1
+ {"version":3,"mappings":";;;;;;AAAA;AACEA;EAAAC;EAAAC;IAAA,wBAAO;EAAA;AAAA;AACPF;EAAAC;EAAAC;IAAA,kCAAiB;EAAA;AAAA;AACjBF;EAAAC;EAAAC;IAAA,uCAAsB;EAAA;AAAA;AACtBF;EAAAC;EAAAC;IAAA,0CAAyB;EAAA;AAAA;AACzBF;EAAAC;EAAAC;IAAA,oCAAmB;EAAA;AAAA","names":["Object","enumerable","get"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-divider/src/index.ts"],"sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState } from './Divider';\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-divider",
3
- "version": "0.0.0-nightly-20221228-0425.1",
3
+ "version": "0.0.0-nightly-20221229-0425.1",
4
4
  "description": "Fluent UI component to visually separate content.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -27,13 +27,13 @@
27
27
  "devDependencies": {
28
28
  "@fluentui/eslint-plugin": "*",
29
29
  "@fluentui/react-conformance": "*",
30
- "@fluentui/react-conformance-griffel": "0.0.0-nightly-20221228-0425.1",
30
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly-20221229-0425.1",
31
31
  "@fluentui/scripts": "^1.0.0"
32
32
  },
33
33
  "dependencies": {
34
34
  "@griffel/react": "^1.4.2",
35
- "@fluentui/react-theme": "0.0.0-nightly-20221228-0425.1",
36
- "@fluentui/react-utilities": "0.0.0-nightly-20221228-0425.1",
35
+ "@fluentui/react-theme": "0.0.0-nightly-20221229-0425.1",
36
+ "@fluentui/react-utilities": "0.0.0-nightly-20221229-0425.1",
37
37
  "tslib": "^2.1.0"
38
38
  },
39
39
  "peerDependencies": {