@luoluoyu/fluentui-plus 1.0.0 → 2.1.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.
- package/dist/components/Select/Listbox.d.ts.map +1 -1
- package/dist/components/Select/MultipleSelector.d.ts.map +1 -1
- package/dist/components/Select/OptionGroup.d.ts +5 -0
- package/dist/components/Select/OptionGroup.d.ts.map +1 -0
- package/dist/components/Select/Select.d.ts.map +1 -1
- package/dist/components/Select/Selector.d.ts.map +1 -1
- package/dist/components/Select/TextDisplay.d.ts.map +1 -1
- package/dist/components/Select/hooks/index.d.ts +1 -2
- package/dist/components/Select/hooks/index.d.ts.map +1 -1
- package/dist/components/Select/hooks/useFloatingPosition.d.ts +6 -2
- package/dist/components/Select/hooks/useFloatingPosition.d.ts.map +1 -1
- package/dist/components/Select/hooks/useOptionSelection.d.ts +4 -3
- package/dist/components/Select/hooks/useOptionSelection.d.ts.map +1 -1
- package/dist/components/Select/hooks/useSelect.d.ts +5 -4
- package/dist/components/Select/hooks/useSelect.d.ts.map +1 -1
- package/dist/components/Select/hooks/useSelectSearch.d.ts +3 -3
- package/dist/components/Select/hooks/useSelectSearch.d.ts.map +1 -1
- package/dist/components/Select/index.d.ts +2 -1
- package/dist/components/Select/index.d.ts.map +1 -1
- package/dist/components/Select/types.d.ts +28 -3
- package/dist/components/Select/types.d.ts.map +1 -1
- package/dist/components/index.d.ts +1 -1
- package/dist/components/index.d.ts.map +1 -1
- package/dist/index.esm.js +5371 -4700
- package/dist/index.esm.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +4 -2
- package/dist/components/Select/hooks/useClickOutside.d.ts +0 -12
- package/dist/components/Select/hooks/useClickOutside.d.ts.map +0 -1
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
*{margin:0;padding:0}body{font-family:var(--fontFamilyBase)}.mm-tag{box-sizing:border-box;margin:0;color:var(--colorNeutralForeground1);font-size:var(--fontSizeBase200);line-height:calc(var(--lineHeightBase200) * var(--fontSizeBase200));list-style:none;font-family:var(--fontFamilyBase);height:auto;padding:0 var(--spacingHorizontalS);white-space:nowrap;background:var(--colorNeutralBackground2);border:var(--strokeWidthThin) solid var(--colorNeutralBackground2Hover);border-radius:var(--borderRadiusMedium);opacity:1;text-align:start;position:relative;overflow:hidden;display:inline-flex;flex-wrap:nowrap;gap:var(--spacingHorizontalS);align-items:center}.mm-tag__content{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mm-tag__close{cursor:pointer;height:100%;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center}.mm-tag--borderless{border:none}.mm-checkable-tag{cursor:pointer!important}.mm-checkable-tag--checked{background-color:var(--colorBrandBackground)!important;color:#fff!important}.mm-input-tag{border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);border-bottom-color:var(--colorNeutralStrokeAccessible);transition:all .2s ease;outline:none;background:var(--colorNeutralBackground1);position:relative;box-sizing:border-box;margin:0;display:flex;width:100%;min-width:0;gap:var(--spacingHorizontalXS);padding:var(--spacingVerticalXS) var(--spacingHorizontalS);color:var(--colorNeutralForeground1);font-size:var(--fontSizeBase300);line-height:calc(var(--lineHeightBase300) * var(--fontSizeBase300));font-family:var(--fontFamilyBase);list-style:none}.mm-input-tag:after{content:"";position:absolute;inset:auto 0 0 0;height:max(2px,var(--borderRadiusMedium));border-bottom:var(--strokeWidthThick) solid var(--colorCompoundBrandStroke);border-radius:0 0 var(--borderRadiusMedium) var(--borderRadiusMedium);box-sizing:border-box;clip-path:inset(calc(100% - 2px) 0px 0px);transform:scaleX(0);transition:transform var(--durationUltraFast) var(--curveAccelerateMid)}.mm-input-tag:focus-within:after{transform:scaleX(1);transition:transform var(--durationNormal) var(--curveDecelerateMid)}.mm-input-tag--disabled{cursor:not-allowed;border-color:var(--colorNeutralStrokeDisabled)}.mm-input-tag--disabled:after{display:none}.mm-input-tag--disabled .mm-input-tag__input{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled)}.mm-input-tag--disabled .mm-tag{opacity:.5;pointer-events:none}.mm-input-tag__content{display:flex;flex-wrap:wrap;width:100%;gap:var(--spacingHorizontalXS)}.mm-input-tag__item{margin:var(--spacingVerticalNone) var(--spacingHorizontalXXS);max-width:100%}.mm-input-tag__input{flex:1;border:none;outline:none;background:transparent;color:var(--colorNeutralForeground1);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase300);line-height:calc(var(--lineHeightBase300) * var(--fontSizeBase300));min-width:50px;padding:var(--spacingVerticalNone);margin:var(--spacingVerticalXXS) var(--spacingHorizontalXXS)}.mm-input-tag__input::placeholder{color:var(--colorNeutralForeground4)}.mm-input-tag__input:disabled{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled)}.mm-nav{background-color:var(--colorNeutralBackground1);overflow:hidden}.mm-nav--inline{width:240px}.mm-nav--collapsed{width:60px}.mm-nav--collapsed .mm-nav__item{justify-content:center;padding:12px}.mm-nav--collapsed .mm-nav__item__label,.mm-nav--collapsed .mm-nav__item__arrow{display:none}.mm-nav--collapsed .mm-nav__item__icon{margin-right:0}.mm-nav--collapsed .mm-nav__submenu{display:none}.mm-nav__list{display:flex;flex-direction:column;gap:4px}.mm-nav__item{display:flex;align-items:center;padding:8px 16px;border-radius:var(--borderRadiusMedium);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--colorNeutralForeground1);font-size:14px;font-weight:400;line-height:20px;min-height:36px;position:relative}.mm-nav__item:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground1Hover)}.mm-nav__item--selected{background-color:var(--colorBrandBackground2)!important;color:var(--colorBrandForeground2)!important;font-weight:600!important}.mm-nav__item--selected:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:16px;background-color:var(--colorBrandStroke1);border-radius:0 2px 2px 0}.mm-nav__item--disabled{color:var(--colorNeutralForegroundDisabled);cursor:not-allowed;opacity:.6}.mm-nav__item--disabled:hover{background-color:transparent;color:var(--colorNeutralForegroundDisabled)}.mm-nav__item__icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px;font-size:16px;flex-shrink:0}.mm-nav__item__icon svg{width:16px;height:16px}.mm-nav__item__label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mm-nav__item__arrow{display:flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:auto;flex-shrink:0}.mm-nav__item__arrow svg{width:12px;height:12px}.mm-nav__item__arrow--expanded{transform:rotate(90deg)}.mm-nav__item--level-0{padding-left:24px}.mm-nav__item--level-1{padding-left:48px}.mm-nav__item--level-2{padding-left:72px}.mm-nav__item--level-3{padding-left:96px}.mm-nav__item--level-4{padding-left:120px}.mm-nav__item--level-5{padding-left:144px}.mm-nav__item--level-6{padding-left:168px}.mm-nav__item--level-7{padding-left:192px}.mm-nav__item--level-8{padding-left:216px}.mm-nav__item--level-9{padding-left:240px}.mm-nav__item--level-10{padding-left:264px}.mm-nav__submenu{overflow:hidden;transform-origin:top;display:flex;flex-direction:column;gap:4px;padding:4px 0}.mm-nav__submenu .mm-nav__item{font-size:14px;min-height:32px;padding-top:8px;padding-bottom:8px}.mm-nav__group{margin:8px 0}.mm-nav__group__title{padding:8px 16px 4px;font-size:12px;font-weight:500;color:var(--colorNeutralForeground4);text-transform:uppercase;letter-spacing:.5px;line-height:16px;margin-bottom:4px;-webkit-user-select:none;user-select:none;opacity:.8}.mm-nav__group__content{display:flex;flex-direction:column;gap:2px}.mm-nav__group__content .mm-nav__item{margin:0 8px;border-radius:var(--borderRadiusSmall)}.mm-nav--collapsed .mm-nav__group{margin:4px 0}.mm-nav--collapsed .mm-nav__group__title{display:none}.mm-nav--collapsed .mm-nav__group__content{gap:4px}.mm-nav--collapsed .mm-nav__group__content .mm-nav__item{margin:0;border-radius:var(--borderRadiusMedium)}.mm-nav__group:first-child{margin-top:0}.mm-nav__group:last-child{margin-bottom:0}.mm-nav--collapsed .mm-nav__submenu,.mm-nav--collapsed .mm-nav__submenu--open{transition:opacity .1s ease-in-out,visibility 0s}.mm-select{position:relative;display:inline-block;min-width:120px;width:100%;font-size:var(--fontSizeBase300)}.mm-select__selector{border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);border-bottom-color:var(--colorNeutralStrokeAccessible);transition:all .2s ease;outline:none;background:var(--colorNeutralBackground1);position:relative;overflow:hidden}.mm-select__selector:after{content:"";position:absolute;inset:auto 0 0 0;height:max(2px,var(--borderRadiusMedium));border-bottom:var(--strokeWidthThick) solid var(--colorCompoundBrandStroke);border-radius:0 0 var(--borderRadiusMedium) var(--borderRadiusMedium);box-sizing:border-box;clip-path:inset(calc(100% - 2px) 0px 0px);transform:scaleX(0);transition:transform var(--durationUltraFast) var(--curveAccelerateMid)}.mm-select__selector:focus-within:after{transform:scaleX(1);transition:transform var(--durationNormal) var(--curveDecelerateMid)}.mm-select__selector--disabled{cursor:not-allowed;border-color:var(--colorNeutralStrokeDisabled)}.mm-select__selector--disabled:after{display:none}.mm-select__selector--disabled .mm-select__selector-inner{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled)}.mm-select__selector--disabled .mm-select__selector-text,.mm-select__selector--disabled .mm-select__selector-arrow{color:var(--colorNeutralForegroundDisabled)}.mm-select__selector--multiple .mm-select__selector-inner{min-height:auto;padding:3px var(--spacingHorizontalMNudge) 3px calc(var(--spacingHorizontalMNudge) + var(--spacingHorizontalXXS))}.mm-select__selector-inner{display:flex;align-items:center;justify-content:space-between;padding:5px var(--spacingHorizontalMNudge) 5px calc(var(--spacingHorizontalMNudge) + var(--spacingHorizontalXXS));background-color:var(--colorNeutralBackground1);cursor:pointer;min-height:32px;box-sizing:border-box;flex-wrap:nowrap;gap:var(--spacingHorizontalXXS)}.mm-select__selector-inner--multiple{align-items:center;min-height:32px;padding:3px var(--spacingHorizontalMNudge) 3px calc(var(--spacingHorizontalMNudge) + var(--spacingHorizontalXXS))}.mm-select__selector-inner--multiple .mm-select__selector-arrow{margin-top:0}.mm-select__selector-text{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mm-select__selector-text--placeholder{color:var(--colorNeutralForeground4)}.mm-select__selector-arrow{color:var(--colorNeutralForeground2);font-size:20px}.mm-select__tags-container{display:flex;flex-wrap:wrap;gap:2px;flex:1;align-items:center;min-height:26px;overflow:hidden}.mm-select__tags-container .mm-input-tag__input{background:transparent;border:none;outline:none;padding:0;margin:0;font-size:inherit;color:inherit;min-width:60px;flex-shrink:0;width:100%;text-overflow:ellipsis}.mm-select__tags-container .mm-input-tag__input::placeholder{color:var(--colorNeutralForeground4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mm-select__search-input{background:transparent;border:none;outline:none;padding:0;margin:0;font-size:inherit;color:inherit;width:100%;flex:1;text-overflow:ellipsis}.mm-select__search-input::placeholder{color:var(--colorNeutralForeground4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mm-select__listbox{overflow-y:auto;min-width:120px;padding-right:var(--spacingHorizontalXS);margin:var(--spacingHorizontalXS);box-sizing:border-box;display:flex;flex-direction:column;flex-wrap:nowrap;gap:var(--spacingHorizontalXXS)}.mm-select__option{padding:var(--spacingVerticalSNudge) var(--spacingHorizontalS);cursor:pointer;color:var(--colorNeutralForeground1)}.mm-select__option:hover{background-color:var(--colorNeutralBackground2Hover)}.mm-select__option--disabled{color:var(--colorNeutralForegroundDisabled);cursor:not-allowed}.mm-select__option--disabled:hover{background-color:transparent}.mm-select__option--empty{color:var(--colorNeutralForeground3);text-align:center;cursor:default}.mm-select__option--empty:hover{background-color:transparent}.mm-select__option-content{display:flex;align-items:center;gap:var(--spacingHorizontalXS)}.mm-select__option-checkmark{width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.mm-select__option-checkbox{width:16px;height:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.mm-select__option-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mm-select__popover-surface{box-sizing:border-box;background-color:var(--colorNeutralBackground1)}
|
|
1
|
+
*{margin:0;padding:0}body{font-family:var(--fontFamilyBase)}.fluentui-plus-tag{box-sizing:border-box;margin:0;color:var(--colorNeutralForeground1);font-size:var(--fontSizeBase200);line-height:calc(var(--lineHeightBase200) * var(--fontSizeBase200));list-style:none;font-family:var(--fontFamilyBase);height:auto;padding:0 var(--spacingHorizontalS);white-space:nowrap;background:var(--colorNeutralBackground2);border:var(--strokeWidthThin) solid var(--colorNeutralBackground2Hover);border-radius:var(--borderRadiusMedium);opacity:1;text-align:start;position:relative;overflow:hidden;display:inline-flex;flex-wrap:nowrap;gap:var(--spacingHorizontalS);align-items:center}.fluentui-plus-tag__content{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fluentui-plus-tag__close{cursor:pointer;height:100%;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center}.fluentui-plus-tag--borderless{border:none}.fluentui-plus-checkable-tag{cursor:pointer!important}.fluentui-plus-checkable-tag--checked{background-color:var(--colorBrandBackground)!important;color:#fff!important}.fluentui-plus-input-tag{border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);border-bottom-color:var(--colorNeutralStrokeAccessible);transition:all .2s ease;outline:none;background:var(--colorNeutralBackground1);position:relative;box-sizing:border-box;margin:0;display:flex;width:100%;min-width:0;gap:var(--spacingHorizontalXS);padding:var(--spacingVerticalXS) var(--spacingHorizontalS);color:var(--colorNeutralForeground1);font-size:var(--fontSizeBase300);line-height:calc(var(--lineHeightBase300) * var(--fontSizeBase300));font-family:var(--fontFamilyBase);list-style:none}.fluentui-plus-input-tag:after{content:"";position:absolute;inset:auto 0 0 0;height:max(2px,var(--borderRadiusMedium));border-bottom:var(--strokeWidthThick) solid var(--colorCompoundBrandStroke);border-radius:0 0 var(--borderRadiusMedium) var(--borderRadiusMedium);box-sizing:border-box;clip-path:inset(calc(100% - 2px) 0px 0px);transform:scaleX(0);transition:transform var(--durationUltraFast) var(--curveAccelerateMid)}.fluentui-plus-input-tag:focus-within:after{transform:scaleX(1);transition:transform var(--durationNormal) var(--curveDecelerateMid)}.fluentui-plus-input-tag--disabled{cursor:not-allowed;border-color:var(--colorNeutralStrokeDisabled)}.fluentui-plus-input-tag--disabled:after{display:none}.fluentui-plus-input-tag--disabled .fluentui-plus-input-tag__input{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled)}.fluentui-plus-input-tag--disabled .fluentui-plus-tag{opacity:.5;pointer-events:none}.fluentui-plus-input-tag__content{display:flex;flex-wrap:wrap;width:100%;gap:var(--spacingHorizontalXS)}.fluentui-plus-input-tag__item{margin:var(--spacingVerticalNone) var(--spacingHorizontalXXS);max-width:100%}.fluentui-plus-input-tag__input{flex:1;border:none;outline:none;background:transparent;color:var(--colorNeutralForeground1);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase300);line-height:calc(var(--lineHeightBase300) * var(--fontSizeBase300));min-width:50px;padding:var(--spacingVerticalNone);margin:var(--spacingVerticalXXS) var(--spacingHorizontalXXS)}.fluentui-plus-input-tag__input::placeholder{color:var(--colorNeutralForeground4)}.fluentui-plus-input-tag__input:disabled{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled)}.fluentui-plus-nav{background-color:var(--colorNeutralBackground1);overflow:hidden}.fluentui-plus-nav--inline{width:240px}.fluentui-plus-nav--collapsed{width:60px}.fluentui-plus-nav--collapsed .fluentui-plus-nav__item{justify-content:center;padding:12px}.fluentui-plus-nav--collapsed .fluentui-plus-nav__item__label,.fluentui-plus-nav--collapsed .fluentui-plus-nav__item__arrow{display:none}.fluentui-plus-nav--collapsed .fluentui-plus-nav__item__icon{margin-right:0}.fluentui-plus-nav--collapsed .fluentui-plus-nav__submenu{display:none}.fluentui-plus-nav__list{display:flex;flex-direction:column;gap:4px}.fluentui-plus-nav__item{display:flex;align-items:center;padding:8px 16px;border-radius:var(--borderRadiusMedium);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--colorNeutralForeground1);font-size:14px;font-weight:400;line-height:20px;min-height:36px;position:relative}.fluentui-plus-nav__item:hover{background-color:var(--colorNeutralBackground1Hover);color:var(--colorNeutralForeground1Hover)}.fluentui-plus-nav__item--selected{background-color:var(--colorBrandBackground2)!important;color:var(--colorBrandForeground2)!important;font-weight:600!important}.fluentui-plus-nav__item--selected:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:16px;background-color:var(--colorBrandStroke1);border-radius:0 2px 2px 0}.fluentui-plus-nav__item--disabled{color:var(--colorNeutralForegroundDisabled);cursor:not-allowed;opacity:.6}.fluentui-plus-nav__item--disabled:hover{background-color:transparent;color:var(--colorNeutralForegroundDisabled)}.fluentui-plus-nav__item__icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px;font-size:16px;flex-shrink:0}.fluentui-plus-nav__item__icon svg{width:16px;height:16px}.fluentui-plus-nav__item__label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fluentui-plus-nav__item__arrow{display:flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:auto;flex-shrink:0}.fluentui-plus-nav__item__arrow svg{width:12px;height:12px}.fluentui-plus-nav__item__arrow--expanded{transform:rotate(90deg)}.fluentui-plus-nav__item--level-0{padding-left:24px}.fluentui-plus-nav__item--level-1{padding-left:48px}.fluentui-plus-nav__item--level-2{padding-left:72px}.fluentui-plus-nav__item--level-3{padding-left:96px}.fluentui-plus-nav__item--level-4{padding-left:120px}.fluentui-plus-nav__item--level-5{padding-left:144px}.fluentui-plus-nav__item--level-6{padding-left:168px}.fluentui-plus-nav__item--level-7{padding-left:192px}.fluentui-plus-nav__item--level-8{padding-left:216px}.fluentui-plus-nav__item--level-9{padding-left:240px}.fluentui-plus-nav__item--level-10{padding-left:264px}.fluentui-plus-nav__submenu{overflow:hidden;transform-origin:top;display:flex;flex-direction:column;gap:4px;padding:4px 0}.fluentui-plus-nav__submenu .fluentui-plus-nav__item{font-size:14px;min-height:32px;padding-top:8px;padding-bottom:8px}.fluentui-plus-nav__group{margin:8px 0}.fluentui-plus-nav__group__title{padding:8px 16px 4px;font-size:12px;font-weight:500;color:var(--colorNeutralForeground4);text-transform:uppercase;letter-spacing:.5px;line-height:16px;margin-bottom:4px;-webkit-user-select:none;user-select:none;opacity:.8}.fluentui-plus-nav__group__content{display:flex;flex-direction:column;gap:2px}.fluentui-plus-nav__group__content .fluentui-plus-nav__item{margin:0 8px;border-radius:var(--borderRadiusSmall)}.fluentui-plus-nav--collapsed .fluentui-plus-nav__group{margin:4px 0}.fluentui-plus-nav--collapsed .fluentui-plus-nav__group__title{display:none}.fluentui-plus-nav--collapsed .fluentui-plus-nav__group__content{gap:4px}.fluentui-plus-nav--collapsed .fluentui-plus-nav__group__content .fluentui-plus-nav__item{margin:0;border-radius:var(--borderRadiusMedium)}.fluentui-plus-nav__group:first-child{margin-top:0}.fluentui-plus-nav__group:last-child{margin-bottom:0}.fluentui-plus-nav--collapsed .fluentui-plus-nav__submenu,.fluentui-plus-nav--collapsed .fluentui-plus-nav__submenu--open{transition:opacity .1s ease-in-out,visibility 0s}.fluentui-plus-select{position:relative;display:inline-block;min-width:120px;width:100%;font-size:var(--fontSizeBase300)}.fluentui-plus-select__selector{border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);border-bottom-color:var(--colorNeutralStrokeAccessible);transition:all .2s ease;outline:none;background:var(--colorNeutralBackground1);position:relative;overflow:hidden}.fluentui-plus-select__selector:after{content:"";position:absolute;inset:auto 0 0 0;height:max(2px,var(--borderRadiusMedium));border-bottom:var(--strokeWidthThick) solid var(--colorCompoundBrandStroke);border-radius:0 0 var(--borderRadiusMedium) var(--borderRadiusMedium);box-sizing:border-box;clip-path:inset(calc(100% - 2px) 0px 0px);transform:scaleX(0);transition:transform var(--durationUltraFast) var(--curveAccelerateMid)}.fluentui-plus-select__selector:focus-within:after{transform:scaleX(1);transition:transform var(--durationNormal) var(--curveDecelerateMid)}.fluentui-plus-select__selector:hover .fluentui-plus-select__selector-clear{opacity:1;visibility:visible}.fluentui-plus-select__selector--disabled{cursor:not-allowed;border-color:var(--colorNeutralStrokeDisabled)}.fluentui-plus-select__selector--disabled:after{display:none}.fluentui-plus-select__selector--disabled .fluentui-plus-select__selector-inner{cursor:not-allowed;color:var(--colorNeutralForegroundDisabled)}.fluentui-plus-select__selector--disabled .fluentui-plus-select__selector-text,.fluentui-plus-select__selector--disabled .fluentui-plus-select__selector-arrow{color:var(--colorNeutralForegroundDisabled)}.fluentui-plus-select__selector--multiple .fluentui-plus-select__selector-inner{min-height:auto;padding:3px var(--spacingHorizontalMNudge) 3px calc(var(--spacingHorizontalMNudge) + var(--spacingHorizontalXXS))}.fluentui-plus-select__selector-inner{display:flex;align-items:center;justify-content:space-between;padding:5px var(--spacingHorizontalMNudge) 5px calc(var(--spacingHorizontalMNudge) + var(--spacingHorizontalXXS));background-color:var(--colorNeutralBackground1);cursor:pointer;min-height:32px;box-sizing:border-box;flex-wrap:nowrap;gap:var(--spacingHorizontalXXS)}.fluentui-plus-select__selector-inner--multiple{align-items:center;min-height:32px;padding:3px var(--spacingHorizontalMNudge) 3px calc(var(--spacingHorizontalMNudge) + var(--spacingHorizontalXXS))}.fluentui-plus-select__selector-inner--multiple .fluentui-plus-select__selector-arrow{margin-top:0}.fluentui-plus-select__selector-text{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fluentui-plus-select__selector-text--placeholder{color:var(--colorNeutralForeground4)}.fluentui-plus-select__selector-suffix{display:flex;align-items:center;position:relative}.fluentui-plus-select__selector-clear{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:var(--colorBrandShadowKey);font-size:16px;cursor:pointer;transition:all .2s ease;background-color:#fff;opacity:0;visibility:hidden}.fluentui-plus-select__selector-clear:hover{color:var(--colorBackgroundOverlay)}.fluentui-plus-select__selector-arrow{color:var(--colorNeutralForeground2);font-size:20px}.fluentui-plus-select__tags-container{display:flex;flex-wrap:wrap;gap:2px;flex:1;align-items:center;min-height:26px;overflow:hidden}.fluentui-plus-select__tags-container .fluentui-plus-input-tag__input{background:transparent;border:none;outline:none;padding:0;margin:0;font-size:inherit;color:inherit;min-width:60px;flex-shrink:0;width:100%;text-overflow:ellipsis}.fluentui-plus-select__tags-container .fluentui-plus-input-tag__input::placeholder{color:var(--colorNeutralForeground4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fluentui-plus-select__search-input{background:transparent;border:none;outline:none;padding:0;margin:0;font-size:inherit;color:inherit;width:100%;flex:1;text-overflow:ellipsis}.fluentui-plus-select__search-input::placeholder{color:var(--colorNeutralForeground4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fluentui-plus-select__listbox{overflow-y:auto;min-width:120px;padding:var(--spacingHorizontalXS);box-sizing:border-box;display:flex;flex-direction:column;flex-wrap:nowrap;gap:var(--spacingHorizontalXXS)}.fluentui-plus-select__option{padding:var(--spacingVerticalSNudge) var(--spacingHorizontalS);cursor:pointer;color:var(--colorNeutralForeground1)}.fluentui-plus-select__option:hover{background-color:var(--colorNeutralBackground2Hover)}.fluentui-plus-select__option--disabled{color:var(--colorNeutralForegroundDisabled);cursor:not-allowed}.fluentui-plus-select__option--disabled:hover{background-color:transparent}.fluentui-plus-select__option--empty{color:var(--colorNeutralForeground3);text-align:center;cursor:default}.fluentui-plus-select__option--empty:hover{background-color:transparent}.fluentui-plus-select__option-content{display:flex;align-items:center;gap:var(--spacingHorizontalXS)}.fluentui-plus-select__option-checkmark{width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.fluentui-plus-select__option-checkbox{width:16px;height:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.fluentui-plus-select__option-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fluentui-plus-select__group:not(:last-child){margin-bottom:var(--spacingVerticalXS)}.fluentui-plus-select__group-label{padding:var(--spacingVerticalSNudge) var(--spacingHorizontalS);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForegroundDisabled)}.fluentui-plus-select__group-options .fluentui-plus-select__option{padding-left:calc(var(--spacingHorizontalS) + var(--spacingHorizontalM))}.fluentui-plus-select__popover-surface{box-sizing:border-box;background-color:var(--colorNeutralBackground1);box-shadow:var(--shadow16)}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@luoluoyu/fluentui-plus",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A component library based on Fluent UI, targeting Chinese enterprise applications",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -108,6 +108,7 @@
|
|
|
108
108
|
"@types/node": "^20.0.0",
|
|
109
109
|
"@types/react": "^18.2.0",
|
|
110
110
|
"@types/react-dom": "^18.2.0",
|
|
111
|
+
"@types/react-router-dom": "^5.3.3",
|
|
111
112
|
"@typescript-eslint/eslint-plugin": "^8.35.0",
|
|
112
113
|
"@typescript-eslint/parser": "^8.35.0",
|
|
113
114
|
"@vitejs/plugin-react": "^4.3.0",
|
|
@@ -127,6 +128,7 @@
|
|
|
127
128
|
"prettier": "^3.6.2",
|
|
128
129
|
"react": "^18.2.0",
|
|
129
130
|
"react-dom": "^18.2.0",
|
|
131
|
+
"react-router-dom": "^7.8.2",
|
|
130
132
|
"rimraf": "^5.0.0",
|
|
131
133
|
"standard-version": "^9.5.0",
|
|
132
134
|
"storybook": "9.0.15",
|
|
@@ -136,7 +138,7 @@
|
|
|
136
138
|
"vite-plugin-dts": "^4.2.0"
|
|
137
139
|
},
|
|
138
140
|
"dependencies": {
|
|
139
|
-
"@floating-ui/
|
|
141
|
+
"@floating-ui/react": "^0.27.16",
|
|
140
142
|
"clsx": "^2.0.0",
|
|
141
143
|
"lodash": "^4.17.21"
|
|
142
144
|
},
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
|
-
interface UseClickOutsideProps {
|
|
3
|
-
isActive: boolean;
|
|
4
|
-
triggerRef: React.RefObject<HTMLElement>;
|
|
5
|
-
floatingRef: React.RefObject<HTMLElement>;
|
|
6
|
-
onClickOutside?: () => void;
|
|
7
|
-
}
|
|
8
|
-
export declare const useClickOutside: ({ isActive, triggerRef, floatingRef, onClickOutside }: UseClickOutsideProps) => {
|
|
9
|
-
handleClickOutside: (event: MouseEvent) => void;
|
|
10
|
-
};
|
|
11
|
-
export {};
|
|
12
|
-
//# sourceMappingURL=useClickOutside.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useClickOutside.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/hooks/useClickOutside.ts"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAEtD,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,eAAO,MAAM,eAAe,GAAI,uDAAuD,oBAAoB;gCAG/F,UAAU;CA8BrB,CAAC"}
|